/* ==========================================================================
   FMP v2 — Home page
   ========================================================================== */

/* ---- 1 · the film: plays on its own, muted and looped (assets/hero.js); scrolling is never tied to it ---- */
.fh{position:relative;min-height:max(600px,100svh);display:flex;align-items:flex-end;overflow:hidden;background:var(--graphite);color:#fff}
.fh-v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;background:var(--graphite)}
.fh-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(14,12,10,.45) 0%,rgba(14,12,10,0) 22%,rgba(14,12,10,0) 50%,rgba(14,12,10,.7) 100%),linear-gradient(90deg,rgba(14,12,10,.42),rgba(14,12,10,0) 58%)}
.fh-copy{position:relative;z-index:2;padding-top:calc(var(--hdr) + var(--s5))}
.fh .d1{max-width:none;color:#fff}
.fh .lead{color:rgba(255,255,255,.86);margin-top:var(--s3);max-width:44ch}
.fh .v-eyebrow{color:rgba(255,255,255,.8)}.fh .v-eyebrow::before{background:rgba(255,255,255,.6)}
.v-hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s5)}
/* Hero text has two states, chosen by the film itself (assets/hero.js sets .fh.playing):
   resting / paused — "Every building is made of layers." and the lead;
   playing — the current scene's mission statement in exactly that place, larger, with its verified supporting line.
   Both live in one grid cell, so swapping them never moves the buttons or the page. */
