/* Hill V5: existing Tonnelier, ink #141318, white and brand #533AFD.
   Local mockup refinement for Abdi's four browser comments, 2026-10-23.
   Design variance 5 / motion 1 / density 5. No added animation or dependencies. */
#about { padding-top: 96px; }
#about .about__top { display: block; padding-bottom: 44px; }
#about .about__heading { margin: 0 0 32px; }
#about .about__heading .about__lb { margin-bottom: 20px; }
#about .about__lead { max-width: 25ch; font-size: clamp(42px, 4.8vw, 70px); line-height: 1.06; letter-spacing: -.027em; }
#about .about__side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 5vw, 72px); }
#about .about__copy-col { display: flex; flex-direction: column; gap: 16px; }
#about .about__side p { font-size: 18px; line-height: 1.5; }
#about .about__figs > div { padding-top: 28px; padding-bottom: 30px; }
#about .about__vv { display: block; padding: 52px 0 48px; }
#about .about__vv > div:first-child { margin-bottom: 38px; }
#about .about__vh { max-width: 38ch; font-size: clamp(30px, 3.3vw, 46px); line-height: 1.14; margin-bottom: 20px; }
#about .about__vv > div:first-child > .about__p { max-width: 78ch; }
#about .about__vv .about__lb { margin-bottom: 20px; }
#about .about__vals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 44px); border-top: 0; }
#about .about__vals li { display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: start; gap: 12px; padding: 20px 0 0; border-bottom: 0; border-top: 1px solid rgba(255,255,255,.26); font-size: clamp(22px, 2vw, 28px); line-height: 1.2; }
#about .about__vals .about__n { padding-top: 6px; }
#about .about__value-copy { margin-top: 12px; line-height: 1.5; }
#about .about__blk { padding: 44px 0 48px; }
#about .about__how h4 { font-size: clamp(21px,1.9vw,26px); }
#about .about__journey { list-style: none; padding: 0; margin: 0; }
#about .about__journey > li { display: grid; grid-template-columns: minmax(180px, 2fr) minmax(0, 8fr); gap: clamp(32px, 6vw, 96px); align-items: start; padding: 30px 0; border-top: 1px solid rgba(255,255,255,.26); }
#about .about__journey > li:last-child { padding-bottom: 0; }
#about .about__year { display: block; color: #B9B9F9; font-size: clamp(64px,6.4vw,92px); line-height: .95; letter-spacing: -.035em; font-weight: 500; }
#about .about__year--today { font-size: clamp(42px,4.4vw,64px); }
#about .about__story-lead { max-width: 34ch; margin: 0; font-size: clamp(26px,2.8vw,38px); line-height: 1.18; }
#about .about__story-body h4 { margin: 0 0 16px; font-size: clamp(26px,2.8vw,38px); line-height: 1.18; font-weight: 500; letter-spacing: -.015em; }
#about .about__story-body .about__p { max-width: 65ch; }
.pw.pw--refined { padding-top: 56px; padding-bottom: 56px; }
.pw--refined .pw__heading { margin: 0 clamp(16px,4vw,56px); }
.pw--refined .pw__lb { padding: 0; margin-bottom: 20px; text-transform: uppercase; }
.pw--refined .pw__p { padding: 0; margin: 0; max-width: 30ch; font-size: clamp(36px,4.3vw,62px); line-height: 1.08; font-weight: 500; letter-spacing: -.025em; }
.pw--refined .pw__emphasis { color: #533AFD; white-space: nowrap; }
.pw--refined .pw__invitation { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 24px; }
#about + .pw--refined .pw__intro { padding: 0; margin: 0; max-width: 74ch; font-size: 18px; line-height: 1.5; }
.pw--refined .pw__cta { box-sizing: border-box; flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 50px; padding: 14px 20px; background: #533AFD; color: #fff; text-decoration: none; border: 1px solid #533AFD; border-radius: 2px; font-size: 16px; line-height: 1.3; }
.pw--refined .pw__cta:hover { background: #4026D8; border-color: #4026D8; color: #fff; }
.pw--refined .pw__cta:focus-visible { outline: 2px solid #141318; outline-offset: 4px; }
.pw--refined .pw__wall { margin-top: 32px; }
@media (max-width:1023px) {
  #about { padding-top: 88px; }
  #about .about__side { gap: 28px; }
  #about .about__vals { gap: 24px; }
  #about .about__vals li { display: block; }
  #about .about__vals .about__n { display: block; padding: 0; margin-bottom: 14px; }
  #about .about__journey > li { grid-template-columns: minmax(130px,2fr) minmax(0,7fr); gap: 28px; }
  .pw--refined .pw__invitation { align-items: flex-start; flex-direction: column; gap: 20px; }
}
@media (max-width:767px) {
  #about { padding-top: 88px; }
  #about .about__heading { margin-bottom: 26px; }
  #about .about__lead { max-width: 21ch; font-size: clamp(36px,8.5vw,48px); line-height: 1.08; }
  #about .about__side { grid-template-columns: minmax(0,1fr); gap: 18px; }
  #about .about__copy-col { gap: 18px; }
  #about .about__side p { font-size: 17px; }
  #about .about__top { padding-bottom: 32px; }
  #about .about__vv { padding: 40px 0; }
  #about .about__vv > div:first-child { margin-bottom: 30px; }
  #about .about__vh { font-size: 30px; }
  #about .about__vals { grid-template-columns: minmax(0,1fr); gap: 24px; }
  #about .about__vals li { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 12px; padding-top: 20px; }
  #about .about__vals .about__n { padding-top: 6px; margin: 0; }
  #about .about__blk { padding: 36px 0 40px; }
  #about .about__journey > li { grid-template-columns: minmax(0,1fr); gap: 20px; padding: 26px 0; }
  #about .about__year { font-size: 64px; }
  #about .about__year--today { font-size: 44px; }
  #about .about__story-lead, #about .about__story-body h4 { font-size: 28px; }
  .pw.pw--refined { padding: 40px 0; }
  .pw--refined .pw__p { font-size: clamp(34px,8.7vw,46px); }
  #about + .pw--refined .pw__intro { font-size: 17px; }
  .pw--refined .pw__cta { min-height: 48px; }
}

/* Compact About rhythm: same content, reduced section gaps. */
#about .about__top{padding-bottom:30px}
#about .about__heading{margin-bottom:24px}
#about .about__figs>div{padding-top:22px;padding-bottom:22px}
#about .about__offices{padding-top:16px}
#about .about__vv{padding:30px 0}
#about .about__vv>div:first-child{margin-bottom:24px}
#about .about__vv .about__lb{margin-bottom:14px}
#about .about__vh{margin-bottom:12px;font-size:clamp(30px,3vw,42px)}
#about .about__vals li{padding-top:14px}
#about .about__value-copy{margin-top:8px}
#about .about__blk{padding:28px 0 30px}
#about .about__blk>.about__lb{margin-bottom:18px}
#about .about__how li{padding-top:14px}
#about .about__how h4{margin-top:8px}
#about .about__journey>li{padding:20px 0;gap:40px;grid-template-columns:minmax(150px,2fr) minmax(0,8fr)}
#about .about__year{font-size:clamp(56px,5.6vw,76px)}
#about .about__year--today{font-size:clamp(40px,4vw,54px)}
#about .about__story-lead,#about .about__story-body h4{font-size:clamp(26px,2.5vw,34px)}
#about .about__story-body h4{margin-bottom:10px}
.pw.pw--refined{padding-top:36px;padding-bottom:32px}
.pw--refined .pw__lb{margin-bottom:14px}
.pw--refined .pw__invitation{margin-top:18px}
.pw--refined .pw__wall{margin-top:24px}
.cosw{padding-top:28px;padding-bottom:28px}
@media(max-width:767px){#about .about__vv{padding:26px 0}#about .about__vv>div:first-child{margin-bottom:22px}#about .about__vals{gap:18px}#about .about__blk{padding:24px 0 26px}#about .about__journey>li{grid-template-columns:1fr;gap:12px;padding:18px 0}#about .about__year{font-size:56px}#about .about__year--today{font-size:40px}.pw.pw--refined{padding-top:28px;padding-bottom:24px}.cosw{padding-top:24px;padding-bottom:24px}}

/* 4419: purple figures and expanded vision, approved browser comments. */
#about .about__figs>div>b,#about .about__figs>div>b .sc-interp{color:#533AFD}
#about .about__vision-heading{max-width:none;margin-bottom:26px}
#about .about__vision-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 48px;list-style:none;padding:0;margin:0}
#about .about__vision-points>li{position:relative;padding:18px 0 0 22px;border-top:1px solid rgba(185,185,249,.24)}
#about .about__vision-points>li:before{content:"";position:absolute;left:0;top:27px;width:7px;height:7px;border-radius:50%;background:#533AFD}
#about .about__vision-points h4{font:inherit;font-size:25px;font-weight:500;line-height:1.2;letter-spacing:-.015em;margin:0 0 9px;color:#fff}
#about .about__vision-points p{font-size:17px;line-height:1.5;color:#C2BFC9;margin:0;max-width:55ch}
@media(max-width:650px){#about .about__vision-points{grid-template-columns:1fr;gap:18px}#about .about__vision-points h4{font-size:23px}#about .about__vision-heading{font-size:30px;margin-bottom:22px}}

/* 4419: portfolio introduction and supporting number accents. */
#about .about__journey>li:first-child .about__year{color:#533AFD}
#about .about__n{color:#B9B9F9}
.hill-portfolio-intro{box-sizing:border-box;padding:54px clamp(20px,4vw,56px) 38px;color:#141318}
.hill-portfolio-intro__label{margin:0 0 24px;font:10px 'Source Code Pro',monospace;letter-spacing:.22em}
.hill-portfolio-intro__grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.hill-portfolio-intro h2{margin:0;font-size:clamp(36px,4.2vw,62px);line-height:1.07;font-weight:500;letter-spacing:-.025em}
.hill-portfolio-intro h2>span{color:#533AFD}
.hill-portfolio-intro__copy p{font-size:18px;line-height:1.5;margin:0 0 16px;max-width:62ch}
.hill-portfolio-intro__copy p:last-child{margin-bottom:0}
.hill-portfolio-intro__sectors{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 0;padding-top:18px;border-top:1px solid #14131826;font:11px 'Source Code Pro',monospace;letter-spacing:.09em;text-transform:uppercase}
.hill-portfolio-intro__sectors>span{color:#533AFD}
@media(max-width:700px){.hill-portfolio-intro{padding-top:38px;padding-bottom:30px}.hill-portfolio-intro__grid{grid-template-columns:1fr;gap:22px}.hill-portfolio-intro__copy p{font-size:17px}.hill-portfolio-intro__sectors{font-size:9px;gap:8px}}

/* 4419: seven client logos per desktop row, smaller marks and no old last-row offsets. */
.pw--refined .pw__wall{grid-template-columns:repeat(7,minmax(0,1fr))}
.pw--refined .pw__wall>li,.pw--refined .pw__wall>li.s2,.pw--refined .pw__wall>li.p2{grid-column:auto;min-height:112px;padding:18px 12px}
.pw--refined .pw__wall img{width:calc(var(--w) * var(--k) * .8 * 1px);max-height:76px;object-fit:contain}
@media(max-width:767px){.pw--refined .pw__wall{grid-template-columns:repeat(3,minmax(0,1fr))}.pw--refined .pw__wall>li{min-height:96px;padding:14px 10px}}
@media(max-width:480px){.pw--refined .pw__wall{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Keep large project collections' page shortcuts within the existing book toolbar. */
.hill-book-dialog .hill-book-progress{min-width:0;max-width:60%;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:thin;scrollbar-color:#B9B9F9 transparent;padding-bottom:4px}
.hill-book-dialog .hill-book-progress button{flex:0 0 auto}
@media(max-width:700px){.hill-book-dialog .hill-book-progress{max-width:100%;width:100%}}