/* ================================================================
   AL BURJ — homepage. Normal-flow editorial sections on the platform shell.
   One invisible grid (12 columns inside .wrap), three vertical rhythms, one image role per picture.
   Nothing here pins, scrubs or listens to the wheel: motion is reveal-on-enter and hover only.
   ================================================================ */
.home main{position:relative;z-index:1}
:root{--gap:clamp(16px,2.2vw,32px);--sp-1:clamp(48px,7vh,88px);--sp-2:clamp(72px,10vh,128px);--sp-3:clamp(96px,13vh,168px)}
.g12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:start}
.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}
/* offset columns run to the right edge of the grid */
.cs5{grid-column:5/-1}.cs7{grid-column:7/-1}.cs8{grid-column:8/-1}
@media(max-width:900px){.g12>[class*="c"]{grid-column:1/-1}}
.sp-1{padding:var(--sp-1) 0}.sp-2{padding:var(--sp-2) 0}.sp-3{padding:var(--sp-3) 0}
.hm-band{background:var(--paper2)}
/* type roles — three sizes, used consistently */
/* type roles — SECTION TITLE (primary/support) and a quiet statement; width axis, no italics */
.t-primary{font-family:var(--display);font-stretch:106%;font-weight:350;font-size:clamp(34px,4vw,60px);line-height:1.02;letter-spacing:-.02em;margin:.35em 0 0}
.t-support{font-family:var(--display);font-stretch:100%;font-weight:400;font-size:clamp(28px,3vw,48px);line-height:1.06;letter-spacing:-.015em;margin:.35em 0 0}
.t-quiet{font-family:var(--display);font-stretch:100%;font-weight:400;font-size:clamp(20px,2vw,28px);line-height:1.3;letter-spacing:-.01em;margin:.5em 0 0;color:var(--paper-ink)}
.hm h2 em{font-style:normal;font-weight:inherit}
.body .hm h2 em{color:var(--navy)}
/* section label — a rule and a word, sentence case, semi-condensed, brass */
.lbl{display:flex;align-items:center;gap:12px;font-family:var(--sans);font-stretch:var(--w-label);font-size:13px;font-weight:500;color:var(--brass);letter-spacing:.01em}
.lbl i{display:block;width:28px;height:1px;background:var(--brass)}
.hm .lede{margin:0;max-width:44ch}
.hm .door svg{width:18px;height:12px}