.fh-say{position:relative} /* the resting headline sets the height; the statement overlays it from the bottom, so swaps never shift layout (CLS) */
.fh-cap{position:absolute;left:0;right:0;bottom:0}
.fh-rest{transition:opacity .5s var(--e),transform .7s var(--e)}
.fh .fh-lead{margin-top:var(--gap-title)}
.fh.playing .fh-rest{opacity:0;transform:translateY(-8px);pointer-events:none}
.fh-cap{opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .42s var(--e),transform .6s var(--e),visibility 0s linear .42s;pointer-events:none}
.fh.playing .fh-cap.on{opacity:1;visibility:visible;transform:none;transition:opacity .7s var(--e) .08s,transform .9s var(--e) .08s,visibility 0s;pointer-events:auto}
.fh-cap:not(.on){transform:translateY(-8px)}
.fh-cap-t{margin:0;max-width:15ch;font:600 clamp(44px,4.6vw,72px)/1.02 var(--disp);letter-spacing:-.03em;color:#fff;text-wrap:balance;text-shadow:0 2px 28px rgba(0,0,0,.3)}
.fh-cap-s{margin:var(--gap-title) 0 0;max-width:46ch;font:400 clamp(17px,1.35vw,20px)/1.55 var(--sans);color:rgba(255,255,255,.88);text-shadow:0 1px 14px rgba(0,0,0,.4)}
.fh-cap-s:empty,.fh-cap-p:empty{display:none}
.fh-cap-p{margin:14px 0 0;font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.fh-cap-p a{display:inline-block;padding:6px 0 3px;line-height:1.5;color:rgba(255,255,255,.84);text-decoration:none;border-bottom:1px solid rgba(238,116,29,.7)}
.fh-cap-p a:hover{color:#fff;border-color:var(--co)}
.fh-cap-p span{color:var(--co)}
.fh-cap-p a:focus-visible{outline:2px solid var(--co);outline-offset:3px}
.fh-copy{padding-bottom:clamp(64px,11vh,120px)}
@media (max-width:1100px){.fh-cap-t{font-size:48px}}
@media (max-width:900px){.fh-cap-t{font-size:42px;max-width:16ch}.fh-cap-s{font-size:16px}}
@media (max-width:600px){.fh-cap-t{font-size:33px;line-height:1.06}.fh-cap-s{font-size:15px;margin-top:14px}.fh-cap-p{margin-top:10px}}
@media (max-width:360px){.fh-cap-t{font-size:29px}.fh-cap-s{font-size:14.5px}}
@media (prefers-reduced-motion:reduce){.fh-rest,.fh-cap,.fh.playing .fh-cap.on{transition:none}}
.fh-play{position:absolute;z-index:3;right:var(--gutter);bottom:24px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(14,12,10,.3);border:1px solid rgba(255,255,255,.34);cursor:pointer;transition:background var(--dur) var(--e)}
.fh-play:hover{background:rgba(14,12,10,.55)}
.fh-play:focus-visible{outline:2px solid var(--co);outline-offset:3px}
.fh-play .i-pause{display:none}.fh-play[aria-pressed="true"] .i-pause{display:block}.fh-play[aria-pressed="true"] .i-play{display:none}
@media (max-width:900px){.fh-play{bottom:auto;top:calc(var(--hdr) + 14px);right:var(--gutter)}}
@media (prefers-reduced-motion:reduce){.fh-cap{transition:none}}

/* ---- 2 · what FMP does ---- */
.v-what-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:var(--s5);align-items:start;margin-bottom:var(--s7)}
.v-state{margin:0;font:500 clamp(26px,2.9vw,44px)/1.22 var(--disp);letter-spacing:-.02em;color:var(--ink);max-width:30ch}
@media (max-width:900px){.v-what-g{grid-template-columns:1fr;gap:0;margin-bottom:var(--s6)}}
/* the lockup beside the statement, with a slow light passing across it now and then (the sheen is masked to the logo) */
.v-mark{position:relative;width:min(230px,70%);margin-top:var(--s5)}
.v-mark img{display:block;width:100%;height:auto}
.v-mark-sh{position:absolute;inset:0;pointer-events:none;-webkit-mask:url(brand/fmp-lion-lockup.png) center/100% 100% no-repeat;mask:url(brand/fmp-lion-lockup.png) center/100% 100% no-repeat;background:linear-gradient(105deg,rgba(255,255,255,0) 38%,rgba(255,248,232,.62) 50%,rgba(255,255,255,0) 62%) no-repeat;background-size:260% 100%;background-position:130% 0;animation:vSheen 9s cubic-bezier(.45,0,.25,1) 1.2s infinite}
@keyframes vSheen{0%,58%{background-position:130% 0}86%,100%{background-position:-30% 0}}
@media (max-width:900px){.v-what-l{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:var(--s4)}.v-what-l .v-eyebrow{margin:0}.v-mark{width:120px;margin:0;flex:none}}
@media (prefers-reduced-motion:reduce){.v-mark-sh{animation:none;opacity:0}}
/* On the record: the infrastructure sketch sits on the page itself, edges faded into the ground */
.v-proof-head{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:var(--s5);align-items:center;margin-bottom:var(--s6)}
.v-proof-t .d2{max-width:14ch}
.v-proof-t .v-link{margin-top:var(--s4)}
.v-sketch{margin:0 calc(-1 * max(var(--gutter),(100vw - 1360px)/2 + var(--gutter))) 0 0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 10%,#000 84%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 90%,transparent 100%),linear-gradient(180deg,transparent 0,#000 10%,#000 84%,transparent 100%);mask-composite:intersect}
.v-sketch img{display:block;width:100%;height:auto;mix-blend-mode:darken}
@media (max-width:900px){.v-proof-head{grid-template-columns:1fr;gap:var(--s4)}.v-sketch{margin:0 -18px;-webkit-mask-image:linear-gradient(180deg,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,#000 82%,transparent 100%)}}

/* ---- shared head row ---- */
.v-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px 48px;margin-bottom:var(--s6)}
.v-head .d2{max-width:18ch}

/* ---- 3 · the built environment: one photograph, with the interaction drawn in its own coordinates (assets/env.js) ---- */
.v-env{background:var(--paper);padding:var(--sec-y) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.v-env-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px 64px;align-items:end;margin-bottom:var(--s6)}
.v-env-head .d2{max-width:16ch}
@media (max-width:900px){.v-env-head{grid-template-columns:1fr;margin-bottom:var(--s5)}}
/* full bleed; on very wide or short screens the panorama is held at 86% of the viewport height and centred */
.env-stage{position:relative;margin:0 auto;width:min(100%,calc(86svh * 2.8115),2900px)}
.env-scroll{position:relative;overflow:hidden}
.env{position:relative;width:100%;aspect-ratio:2103/748;background:#d9cdb9}
.env-img{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;user-select:none;-webkit-user-drag:none}
.env-ov{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.env-dim{fill:rgba(16,14,12,.46);opacity:0;transition:opacity .24s var(--e)}
.env-stage.focus .env-dim{opacity:1}
.env-r{fill:rgba(238,116,29,.10);stroke:var(--co);stroke-width:1.6;vector-effect:non-scaling-stroke;stroke-linejoin:round;fill-rule:evenodd;opacity:0;transition:opacity .2s var(--e)}
.env-r.on{opacity:1}
/* hotspots: white centre, graphite ring, a hairline of shadow to lift it off the photograph */
.env-pts{position:absolute;inset:0}
.env-pt{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;padding:0;border:0;background:transparent;border-radius:50%;cursor:pointer;display:grid;place-items:center;-webkit-tap-highlight-color:transparent}
.env-pt i{position:relative;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 0 0 2.5px #1d1a16,0 1px 6px rgba(0,0,0,.35);transition:transform .2s var(--e),box-shadow .2s var(--e),opacity .2s var(--e)}
.env-pt i::after{content:"";position:absolute;inset:5px;border-radius:50%;background:#1d1a16;transition:background .2s var(--e),transform .2s var(--e);transform:scale(0)}
.env-pt:hover i,.env-pt.on i,.env-pt:focus-visible i{transform:scale(1.12);box-shadow:0 0 0 2.5px var(--co),0 1px 8px rgba(0,0,0,.4)}
.env-pt:hover i::after,.env-pt.on i::after,.env-pt:focus-visible i::after{background:var(--co);transform:scale(1)}
.env-pt:focus-visible{outline:none}
.env-pt:focus-visible i{box-shadow:0 0 0 2.5px var(--co),0 0 0 6px rgba(255,255,255,.9),0 1px 8px rgba(0,0,0,.4)}
.env-pt.on i::before{content:"";position:absolute;inset:-7px;border-radius:50%;border:1.5px solid rgba(238,116,29,.7);animation:envPulse 2.6s var(--e) infinite}
@keyframes envPulse{0%{transform:scale(.7);opacity:.9}70%,100%{transform:scale(1.5);opacity:0}}
.env-stage.focus .env-pt:not(.on) i{opacity:.72}
/* hover label */
.env-tag{position:absolute;left:0;top:0;z-index:4;padding:8px 12px;border-radius:8px;background:rgba(20,18,16,.94);color:#f6f1e8;font:600 13.5px/1.2 var(--sans);white-space:nowrap;pointer-events:none;opacity:0;transform:translate(-50%,calc(-100% - 16px));transition:opacity .2s var(--e)}
.env-tag.below{transform:translate(-50%,44px)}
.env-tag.on{opacity:1}
.env-snap{position:absolute;top:0;width:1px;height:1px;scroll-snap-align:center;pointer-events:none}
.env-swipe{display:none}
/* phones and tablets: the panorama keeps its height and pans */
@media (max-width:900px){
  .env-stage{width:100%}
  .env-scroll{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .env-scroll::-webkit-scrollbar{display:none}
  .env{width:auto;height:clamp(340px,62svh,560px)}
  .env-stage::before,.env-stage::after{content:"";position:absolute;top:0;z-index:2;width:28px;height:clamp(340px,62svh,560px);pointer-events:none}
  .env-stage::before{left:0;background:linear-gradient(90deg,rgba(251,248,243,.55),rgba(251,248,243,0))}
  .env-stage::after{right:0;background:linear-gradient(270deg,rgba(251,248,243,.55),rgba(251,248,243,0))}
  .env-swipe{display:block;margin:14px 0 0;text-align:center;font:500 11.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
  .env-tag{display:none}
}
/* pan controls (phones/tablets only): small warm-white squares on the soil band at the foot of the photo */
.env-nav,.env-pos{display:none}
@media (max-width:900px){
  .env-nav{display:flex;justify-content:space-between;position:absolute;z-index:3;left:12px;right:12px;top:calc(clamp(340px,62svh,560px) - 48px);pointer-events:none}
  .env-arr{pointer-events:auto;width:40px;height:40px;display:grid;place-items:center;padding:0;border:1px solid rgba(20,18,16,.18);border-radius:3px;background:rgba(251,248,243,.94);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.12);cursor:pointer;transition:opacity .3s var(--e),border-color .2s var(--e),color .2s var(--e)}
  .env-arr:active{border-color:var(--co);color:var(--co-text)}
  .env-arr:focus-visible{outline:2px solid var(--co);outline-offset:2px}
  .env-arr:disabled{opacity:0;pointer-events:none}
  .env-pos{display:block;position:relative;height:2px;margin:10px var(--gutter) 0;background:var(--line)}
  .env-pos i{position:absolute;left:0;top:0;bottom:0;background:var(--co);transition:none}
}
/* under the photograph, one column with it: the zone navigator (an architectural legend, house style of the globe's
   index) and the selected place's engineering context, set on the paper ground */
.env-below{margin-top:var(--s5)}
.ei-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--line-2)}
.ei-k{margin:0;font:500 12px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.ei-ctl{display:flex;align-items:center;gap:8px}
.ei-pos{margin-right:10px;font:500 13px/1 var(--mono);color:var(--mute);font-variant-numeric:tabular-nums}
.ei-pos b{font-weight:500;color:var(--ink)}
.ei-step{width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--line-2);border-radius:3px;background:transparent;color:var(--ink);cursor:pointer;transition:border-color .2s,color .2s}
.ei-step:hover{border-color:var(--ink-2)}
.ei-step:active{color:var(--co-text);border-color:var(--co)}
.ei-step:focus-visible,.ei-c:focus-visible{outline:2px solid var(--co);outline-offset:2px}
.ei-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));column-gap:24px}
.ei-list li{border-bottom:1px solid var(--line)}
.ei-c{position:relative;display:flex;align-items:baseline;gap:12px;width:100%;min-height:52px;padding:16px 0 14px;border:0;background:none;text-align:left;cursor:pointer;color:var(--ink-2)}
.ei-c::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--co);transform:scaleX(0);transform-origin:0 50%;transition:transform .35s var(--e)}
.ei-n{flex:none;font:500 11.5px/1 var(--mono);color:var(--mute);font-variant-numeric:tabular-nums}
.ei-t{font:500 15.5px/1.25 var(--sans);letter-spacing:-.003em}
.ei-c:hover{color:var(--ink)}
.ei-c:hover::before,.ei-c.pv::before{transform:scaleX(.35)}
.ei-c.pv{color:var(--ink)}
.ei-c[aria-pressed="true"]{color:var(--ink)}
.ei-c[aria-pressed="true"] .ei-t{font-weight:600}
.ei-c[aria-pressed="true"] .ei-n{color:var(--co-text)}
.ei-c[aria-pressed="true"]::before{transform:scaleX(1)}
.ec-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0;padding:0}
/* the context: name and actions on the left, the engineering facts on the right */
.ec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:24px 64px;align-items:start;margin-top:var(--s5);min-height:220px}
.ec>*{animation:ecIn .45s var(--e)}
@keyframes ecIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ec-k{margin:0;display:flex;align-items:baseline;gap:12px;font:500 12px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--co-text)}
.ec-k span{color:var(--mute);letter-spacing:0}
.ec-t{margin:10px 0 0;font:600 clamp(28px,2.7vw,40px)/1.06 var(--disp);letter-spacing:-.022em;color:var(--ink);max-width:18ch}
.ec-intro{font-size:clamp(24px,2.4vw,34px);max-width:22ch;line-height:1.12}
.ec-a{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-top:var(--s4)}
.ec-a .b{margin-bottom:6px}
.ec-a .b:hover .ar{transform:translateX(4px)}
.ec-ask{display:inline-block;padding:12px 0;font:500 14.5px/1.3 var(--sans);color:var(--co-text);text-decoration:underline;text-decoration-color:rgba(160,71,9,.35);text-underline-offset:4px}
.ec-ask:hover{text-decoration-color:currentColor}
.ec a:focus-visible{outline:2px solid var(--co);outline-offset:3px}
.ec-d{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.ec-d>div{padding:16px 0 20px;border-top:1px solid var(--line)}
.ec-d dt{font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.ec-d dd{margin:8px 0 0;font-size:16px;line-height:1.55;color:var(--ink-2)}
.ec-d ul{list-style:none;margin:0;padding:0}
.ec-d li{padding:3px 0}
.ec-d li a{font:500 15.5px/1.4 var(--sans);color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2);transition:border-color .2s}
.ec-d li a:hover{border-color:var(--co)}
.ec-r{padding-top:16px;border-top:1px solid var(--line)}
.ec-sum{margin:0;font:500 15px/1.4 var(--mono);color:var(--mute)}
.ec-sum b{font:600 22px/1 var(--disp);color:var(--ink);margin-right:6px}
.ec-sum i{font-style:normal;margin:0 10px}
.ec-note{margin:14px 0 6px;max-width:52ch;font-size:16px;line-height:1.55;color:var(--ink-2)}
@media (max-width:1180px){.ei-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:900px){
  .env-below{margin-top:var(--s4)}
  .ei-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ec{grid-template-columns:1fr;gap:0;margin-top:var(--s4);min-height:0}
  /* one column reads in the order of the work: the place, its condition and systems, then the ways onward */
  .ec-l{display:contents}
  .ec-d,.ec-r{order:1;margin-top:var(--s3)}
  .ec-a{order:2;margin-top:var(--s2)}
}
/* phones: the navigator is one row that scrolls sideways (the active place is kept in view); the facts stack */
@media (max-width:640px){
  .ei-list{display:flex;overflow-x:auto;scrollbar-width:none;column-gap:0;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;overscroll-behavior-x:contain;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
  .ei-list::-webkit-scrollbar{display:none}
  .ei-list li{flex:none;scroll-snap-align:start}
  .ei-c{padding:16px 22px 14px 0;white-space:nowrap}
  .ei-pos{margin-right:4px}
  .ec-d{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.env-pt.on i::before{animation:none;opacity:0}.env-dim,.env-r,.ei-c::before{transition:none}.ec>*{animation:none}}

/* ---- 4 · project proof ---- */
.proof{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px;border-top:1px solid var(--line-2)}
.pf{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.pf-im{display:block;aspect-ratio:4/3;overflow:hidden;border-radius:var(--r-sm);background:var(--sand)}
.pf-im img{width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:transform .9s var(--e),filter .6s var(--e)}
.pf:hover .pf-im img{transform:scale(1.04);filter:none}
.pf-tx h3{margin:8px 0 8px;font:600 21px/1.2 var(--disp);letter-spacing:-.012em}
.pf-tx h3 a{text-decoration:none}
.pf-tx h3 a:hover{color:var(--co-text)}
.pf-tx>p:not(.lbl){margin:0;color:var(--ink-2);font-size:15px;line-height:1.5;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.pf-doc{display:inline-flex;gap:6px;margin-top:12px;font:500 13px var(--sans);color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}
.pf-doc:hover{border-color:var(--ink)}
@media (max-width:1000px){.proof{grid-template-columns:1fr}}
@media (max-width:560px){.pf{grid-template-columns:120px minmax(0,1fr);gap:16px}.pf-tx h3{font-size:18px}}

/* ---- 5 · technical authority ---- */
.v-auth{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.v-auth-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center}
.v-auth-ph{margin:0;border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--sand)}
.v-auth-ph img{width:100%;height:100%;object-fit:cover}
.v-points{list-style:none;counter-reset:pt;margin:var(--s5) 0 0;padding:0;border-top:1px solid var(--line-2)}
.v-points li{counter-increment:pt;display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 12px;padding:22px 0;border-bottom:1px solid var(--line)}
.v-points li::before{content:counter(pt,decimal-leading-zero);grid-row:span 2;font:500 12px/1.6 var(--mono);color:var(--co-text)}
.v-points b{font:600 18px/1.3 var(--disp);letter-spacing:-.01em}
.v-points span{color:var(--ink-2);font-size:15.5px;line-height:1.55}
.v-auth-links{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin-top:var(--s4)}
@media (max-width:900px){.v-auth-g{grid-template-columns:1fr}.v-auth-ph{aspect-ratio:16/10}}

/* ---- 6 · reach (map styles live in fmp.css) ---- */
.v-reach .smap{margin-top:0}

/* ---- 7 · company ---- */
.v-co-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(40px,6vw,96px);align-items:end}
.v-co .lead{margin-top:24px}.v-co .v-link{margin-top:20px}
.v-ppl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
/* portraits share one warm-white ground, 4:5 frame and head position (images/leadership/v4, LEADERSHIP_IMAGE_PROCESSING.md): shown as they are */
.v-ppl img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center top;border-radius:var(--r-sm);background:#f8f4ee}
.v-ppl b{display:block;margin-top:12px;font:600 15px/1.25 var(--sans)}
.v-ppl span{display:block;margin-top:2px;font-size:13.5px;color:var(--mute)}
@media (max-width:900px){.v-co-g{grid-template-columns:1fr}.v-ppl{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---- 8 · knowledge ---- */
.v-kn{background:var(--paper);border-top:1px solid var(--line)}
.v-kn-g{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(32px,4vw,64px);border-top:1px solid var(--line-2);padding-top:32px}
.v-kn-h{margin:0 0 14px;font:600 13px/1.2 var(--sans);color:var(--co-text);letter-spacing:.02em}
.kn-list{list-style:none;margin:0;padding:0}
.kn-row{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:15.5px}
.kn-row em{flex:none;font:500 12px var(--sans);font-style:normal;color:var(--mute)}
.kn-row:hover span{color:var(--co-text)}
.kn-tool{display:block;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none}
.kn-tool b{display:block;font:600 17px/1.3 var(--disp)}
.kn-tool span{display:block;margin-top:4px;color:var(--ink-2);font-size:14.5px}
.kn-tool:hover b{color:var(--co-text)}
.kn-mag{display:flex;gap:16px;align-items:center;text-decoration:none}
.kn-mag-c{flex:none;width:92px;aspect-ratio:3/4;border-radius:8px;background:var(--ink);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:10px;box-shadow:0 14px 26px rgba(14,12,10,.18)}
.kn-mag-c b{font:700 20px/.95 var(--disp)}
.kn-mag-c b:first-child{color:var(--co)}
.kn-mag>span:last-child b{display:block;font:600 17px/1.3 var(--disp)}
.kn-mag>span:last-child span{display:block;margin-top:4px;color:var(--ink-2);font-size:14.5px}
@media (max-width:900px){.v-kn-g{grid-template-columns:1fr}}

/* ---- 9 · careers ---- */
.v-car-g{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end}
.v-car .lead{margin-top:24px}
.job-depts{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.job-depts li{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px}
.job-depts b{font:600 24px/1 var(--disp)}
@media (max-width:900px){.v-car-g{grid-template-columns:1fr}}

/* ---- 10 · closing call ---- */
.v-end{background:var(--graphite);color:#fff;padding:var(--sec-y) 0}
.v-end-g{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end}
.v-end .d2{color:#fff}.v-end .lead{color:#cfc5b5;margin-top:20px}
.v-end-ways{list-style:none;margin:0;padding:0;border-top:1px solid rgba(255,255,255,.18)}
.v-end-ways a{display:block;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.12);text-decoration:none;color:#fff}
.v-end-ways span{display:block;font:500 12.5px var(--sans);color:#b5ab9a}
.v-end-ways b{display:block;margin-top:4px;font:600 19px/1.3 var(--disp)}
.v-end-ways a:hover b{color:var(--co)}
@media (max-width:900px){.v-end-g{grid-template-columns:1fr}}

/* header over the film: white links until the header turns solid on scroll */
body[data-page="home"] .hdr:not(.solid) .navp a{color:rgba(255,255,255,.86)}
body[data-page="home"] .hdr:not(.solid) .navp a:hover{color:#fff}

/* questions (home): intro left, answers right; each answer opens in place */
.v-faq-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.faq-l{border-top:1px solid var(--line-2,var(--line))}
.faq-i{border-bottom:1px solid var(--line)}
.faq-i summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0}
.faq-i summary::-webkit-details-marker{display:none}
.faq-i summary h3{margin:0;font:600 clamp(17px,1.4vw,20px)/1.35 var(--sans);color:var(--ink)}
.faq-i summary::after{content:"+";flex:none;display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--line-2,var(--line));border-radius:50%;font:400 20px/1 var(--sans);color:var(--co-text,#a04709);transition:transform .3s var(--e,ease),background .3s}
.faq-i[open] summary::after{content:"–";background:var(--co,#ee741d);border-color:var(--co,#ee741d);color:#fff}
.faq-i summary:hover h3{color:var(--co-text,#a04709)}
.faq-i summary:focus-visible{outline:2px solid var(--co);outline-offset:4px}
.faq-a{padding:0 54px 24px 0}
.faq-a p{margin:0 0 12px;font-size:16.5px;line-height:1.6;color:var(--ink-2)}
@media (max-width:860px){.v-faq-g{grid-template-columns:1fr}.faq-a{padding-right:0}}