/* ---------- HERO — one in-flow viewport: copy column on navy, photograph right ---------- */
#hero{position:relative;height:100vh;height:100svh;min-height:600px;max-height:1120px;overflow:hidden;background:#060c1c;color:var(--ink);border-bottom:1px solid rgba(199,154,87,.28);isolation:isolate}
#hero .hx-media{position:absolute;inset:0;z-index:0;overflow:hidden}
#hero .hx-par{position:absolute;left:-3%;right:-3%;top:-5%;height:110%;will-change:transform;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
#hero picture{display:contents}
#hero .hx-par img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--hx-pos,62% 48%);transform:scale(1.04);opacity:0;animation:hxPhoto 1.8s cubic-bezier(.2,.7,.2,1) .05s forwards}
#hero .hx-veil{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,#060c1c 0%,#060c1c 28%,rgba(6,12,28,.84) 40%,rgba(6,12,28,.36) 54%,rgba(6,12,28,0) 66%),linear-gradient(180deg,rgba(6,12,28,.55) 0,rgba(6,12,28,0) 170px),linear-gradient(0deg,rgba(6,12,28,.55) 0,rgba(6,12,28,0) 22%)}
#hero .hx-copy{position:absolute;z-index:2;left:clamp(16px,4vw,52px);top:50%;transform:translateY(-50%);width:min(46vw,640px);padding-left:clamp(18px,1.8vw,26px);border-left:1px solid rgba(199,154,87,.6)}
#hero .hx-eyebrow{margin:0;font-family:var(--sans);font-stretch:var(--w-label);font-style:normal;font-weight:500;font-size:14px;letter-spacing:.01em;color:var(--brass);opacity:0;animation:hxFade .6s ease-out .15s forwards}
#hero .hx-eyebrow .hx-sep{color:rgba(233,207,161,.5);padding:0 .35em}
/* DISPLAY: wide, light, tight — the width settles from 96% to 112% as the lines rise */
#hero h1{font-family:var(--display);font-stretch:var(--w-display);font-weight:300;font-size:clamp(42px,6.2vw,104px);line-height:.98;letter-spacing:-.02em;color:#F4F7FC;margin:18px 0 0}
#hero h1 .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
#hero h1 .ln span{display:block;transform:translateY(110%);font-stretch:96%;animation:hxRise .95s cubic-bezier(.2,.7,.2,1) .22s forwards,hxWidth 1.6s cubic-bezier(.2,.7,.2,1) .22s forwards}
#hero h1 .ln:nth-child(2) span{animation-delay:.34s,.34s;font-style:normal;font-weight:300;color:#E9CFA1}
@keyframes hxWidth{to{font-stretch:112%}}
#hero .hx-lede{font-family:var(--sans);font-weight:400;font-size:clamp(15.5px,1.1vw,18px);line-height:1.6;color:rgba(237,241,248,.8);max-width:38ch;margin:26px 0 0;opacity:0;animation:hxUp .7s cubic-bezier(.2,.7,.2,1) .62s forwards}
#hero .hx-cta{display:inline-flex;align-items:center;gap:14px;margin-top:34px;height:52px;padding:0 26px;border:1px solid var(--brass);color:#F4F7FC;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:0;text-transform:none;text-decoration:none;opacity:0;animation:hxFade .6s ease-out .85s forwards;transition:background .25s,color .25s,font-weight .25s}
#hero .hx-cta:hover{font-weight:600}
#hero .hx-cta svg{width:18px;height:12px;flex:none;transition:transform .25s}
#hero .hx-cta:hover,#hero .hx-cta:focus-visible{background:rgba(199,154,87,.16);color:#fff;outline:none}
#hero .hx-cta:hover svg,#hero .hx-cta:focus-visible svg{transform:translateX(4px)}
#hero .hx-cue{position:absolute;z-index:2;left:clamp(16px,4vw,52px);bottom:32px;display:flex;align-items:center;gap:14px;font-family:var(--sans);font-stretch:var(--w-label);font-size:13px;font-weight:500;letter-spacing:.01em;text-transform:none;color:var(--soft);opacity:0;animation:hxFade .8s ease-out 1.3s forwards}
#hero .hx-cue i{display:block;width:1px;height:40px;background:var(--brass);animation:hxCue 2.4s ease-in-out infinite}
#hero .hx-cap{position:absolute;z-index:2;right:clamp(20px,4vw,52px);bottom:34px;margin:0;font-family:var(--sans);font-stretch:var(--w-label);font-style:normal;font-size:13px;font-weight:500;color:rgba(237,241,248,.6);opacity:0;animation:hxFade .8s ease-out 1.2s forwards}
#hero .hx-pick{position:absolute;z-index:3;right:clamp(20px,4vw,52px);top:clamp(72px,9vh,96px);display:flex;gap:6px}
#hero .hx-pick a{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--soft);border:1px solid var(--line2);padding:6px 10px;background:rgba(6,12,28,.55);transition:.2s}
#hero .hx-pick a.on,#hero .hx-pick a:hover{color:#1a1206;background:var(--brass);border-color:var(--brass)}
@keyframes hxPhoto{to{transform:none;opacity:1}}
@keyframes hxRise{to{transform:none}}
@keyframes hxUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes hxFade{to{opacity:1}}
@keyframes hxCue{0%,100%{opacity:.25;transform:scaleY(.45)}50%{opacity:1;transform:scaleY(1)}}
@media(max-width:1100px){#hero .hx-copy{width:min(56vw,560px)}#hero .hx-veil{background:linear-gradient(90deg,#060c1c 0%,#060c1c 24%,rgba(6,12,28,.84) 40%,rgba(6,12,28,.36) 58%,rgba(6,12,28,0) 72%),linear-gradient(180deg,rgba(6,12,28,.55) 0,rgba(6,12,28,0) 170px),linear-gradient(0deg,rgba(6,12,28,.55) 0,rgba(6,12,28,0) 22%)}}
@media(max-width:760px){
  #hero{height:auto;min-height:100vh;min-height:100svh;max-height:none;display:flex;flex-direction:column;padding-bottom:28px}
  #hero .hx-media{position:relative;inset:auto;height:54svh;min-height:300px;flex:none}
  #hero .hx-par{left:0;right:0;top:0;height:100%;transition:none}
  #hero .hx-par img{object-position:var(--hx-pos-m,50% 46%)}
  #hero .hx-veil{background:linear-gradient(180deg,rgba(6,12,28,.5) 0,rgba(6,12,28,0) 28%,rgba(6,12,28,0) 80%,#060c1c 100%)}
  #hero .hx-copy{position:relative;top:auto;left:auto;transform:none;width:auto;margin:6px var(--gutter) 0;padding:22px 0 0 16px;flex:1}
  #hero .hx-eyebrow{font-size:16px;line-height:1.5}
  #hero .hx-eyebrow span:first-child{display:block}#hero .hx-eyebrow .hx-sep{display:none}
  #hero h1{font-size:clamp(42px,12vw,54px);margin-top:12px}
  #hero .hx-lede{font-size:15px;margin-top:16px;max-width:none}
  #hero .hx-cta{margin-top:24px;height:48px;justify-content:center;width:100%;max-width:320px}
  #hero .hx-cue,#hero .hx-cap{display:none}
  #hero .hx-pick{top:auto;bottom:calc(46svh + 10px);right:14px}
}
@media(prefers-reduced-motion:reduce){#hero .hx-par img,#hero h1 .ln span,#hero .hx-eyebrow,#hero .hx-lede,#hero .hx-cta,#hero .hx-cue,#hero .hx-cap{animation:none;opacity:1;transform:none}#hero .hx-cue i{animation:none}#hero .hx-par{transition:none}}

/* ---------- shared motion grammar ---------- */
.stagger>*{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.stagger.in>*{opacity:1;transform:none;transition-delay:calc(var(--i,0) * 70ms)}
.fade{opacity:0;transition:opacity 1s ease}
.fade.in{opacity:1}
@media(prefers-reduced-motion:reduce){.stagger>*,.fade{opacity:1;transform:none;transition:none}}

/* ---------- 01 · WHAT WE DO — typographic, quiet ground ---------- */
.hm-intro .prose{margin-top:12px}
.hm-intro .prose p{font-family:var(--sans);font-weight:350;font-size:clamp(19px,1.5vw,23px);line-height:1.42;letter-spacing:-.005em;color:var(--paper-ink);margin:0}
.caplist{margin-top:clamp(26px,3vh,40px);border-top:1px solid var(--paper-line2)}
.caplist a{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr) auto;gap:14px clamp(14px,2vw,28px);align-items:baseline;padding:16px 4px;border-bottom:1px solid var(--paper-line);color:var(--paper-ink);transition:background .25s,padding-left .25s}
.caplist a:hover{background:var(--paper2);padding-left:12px}
.caplist .nm{font-family:var(--display);font-weight:500;font-size:clamp(19px,1.6vw,24px);line-height:1.15;transition:color .2s}
.caplist a:hover .nm{color:var(--navy)}
.caplist .st{font-size:13.5px;line-height:1.5;color:var(--paper-soft)}
.caplist .go{color:var(--brass);display:inline-flex;transition:transform .25s}
.caplist .go svg{width:18px;height:12px}
.caplist a:hover .go{transform:translateX(6px)}
@media(max-width:600px){.caplist a{grid-template-columns:1fr auto;gap:8px 14px}.caplist .go{grid-row:1;grid-column:2;align-self:center}.caplist .st{grid-column:1/-1}}
.numbers{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);margin-top:var(--sp-2);border-top:1px solid var(--paper-line2);padding-top:clamp(22px,3vh,34px)}
.numbers .num{font-family:var(--display);font-stretch:var(--w-data);font-weight:300;font-size:clamp(44px,4.8vw,84px);line-height:.9;letter-spacing:-.01em;color:var(--navy);font-variant-numeric:lining-nums tabular-nums}
.numbers .num i{font-style:normal;font-stretch:100%;font-weight:400;font-size:.38em;color:var(--brass);vertical-align:.95em;margin-left:.06em}
.numbers .lab{font-size:14px;font-weight:600;margin-top:14px;color:var(--paper-ink)}
.numbers .note{font-size:12.5px;color:var(--paper-soft);margin-top:4px;line-height:1.5;max-width:26ch}
@media(max-width:760px){.numbers{grid-template-columns:1fr 1fr;gap:28px var(--gap)}}

/* ==================================================================================
   02 · SELECTED WORK — THE ARC
   Plates sit on the circumference of a large invisible circle centred behind the screen:
   P(θ) = (R·sinθ, 0, R·(cosθ−1)) with rotateY(θ) so each plate stays tangent to the arc.
   Depth comes from real perspective, not from a translateX slider.
   touch-action:pan-y and horizontal-only wheel handling mean vertical page scroll is never touched.
   ================================================================================== */
.hm-work .head{margin-bottom:clamp(28px,4vh,52px)}
.hm-work .head .lede{align-self:end}
.arc{position:relative;--cw:clamp(186px,21vw,320px)}
.arc-stage{position:relative;height:calc(var(--cw)*1.25 + clamp(60px,9vh,110px));perspective:1500px;perspective-origin:50% 44%;touch-action:pan-y;cursor:grab;outline:none;overflow:hidden}
.arc-stage.drag{cursor:grabbing}
.arc-stage:focus-visible{outline:1px solid var(--brass);outline-offset:-6px}
.arc-track{position:absolute;left:50%;top:calc(50% - clamp(14px,2vh,26px));width:0;height:0;transform-style:preserve-3d;will-change:transform}
.arc-it{position:absolute;left:0;top:0;display:block;width:var(--cw);height:calc(var(--cw)*1.25);margin-left:calc(var(--cw) / -2);margin-top:calc(var(--cw) * -0.625);transform-style:preserve-3d;will-change:transform,opacity;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.arc-it .ph{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#0a0e18;box-shadow:0 24px 50px rgba(4,8,18,.28);transition:box-shadow .5s}
.arc-it .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .5s;filter:saturate(.82) brightness(.86)}
/* the shutter — a brass edge that wipes across the plate as it becomes active */
.arc-it .sh{position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 42%,rgba(199,154,87,.28) 50%,transparent 58%);transform:translateX(-110%);transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.arc-it .no{position:absolute;left:0;bottom:-26px;font-family:var(--sans);font-stretch:var(--w-data);font-weight:400;font-size:15px;font-variant-numeric:lining-nums tabular-nums;color:var(--paper-soft);opacity:0;transition:opacity .4s}
.arc-it.on .ph{box-shadow:0 40px 80px rgba(4,8,18,.42)}
.arc-it.on .ph img{filter:none}
.arc-it.on .sh{transform:translateX(110%)}
.arc-it.on .no{opacity:1}
.arc-it.on .ph::after{content:"";position:absolute;inset:0;border:1px solid rgba(199,154,87,.55);pointer-events:none}
.arc-it:hover .ph img{transform:scale(1.045)}
/* the datum: a drawing line beneath the arc with a centre tick under the active plate */
.arc-datum{position:absolute;left:0;right:0;bottom:clamp(10px,2vh,26px);height:60px;width:100%;pointer-events:none}
.arc-datum path{stroke:var(--paper-line2);stroke-width:1;fill:none;vector-effect:non-scaling-stroke}
.arc-datum .t{stroke:var(--brass);stroke-width:1.5}
/* HUD: the record for the active plate, and the controls */
.arc-hud{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--gap);align-items:end;margin-top:clamp(30px,4vh,52px)}
.arc-meta{position:relative;min-height:118px}
.arc-meta .m{position:absolute;inset:0;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .45s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
.arc-meta .m.on{opacity:1;transform:none;pointer-events:auto}
.arc-meta .nm{font-family:var(--display);font-stretch:104%;font-weight:400;font-size:clamp(26px,2.9vw,44px);line-height:1.04;letter-spacing:-.02em;margin:0;color:var(--paper-ink)}
.arc-meta .mt{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:12px 0 0;font-family:var(--sans);font-stretch:var(--w-label);font-weight:500;font-size:13px;color:var(--paper-soft)}
.arc-meta .mt i{display:block;width:14px;height:1px;background:var(--paper-line2)}
.arc-meta .mt .yr{font-stretch:var(--w-data);font-variant-numeric:lining-nums tabular-nums;font-size:15px;color:var(--paper-ink)}
.arc-meta .mt .md{color:var(--brass)}
.arc-meta .rl{margin:10px 0 0;font-size:14px;line-height:1.55;color:var(--paper-soft);max-width:52ch}
.arc-ctl{display:flex;align-items:center;gap:14px;justify-content:flex-end}
.arc-ctl button{all:unset;cursor:pointer;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border:1px solid var(--paper-line2);color:var(--paper-ink);transition:.22s}
.arc-ctl button svg{width:18px;height:12px}
.arc-ctl button:hover{border-color:var(--navy);color:var(--navy);background:var(--paper)}
.arc-ctl button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.arc-ctl .ix{font-family:var(--sans);font-stretch:var(--w-data);font-variant-numeric:lining-nums tabular-nums;font-size:17px;color:var(--paper-soft);display:flex;gap:6px;min-width:74px;justify-content:center}
.arc-ctl .ix b{font-weight:400;color:var(--paper-ink)}
.arc-ctl .ix i{font-style:normal;color:var(--paper-line2)}
.arc-ctl .door{margin-left:8px}
@media(max-width:900px){
  .arc-hud{grid-template-columns:1fr;align-items:start;gap:26px}
  .arc-ctl{justify-content:flex-start;flex-wrap:wrap}
  .arc-meta{min-height:150px}
}
@media(max-width:600px){.arc-ctl .door{margin-left:0;width:100%;justify-content:center}}
@media(prefers-reduced-motion:reduce){.arc-it,.arc-it .ph img,.arc-it .sh,.arc-meta .m{transition:none}}

/* ---------- 03 · REGIONAL PRESENCE — the night section ---------- */
.hm-geo{background:var(--night);color:var(--ink);position:relative;overflow:hidden;padding:var(--sp-3) 0}
.hm-geo::before{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 70% 30%,rgba(11,46,114,.35),transparent 65%);pointer-events:none}
.hm-geo .wrap{position:relative;z-index:1}
.hm-geo .head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gap);align-items:end;margin-bottom:clamp(36px,5vh,64px)}
.hm-geo .head h2{color:#F4F7FC;margin:.3em 0 0}
.hm-geo .head h2 em{color:#E9CFA1}
.hm-geo .head .lede{color:var(--soft);margin:0;max-width:46ch;justify-self:end}
.hm-geo .grid{display:grid;grid-template-columns:minmax(240px,4fr) minmax(0,8fr);gap:clamp(28px,5vw,80px);align-items:start}
.hm-geo .grp{font-family:var(--sans);font-stretch:var(--w-label);font-style:normal;font-weight:500;color:var(--brass);font-size:13px;margin:22px 0 6px;display:flex;align-items:center;gap:12px}
.hm-geo .grp:first-child{margin-top:0}
.hm-geo .grp small{font-family:var(--sans);font-style:normal;font-size:11.5px;color:var(--soft);letter-spacing:.02em}
.hm-geo .c{all:unset;display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:14px;padding:12px 4px;border-bottom:1px solid var(--line);cursor:pointer;color:var(--ink);transition:background .2s,padding-left .2s}
.hm-geo .c:hover,.hm-geo .c:focus-visible{background:rgba(255,255,255,.03);padding-left:10px}
.hm-geo .c .mk{width:10px;height:10px;background:var(--brass);display:block}
.hm-geo .c.market .mk{background:transparent;border:1px solid var(--brass);border-radius:50%;width:9px;height:9px}
.hm-geo .c .nm{font-family:var(--display);font-size:clamp(21px,1.9vw,27px);line-height:1.1;transition:color .2s}
.hm-geo .c .since{font-family:var(--sans);font-size:12px;color:var(--soft);white-space:nowrap}
.hm-geo .c.on .nm{color:#E9CFA1}
.hm-geo .c.on .mk{box-shadow:0 0 0 4px rgba(199,154,87,.22)}
.hm-geo .map{position:relative}
.hm-geo .map svg{width:100%;height:auto;display:block}
.hm-geo .map .land{fill:#0d1a36;stroke:#233661;stroke-width:.7;vector-effect:non-scaling-stroke;transition:fill .3s}
.hm-geo .map .land.focus{fill:#132650;stroke:#3a5a9a;stroke-dasharray:1600;stroke-dashoffset:1600;transition:fill .3s,stroke-dashoffset 2.4s cubic-bezier(.2,.7,.2,1)}
.hm-geo.in .map .land.focus{stroke-dashoffset:0}
.hm-geo .map .land.focus.on{fill:#1d3d78}
.hm-geo .map .pt{cursor:pointer;opacity:0;transition:opacity .6s ease}
.hm-geo.in .map .pt{opacity:1}
.hm-geo.in .map .pt:nth-of-type(2){transition-delay:.1s}.hm-geo.in .map .pt:nth-of-type(3){transition-delay:.2s}.hm-geo.in .map .pt:nth-of-type(4){transition-delay:.3s}.hm-geo.in .map .pt:nth-of-type(5){transition-delay:.4s}.hm-geo.in .map .pt:nth-of-type(6){transition-delay:.5s}.hm-geo.in .map .pt:nth-of-type(7){transition-delay:.6s}.hm-geo.in .map .pt:nth-of-type(8){transition-delay:.7s}.hm-geo.in .map .pt:nth-of-type(9){transition-delay:.8s}
.hm-geo .map .pt rect{fill:var(--brass)}
.hm-geo .map .pt circle:not(.halo){fill:none;stroke:var(--brass);stroke-width:1.5}
.hm-geo .map .pt .halo{fill:none;stroke:var(--brass);stroke-width:1;opacity:0;transform-box:fill-box;transform-origin:center;transition:opacity .3s}
.hm-geo .map .pt.on .halo{opacity:.6;animation:geoHalo 2.6s ease-out infinite}
.hm-geo .map .pt text{font-family:var(--sans);font-size:24px;font-weight:500;fill:var(--soft);paint-order:stroke;stroke:#05070f;stroke-width:6px;stroke-linejoin:round}
.hm-geo .map .pt.office text{fill:#F4F7FC}
.hm-geo .map .pt.on text{fill:#E9CFA1}
@keyframes geoHalo{from{transform:scale(.4);opacity:.7}to{transform:scale(2.4);opacity:0}}
.hm-geo .legend{display:flex;flex-wrap:wrap;gap:22px;font-size:12.5px;color:var(--soft);margin-top:14px}
.hm-geo .legend span{display:inline-flex;align-items:center;gap:8px}
.hm-geo .legend i{display:inline-block;width:10px;height:10px;background:var(--brass)}
.hm-geo .legend i.o{background:transparent;border:1px solid var(--brass);border-radius:50%;width:9px;height:9px}
.hm-geo .detail{position:relative;margin-top:clamp(24px,3vh,36px);min-height:180px}
.hm-geo .detail>div{display:none;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--gap);align-items:start;animation:geoIn .5s ease}
.hm-geo .detail>div.on{display:grid}
@keyframes geoIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hm-geo .detail .ph{aspect-ratio:4/3;overflow:hidden;background:#0a0e18;border-bottom:1px solid rgba(199,154,87,.4)}
.hm-geo .detail .ph img{width:100%;height:100%;object-fit:cover;display:block}
.hm-geo .detail .ph.none{display:flex;align-items:flex-end;padding:18px;background:linear-gradient(160deg,#17305e,#0f1f42);background-image:linear-gradient(rgba(155,170,198,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(155,170,198,.08) 1px,transparent 1px),linear-gradient(160deg,#17305e,#0f1f42);background-size:26px 26px,26px 26px,100% 100%;border:1px solid rgba(199,154,87,.25);font-family:var(--display);font-style:italic;color:#E9CFA1;font-size:17px}
.hm-geo .detail .ph.none small{display:block;font-family:var(--sans);font-style:normal;font-size:12px;color:var(--soft);margin-top:4px}
.hm-geo .detail .tag{font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--brass)}
.hm-geo .detail .tag.market{color:var(--soft)}
.hm-geo .detail h3{font-family:var(--display);font-weight:500;font-size:clamp(26px,2.6vw,38px);margin:8px 0 10px;color:#F4F7FC}
.hm-geo .detail p{color:var(--soft);font-size:14.5px;line-height:1.6;margin:0;max-width:46ch}
.hm-geo .detail .pl{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-direction:column}
.hm-geo .detail .pl a{display:flex;justify-content:space-between;gap:14px;color:var(--ink);font-size:14px;padding:9px 0;border-top:1px solid var(--line);transition:color .2s}
.hm-geo .detail .pl a:hover{color:#E9CFA1}
.hm-geo .detail .pl a span{color:var(--soft);font-size:12.5px;white-space:nowrap}
/* the journey — the years live here, where the geography is */
.hm-geo .journey{margin-top:var(--sp-2);display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gap);border-top:1px solid var(--line2);padding-top:22px}
.hm-geo .journey .j{position:relative;padding-top:14px}
.hm-geo .journey .j::before{content:"";position:absolute;left:0;top:-23px;width:9px;height:9px;background:var(--brass);transform:rotate(45deg)}
.hm-geo .journey .j.market::before{background:transparent;border:1px solid var(--brass);border-radius:50%;transform:none;width:8px;height:8px}
.hm-geo .journey .yr{font-family:var(--display);font-stretch:var(--w-data);font-weight:300;font-size:clamp(30px,2.8vw,44px);line-height:1;color:#F4F7FC;font-variant-numeric:lining-nums tabular-nums}
.hm-geo .journey .ct{font-family:var(--sans);font-stretch:var(--w-label);font-style:normal;font-weight:500;font-size:13px;color:var(--brass);margin-top:8px}
.hm-geo .journey .ev{font-size:13px;line-height:1.55;color:var(--soft);margin-top:8px;max-width:26ch}
@media(max-width:900px){.hm-geo .head{grid-template-columns:1fr}.hm-geo .head .lede{justify-self:start}.hm-geo .grid{grid-template-columns:1fr}.hm-geo .detail>div.on{grid-template-columns:1fr}
  .hm-geo .journey{grid-template-columns:repeat(3,1fr);border-top:0;padding-top:0;gap:28px var(--gap)}.hm-geo .journey .j{border-top:1px solid var(--line2);padding-top:20px}.hm-geo .journey .j::before{top:-5px}}
@media(max-width:560px){.hm-geo .journey{grid-template-columns:1fr 1fr}.hm-geo .c .since{display:none}}
@media(prefers-reduced-motion:reduce){.hm-geo .map .land.focus{stroke-dashoffset:0;transition:none}.hm-geo .map .pt{opacity:1;transition:none}.hm-geo .map .pt.on .halo{animation:none}.hm-geo .detail>div{animation:none}}

/* ---------- 04 · EXPERTISE — supporting: drawn lines, one detail, two drawings ---------- */
/* drawing extension lines: they frame the photograph like a sheet, never cross the text */
.hm-expert .detail{position:relative}
.hm-expert .lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.hm-expert .lines .l{fill:none;stroke:rgba(11,46,114,.28);stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:130;stroke-dashoffset:130;transition:stroke-dashoffset 1.6s cubic-bezier(.2,.7,.2,1)}
.hm-expert.in .lines .l{stroke-dashoffset:0}
.hm-expert.in .lines .l:nth-child(2){transition-delay:.2s}.hm-expert.in .lines .l:nth-child(3){transition-delay:.4s}.hm-expert.in .lines .l:nth-child(4){transition-delay:.6s}
.hm-expert .detail .reveal{position:relative;z-index:1}
.hm-expert .c6{padding-top:clamp(28px,4vh,48px)}
.hm-expert .prose{margin-top:18px;max-width:52ch}
.hm-expert .prose p{margin:0 0 .9em;font-size:15.5px;line-height:1.65;color:var(--paper-soft)}
.hm-expert .prose p:first-child{font-family:var(--sans);font-size:16px;color:var(--paper-ink)}
.hm-expert .certs{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.hm-expert .cert{display:inline-flex;flex-direction:column;gap:2px;border:1px solid var(--paper-line2);padding:10px 14px;font-size:12.5px;color:var(--paper-soft)}
.hm-expert .cert b{font-family:var(--display);font-size:16px;color:var(--paper-ink);font-weight:500}
.hm-expert .doors{margin-top:26px}
.hm-expert .detail{margin:0}
.hm-expert .detail .reveal{aspect-ratio:3/4;background:#0a0e18}
/* the detail crop is 1200x1600 (3:4) and its frame is 3:4, so cover fills it with no crop at all —
   without this the img inherited object-fit:fill and was stretched ~60%. */
.hm-expert .detail .reveal img{width:100%;height:100%;object-fit:cover;object-position:50% 45%;display:block}
.hm-expert figcaption{font-family:var(--sans);font-stretch:var(--w-label);font-style:normal;font-weight:500;font-size:13px;color:var(--paper-soft);padding:12px 0 0;display:flex;justify-content:space-between;gap:16px}
.hm-expert .cert b{font-stretch:var(--w-data);font-weight:400;font-size:17px}
.hm-expert .plan{margin-top:var(--sp-2);border-top:1px solid var(--paper-line2);padding-top:clamp(26px,3.5vh,44px)}
.hm-expert .plan-t h3{font-family:var(--display);font-weight:500;font-size:clamp(22px,2.2vw,30px);line-height:1.15;margin:0 0 12px;max-width:16ch}
.hm-expert .plan-t p{font-size:14px;line-height:1.6;color:var(--paper-soft);margin:0;max-width:34ch}
.hm-expert .dwg{display:block;color:var(--paper-ink)}
.hm-expert .dwg .ph{aspect-ratio:16/10;background:#0a0e18}
.hm-expert .dwg .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.hm-expert .dwg:hover .ph img{transform:scale(1.03)}
.hm-expert .dwg .cap{padding-top:12px;display:flex;flex-direction:column;gap:4px}
.hm-expert .dwg .nm{font-family:var(--display);font-weight:500;font-size:18px}
.hm-expert .dwg .mt{font-size:12.5px;color:var(--paper-soft)}
@media(max-width:900px){.hm-expert .detail{margin-top:32px}.hm-expert .detail .reveal{aspect-ratio:4/5;max-width:520px}.hm-expert .plan-t{margin-bottom:8px}.hm-expert .lines{display:none}}
@media(prefers-reduced-motion:reduce){.hm-expert .lines .l{stroke-dashoffset:0;transition:none}}

.hm-geo .detail .ph.none{font-family:var(--sans);font-style:normal;font-stretch:var(--w-label);font-weight:500;font-size:14px}
.hm-geo .detail .tag{font-stretch:var(--w-label);letter-spacing:.01em;text-transform:none;font-size:13px}
.hm-close .offices{font-family:var(--sans);font-style:normal;font-size:14px}

/* ---------- 06 · CONTACT — calm ---------- */
.hm-close .lede{color:var(--paper-soft)}
.hm-close .doors{margin-top:24px}
.hm-close .offices{font-family:var(--display);font-style:italic;font-size:15px;color:var(--paper-soft);margin:26px 0 0}


/* ==================================================================================
   03 · URBAN PLANNING — the PLAN ATLAS. One large live sheet (64%), the record beside
   it, a filmstrip beneath. All navigation is instant; only a 320ms crossfade moves.
   Drawn plans are shown WHOLE (contain); renders and aerials may fill (cover).
   ================================================================================== */
.atl{background:var(--night);color:var(--ink);position:relative;padding-bottom:clamp(40px,6vh,80px)}
.atl-open{padding-top:var(--sp-3);padding-bottom:clamp(24px,3.5vh,44px)}
.atl-open h2{color:#F4F7FC}
.atl-open h2 em{color:#E9CFA1}
.atl-open .lede{color:var(--soft)}
.atl .lbl span{color:#B9C6DE}
.atl-stage{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:clamp(20px,2.6vw,42px);align-items:stretch}
.atl-view{position:relative;min-height:clamp(380px,56vh,640px);background:#0a1020;border:1px solid rgba(175,193,228,.14);overflow:hidden;outline-offset:3px}
.atl-sc{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transition:opacity .32s ease,visibility 0s linear .32s}
.atl-sc.on{opacity:1;visibility:visible;transition:opacity .32s ease}
.atl-sc .fr{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .32s ease}
.atl-sc .fr img{width:100%;height:100%;display:block}
.atl-sc .fr[data-kind="plan"] img{object-fit:contain;padding:clamp(10px,1.6vw,26px);box-sizing:border-box}
.atl-sc .fr[data-kind="render"] img,.atl-sc .fr[data-kind="aerial"] img{object-fit:cover}
/* which face shows: plan by default, view when the figure carries data-face="vw" */
.atl-sc .fr.pl{opacity:1}
.atl-sc[data-face="vw"] .fr.pl{opacity:0}
.atl-sc[data-face="vw"] .fr.vw{opacity:1}
.atl-flip{position:absolute;right:14px;bottom:14px;z-index:4;display:flex;border:1px solid rgba(175,193,228,.3);background:rgba(6,10,20,.78);backdrop-filter:blur(6px)}
.atl-flip button{all:unset;cursor:pointer;font-family:var(--sans);font-stretch:var(--w-label);font-weight:600;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--soft);padding:8px 14px}
.atl-flip button.on{background:var(--brass);color:#1a1206}
.atl-flip button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.atl-info{position:relative;display:flex;flex-direction:column;min-height:100%}
.atl-rec{display:none;flex:1}
.atl-rec.on{display:block;animation:atlin .32s ease}
@keyframes atlin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.atl-rec .ix{font-family:var(--sans);font-stretch:var(--w-data);font-size:13px;color:var(--brass);font-variant-numeric:tabular-nums}
.atl-rec .ix i{opacity:.5;font-style:normal;padding:0 2px}
.atl-rec .nm{font-family:var(--display);font-stretch:var(--w-text);font-weight:400;font-size:clamp(24px,2.6vw,36px);letter-spacing:-.015em;line-height:1.1;color:#F4F7FC;margin:10px 0 12px}
.atl-rec .mt{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:baseline;font-family:var(--sans);font-size:13.5px;color:var(--soft);margin:0 0 14px}
.atl-rec .mt i{width:22px;height:1px;background:rgba(175,193,228,.35);align-self:center}
.atl-rec .mt .ar{color:#E9CFA1;font-variant-numeric:tabular-nums}
.atl-rec .bl{font-size:14.5px;line-height:1.65;color:#C3CEE2;margin:0 0 14px;max-width:44ch}
.atl-rec .cl{font-size:12.5px;line-height:1.6;color:var(--soft);margin:0 0 16px}
.atl-rec .go{display:inline-flex;align-items:center;gap:9px;color:#E9CFA1;font-family:var(--sans);font-weight:500;font-size:13.5px}
.atl-rec .go svg{width:16px;height:11px;transition:transform .25s}
.atl-rec .go:hover svg{transform:translateX(5px)}
.atl-ctl{display:flex;align-items:center;gap:14px;margin-top:auto;padding-top:18px;border-top:1px solid rgba(175,193,228,.16)}
.atl-ctl button{all:unset;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(175,193,228,.3);color:var(--ink);transition:border-color .2s,color .2s}
.atl-ctl button:hover{border-color:#E9CFA1;color:#E9CFA1}
.atl-ctl button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.atl-ctl button svg{width:18px;height:12px}
.atl-ctl .ix{font-family:var(--sans);font-stretch:var(--w-data);font-size:14px;color:var(--soft);font-variant-numeric:tabular-nums}
.atl-ctl .ix b{color:#F4F7FC;font-weight:500}
.atl-ctl .ix i{font-style:normal;opacity:.5;padding:0 3px}
.atl-strip{display:flex;gap:10px;margin-top:clamp(16px,2.2vh,26px);overflow-x:auto;padding-bottom:6px;scrollbar-width:thin}
.atl-strip .th{all:unset;cursor:pointer;flex:0 0 auto;display:flex;align-items:center;gap:10px;border:1px solid rgba(175,193,228,.16);background:rgba(10,16,32,.6);padding:6px 12px 6px 6px;transition:border-color .2s,background .2s;max-width:240px}
.atl-strip .th .im{width:64px;height:44px;overflow:hidden;flex:none;background:#0a1020}
.atl-strip .th .im img{width:100%;height:100%;object-fit:cover;display:block}
.atl-strip .th .tx{font-family:var(--sans);font-size:12px;line-height:1.3;color:var(--soft);display:flex;flex-direction:column;gap:1px;white-space:normal}
.atl-strip .th .tx b{font-stretch:var(--w-data);font-weight:500;color:var(--brass);font-variant-numeric:tabular-nums}
.atl-strip .th.on{border-color:#E9CFA1;background:rgba(20,28,48,.9)}
.atl-strip .th.on .tx{color:#EDF1F8}
.atl-strip .th:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
@media(max-width:1100px){.atl-reg .rgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){
  .atl-stage{grid-template-columns:1fr}
  .atl-view{min-height:clamp(300px,46vh,480px)}
  .atl-info{margin-top:4px}
  .atl-reg .rgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .atl-reg .rgrid{grid-template-columns:1fr}
  .atl-strip .th{max-width:200px}
  .atl-rec .nm{font-size:24px}
}

/* ==================================================================================
/* ==================================================================================
   EXPERTISE MATRIX — the fifteen services at full width: a live visual panel and a
   three-band editorial grid. CLIENT REVISION PART 1 (2026-09-06): every service carries a
   visual that fills the panel; the number is a restrained graphic layer; a compact footer holds
   the title, one-line statement, three capabilities and the CTA. Selection is a 280ms crossfade
   between stacked panels (no blank frame); mobile order is title → visual → scope → CTA.
   ================================================================================== */
.mx{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.35fr);gap:clamp(22px,3vw,52px);margin-top:clamp(26px,3.6vh,44px);align-items:stretch}
.mx-preview{position:relative;min-height:clamp(440px,56vh,620px);background:var(--night);border:1px solid var(--paper-line2);overflow:hidden}
.mx-p{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;visibility:hidden;transition:opacity .28s ease,visibility 0s linear .28s}
.mx-p.on{opacity:1;visibility:visible;transition:opacity .28s ease;z-index:1}
.mx-p .ph{order:1;flex:1;margin:0;position:relative;overflow:hidden;min-height:0;background:#0a1020}
.mx-p .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.mx-p .ph[data-kind="drawing"]{background:#0a1020 linear-gradient(rgba(175,193,228,.07) 1px,transparent 1px) 0 0/24px 24px,#0a1020 linear-gradient(90deg,rgba(175,193,228,.07) 1px,transparent 1px) 0 0/24px 24px}
.mx-p .ph[data-kind="drawing"] img{object-fit:contain;padding:clamp(10px,1.4vw,22px);box-sizing:border-box}
.mx-p .ph .tn{position:absolute;top:-.12em;right:10px;font-family:var(--display);font-stretch:var(--w-display);font-weight:200;font-size:clamp(84px,9vw,140px);line-height:1;color:rgba(233,207,161,.22);font-variant-numeric:tabular-nums;pointer-events:none;mix-blend-mode:screen}
.mx-p .ph[data-kind="drawing"] .tn{color:rgba(11,46,114,.14);mix-blend-mode:multiply}
.mx-p .ph figcaption{position:absolute;left:0;right:0;bottom:0;font-family:var(--sans);font-size:11.5px;letter-spacing:.02em;color:#C3CEE2;background:linear-gradient(transparent,rgba(5,8,15,.82));padding:26px 14px 10px}
.mx-p .ph[data-kind="drawing"] figcaption{background:linear-gradient(transparent,rgba(5,8,15,.92))}
.mx-p .tp{order:1;flex:1;position:relative;background:#0a1020}
.mx-p .mxh{order:2;display:flex;align-items:baseline;gap:12px;padding:clamp(12px,1.5vw,18px) clamp(14px,1.8vw,22px) 0;background:#0a1020;border-top:1px solid rgba(175,193,228,.16)}
.mx-p .mxh .no{font-family:var(--sans);font-stretch:var(--w-data);font-size:12px;color:var(--brass);font-variant-numeric:tabular-nums;flex:none}
.mx-p .mxh .no i{font-style:normal;opacity:.5;padding:0 2px}
.mx-p .mxh h3{font-family:var(--display);font-stretch:var(--w-text);font-weight:400;font-size:clamp(19px,1.8vw,25px);letter-spacing:-.015em;line-height:1.15;color:#F4F7FC;margin:0}
.mx-p .ft{order:3;background:#0a1020;padding:8px clamp(14px,1.8vw,22px) clamp(14px,1.8vw,20px)}
.mx-p .ft .st{font-size:13.5px;line-height:1.5;color:var(--soft);margin:0 0 8px;max-width:56ch}
.mx-p .ft .sc{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;gap:4px 0;font-family:var(--sans);font-stretch:var(--w-label);font-size:12px;line-height:1.4;color:#C3CEE2}
.mx-p .ft .sc li+li::before{content:"·";color:var(--brass);padding:0 8px}
.mx-p .ft .go{display:inline-flex;align-items:center;gap:8px;color:#E9CFA1;font-family:var(--sans);font-weight:500;font-size:13px}
.mx-p .ft .go svg{width:15px;height:10px;transition:transform .25s}
.mx-p .ft .go:hover svg{transform:translateX(5px)}
.mx-grid{display:grid;grid-template-columns:1fr;align-content:start}
.mx-band{margin-bottom:clamp(10px,1.6vh,18px)}
.mx-band .bh{display:flex;align-items:baseline;gap:12px;border-bottom:2px solid var(--paper-ink);padding-bottom:7px;margin-bottom:2px}
.mx-band .bh .rn{font-family:var(--sans);font-stretch:var(--w-data);font-size:11.5px;color:var(--brass);font-variant-numeric:tabular-nums}
.mx-band .bh .bt{font-family:var(--sans);font-stretch:var(--w-label);font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--paper-soft)}
.mx-it{all:unset;cursor:pointer;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:baseline;width:100%;box-sizing:border-box;padding:9px 6px;border-bottom:1px solid var(--paper-line);transition:background .18s,padding-left .18s}
.mx-it .no{font-family:var(--sans);font-stretch:var(--w-data);font-size:12px;color:var(--brass);font-variant-numeric:tabular-nums}
.mx-it .nm{font-family:var(--display);font-weight:500;font-size:clamp(14.5px,1.25vw,17px);line-height:1.25;color:var(--paper-ink);transition:color .18s}
.mx-it:hover,.mx-it.on{background:var(--paper2);padding-left:14px}
.mx-it.on .nm{color:var(--navy)}
.mx-it.on{box-shadow:inset 3px 0 0 var(--brass)}
.mx-it:focus-visible{outline:2px solid var(--brass);outline-offset:-2px}
.mx-foot{margin-top:10px}
@media(max-width:1000px){
  .mx{grid-template-columns:1fr}
  /* the active panel is in flow so the preview takes exactly its height: title → visual → scope → CTA */
  .mx-preview{min-height:0}
  .mx-p.on{position:relative;inset:auto}
  .mx-p .mxh{order:1;border-top:0;padding-top:clamp(14px,2.4vh,18px)}
  .mx-p .ph{order:2;flex:none;aspect-ratio:16/10;margin-top:12px}
  .mx-p .ph[data-kind="drawing"]{aspect-ratio:16/10}
  .mx-p .ft{order:3;padding-top:12px}
  .mx-p .ph .tn{font-size:clamp(64px,16vw,96px)}
  .mx-grid{grid-template-columns:1fr}
}
@media(max-width:560px){.mx-p .ph{aspect-ratio:4/3}.mx-p .ph[data-kind="drawing"]{aspect-ratio:16/10}}
@media(prefers-reduced-motion:reduce){.mx-p{transition:none}}

/* KPI band styles live in shell.css (shared with /projects since the FINAL CLIENT REVISION 2026-09-06) */

/* ==================================================================================
   CERTIFICATIONS & PROFESSIONAL STANDING — the real ISO certificates, framed as documents.
   (CLIENT FINAL CORRECTION item 9 — no unrelated photograph, no tiny text boxes.)
   ================================================================================== */
.hm-cred{background:var(--paper)}
.cred-list{list-style:none;margin:clamp(18px,2.4vh,28px) 0 0;padding:0}
.cred-list li{display:flex;flex-direction:column;gap:2px;padding:12px 0;border-top:1px solid var(--paper-line2)}
.cred-list li b{font-family:var(--display);font-weight:500;font-size:16.5px;color:var(--paper-ink)}
.cred-list li span{font-family:var(--sans);font-size:12.5px;color:var(--paper-soft)}
.cred-docs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.6vw,40px);align-items:start}
.cred-docs .doc{display:block;color:inherit}
.cred-docs .doc.d2{margin-top:clamp(22px,3.4vh,44px)}   /* editorial offset */
.cred-docs .fr{display:block;background:#fff;border:1px solid var(--paper-line2);box-shadow:0 18px 44px rgba(11,20,42,.14),0 2px 8px rgba(11,20,42,.08);padding:clamp(8px,1vw,14px);transition:transform .3s,box-shadow .3s}
.cred-docs .doc:hover .fr{transform:translateY(-4px);box-shadow:0 26px 60px rgba(11,20,42,.2),0 4px 12px rgba(11,20,42,.1)}
.cred-docs .fr img{width:100%;height:auto;display:block}
.cred-docs .cap{display:flex;flex-direction:column;gap:2px;padding-top:12px}
.cred-docs .cap b{font-family:var(--display);font-weight:500;font-size:15px;color:var(--paper-ink)}
.cred-docs .cap span{font-family:var(--sans);font-size:12px;color:var(--paper-soft)}
@media(max-width:640px){.cred-docs{grid-template-columns:1fr}.cred-docs .doc.d2{margin-top:0}}

/* geo detail: the designed location treatment for countries without a verified photograph */
.hm-geo .detail .loc{position:relative;height:100%;min-height:200px;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;background:linear-gradient(160deg,#0d1526,#0a1020);border:1px solid rgba(175,193,228,.16);overflow:hidden}
.hm-geo .detail .loc .iso{position:absolute;top:-0.14em;right:8px;font-family:var(--display);font-stretch:var(--w-display);font-weight:200;font-size:clamp(90px,9vw,150px);line-height:1;color:rgba(175,193,228,.09);letter-spacing:.02em}
.hm-geo .detail .loc .cty{font-family:var(--display);font-stretch:var(--w-text);font-weight:400;font-size:clamp(24px,2.4vw,34px);letter-spacing:-.015em;color:#F4F7FC}
.hm-geo .detail .loc .st{font-family:var(--sans);font-stretch:var(--w-label);font-weight:600;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:#E9CFA1;margin-top:6px}

/* ---------- 06 · TRUST — two continuous ribbons (FINAL CLIENT REVISION 2026-09-06, items 3–7).
   Desktop only (hidden at 1024px and below). No tiles, no grid, no borders: marks float on one bounding
   height with an edge mask; the duplicated track loops seamlessly on a compositor transform, pauses on
   hover and off-screen (home.js), and is static under prefers-reduced-motion. ---------- */
.hm-trust.hm-band{background:#fff}
.hm-trust .head{align-items:end}
.hm-trust .head .cta{justify-self:end}
.hm-trust .go{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:550;letter-spacing:0;text-transform:none;color:var(--navy)}
.hm-trust .go svg{width:18px;height:12px;transition:transform .25s}
.hm-trust .go:hover svg{transform:translateX(4px)}
.rb{margin-top:clamp(34px,5vh,56px)}
.rb-h{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:10px;border-bottom:1px solid var(--paper-line2)}
.rb-t{font-family:var(--sans);font-stretch:var(--w-label);font-weight:600;font-size:13.5px;color:var(--paper-ink)}
.rb-n{font-family:var(--sans);font-stretch:var(--w-data);font-size:12.5px;color:var(--paper-soft);font-variant-numeric:tabular-nums;white-space:nowrap}
.rb-note{font-family:var(--sans);font-style:normal;font-size:15px;line-height:1.5;color:var(--paper-soft);margin:14px 0 0;max-width:60ch}
.rb-view{overflow:hidden;padding:clamp(18px,2.4vh,28px) 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.rb-track{display:flex;width:max-content;will-change:transform;animation:rbLoop var(--dur,70s) linear infinite;animation-play-state:paused}
.rb.run .rb-track{animation-play-state:running}
.rb.rev .rb-track{animation-direction:reverse}
.rb:hover .rb-track{animation-play-state:paused}
@keyframes rbLoop{to{transform:translateX(-50%)}}
.rb-row{display:flex;align-items:center;gap:clamp(44px,4.2vw,76px);padding-right:clamp(44px,4.2vw,76px)}
.rb-row .lg{flex:none;display:flex;align-items:center;justify-content:center;height:56px}
.rb-row .lg img{width:auto;height:auto;max-height:52px;max-width:150px;object-fit:contain;display:block;mix-blend-mode:multiply;filter:grayscale(1);opacity:.78;transition:filter .3s,opacity .3s}
.rb-row .lg.tall img{max-height:64px;max-width:90px}
.rb-row .lg.wide img{max-height:44px;max-width:190px}
.rb-row .lg:hover img{filter:none;opacity:1}
@media(prefers-reduced-motion:reduce){
  .rb-track{animation:none;width:auto}
  .rb-row[aria-hidden]{display:none}
  .rb-view{overflow-x:auto;scrollbar-width:thin;-webkit-mask-image:none;mask-image:none}
}
@media(max-width:1024px){.hm-trust{display:none!important}}



/* ---------- 03 · PRESENCE — country detail redesign (CLIENT REVISION PART 2, 2026-09-06).
   One image, one representative project under it, the branch contact block in place of the old
   project list. Map labels are country names only; office cities are unlabelled squares. ---------- */
.hm-geo .map .pt text.lb{font-family:var(--sans);font-stretch:var(--w-label);font-size:23px;font-weight:500;fill:var(--soft);paint-order:stroke;stroke:#05070f;stroke-width:7px;stroke-linejoin:round;pointer-events:none}
.hm-geo .map .pt.office text.lb{fill:#F4F7FC}
.hm-geo .map .pt.on text.lb{fill:#E9CFA1}
.hm-geo .detail>div{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.hm-geo .detail .ph{margin:0;aspect-ratio:auto;border-bottom:0;background:transparent}
.hm-geo .detail .ph img{aspect-ratio:4/3;width:100%;height:auto;object-fit:cover;display:block;border-bottom:1px solid rgba(199,154,87,.4)}
.hm-geo .detail .ph .loc{aspect-ratio:4/3}
.hm-geo .detail .ph figcaption{display:flex;flex-direction:column;gap:3px;padding:12px 0 0}
.hm-geo .detail .ph figcaption .k{font-family:var(--sans);font-stretch:var(--w-label);font-size:11.5px;color:var(--brass)}
.hm-geo .detail .ph figcaption a,.hm-geo .detail .ph figcaption span:not(.k){font-family:var(--display);font-stretch:var(--w-text);font-weight:500;font-size:clamp(16px,1.35vw,19px);line-height:1.25;color:#F4F7FC}
.hm-geo .detail .ph figcaption a:hover{color:#E9CFA1}
.hm-geo .detail .dt .ln{color:var(--soft);font-size:14.5px;line-height:1.55;margin:0 0 4px;max-width:46ch}
.hm-geo .detail .cb{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 22px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line2)}
.hm-geo .detail .cc{display:flex;flex-direction:column;gap:4px;min-width:0}
.hm-geo .detail .cc-h{font-family:var(--sans);font-stretch:var(--w-label);font-weight:600;font-size:12.5px;color:#EDF1F8}
.hm-geo .detail .cc-h i{font-style:normal;color:var(--brass);padding:0 2px}
.hm-geo .detail .cc-a{font-family:var(--sans);font-size:13px;line-height:1.55;color:var(--soft)}
.hm-geo .detail .cc-a[dir="rtl"]{text-align:right;font-size:14px;line-height:1.7}
.hm-geo .detail .cc-lines{gap:6px}
.hm-geo .detail .cc.cc-pairs{display:grid;grid-template-columns:max-content max-content;column-gap:26px;row-gap:6px;align-items:baseline;grid-column:1 / -1}
@media(max-width:400px){.hm-geo .detail .cc.cc-pairs{column-gap:16px}}
.hm-geo .detail .cc-lines a,.hm-geo .detail .cc-a a{font-family:var(--sans);font-size:13.5px;color:#EDF1F8;font-variant-numeric:tabular-nums;width:fit-content;border-bottom:1px solid rgba(175,193,228,.28);transition:color .2s,border-color .2s}
.hm-geo .detail .cc-lines a:hover,.hm-geo .detail .cc-a a:hover{color:#E9CFA1;border-color:#E9CFA1}
@media(max-width:900px){.hm-geo .detail .cb{grid-template-columns:1fr 1fr}.hm-geo .detail .ph img{aspect-ratio:16/10}}
@media(max-width:560px){.hm-geo .detail .cb{grid-template-columns:1fr}.hm-geo .map .pt text.lb{font-size:42px;stroke-width:11px;font-weight:600}}

/* the fifteen services are links now (CLIENT REVISION PART 2, item 8): hover/focus previews, click opens the service */
.mx-it{text-decoration:none;color:inherit}
.mx-it:hover .nm{color:var(--navy)}