/* TT Norms Pro is licensed: put TTNormsPro-Regular.woff2 and TTNormsPro-Medium.woff2 in /fonts.
   Until then the page uses Figtree, the closest free match. */
@font-face{font-family:"TT Norms Pro";src:local("TT Norms Pro"),url("fonts/TTNormsPro-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"TT Norms Pro";src:local("TT Norms Pro Medium"),url("fonts/TTNormsPro-Medium.woff2") format("woff2");font-weight:500;font-display:swap}

:root{
  --orange:#FF5B2E; --black:#0A0A0B; --dark-grey:#5E5E63; --grey:#8E8E93; --platinum:#E2E2E6; --snow:#F5F5F7; --white:#FFFFFF;
  --font:"TT Norms Pro","Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wrap:1280px; --pad:clamp(20px,4vw,40px);
  --r-sm:8px; --r-md:12px; --r-lg:20px;
  --ease:cubic-bezier(.2,.7,.1,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--snow);color:var(--black);font:400 18px/1.4 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
.skip{position:absolute;left:-999px;top:8px;background:var(--black);color:var(--snow);padding:12px 16px;z-index:100;border-radius:var(--r-sm)}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* type scale (brand sheet) */
h1,h2,h3,p{margin:0}
h1,h2,h3{font-weight:500}
h2{font-size:40px;line-height:1;letter-spacing:-2px}
h3{font-size:24px;line-height:1.2;letter-spacing:-.5px}
.t1{font-size:18px;font-weight:500;line-height:1.4}
.text2{font-size:16px;line-height:1.4}
.text3{font-size:14px;line-height:1.4}
.muted{color:var(--dark-grey)}
@media (max-width:640px){h2{font-size:32px;letter-spacing:-1.5px}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:var(--r-sm);font-size:14px;font-weight:500;line-height:1.4;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background .2s,color .2s,transform .2s var(--ease)}
.btn:active{transform:scale(.97)}
.btn-dark{background:var(--black);color:var(--snow)}.btn-dark:hover{background:var(--dark-grey)}
.btn-line{border-color:var(--black)}.btn-line:hover{background:var(--black);color:var(--snow)}
.btn-orange{background:var(--orange);color:var(--black);font-size:18px;min-height:56px;padding:0 28px}.btn-orange:hover{background:var(--black);color:var(--snow)}

/* logo */
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.logo-word{font-weight:500;font-size:26px;letter-spacing:-1px;line-height:1}
.logo svg .arc{transform-origin:40px 40px;transition:transform .5s var(--ease)}
.logo:hover svg .arc{transform:rotate(-12deg)}

/* header */
.site-header{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s}
.site-header.scrolled{background:rgba(245,245,247,.92);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--platinum)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:76px}
.nav-links{display:flex;align-items:center;gap:32px;list-style:none;margin:0;padding:0;font-size:16px;font-weight:500}
.nav-links a:not(.btn){text-decoration:none;position:relative;padding:8px 0}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--orange);transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.nav-links a:not(.btn):hover::after{transform:scaleX(1);transform-origin:left}
.menu-btn{display:none;background:none;border:0;width:48px;height:48px;margin-right:-12px;cursor:pointer}
@media (max-width:900px){
  .menu-btn{display:inline-grid;place-items:center}
  .nav-links{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--snow);border-bottom:1px solid var(--platinum);padding:8px var(--pad) 24px;display:none}
  .nav-links.open{display:flex}
  .nav-links a:not(.btn){display:block;padding:16px 0;border-bottom:1px solid var(--platinum)}
  .nav-links .btn{margin-top:16px}
}

/* ---------- HERO ---------- */
.hero{padding:clamp(120px,14vw,168px) 0 clamp(64px,8vw,104px)}
.hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(40px,5vw,80px);align-items:center}
.hero h1{font-size:clamp(52px,7.4vw,104px);line-height:.9;letter-spacing:-.045em}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .line span{display:inline-block;transform:translateY(105%);animation:rise .9s var(--ease) forwards}
.hero h1 .line:nth-child(2) span{animation-delay:.1s}
.hero h1 .line:nth-child(3) span{animation-delay:.2s}
.hero h1 .hl{background:linear-gradient(var(--orange),var(--orange)) no-repeat 0 92%/0% 38%;animation:rise .9s var(--ease) .2s forwards,sweep .7s var(--ease) 1s forwards;padding:0 .04em}
@keyframes rise{to{transform:none}}
@keyframes sweep{to{background-size:100% 38%}}
.hero-copy{margin-top:32px;max-width:30em;opacity:0;animation:fade .8s var(--ease) .5s forwards}
.hero-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px;opacity:0;animation:fade .8s var(--ease) .65s forwards}
@keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* the stage: the logo mark, blown up, with stock moving along its arc */
.stage-wrap{position:relative;aspect-ratio:1;width:100%;max-width:540px;justify-self:end}
.stage{position:absolute;top:0;left:0;width:480px;height:480px;transform-origin:0 0;border-radius:28px;background:var(--black);overflow:hidden;opacity:0;animation:pop 1s var(--ease) .25s forwards}
@keyframes pop{from{opacity:0;transform:scale(calc(var(--s,1)*.94))}to{opacity:1;transform:scale(var(--s,1))}}
.stage .stem{position:absolute;left:96px;top:72px;width:84px;height:336px;background:var(--snow);border-radius:2px;transform-origin:bottom;transform:scaleY(0);animation:grow .8s var(--ease) .6s forwards}
@keyframes grow{to{transform:none}}
.stage .arc{position:absolute;inset:0;transform-origin:480px 480px;transform:scale(0);animation:grow .9s var(--ease) .75s forwards}
.parcel{position:absolute;left:0;top:0;offset-path:path("M 250 640 L 250 480 A 230 230 0 0 1 480 250 L 680 250");offset-rotate:0deg;offset-anchor:50% 50%;animation:travel 14s linear infinite;display:flex;align-items:center;gap:8px;background:var(--snow);color:var(--black);border-radius:999px;padding:8px 14px 8px 10px;font-size:14px;font-weight:500;white-space:nowrap;box-shadow:0 6px 18px rgba(10,10,11,.25)}
.parcel svg{width:22px;height:22px;flex:none}
.parcel:nth-of-type(1){animation-delay:-0s}.parcel:nth-of-type(2){animation-delay:-2.8s}.parcel:nth-of-type(3){animation-delay:-5.6s}.parcel:nth-of-type(4){animation-delay:-8.4s}.parcel:nth-of-type(5){animation-delay:-11.2s}
@keyframes travel{from{offset-distance:0%}to{offset-distance:100%}}
.stage-tag{position:absolute;font-size:14px;color:var(--grey)}
.stage-tag.from{left:24px;bottom:22px}
.stage-tag.to{right:24px;top:22px;color:var(--grey)}
.stage:hover .parcel{animation-play-state:paused}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.stage-wrap{justify-self:start}}

/* ---------- TICKER ---------- */
.ticker{background:var(--black);color:var(--snow);overflow:hidden;padding:22px 0;border-block:1px solid var(--dark-grey)}
.ticker-track{display:flex;width:max-content;animation:tick 40s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker ul{display:flex;list-style:none;margin:0;padding:0}
.ticker li{font-size:24px;font-weight:500;letter-spacing:-.5px;padding-right:32px;white-space:nowrap}
.ticker li::after{content:"/";color:var(--orange);padding-left:32px}
@keyframes tick{to{transform:translateX(-50%)}}

/* ---------- PRODUCT LINES ---------- */
.lines{padding:clamp(80px,10vw,136px) 0}
.lines-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px}
.lines-head p{max-width:26em}
.explorer{display:grid;grid-template-columns:minmax(260px,.8fr) 1.4fr;gap:16px}
.tablist{display:flex;flex-direction:column;gap:4px}
.tab{appearance:none;border:0;background:transparent;text-align:left;cursor:pointer;padding:22px 24px;border-radius:var(--r-md);display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:32px;font-weight:500;letter-spacing:-1.5px;line-height:1;color:var(--grey);transition:background .3s,color .3s}
.tab small{font-size:14px;font-weight:400;letter-spacing:0;color:inherit}
.tab:hover{color:var(--dark-grey)}
.tab[aria-selected="true"]{background:var(--white);color:var(--black)}
.tab[aria-selected="true"] small{color:var(--dark-grey)}
.panels{position:relative;background:var(--white);border-radius:var(--r-lg);min-height:520px;overflow:hidden}
.panel{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:clamp(28px,4vw,48px);align-items:center}
.panel[hidden]{display:grid;visibility:hidden;opacity:0;pointer-events:none}
.panel{transition:opacity .45s var(--ease),visibility .45s}
.panel .art{position:relative;aspect-ratio:1;display:grid;place-items:center}
.panel .art::before{content:"";position:absolute;inset:12%;border-radius:50%;background:var(--snow);transform:scale(.6);transition:transform .7s var(--ease)}
.panel .art svg{position:relative;width:78%;height:auto;stroke:var(--black);stroke-width:.9;fill:none;stroke-linecap:round;stroke-linejoin:round;transform:translateY(16px) rotate(-6deg);opacity:0;transition:transform .7s var(--ease) .05s,opacity .5s .05s}
.panel .art .dot{fill:var(--orange);stroke:none}
.panel:not([hidden]) .art::before{transform:none}
.panel:not([hidden]) .art svg{transform:none;opacity:1}
.panel h3{font-size:40px;line-height:1;letter-spacing:-2px}
.panel ul{list-style:none;padding:0;margin:24px 0 32px;display:flex;flex-wrap:wrap;gap:8px}
.panel li{background:var(--snow);border-radius:999px;padding:8px 14px;font-size:14px}
.add-btn[aria-pressed="true"]{background:var(--orange);color:var(--black)}
@media (max-width:900px){
  .explorer{grid-template-columns:1fr}
  .tablist{flex-direction:row;overflow-x:auto;scrollbar-width:none}
  .tab{font-size:22px;letter-spacing:-.5px;padding:16px 18px;white-space:nowrap}
  .tab small{display:none}
  .panels{min-height:0}
  .panel{position:relative;grid-template-columns:1fr}
  .panel[hidden]{display:none}
  .panel .art{max-width:280px;margin:0 auto;width:100%}
}

/* ---------- PROMISES ---------- */
.promises{background:var(--white);padding:clamp(80px,10vw,128px) 0}
.promises-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr 1fr;gap:clamp(24px,3vw,48px);align-items:start}
.promise svg{width:48px;height:48px;stroke:var(--orange);stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round;margin-bottom:28px}
.promise p{margin-top:10px}
@media (max-width:1000px){.promises-grid{grid-template-columns:1fr 1fr}.promises-grid h2{grid-column:1/-1}}
@media (max-width:600px){.promises-grid{grid-template-columns:1fr}}

/* ---------- HOW (sticky, scroll-linked) ---------- */
.how{padding:clamp(80px,10vw,136px) 0}
.how-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(40px,6vw,96px)}
.how-side{position:sticky;top:120px;align-self:start}
.how-side p{margin-top:20px;max-width:24em}
.rail{position:relative;margin-top:48px;height:4px;background:var(--platinum);border-radius:4px;overflow:hidden}
.rail i{position:absolute;inset:0;background:var(--orange);transform-origin:left;transform:scaleX(var(--p,0))}
.rail-labels{display:flex;justify-content:space-between;margin-top:12px;font-size:14px;color:var(--dark-grey)}
.steps{list-style:none;margin:0;padding:0;counter-reset:s}
.step{counter-increment:s;min-height:56vh;display:flex;flex-direction:column;justify-content:center;padding:32px 0;border-top:1px solid var(--platinum);opacity:.28;transition:opacity .5s var(--ease)}
.step.on{opacity:1}
.step::before{content:counter(s,decimal-leading-zero);font-size:104px;line-height:.85;letter-spacing:-.05em;font-weight:500;color:var(--grey);transition:color .5s}
.step.on::before{color:var(--orange)}
.step h3{margin-top:28px;font-size:40px;line-height:1;letter-spacing:-2px}
.step p{margin-top:14px;max-width:28em}
@media (max-width:900px){.how-grid{grid-template-columns:1fr}.how-side{position:static}.step{min-height:0;opacity:1}.step::before{font-size:64px}}

/* ---------- NAME ---------- */
.name{background:var(--black);color:var(--snow);padding:clamp(96px,12vw,160px) 0;overflow:hidden}
.name blockquote{margin:0;font-size:clamp(40px,6vw,80px);line-height:1;letter-spacing:-.04em;font-weight:500;max-width:15em}
.word{position:relative;display:inline-block;color:var(--orange)}
.word svg{position:absolute;left:-2%;width:104%;bottom:-.28em;height:.36em;overflow:visible}
.word path{fill:none;stroke:var(--orange);stroke-width:5;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1.6s var(--ease) .3s}
.name.seen .word path{stroke-dashoffset:0}
.name-foot{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:64px;color:var(--platinum)}
@media (max-width:800px){.name-foot{grid-template-columns:1fr;gap:20px}}

/* ---------- REQUEST BUILDER ---------- */
.request{padding:clamp(80px,10vw,136px) 0}
.req{display:grid;grid-template-columns:1.25fr 1fr;gap:16px}
.req-form{background:var(--white);border-radius:var(--r-lg);padding:clamp(24px,4vw,48px)}
.req-form h2{margin-bottom:12px}
fieldset{border:0;padding:0;margin:36px 0 0}
legend{font-size:18px;font-weight:500;margin-bottom:14px;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{appearance:none;border:1.5px solid var(--platinum);background:var(--snow);border-radius:999px;min-height:44px;padding:0 18px;font-size:16px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:background .2s,border-color .2s,transform .2s var(--ease)}
.chip:hover{border-color:var(--grey)}
.chip:active{transform:scale(.96)}
.chip .tick{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--grey);display:grid;place-items:center;transition:all .2s}
.chip[aria-pressed="true"],.chip[aria-checked="true"]{background:var(--black);border-color:var(--black);color:var(--snow)}
.chip[aria-pressed="true"] .tick,.chip[aria-checked="true"] .tick{background:var(--orange);border-color:var(--orange)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:36px}
.field label{display:block;font-size:14px;font-weight:500;margin-bottom:8px}
.field input{width:100%;min-height:48px;border:1.5px solid var(--platinum);background:var(--snow);border-radius:var(--r-sm);padding:0 14px;font-size:16px}
.field input:focus{outline:none;border-color:var(--black)}
@media (max-width:560px){.fields{grid-template-columns:1fr}}
.req-preview{background:var(--black);color:var(--snow);border-radius:var(--r-lg);padding:clamp(24px,4vw,40px);display:flex;flex-direction:column;gap:20px;position:relative;overflow:hidden}
.req-preview::after{content:"";position:absolute;right:-110px;bottom:-110px;width:260px;height:260px;border-radius:50%;background:var(--orange);pointer-events:none}
.req-preview>*{position:relative;z-index:1}
.bubble{background:var(--dark-grey);border-radius:16px 16px 16px 4px;padding:18px 20px;font-size:16px;line-height:1.5;white-space:pre-line;min-height:180px;transition:background .3s}

.req-actions{display:flex;flex-direction:column;gap:10px;margin-top:auto}
.req-actions .btn-line{border-color:var(--snow);color:var(--snow)}.req-actions .btn-line:hover{background:var(--snow);color:var(--black)}
@media (max-width:900px){.req{grid-template-columns:1fr}.req-preview::after{display:none}}

/* footer */
.site-footer{border-top:1px solid var(--platinum);padding:48px 0;font-size:14px;color:var(--dark-grey)}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:28px}
.site-footer address{font-style:normal;line-height:1.6}
.site-footer nav{display:flex;gap:20px}
.site-footer a{text-decoration:none}.site-footer a:hover{color:var(--black);text-decoration:underline}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .parcel{display:none}
  .ticker-track{animation:none}
  .step{opacity:1}
}

/* =========================================================
   MULTI-PAGE ADDITIONS
   ========================================================= */
.nav-links a[aria-current="page"]:not(.btn)::after{transform:scaleX(1)}
.count{display:none;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--orange);color:var(--black);font-size:12px;font-weight:500;align-items:center;justify-content:center;line-height:1}
.count.has{display:inline-flex}

/* page hero */
.page-hero{padding:clamp(128px,14vw,176px) 0 clamp(56px,7vw,88px)}
.page-hero h1{font-size:clamp(48px,6.4vw,88px);line-height:.92;letter-spacing:-.045em;max-width:12em}
.page-hero h1 .line{display:block;overflow:hidden;padding-bottom:.06em}
.page-hero h1 .line span{display:inline-block;transform:translateY(105%);animation:rise .9s var(--ease) forwards}
.page-hero h1 .line:nth-child(2) span{animation-delay:.1s}
.page-hero .intro{margin-top:28px;max-width:34em;font-size:18px;color:var(--dark-grey);opacity:0;animation:fade .8s var(--ease) .45s forwards}
.crumb{font-size:14px;color:var(--dark-grey);margin-bottom:24px;display:flex;gap:8px}
.crumb a{text-decoration:none}.crumb a:hover{text-decoration:underline}
.split-hero{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:900px){.split-hero{grid-template-columns:1fr}}

.sec{padding:clamp(72px,9vw,128px) 0}
.sec-white{background:var(--white)}
.sec-dark{background:var(--black);color:var(--snow)}
.sec-dark .muted{color:var(--platinum)}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:24px;margin-bottom:48px}
.sec-head p{max-width:28em}

/* route map */
.routes{position:relative;background:var(--black);border-radius:28px;overflow:hidden;aspect-ratio:600/520}
.routes svg{width:100%;height:100%}
.routes .r{fill:none;stroke:var(--orange);stroke-width:2;stroke-linecap:round;stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600);transition:stroke-dashoffset 1.8s var(--ease)}
.routes.go .r{stroke-dashoffset:0}
.routes .r:nth-of-type(2){transition-delay:.12s}.routes .r:nth-of-type(3){transition-delay:.24s}.routes .r:nth-of-type(4){transition-delay:.36s}.routes .r:nth-of-type(5){transition-delay:.48s}.routes .r:nth-of-type(6){transition-delay:.6s}.routes .r:nth-of-type(7){transition-delay:.72s}.routes .r:nth-of-type(8){transition-delay:.84s}
.routes .city circle{fill:var(--snow);opacity:0;transition:opacity .4s 1.4s}
.routes .city text{fill:var(--platinum);font:400 15px var(--font);opacity:0;transition:opacity .4s 1.5s}
.routes.go .city circle,.routes.go .city text{opacity:1}
.routes .hub text{fill:var(--snow);font:500 20px var(--font)}
.routes .pulse{fill:var(--orange);transform-origin:250px 210px;animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%{transform:scale(.4);opacity:.7}100%{transform:scale(3.2);opacity:0}}
.routes .grid{stroke:#5E5E63;stroke-width:1;opacity:.6}
.routes .truck{offset-path:path("M250 210 Q 300 300 342 330");offset-rotate:0deg;animation:drive 5s linear infinite}
@keyframes drive{0%{offset-distance:0%;opacity:0}10%{opacity:1}90%{opacity:1}100%{offset-distance:100%;opacity:0}}

/* fact strip */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px}
.fact{background:var(--white);border-radius:var(--r-lg);padding:28px}
.fact svg{width:40px;height:40px;stroke:var(--orange);stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round;margin-bottom:24px}
.fact p{margin-top:8px}
@media (max-width:1000px){.facts{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.facts{grid-template-columns:1fr}}

/* methods */
.methods{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.method{position:relative;border-radius:var(--r-lg);padding:clamp(28px,3.5vw,40px);min-height:300px;display:flex;flex-direction:column;justify-content:space-between;gap:32px;overflow:hidden;background:var(--snow)}
.method h3{font-size:32px;line-height:1;letter-spacing:-1.5px}
.method p{margin-top:12px;font-size:16px;color:var(--dark-grey);max-width:28em}
.method .ico{width:64px;height:64px;stroke:var(--black);stroke-width:1.2;fill:none;stroke-linecap:round;stroke-linejoin:round;transition:transform .6s var(--ease)}
.method:hover .ico{transform:translateX(12px)}
.method .tag{position:absolute;top:28px;right:28px;font-size:14px;color:var(--dark-grey)}
.method.feat{background:var(--orange)}
.method.feat p,.method.feat .tag{color:var(--black)}
.method.dark{background:var(--black);color:var(--snow)}
.method.dark p,.method.dark .tag{color:var(--platinum)}
.method.dark .ico{stroke:var(--snow)}
@media (max-width:820px){.methods{grid-template-columns:1fr}}

/* warehouse flow */
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;counter-reset:f}
.flow::before{content:"";position:absolute;left:0;right:0;top:27px;height:2px;background:var(--dark-grey)}
.flow::after{content:"";position:absolute;left:0;right:0;top:27px;height:2px;background:var(--orange);transform-origin:left;transform:scaleX(0);transition:transform 2s var(--ease)}
.flow.go::after{transform:scaleX(1)}
.flow li{position:relative;padding-right:24px;counter-increment:f}
.flow li::before{content:counter(f);display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--dark-grey);color:var(--snow);font-size:18px;font-weight:500;position:relative;z-index:1;transition:background .4s,color .4s}
.flow.go li::before{background:var(--orange);color:var(--black)}
.flow.go li:nth-child(2)::before{transition-delay:.4s}.flow.go li:nth-child(3)::before{transition-delay:.8s}.flow.go li:nth-child(4)::before{transition-delay:1.2s}.flow.go li:nth-child(5)::before{transition-delay:1.6s}
.flow h3{margin-top:24px;font-size:20px;letter-spacing:-.3px}
.flow p{margin-top:8px;font-size:16px;color:var(--platinum)}
@media (max-width:900px){
  .flow{grid-template-columns:1fr;gap:28px}
  .flow::before,.flow::after{left:27px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .flow::after{transform-origin:top;transform:scaleY(0)}.flow.go::after{transform:scaleY(1)}
  .flow li{display:grid;grid-template-columns:56px 1fr;column-gap:20px;padding:0}
  .flow li::before{grid-row:span 2}.flow h3{margin-top:4px}
}

/* incoterms */
.terms{display:grid;grid-template-columns:minmax(240px,.7fr) 1.3fr;gap:16px}
.term-picks{display:flex;flex-direction:column;gap:8px}
.term-pick{appearance:none;border:1.5px solid var(--platinum);background:var(--white);border-radius:var(--r-md);padding:18px 20px;text-align:left;cursor:pointer;transition:all .25s}
.term-pick b{display:block;font-size:24px;font-weight:500;letter-spacing:-.5px}
.term-pick span{font-size:14px;color:var(--dark-grey)}
.term-pick:hover{border-color:var(--grey)}
.term-pick[aria-checked="true"]{background:var(--black);border-color:var(--black);color:var(--snow)}
.term-pick[aria-checked="true"] span{color:var(--platinum)}
.term-board{background:var(--white);border-radius:var(--r-lg);padding:clamp(24px,3.5vw,40px)}
.term-desc{min-height:3em;color:var(--dark-grey)}
.legs{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.leg{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:16px;font-size:16px}
.leg .bar{position:relative;height:44px;border-radius:var(--r-sm);background:var(--snow);overflow:hidden}
.leg .bar i{position:absolute;inset:0;border-radius:var(--r-sm);display:flex;align-items:center;padding:0 14px;font-size:14px;font-style:normal;font-weight:500;transition:transform .5s var(--ease),background .3s}
.leg .bar i.bossa{background:var(--orange);color:var(--black);transform:translateX(0)}
.leg .bar i.you{background:var(--black);color:var(--snow);transform:translateX(0)}
.legend{display:flex;gap:20px;margin-top:20px;font-size:14px;color:var(--dark-grey)}
.legend span{display:inline-flex;align-items:center;gap:8px}
.legend span::before{content:"";width:14px;height:14px;border-radius:4px;background:var(--orange)}
.legend span.y::before{background:var(--black)}
@media (max-width:860px){.terms{grid-template-columns:1fr}.term-picks{flex-direction:row;flex-wrap:wrap}.term-pick{flex:1 1 140px}.leg{grid-template-columns:1fr}}

/* docs */
.docs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.doc{background:var(--snow);border-radius:var(--r-lg);padding:28px;display:flex;gap:18px;align-items:flex-start}
.doc svg{width:32px;height:32px;flex:none;stroke:var(--black);stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}
.doc p{margin-top:6px;font-size:16px;color:var(--dark-grey)}
@media (max-width:900px){.docs{grid-template-columns:1fr}}

/* faq */
.faq{max-width:880px}
.faq details{border-top:1px solid var(--platinum)}
.faq details:last-child{border-bottom:1px solid var(--platinum)}
.faq summary{list-style:none;cursor:pointer;padding:26px 0;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:24px;font-weight:500;letter-spacing:-.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{flex:none;width:36px;height:36px;border-radius:50%;background:var(--snow);position:relative;transition:background .3s,transform .4s var(--ease)}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:var(--black);transform:translate(-50%,-50%)}
.faq summary .pm::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s var(--ease)}
.faq details[open] .pm{background:var(--orange);transform:rotate(180deg)}
.faq details[open] .pm::after{transform:translate(-50%,-50%) rotate(0)}
.faq .ans{padding:0 64px 28px 0;color:var(--dark-grey);animation:fade .4s var(--ease)}

/* map */
.mapbox{display:grid;grid-template-columns:1fr 1.4fr;gap:16px}
.map-card{background:var(--black);color:var(--snow);border-radius:var(--r-lg);padding:clamp(28px,4vw,44px);display:flex;flex-direction:column;gap:24px}
.map-card address{font-style:normal;font-size:18px;line-height:1.5;color:var(--platinum)}
.map-card dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 24px;font-size:16px}
.map-card dt{color:var(--grey)}.map-card dd{margin:0;color:var(--snow)}
.map-card .btn-line{border-color:var(--snow);color:var(--snow);align-self:flex-start}.map-card .btn-line:hover{background:var(--snow);color:var(--black)}
.map-frame{border-radius:var(--r-lg);overflow:hidden;min-height:420px;background:var(--platinum)}
.map-frame iframe{width:100%;height:100%;min-height:420px;border:0;filter:grayscale(1) contrast(1.05);transition:filter .5s}
.map-frame:hover iframe{filter:none}
@media (max-width:900px){.mapbox{grid-template-columns:1fr}}

/* teaser band on home */
.ship-band{background:var(--black);color:var(--snow);padding:clamp(72px,9vw,120px) 0;overflow:hidden}
.ship-band .grid2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.ship-band p{color:var(--platinum);margin-top:20px;max-width:28em}
.ship-band ul{list-style:none;padding:0;margin:28px 0 36px;display:flex;flex-direction:column;gap:12px}
.ship-band li{display:flex;gap:12px;align-items:center;font-size:18px}
.ship-band li::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--orange);flex:none}
.ship-band .btn-line{border-color:var(--snow);color:var(--snow)}.ship-band .btn-line:hover{background:var(--snow);color:var(--black)}
@media (max-width:900px){.ship-band .grid2{grid-template-columns:1fr}}

/* cta band */
.cta-band{padding:clamp(72px,9vw,120px) 0}
.cta-card{background:var(--orange);border-radius:28px;padding:clamp(36px,6vw,80px);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:32px;position:relative;overflow:hidden}
.cta-card h2{font-size:clamp(40px,5.6vw,72px);line-height:.95;letter-spacing:-.04em;max-width:10em}
.cta-card p{margin-top:16px;font-size:18px;max-width:26em}
.cta-card::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;border:2px solid var(--black);opacity:.15}

/* about */
.values-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--platinum)}
.values-list div{padding:36px 36px 36px 0;border-bottom:1px solid var(--platinum)}
.values-list div:nth-child(odd){border-right:1px solid var(--platinum)}
.values-list div:nth-child(even){padding-left:36px}
.values-list h3{font-size:32px;letter-spacing:-1.5px;line-height:1}
.values-list p{margin-top:12px;color:var(--dark-grey);max-width:26em}
@media (max-width:760px){.values-list{grid-template-columns:1fr}.values-list div:nth-child(odd){border-right:0}.values-list div:nth-child(even){padding-left:0}}
.big-mark{width:100%;max-width:440px;aspect-ratio:1;justify-self:end}
.big-mark .arc{transform-origin:40px 40px;animation:swing 6s var(--ease) infinite alternate}
@keyframes swing{0%{transform:rotate(0)}100%{transform:rotate(-14deg)}}

/* contact channels */
.channels{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.channel{display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:180px;background:var(--white);border-radius:var(--r-lg);padding:28px;text-decoration:none;transition:transform .3s var(--ease),background .3s}
.channel:hover{transform:translateY(-4px)}
.channel b{font-size:24px;font-weight:500;letter-spacing:-.5px}
.channel span{font-size:16px;color:var(--dark-grey)}
.channel svg{width:32px;height:32px;stroke:var(--orange);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:800px){.channels{grid-template-columns:1fr}}

.footer-cols{display:grid!important;grid-template-columns:1.4fr 1fr 1fr 1fr;align-items:start!important}
.footer-cols h4{margin:0 0 12px;font-size:14px;font-weight:500;color:var(--black)}
.footer-cols ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.footer-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:40px;padding-top:24px;border-top:1px solid var(--platinum)}
@media (max-width:800px){.footer-cols{grid-template-columns:1fr 1fr}}

@media (prefers-reduced-motion:reduce){
  .routes .r{stroke-dashoffset:0}.routes .city circle,.routes .city text{opacity:1}.routes .truck,.routes .pulse{display:none}
  .page-hero h1 .line span{transform:none}.page-hero .intro{opacity:1}
}

/* =========================================================
   CORPORATE ADDITIONS
   ========================================================= */
.trust{list-style:none;margin:36px 0 0;padding:24px 0 0;border-top:1px solid var(--platinum);display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--dark-grey);opacity:0;animation:fade .8s var(--ease) .8s forwards}
.trust li{display:flex;align-items:center;gap:10px}
.trust svg{width:18px;height:18px;flex:none;stroke:var(--orange);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round}

.company{display:grid;grid-template-columns:1fr 1.5fr;gap:16px}
.leader{background:var(--snow);border-radius:var(--r-lg);padding:clamp(28px,3.5vw,40px);display:flex;flex-direction:column;gap:20px}
.leader-mark{width:88px;height:88px;border-radius:50%;background:var(--black);color:var(--snow);display:grid;place-items:center;font-size:28px;font-weight:500;letter-spacing:-.5px;box-shadow:inset 0 -6px 0 var(--orange)}
.leader h3{font-size:32px;letter-spacing:-1.5px;line-height:1}
.leader p.muted{margin-top:6px}
.facts-dl{margin:0;background:var(--snow);border-radius:var(--r-lg);padding:8px clamp(24px,3.5vw,40px)}
.facts-dl div{display:grid;grid-template-columns:220px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--platinum)}
.facts-dl div:last-child{border-bottom:0}
.facts-dl dt{font-size:14px;color:var(--dark-grey)}
.facts-dl dd{margin:0;font-size:16px;font-weight:500}
.facts-dl a{text-decoration:none}.facts-dl a:hover{text-decoration:underline}
@media (max-width:900px){.company{grid-template-columns:1fr}.facts-dl div{grid-template-columns:1fr;gap:2px}}

.field select,.field textarea{width:100%;border:1.5px solid var(--platinum);background:var(--snow);border-radius:var(--r-sm);font-size:16px}
.field select{min-height:48px;padding:0 12px}
.field textarea{padding:12px 14px;resize:vertical;font-family:inherit}
.field select:focus,.field textarea:focus{outline:none;border-color:var(--black)}
.field input[aria-invalid="true"]{border-color:var(--orange)}
.err{margin:6px 0 0;font-size:14px;color:var(--black);display:flex;align-items:center;gap:8px}.err::before{content:"";width:8px;height:8px;background:var(--orange);flex:none}.err[hidden]{display:none}
.summary{margin:0;display:flex;flex-direction:column}
.summary div{display:grid;grid-template-columns:100px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--dark-grey);font-size:16px}
.summary dt{color:var(--grey);font-size:14px}
.summary dd{margin:0;color:var(--snow)}
.req-actions button.btn{width:100%;border:0}

/* about: story timeline (reuses the scroll-linked steps) */
.story .step::before{content:attr(data-label);font-size:clamp(56px,6vw,88px)}
.story .step h3{font-size:32px;letter-spacing:-1.5px}
.story .step p{font-size:18px;max-width:32em}

/* =========================================================
   LOGO: stacked wordmark (option 07)
   ========================================================= */
.lockup,.big-lockup{display:inline-flex;flex-direction:column;font-weight:500;line-height:.84;letter-spacing:-.055em}
.lockup{font-size:23px}
.lockup-sm{font-size:28px}
.lockup .l1,.big-lockup .l1{color:var(--black)}
.lockup .l2,.big-lockup .l2{color:var(--grey)}
.lockup i,.big-lockup i{display:inline-block;width:.19em;height:.19em;background:var(--orange);margin-left:.07em;transition:transform .35s var(--ease)}
.logo:hover .lockup i{transform:translateX(.18em)}
.big-lockup{font-size:clamp(96px,11vw,168px);justify-self:end}
.big-lockup i{animation:blink-in .6s var(--ease) 1s both}
@keyframes blink-in{from{transform:scale(0)}to{transform:scale(1)}}

/* =========================================================
   BRAND GRADIENTS: Orange fading into Snow
   down = from the top, up = from the bottom
   ========================================================= */
:root{
  --grad-down:linear-gradient(180deg,rgba(255,91,46,.88) 0%,rgba(255,91,46,.55) 22%,rgba(255,91,46,.18) 42%,rgba(255,91,46,0) 56%);
  --grad-up:linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,.6) 28%,rgba(255,91,46,.16) 52%,rgba(255,91,46,0) 70%);
}

/* home hero: wide panel fading down + narrow strip rising up, behind the stage */
.hero{position:relative;isolation:isolate;overflow:hidden}
.hero::before,.hero::after{content:"";position:absolute;top:0;bottom:0;z-index:-1;pointer-events:none;animation:gradIn 1.4s var(--ease) both}
.hero::before{right:9vw;width:38vw;background:var(--grad-down)}
.hero::after{right:0;width:9vw;background:var(--grad-up);animation-delay:.25s}
@keyframes gradIn{from{opacity:0;transform:translateY(-24px)}to{opacity:1;transform:none}}
@media (max-width:900px){
  .hero::before{left:0;right:0;width:auto;background:linear-gradient(180deg,rgba(255,91,46,.88) 0%,rgba(255,91,46,.3) 18%,rgba(255,91,46,0) 34%)}
  .hero::after{display:none}
}

/* inner page heroes */
.page-hero{background:var(--grad-down)}

/* call-to-action cards rise from the bottom */
.cta-card{background:linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,.7) 35%,rgba(255,91,46,.25) 70%,#F5F5F7 100%);box-shadow:inset 0 0 0 1px var(--platinum)}
.cta-card::after{display:none}

/* about: logo sits on the two-part gradient composition */
.big-lockup{position:relative;padding:48px 56px;isolation:isolate}
.big-lockup::before{content:"";position:absolute;inset:0 18% 0 0;z-index:-1;background:linear-gradient(180deg,#FF5B2E 0%,rgba(255,91,46,.45) 30%,rgba(255,91,46,0) 58%);border-radius:var(--r-lg) 0 0 var(--r-lg)}
.big-lockup::after{content:"";position:absolute;top:0;bottom:0;right:0;width:18%;z-index:-1;background:linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,.45) 40%,rgba(255,91,46,0) 72%);border-radius:0 var(--r-lg) var(--r-lg) 0}

/* footer: thin gradient rule */
.site-footer{border-top:0;position:relative}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#FF5B2E,rgba(255,91,46,0) 70%)}

@media (prefers-reduced-motion:reduce){.hero::before,.hero::after{animation:none}}

/* =========================================================
   GLASS: frosted, layered cards in the brand colours
   ========================================================= */
.glass,.glass-orange,.glass-orange-soft{
  backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);
  border:1px solid rgba(255,255,255,.65);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),inset 0 -1px 0 rgba(255,255,255,.15),0 24px 48px -24px rgba(255,91,46,.45);
}
.glass{background:linear-gradient(160deg,rgba(255,255,255,.82),rgba(255,255,255,.5))}
.glass-orange{background:var(--orange);border-color:rgba(255,255,255,.4)}
.glass-orange-soft{background:linear-gradient(180deg,#FF5B2E,rgba(255,91,46,.45))}

/* hero: three stacked glass cards overlapping the stage */
.glass-stack{position:absolute;left:-14%;bottom:-6%;width:300px;height:220px;list-style:none;margin:0;padding:0;z-index:2}
.glass-stack .g{position:absolute;width:228px;height:132px;border-radius:16px;padding:18px 20px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;color:var(--black);opacity:0;animation:glassIn .9s var(--ease) forwards;transition:transform .5s var(--ease)}
.glass-stack span{font-size:14px;font-weight:500}
.glass-stack b{font-size:36px;font-weight:500;letter-spacing:-1.5px;line-height:1}
.glass-stack .g3{top:0;left:72px;animation-delay:1.2s}
.glass-stack .g2{top:40px;left:36px;animation-delay:1.35s}
.glass-stack .g1{top:80px;left:0;animation-delay:1.5s}
.glass-stack .g1 b{font-size:30px}
@keyframes glassIn{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
.stage-wrap:hover .g3{transform:translate(18px,-14px)}
.stage-wrap:hover .g2{transform:translate(8px,-6px)}
@media (max-width:900px){.glass-stack{left:4%;bottom:-12%;transform:scale(.85);transform-origin:left bottom}}
@media (max-width:900px){.stage-wrap{margin-bottom:56px}}

/* sections where glass cards float over the brand gradient */
.glass-zone{position:relative;isolation:isolate;overflow:hidden}
.glass-zone::before,.glass-zone::after{content:"";position:absolute;z-index:-1;pointer-events:none}
.glass-zone::before{right:12%;top:0;width:34%;height:100%;background:linear-gradient(180deg,#FF5B2E 0%,rgba(255,91,46,.5) 35%,rgba(255,91,46,0) 75%)}
.glass-zone::after{right:3%;bottom:0;width:8%;height:100%;background:linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,.5) 40%,rgba(255,91,46,0) 80%)}
.promise.glass,.fact.glass{border-radius:var(--r-lg);padding:28px}
.fact.glass{background:linear-gradient(160deg,rgba(255,255,255,.8),rgba(255,255,255,.45))}
.promise.glass svg{margin-bottom:22px}
.channel.glass{background:linear-gradient(160deg,rgba(255,255,255,.85),rgba(255,255,255,.55))}
.channel.glass:hover{background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(255,255,255,.7))}
@media (max-width:900px){.glass-zone::before{width:60%;right:0}.glass-zone::after{display:none}}
@media (prefers-reduced-motion:reduce){.glass-stack .g{opacity:1;animation:none}}

/* =========================================================
   HERO v3: sliced globe with moving data/shipments
   ========================================================= */
.hero::before,.hero::after{display:none}
.hero h1{font-size:clamp(52px,7vw,100px)}
.hero-cats{list-style:none;margin:40px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;opacity:0;animation:fade .8s var(--ease) .8s forwards}
.hero-cats a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--platinum);background:var(--white);font-size:14px;text-decoration:none;color:var(--dark-grey);transition:border-color .2s,color .2s}
.hero-cats a:hover{border-color:var(--black);color:var(--black)}
.globe-panel{position:relative;width:100%;max-width:560px;aspect-ratio:1;justify-self:end;border-radius:28px;overflow:hidden;
  background:linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,.5) 22%,rgba(255,91,46,0) 48%),var(--white);
  display:grid;place-items:center;opacity:0;animation:fade 1s var(--ease) .3s forwards}
.globe{width:78%;height:auto;margin-top:-10%}
.globe .pk{transform-box:view-box;transform:translateX(var(--s));animation:packet ease-in-out infinite alternate}
@keyframes packet{from{transform:translateX(0)}to{transform:translateX(var(--dx))}}
.globe-cap{position:absolute;left:20px;right:20px;bottom:20px;border-radius:16px;padding:16px 20px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.globe-cap span{display:block;font-size:14px;color:var(--dark-grey)}
.globe-cap b{display:block;font-size:24px;font-weight:500;letter-spacing:-.5px;margin-top:4px}
@media (max-width:900px){.globe-panel{justify-self:stretch;max-width:none}}
@media (prefers-reduced-motion:reduce){.globe .pk{animation:none}.hero-cats,.globe-panel{opacity:1}}

/* HERO v4: glass category tiles over the two-part brand gradient */
.hero-panel{position:relative;width:100%;max-width:560px;aspect-ratio:1;justify-self:end;border-radius:28px;overflow:hidden;padding:20px;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;
  background:linear-gradient(180deg,rgba(255,91,46,.9) 0%,rgba(255,91,46,0) 46%),linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,0) 42%),var(--white)}
.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1}
.tile{border-radius:18px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;opacity:0;animation:tileIn .8s var(--ease) forwards;transition:transform .35s var(--ease)}
.tile:nth-child(1){animation-delay:.35s}.tile:nth-child(2){animation-delay:.45s}.tile:nth-child(3){animation-delay:.55s}.tile:nth-child(4){animation-delay:.65s}
.tile:hover{transform:translateY(-4px)}
.tile svg{width:52px;height:52px;fill:none;stroke:var(--black);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.tile svg .acc{fill:var(--orange);stroke:none}
.tile span{font-size:18px;font-weight:500;letter-spacing:-.3px;line-height:1.2}
@keyframes tileIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
.panel-cap{border-radius:16px;padding:16px 20px;display:grid;grid-template-columns:1fr 1fr;gap:16px;opacity:0;animation:tileIn .8s var(--ease) .8s forwards}
.panel-cap span{display:block;font-size:14px;color:var(--dark-grey)}
.panel-cap b{display:block;font-size:24px;font-weight:500;letter-spacing:-.5px;margin-top:4px}
@media (max-width:900px){.hero-panel{justify-self:stretch;max-width:none;aspect-ratio:auto}.tile{min-height:140px}}
@media (max-width:420px){.tile span{font-size:16px}.panel-cap b{font-size:20px}}
@media (prefers-reduced-motion:reduce){.tile,.panel-cap{opacity:1;animation:none}}

/* legal pages */
.legal{max-width:820px}
.legal h2{font-size:24px;letter-spacing:-.5px;line-height:1.2;margin:48px 0 14px}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{font-size:17px;line-height:1.6;color:var(--dark-grey)}
.legal p{margin:0 0 14px}
.legal ul{margin:0 0 14px;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.legal li::marker{color:var(--orange)}
.legal strong{color:var(--black);font-weight:500}
.legal a{color:var(--black)}
/* language switch */
.lang{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--platinum);border-radius:999px;font-size:13px;font-weight:500}
.lang a,.lang span{display:inline-grid;place-items:center;min-width:36px;min-height:30px;border-radius:999px;text-decoration:none}
.lang span{background:var(--black);color:var(--snow)}
.lang a:hover{background:var(--platinum)}
.nav-links .lang a::after{display:none}
@media (max-width:900px){.nav-links .lang{align-self:flex-start;margin-top:16px}.nav-links .lang a{border:0;padding:0}}

/* =========================================================
   GROUP HOME (v5): bigger, corporate group presentation
   ========================================================= */
/* header over the dark hero */
.dark-top .site-header:not(.scrolled) .lockup .l1{color:var(--snow)}
.dark-top .site-header:not(.scrolled) .menu-btn{color:var(--snow)}
@media (min-width:901px){
  .dark-top .site-header:not(.scrolled) .nav-links a:not(.btn){color:var(--snow)}
  .dark-top .site-header:not(.scrolled) .nav-links .btn-dark{background:var(--snow);color:var(--black)}
  .dark-top .site-header:not(.scrolled) .lang{border-color:var(--dark-grey)}
  .dark-top .site-header:not(.scrolled) .lang a{color:var(--snow)}
  .dark-top .site-header:not(.scrolled) .lang span{background:var(--snow);color:var(--black)}
}
.dark-top .site-header:not(.scrolled) .lang a:hover{background:var(--dark-grey)}

.g-hero{position:relative;overflow:hidden;background:var(--black);color:var(--snow);padding:clamp(140px,16vw,200px) 0 clamp(56px,6vw,80px);isolation:isolate}
.g-hero-glow{position:absolute;z-index:-1;right:-18vw;bottom:-55vw;width:95vw;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(255,91,46,.9) 0%,rgba(255,91,46,.45) 32%,rgba(255,91,46,0) 64%);animation:glow 14s ease-in-out infinite alternate}
@keyframes glow{from{transform:translate(0,0) scale(1)}to{transform:translate(-6vw,-3vw) scale(1.08)}}
.g-hero-grid{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(245,245,247,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(245,245,247,.06) 1px,transparent 1px);background-size:88px 88px;
  -webkit-mask-image:radial-gradient(ellipse at 30% 30%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse at 30% 30%,#000 20%,transparent 75%)}
.g-h1{font-size:clamp(56px,9.4vw,144px);line-height:.88;letter-spacing:-.05em;font-weight:500;margin:0}
.g-h1 .line{display:block;overflow:hidden;padding-bottom:.06em}
.g-h1 .line span{display:inline-block;transform:translateY(105%);animation:rise 1s var(--ease) forwards}
.g-h1 .line:nth-child(2) span{animation-delay:.12s;color:var(--orange)}
.g-hero-side{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px;margin-top:48px;opacity:0;animation:fade .9s var(--ease) .55s forwards}
.g-lede{font-size:clamp(18px,1.5vw,20px);line-height:1.45;color:var(--platinum);max-width:36em;margin:0}
.g-ctas{display:flex;flex-wrap:wrap;gap:12px}
.g-btn-ghost{border-color:var(--snow);color:var(--snow);min-height:56px;font-size:16px;padding:0 26px}
.g-btn-ghost:hover{background:var(--snow);color:var(--black)}
.g-divisions{list-style:none;margin:clamp(64px,8vw,112px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.g-div{position:relative;display:flex;flex-direction:column;gap:12px;min-height:230px;padding:26px;border-radius:20px;text-decoration:none;color:var(--snow);
  background:rgba(245,245,247,.06);border:1px solid rgba(245,245,247,.16);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  opacity:0;animation:tileIn .8s var(--ease) forwards;transition:background .35s,color .35s,transform .35s var(--ease)}
.g-divisions li:nth-child(1) .g-div{animation-delay:.8s}.g-divisions li:nth-child(2) .g-div{animation-delay:.9s}.g-divisions li:nth-child(3) .g-div{animation-delay:1s}.g-divisions li:nth-child(4) .g-div{animation-delay:1.1s}
.g-div-n{font-size:14px;color:var(--grey)}
.g-div b{font-size:24px;font-weight:500;letter-spacing:-.5px;line-height:1.1;margin-top:auto}
.g-div span:not(.g-div-n){font-size:16px;color:var(--platinum);line-height:1.4}
.g-div i{position:absolute;top:22px;right:22px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(245,245,247,.3);transition:all .35s var(--ease)}
.g-div i::before{content:"";position:absolute;left:14px;top:14px;width:9px;height:9px;border-top:2px solid currentColor;border-right:2px solid currentColor}
.g-div i::after{content:"";position:absolute;left:12px;top:26px;width:15px;height:2px;background:currentColor;transform:rotate(-45deg);transform-origin:left}
.g-div:hover{background:var(--snow);color:var(--black);transform:translateY(-4px)}
.g-div:hover span:not(.g-div-n){color:var(--dark-grey)}
.g-div:hover i{background:var(--orange);border-color:var(--orange)}
@media (max-width:1000px){.g-divisions{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.g-divisions{grid-template-columns:1fr}.g-div{min-height:170px}}

.g-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:24px;margin-bottom:56px}
.g-head h2{font-size:clamp(36px,4.4vw,56px);letter-spacing:-.04em;line-height:1;max-width:14em}
.g-head p{max-width:30em;margin:0}

.g-metrics{padding:clamp(72px,8vw,112px) 0;background:var(--snow)}
.g-metrics-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.g-metrics-grid div{border-top:2px solid var(--black);padding-top:24px}
.g-metrics-grid b{display:block;font-size:clamp(56px,6.4vw,96px);font-weight:500;letter-spacing:-.05em;line-height:.9}
.g-metrics-grid div:first-child b{color:var(--orange)}
.g-metrics-grid span{display:block;margin-top:14px;font-size:16px;color:var(--dark-grey);max-width:16em}
@media (max-width:900px){.g-metrics-grid{grid-template-columns:1fr 1fr;gap:40px 24px}}

.g-what{background:var(--white);padding:clamp(80px,10vw,136px) 0}
.g-acc details{border-top:1px solid var(--platinum)}
.g-acc details:last-child{border-bottom:1px solid var(--platinum)}
.g-acc summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:72px 1fr 48px;align-items:center;gap:16px;padding:28px 0}
.g-acc summary::-webkit-details-marker{display:none}
.g-acc-n{font-size:16px;color:var(--grey);transition:color .3s}
.g-acc-t{font-size:clamp(26px,3.4vw,48px);font-weight:500;letter-spacing:-.04em;line-height:1.05;transition:transform .4s var(--ease)}
.g-acc summary:hover .g-acc-t{transform:translateX(8px)}
.g-acc-i{width:48px;height:48px;border-radius:50%;background:var(--snow);position:relative;transition:background .3s,transform .4s var(--ease)}
.g-acc-i::before,.g-acc-i::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:2px;background:var(--black);transform:translate(-50%,-50%)}
.g-acc-i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s var(--ease)}
.g-acc details[open] .g-acc-n{color:var(--orange)}
.g-acc details[open] .g-acc-i{background:var(--orange);transform:rotate(180deg)}
.g-acc details[open] .g-acc-i::after{transform:translate(-50%,-50%) rotate(0)}
.g-acc-b{display:grid;grid-template-columns:1fr 1fr;gap:32px;padding:0 64px 36px 88px;animation:fade .45s var(--ease)}
.g-acc-b p{margin:0;font-size:18px;line-height:1.5;color:var(--dark-grey)}
.g-acc-b ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
.g-acc-b li{background:var(--snow);border-radius:999px;padding:9px 16px;font-size:15px}
.g-link{grid-column:1/-1;justify-self:start;font-weight:500;font-size:16px;color:var(--black);text-underline-offset:4px;text-decoration-color:var(--orange);text-decoration-thickness:2px}
@media (max-width:760px){.g-acc summary{grid-template-columns:44px 1fr 44px}.g-acc-b{grid-template-columns:1fr;padding:0 0 28px 0}.g-acc-i{width:44px;height:44px}}

.g-process{padding:clamp(80px,10vw,128px) 0;background:var(--snow)}
.g-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;counter-reset:gs}
.g-steps li{counter-increment:gs;border-top:2px solid var(--black);padding-top:24px}
.g-steps li::before{content:counter(gs,decimal-leading-zero);display:block;font-size:64px;font-weight:500;letter-spacing:-.05em;line-height:1;color:var(--grey);transition:color .3s}
.g-steps li:hover::before{color:var(--orange)}
.g-steps h3{margin-top:28px}
.g-steps p{margin-top:10px;font-size:16px;color:var(--dark-grey)}
@media (max-width:900px){.g-steps{grid-template-columns:1fr 1fr;gap:40px 24px}}
@media (max-width:520px){.g-steps{grid-template-columns:1fr}}

.g-serve{position:relative;overflow:hidden;isolation:isolate;background:var(--white);padding:clamp(80px,10vw,128px) 0}
.g-serve::before{content:"";position:absolute;z-index:-1;left:8%;top:30%;width:40%;height:70%;background:linear-gradient(180deg,#FF5B2E 0%,rgba(255,91,46,.45) 40%,rgba(255,91,46,0) 85%);border-radius:28px}
.g-serve::after{content:"";position:absolute;z-index:-1;right:6%;bottom:0;width:10%;height:80%;background:linear-gradient(0deg,#FF5B2E 0%,rgba(255,91,46,.45) 40%,rgba(255,91,46,0) 85%)}
.g-serve-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.g-serve-grid li{border-radius:20px;padding:30px;min-height:170px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;transition:transform .35s var(--ease)}
.g-serve-grid li:hover{transform:translateY(-4px)}
.g-serve-grid b{font-size:24px;font-weight:500;letter-spacing:-.5px;line-height:1.15}
.g-serve-grid span{font-size:16px;color:var(--dark-grey)}
@media (max-width:900px){.g-serve-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.g-serve-grid{grid-template-columns:1fr}}

.g-reach{background:var(--black);color:var(--snow);padding:clamp(80px,10vw,136px) 0}
.g-reach-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,6vw,88px);align-items:center}
.g-reach h2{font-size:clamp(36px,4.4vw,56px);letter-spacing:-.04em;line-height:1}
.g-reach-p{margin-top:24px;color:var(--platinum);max-width:32em}
.g-locs{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:28px 24px}
.g-locs li{border-top:1px solid var(--dark-grey);padding-top:16px}
.g-locs b{display:block;font-size:24px;font-weight:500;letter-spacing:-.5px}
.g-locs span{display:block;margin-top:4px;font-size:15px;color:var(--grey)}
.g-reach .routes{border:1px solid var(--dark-grey)}
@media (max-width:900px){.g-reach-grid{grid-template-columns:1fr}}

.g-why{background:var(--snow);padding:clamp(80px,10vw,128px) 0}
.g-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.g-why-grid div{background:var(--white);border-radius:20px;padding:30px;box-shadow:inset 0 3px 0 var(--orange)}
.g-why-grid p{margin-top:12px;font-size:16px;color:var(--dark-grey)}
@media (max-width:1000px){.g-why-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.g-why-grid{grid-template-columns:1fr}}

.g-story{background:var(--white);padding:clamp(80px,10vw,128px) 0;overflow:hidden}
.g-story-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.g-story-year{font-size:clamp(120px,18vw,260px);font-weight:500;letter-spacing:-.06em;line-height:.8;
  background:linear-gradient(180deg,#FF5B2E 0%,rgba(255,91,46,.15) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.g-story h2{font-size:clamp(32px,3.6vw,48px);letter-spacing:-.035em;line-height:1.05}
.g-story p{margin-top:20px;max-width:32em}
@media (max-width:820px){.g-story-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){.g-hero-glow{animation:none}.g-h1 .line span{transform:none}.g-hero-side,.g-div{opacity:1;animation:none}}

/* =========================================================
   v6: Solutions menu, service pages, map, news, careers
   ========================================================= */
/* smooth page transitions */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .25s ease both}
::view-transition-new(root){animation:vtIn .35s ease both}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0}}
#main{animation:pageIn .45s ease both}
@keyframes pageIn{from{opacity:0}}

/* Solutions dropdown */
.has-sub{position:relative}
.sub-btn{appearance:none;background:none;border:0;padding:8px 0;font:inherit;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:inherit}
.sub-btn::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .25s}
.has-sub.open .sub-btn::after{transform:rotate(225deg) translateY(-2px)}
.sub-btn.is-current{box-shadow:inset 0 -2px 0 var(--orange)}
.sub{list-style:none;margin:0;padding:8px;position:absolute;top:calc(100% + 10px);left:-16px;width:320px;background:var(--white);border-radius:16px;box-shadow:0 24px 60px -20px rgba(10,10,11,.35),0 0 0 1px var(--platinum);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s;z-index:60}
.has-sub.open .sub,.has-sub:hover .sub,.has-sub:focus-within .sub{opacity:1;visibility:visible;transform:none}
.sub a{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:10px;text-decoration:none;color:var(--black)!important}
.sub a::after{display:none!important}
.sub a b{font-size:16px;font-weight:500}
.sub a span{font-size:13px;color:var(--dark-grey)}
.sub a:hover,.sub a[aria-current="page"]{background:var(--snow)}
.sub a[aria-current="page"] b{color:var(--black);box-shadow:inset 0 -2px 0 var(--orange)}
@media (min-width:901px){.dark-top .site-header:not(.scrolled) .sub-btn{color:var(--snow)}}
@media (max-width:900px){
  .has-sub{border-bottom:1px solid var(--platinum)}
  .sub-btn{width:100%;justify-content:space-between;padding:16px 0}
  .sub{position:static;width:auto;box-shadow:none;padding:0 0 12px;opacity:1;visibility:visible;transform:none;display:none}
  .has-sub.open .sub{display:block}
  .has-sub:hover .sub{display:none}.has-sub.open:hover .sub{display:block}
  .sub a{border:0!important;padding:10px 12px!important}
}

/* service page cards */
.cards3,.cards4{display:grid;gap:16px}
.cards3{grid-template-columns:repeat(3,1fr)}
.cards4{grid-template-columns:repeat(4,1fr)}
.ccard{background:var(--snow);border-radius:20px;padding:28px;display:flex;flex-direction:column;gap:10px;transition:transform .35s var(--ease)}
.sec:not(.sec-white) .ccard{background:var(--white)}
.ccard:hover{transform:translateY(-4px)}
.ccard svg{width:40px;height:40px;fill:none;stroke:var(--orange);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:14px}
.ccard h3{font-size:22px}
.ccard p{font-size:16px;color:var(--dark-grey);margin:0}
.ccard.dark{background:var(--black)!important;color:var(--snow)}
.ccard.dark .ticks li{color:var(--platinum)}
.two-up{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ticks{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.ticks li{display:flex;gap:12px;font-size:16px;color:var(--dark-grey)}
.ticks li::before{content:"";width:8px;height:8px;margin-top:8px;background:var(--orange);flex:none}
@media (max-width:1000px){.cards4{grid-template-columns:1fr 1fr}.cards3{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.cards3,.cards4,.two-up{grid-template-columns:1fr}}

/* Europe map */
.emap{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(24px,4vw,48px);align-items:center}
.emap-grid{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);gap:6px;aspect-ratio:1;max-width:560px;width:100%}
.tile{appearance:none;border:0;border-radius:10px;font:500 13px var(--font);cursor:pointer;display:grid;place-items:center;min-height:36px;transition:transform .2s var(--ease),box-shadow .2s;position:relative}
.tile:hover,.tile[aria-pressed="true"]{transform:scale(1.12);z-index:2;box-shadow:0 0 0 3px var(--snow),0 8px 20px rgba(0,0,0,.35)}
.z-hub{background:var(--orange);color:var(--black)}
.z-a{background:rgba(255,91,46,.7);color:var(--black)}
.z-b{background:rgba(255,91,46,.42);color:var(--black)}
.z-c{background:var(--platinum);color:var(--black)}
.z-d{background:var(--grey);color:var(--black)}
.z-e{background:var(--dark-grey);color:var(--snow)}
.sec-dark .z-c,.g-reach .z-c{background:#E2E2E6}
.emap-info{background:rgba(245,245,247,.06);border:1px solid rgba(245,245,247,.16);border-radius:20px;padding:28px;color:var(--snow)}
.sec:not(.sec-dark) .emap-info{background:var(--white);border-color:var(--platinum);color:var(--black)}
.emap-zone{display:inline-block;font-size:13px;font-weight:500;padding:5px 12px;border-radius:999px;background:var(--orange);color:var(--black)}
.emap-info b{display:block;font-size:36px;font-weight:500;letter-spacing:-1.5px;margin-top:14px}
.emap-info dl{margin:18px 0 0;display:flex;flex-direction:column}
.emap-info dl div{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:12px 0;border-top:1px solid rgba(142,142,147,.35)}
.emap-info dt{font-size:14px;color:var(--grey)}
.emap-info dd{margin:0;font-size:16px}
.emap-legend{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13px;color:var(--grey)}
.emap-legend li{display:flex;align-items:center;gap:6px}
.emap-legend i{width:12px;height:12px;border-radius:3px}
.emap-note{margin-top:14px;font-size:13px;color:var(--grey)}
@media (max-width:900px){.emap{grid-template-columns:1fr}.tile{font-size:11px;border-radius:7px}}

/* hero video */
.g-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.35;filter:grayscale(.3)}

/* news */
.ngrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ncard{background:var(--white);border-radius:20px;padding:28px;display:flex;flex-direction:column;gap:12px;text-decoration:none;min-height:240px;transition:transform .35s var(--ease)}
.ncard:hover{transform:translateY(-4px)}
.ncard b{font-size:22px;font-weight:500;letter-spacing:-.5px;line-height:1.2}
.ncard span:not(.ntag){font-size:16px;color:var(--dark-grey)}
.ncard small{margin-top:auto;font-size:14px;color:var(--dark-grey)}
.ntag{align-self:flex-start;font-size:13px;font-weight:500;padding:4px 10px;border-radius:999px;background:var(--orange);color:var(--black)}
.article{padding:48px 0;border-top:1px solid var(--platinum)}
.article:first-child{border-top:0;padding-top:0}
.article h2{font-size:clamp(28px,3vw,40px)!important;letter-spacing:-1.5px!important;margin:12px 0 20px!important}
.article h3{font-size:20px;margin:24px 0 8px;color:var(--black)}
.ameta{display:flex;gap:12px;align-items:center;font-size:14px;color:var(--dark-grey)}
.draft{background:var(--snow);border-radius:10px;padding:10px 14px;font-size:14px!important}
@media (max-width:900px){.ngrid{grid-template-columns:1fr}}

/* careers */
.notice{background:var(--snow);border-radius:20px;padding:28px}
.notice h2{font-size:28px;letter-spacing:-1px}
.notice p{margin-top:8px;color:var(--dark-grey)}
.mail-form{background:var(--snow)}
.sec-white .mail-form{background:var(--snow)}
.mail-form .field input,.mail-form .field textarea{background:var(--white)}
.mail-form .chip{background:var(--white)}
.mail-form .chip[aria-pressed="true"]{background:var(--black);color:var(--snow)}

/* =========================================================
   v6.1: true brand orange on dark backgrounds
   Transparent orange over Black turns brown, so orange on
   dark surfaces is always solid #FF5B2E.
   ========================================================= */
.g-hero-glow{right:-20vw;bottom:-30vw;width:62vw;background:var(--orange);animation:orb 16s ease-in-out infinite alternate}
@keyframes orb{from{transform:translate(0,0)}to{transform:translate(-2vw,-1.5vw)}}
.g-hero-side{flex-direction:column;align-items:flex-start;justify-content:flex-start}
.g-div{background:var(--black);border-color:var(--dark-grey);backdrop-filter:none;-webkit-backdrop-filter:none}
.g-div:hover{background:var(--snow)}
@media (max-width:900px){.g-hero-glow{width:110vw;right:-50vw;bottom:-70vw}}
/* map zones: solid brand colours, told apart by lightness */
.z-hub{background:var(--orange);color:var(--black)}
.z-a{background:var(--snow);color:var(--black)}
.z-b{background:var(--platinum);color:var(--black)}
.z-c,.sec-dark .z-c,.g-reach .z-c{background:var(--grey);color:var(--black)}
.z-d{background:var(--dark-grey);color:var(--snow)}
.z-e{background:transparent;color:var(--snow);box-shadow:inset 0 0 0 1.5px var(--grey)}
.tile.z-e:hover,.tile.z-e[aria-pressed="true"]{box-shadow:inset 0 0 0 1.5px var(--grey),0 0 0 3px var(--snow),0 8px 20px rgba(0,0,0,.35)}

/* =========================================================
   v7 palette: Night, Graphite, Mist, Paper, Ember
   ========================================================= */
:root{
  --night:#0A0A0B; --graphite:#1D1D1F; --mist:#F5F5F7; --paper:#FFFFFF; --ember:#FF5B2E;
  --orange:var(--ember); --black:var(--night); --snow:var(--mist); --white:var(--paper);
  --dark-grey:#5E5E63;   /* secondary text, a Graphite tint */
  --grey:#8E8E93;        /* labels on dark, GROUP in the logo */
  --platinum:#E2E2E6;    /* hairlines and borders on Mist */
}
/* raised surfaces on dark sections use Graphite */
.g-div,.ccard.dark,.emap-info,.req-preview{background:var(--graphite)}
.g-div{border-color:#2C2C2F}
.g-div:hover{background:var(--paper)}
.sec:not(.sec-dark) .emap-info{background:var(--paper)}
.g-reach .routes,.routes{background:var(--graphite)}
.g-reach .routes{border-color:#2C2C2F}
.site-header.scrolled{background:rgba(245,245,247,.92)}

/* =========================================================
   Dot-matrix distribution map
   ========================================================= */
.emap.dot{grid-template-columns:1.6fr 1fr}
.dmap{position:relative;width:100%;border-radius:24px;overflow:hidden;background:radial-gradient(ellipse at 45% 55%,#1D1D1F 0%,#0A0A0B 75%);border:1px solid #2C2C2F}
.dm-svg{position:absolute;inset:0;width:100%;height:100%}
.dm-dots circle{fill:#2C2C2F}
.dm-dots circle.tw{fill:#5E5E63;animation:tw 6s ease-in-out infinite}
.dm-dots circle.near{fill:#FF5B2E;opacity:.55}
@keyframes tw{0%,100%{fill:#2C2C2F}45%{fill:#8E8E93}55%{fill:#F5F5F7}}
.dm-scan{animation:scan 7s linear infinite}
@keyframes scan{from{transform:translateX(0)}to{transform:translateX(1160px)}}
.arc{fill:none;stroke:#FF5B2E;stroke-width:1.4;stroke-linecap:round;stroke-dasharray:3 7;opacity:.75;animation:flow 1.6s linear infinite}
.arc.on{stroke-width:2.6;stroke-dasharray:none;opacity:1}
@keyframes flow{to{stroke-dashoffset:-20}}
.garc{fill:none;stroke:#8E8E93;stroke-width:1.2;stroke-dasharray:2 8;opacity:.6;animation:flow 2.4s linear infinite}
.pkt{fill:#F5F5F7}
.hq-ring{fill:none;stroke:#FF5B2E;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:ring 2.6s ease-out infinite}
.hq-ring.r2{animation-delay:1.3s}
@keyframes ring{from{transform:scale(1);opacity:.9}to{transform:scale(5);opacity:0}}
/* city markers */
.dmap .city{position:absolute;transform:translate(-50%,-50%);background:none!important;box-shadow:none!important;border:0;padding:6px;min-height:0;width:auto;border-radius:50%;cursor:pointer;display:block;z-index:2}
.dmap .city:hover,.dmap .city[aria-pressed="true"]{transform:translate(-50%,-50%);z-index:4}
.dmap .pin{display:block;width:9px;height:9px;border-radius:50%;background:#F5F5F7;box-shadow:0 0 0 3px rgba(245,245,247,.12);transition:transform .2s,background .2s}
.dmap .city:hover .pin,.dmap .city[aria-pressed="true"] .pin{background:#FF5B2E;transform:scale(1.5);box-shadow:0 0 0 4px rgba(255,91,46,.25)}
.dmap .lab{position:absolute;left:50%;bottom:calc(100% + 4px);transform:translateX(-50%);white-space:nowrap;font-size:12px;font-weight:500;color:#F5F5F7;background:#1D1D1F;border:1px solid #2C2C2F;padding:4px 8px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .2s}
.dmap .city:hover .lab,.dmap .city:focus-visible .lab,.dmap .city[aria-pressed="true"] .lab{opacity:1}
.dmap .city.hq .pin{width:16px;height:16px;background:#FF5B2E;box-shadow:0 0 0 5px rgba(255,91,46,.25)}
.dmap .city.hq .lab{opacity:1;display:flex;flex-direction:column;align-items:flex-start;gap:1px;background:#FF5B2E;border-color:#FF5B2E;color:#0A0A0B;font-weight:400;left:calc(100% + 6px);bottom:auto;top:50%;transform:translateY(-50%);padding:6px 10px}
.dmap .city.hq .lab b{font-weight:500;font-size:13px}
.dm-tag{position:absolute;right:16px;top:16px;font-size:12px;color:#8E8E93;border:1px dashed #5E5E63;border-radius:999px;padding:5px 10px}
.emap.dot .emap-info{align-self:stretch;display:flex;flex-direction:column;justify-content:center}
@media (max-width:900px){.emap.dot{grid-template-columns:1fr}.dmap .city .lab{font-size:11px}.dmap .city.hq .lab{padding:4px 8px}}
@media (prefers-reduced-motion:reduce){.dm-dots circle.tw,.dm-scan,.arc,.garc,.hq-ring{animation:none}.pkt{display:none}}
.emap.dot{grid-template-columns:1fr}
.emap.dot .dmap{max-width:none}
#delivery-map .dmap{max-width:860px;margin:0 auto}

/* map clarity: HQ label sits in the North Sea with a leader line, city pins step back */
.dmap .pin{width:7px;height:7px;background:rgba(245,245,247,.85);box-shadow:none}
.dmap .city:hover .pin,.dmap .city[aria-pressed="true"] .pin{transform:scale(1.6)}
.dmap .city.hq{z-index:5}
.dmap .city.hq .pin{width:14px;height:14px;background:#FF5B2E;box-shadow:0 0 0 4px #0A0A0B,0 0 0 6px #FF5B2E}
.dmap .city.hq::before{content:"";position:absolute;right:50%;bottom:50%;width:44px;height:38px;pointer-events:none;
  background:linear-gradient(to top right,transparent calc(50% - 1px),#FF5B2E calc(50% - 1px),#FF5B2E calc(50% + 1px),transparent calc(50% + 1px))}
.dmap .city.hq .lab{left:auto;top:auto;right:calc(50% + 44px);bottom:calc(50% + 38px);transform:none;box-shadow:0 10px 30px -10px rgba(0,0,0,.6)}
.dmap .city:not(.hq):hover,.dmap .city:not(.hq):focus-visible{z-index:6}
.arc{opacity:.5}
.arc.on{opacity:1}
.dm-dots circle.near{opacity:.35}

/* Global reach: dot map as the full section background */
.g-reach{position:relative;overflow:hidden;isolation:isolate;min-height:clamp(760px,62vw,980px);display:flex;align-items:center;background:var(--night)}
.g-reach-bg{position:absolute;inset:0;z-index:0;display:block}
.g-reach-bg .dmap{position:absolute;top:50%;right:-4%;height:118%;width:auto;max-width:none;transform:translateY(-50%);border:0;border-radius:0;background:transparent}
.g-reach::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,#0A0A0B 0%,#0A0A0B 22%,rgba(10,10,11,.75) 38%,rgba(10,10,11,0) 58%),linear-gradient(0deg,#0A0A0B 0%,rgba(10,10,11,0) 18%),linear-gradient(180deg,#0A0A0B 0%,rgba(10,10,11,0) 14%)}
.g-reach-grid{position:relative;z-index:2;grid-template-columns:minmax(0,520px)!important;pointer-events:none}
.g-reach-grid>*{pointer-events:auto}
.g-reach .dm-tag{display:none}
@media (max-width:900px){
  .g-reach{display:block;min-height:0;padding-bottom:0}
  .g-reach::after{display:none}
  .g-reach-bg{position:relative;inset:auto;order:2;margin-top:40px}
  .g-reach-bg .dmap{position:relative;top:auto;right:auto;height:auto;width:100%;transform:none}
  .g-reach{display:flex;flex-direction:column-reverse}
}

/* Global reach: text pinned left on solid black, fading left to right into the map */
.g-reach>.wrap{width:100%}
.g-reach-grid{justify-content:start}
.g-reach::after{background:
  linear-gradient(90deg,#0A0A0B 0%,#0A0A0B 34%,rgba(10,10,11,.92) 42%,rgba(10,10,11,.6) 52%,rgba(10,10,11,.25) 62%,rgba(10,10,11,0) 72%),
  linear-gradient(0deg,#0A0A0B 0%,rgba(10,10,11,0) 16%),
  linear-gradient(180deg,#0A0A0B 0%,rgba(10,10,11,0) 12%)}
.g-reach-bg .dmap{right:-8%}

/* Global reach: text and map side by side, no overlap */
.g-reach-grid{grid-template-columns:minmax(0,min(520px,40vw))!important}
.g-reach-bg .dmap{left:calc(50% - 20px);right:auto;height:auto;width:52vw;transform:translateY(-50%)}
.g-reach::after{background:
  linear-gradient(90deg,#0A0A0B 0%,#0A0A0B 46%,rgba(10,10,11,.5) 52%,rgba(10,10,11,0) 60%),
  linear-gradient(0deg,#0A0A0B 0%,rgba(10,10,11,0) 14%),
  linear-gradient(180deg,#0A0A0B 0%,rgba(10,10,11,0) 10%)}
.g-reach{min-height:calc(52vw * 882 / 1000 + 80px)}
@media (max-width:900px){.g-reach-grid{grid-template-columns:1fr!important}.g-reach-bg .dmap{left:auto;width:100%}.g-reach{min-height:0}}
/* HQ callout straight above, over the North Sea, clear of the text column */
.dmap .city.hq::before{right:auto;left:50%;bottom:50%;width:2px;height:40px;margin-left:-1px;background:#FF5B2E}
.dmap .city.hq .lab{right:auto;left:50%;bottom:calc(50% + 40px);transform:translateX(-50%)}

/* Services mega menu: two columns */
.sub{width:640px;display:grid;grid-template-columns:1fr 1fr;gap:4px 8px;padding:12px}
.sub-col{list-style:none}
.sub-col ul{list-style:none;margin:0;padding:0}
.sub-h{display:block;font-size:12px;font-weight:500;letter-spacing:.04em;color:var(--dark-grey);padding:8px 14px 4px}
@media (max-width:900px){.sub{width:auto;display:none;grid-template-columns:1fr}.has-sub.open .sub{display:grid}}

/* =========================================================
   Footer: five columns + full-width legal bar
   ========================================================= */
.site-footer.ft{border-top:0;padding:0;background:var(--paper);color:var(--night)}
.site-footer.ft::before{display:none}
.ft-cols{display:grid!important;grid-template-columns:repeat(4,1fr) 1.2fr;gap:32px;padding-top:56px!important;padding-bottom:48px!important;align-items:start}
.ft h4{margin:0 0 18px;font-size:18px;font-weight:500;letter-spacing:-.2px;color:var(--night)}
.ft ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.ft a{color:var(--night);text-decoration:none;font-size:16px}
.ft a:hover{color:var(--ember);text-decoration:underline;text-underline-offset:3px}
.ft-social{display:inline-flex;align-items:center;gap:10px}
.ft-social svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ft-contact p{margin:0 0 10px;font-size:16px}
.ft-name{font-weight:500}
.ft-mail{text-decoration:underline!important;text-underline-offset:3px}
.ft-bar{background:var(--night);color:var(--mist)}
.ft-bar-in{display:flex!important;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:22px!important;padding-bottom:22px!important}
.ft-legal{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;font-size:14px;color:#C7C7CC}
.ft-legal b{color:var(--mist);font-weight:500}
.ft-legal>*+*::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--ember);margin:0 12px;vertical-align:middle}
.ft-lang{margin:0;display:flex;align-items:center;gap:16px;font-size:14px}
.ft-lang b{font-weight:500}
.ft-lang .lang-change{display:inline-flex;align-items:center;min-height:36px;padding:0 18px;border-radius:999px;background:var(--mist);color:var(--night);font-size:14px;text-decoration:none}
.ft-lang .lang-change:hover{background:var(--ember);color:var(--night);text-decoration:none}
@media (max-width:1000px){.ft-cols{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:620px){.ft-cols{grid-template-columns:1fr 1fr}.ft-contact{grid-column:1/-1}}
/* footer columns: align every column to the top */
.site-footer.ft .ft-cols{align-items:start!important;justify-content:stretch}
.site-footer.ft .ft-cols>div{align-self:start}
.ft h4{line-height:1.2}
.ft-contact p:first-of-type{margin-top:0}

/* Header: the logo always sits on a clean surface.
   Inner pages: solid Paper bar above the orange gradient. Home: Night until scrolled. */
body:not(.dark-top) .site-header{background:rgba(255,255,255,.97);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--platinum)}
.dark-top .site-header:not(.scrolled){background:var(--night)}
.dark-top .site-header:not(.scrolled) .lockup .l2{color:#8E8E93}
.site-header .lockup{font-size:24px}
.page-hero{padding-top:clamp(140px,15vw,184px)}
/* contact: form only, no summary panel */
.req.req-single{grid-template-columns:1fr;max-width:960px}
.req-submit{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:32px;padding-top:24px;border-top:1px solid var(--platinum)}
.req-submit p{margin:0;max-width:34em}

/* Netherlands dot map (contact + logistics) */
.map-frame.nm-frame{background:var(--night);min-height:420px;position:relative}
.nmap{position:absolute;inset:0;overflow:hidden}
.nm-svg{position:absolute;inset:0;width:100%;height:100%}
.nm-dots .nb{fill:#1D1D1F}
.nm-dots .nl{fill:#3A3A3E}
.nm-route{fill:none;stroke:#FF5B2E;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:4 8;animation:flow 1.4s linear infinite}
.nm-pin{position:absolute;transform:translate(-50%,-50%);text-decoration:none;z-index:2}
.nm-pin .dot{display:block;width:12px;height:12px;border-radius:50%;background:#F5F5F7;box-shadow:0 0 0 4px #0A0A0B,0 0 0 5.5px #F5F5F7}
.nm-pin.office .dot{width:16px;height:16px;background:#FF5B2E;box-shadow:0 0 0 4px #0A0A0B,0 0 0 6px #FF5B2E}
.nm-pin .lab{position:absolute;white-space:nowrap;display:flex;flex-direction:column;gap:1px;padding:7px 11px;border-radius:8px;font-size:12px;line-height:1.3;background:#1D1D1F;color:#C7C7CC;border:1px solid #2C2C2F;transition:transform .2s}
.nm-pin .lab b{font-size:14px;font-weight:500;color:#F5F5F7}
.nm-pin.office .lab{right:calc(100% + 14px);top:50%;transform:translateY(-50%)}
.nm-pin.warehouse .lab{left:calc(100% + 14px);top:50%;transform:translateY(-50%)}
.nm-pin.on .lab{background:#FF5B2E;border-color:#FF5B2E;color:#0A0A0B}
.nm-pin.on .lab b{color:#0A0A0B}
.nm-pin:hover .lab{text-decoration:underline;text-underline-offset:3px}
.nm-scale{position:absolute;left:16px;bottom:14px;font-size:12px;color:#8E8E93}
@media (prefers-reduced-motion:reduce){.nm-route{animation:none}}
/* NL map: keep the whole country visible and labels inside the frame */
.map-frame.nm-frame{display:flex;align-items:center;justify-content:center;padding:24px;min-height:0}
.nmap{position:relative;inset:auto;width:100%;max-width:520px;max-height:100%}
.nm-pin.office .lab{right:auto;left:50%;top:calc(100% + 14px);transform:translateX(-50%)}
.nm-pin.warehouse .lab{left:calc(100% + 12px);top:auto;bottom:calc(100% - 4px);transform:none}
.nm-scale{left:0;bottom:-4px}

/* =========================================================
   HERO D: dot-matrix Europe behind the headline
   ========================================================= */
.g-hero-d{min-height:clamp(640px,92vh,900px);display:flex;align-items:center;padding:clamp(120px,12vw,160px) 0 clamp(64px,7vw,96px)}
.g-hero-d>.wrap{width:100%}
.g-hero-map{position:absolute;z-index:-2;top:50%;right:-6%;height:118%;transform:translateY(-50%)}
.g-hero-map svg{display:block;width:100%;height:100%}
.g-hero-map .dm-dots circle{fill:#18181A}
.g-hero-map .dm-dots circle.tw{animation:twHero 7s ease-in-out infinite}
.g-hero-map .dm-dots circle.near{fill:#FF5B2E;opacity:.4}
@keyframes twHero{0%,100%{fill:#18181A}50%{fill:#5E5E63}}
.g-hero-map .arc{opacity:.45}
.g-hero-map .garc{opacity:.35}
.g-hero-d::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,#0A0A0B 0%,#0A0A0B 28%,rgba(10,10,11,.85) 40%,rgba(10,10,11,.35) 56%,rgba(10,10,11,0) 70%),linear-gradient(0deg,#0A0A0B 0%,rgba(10,10,11,0) 22%)}
.g-hero-d .g-hero-inner{max-width:760px;margin-left:0}
.g-hero-d .g-h1{font-size:clamp(52px,7.6vw,120px)}
.g-hero-d .g-lede{max-width:32em}
.g-chips{list-style:none;margin:48px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;opacity:0;animation:fade .9s var(--ease) .9s forwards}
.g-chips li{font-size:14px;color:var(--mist);background:#1D1D1F;border:1px solid #2C2C2F;border-radius:999px;padding:8px 14px}
.g-chips li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ember);margin-right:8px;vertical-align:middle}
@media (max-width:900px){
  .g-hero-map{right:-40%;height:90%;opacity:.7}
  .g-hero-d::after{background:linear-gradient(90deg,#0A0A0B 0%,rgba(10,10,11,.7) 60%,rgba(10,10,11,.3) 100%)}
}
@media (prefers-reduced-motion:reduce){.g-chips{opacity:1;animation:none}}

/* rotating word in the hero */
.g-h1 .rot,.g-h1 .rot .w,.g-h1 .biz,.g-h1 .sr{animation:none!important}
.g-h1 .rot{display:inline-block;position:relative;vertical-align:bottom;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em;transition:width .55s var(--ease);transform:none!important}
.g-h1 .rot .w{position:absolute;left:0;top:0;white-space:nowrap;color:var(--ember)!important;transform:translateY(105%)!important;opacity:0;transition:transform .55s var(--ease),opacity .4s}
.g-h1 .rot .w.on{position:relative;transform:none!important;opacity:1}
.g-h1 .rot .w.out{transform:translateY(-105%)!important;opacity:0}
.g-h1 .biz{color:var(--mist)!important;transform:none!important}
.g-h1 .rot::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.06em;background:var(--ember);opacity:.9}

/* =========================================================
   HERO background: isometric grid (warehouse / data centre)
   ========================================================= */
.g-hero-iso{position:absolute;z-index:-2;top:50%;right:-4%;width:min(64vw,980px);aspect-ratio:760/520;transform:translateY(-46%)}
.g-hero-iso svg{display:block;width:100%;height:100%}
.iso .fl{fill:transparent;stroke:#1D1D1F;stroke-width:1}
.iso .fl.glow{animation:isoGlow 8s ease-in-out infinite}
@keyframes isoGlow{0%,78%,100%{fill:transparent}86%{fill:rgba(255,91,46,.28)}}
.iso .cube .top{fill:#1D1D1F;stroke:#2C2C2F;stroke-width:1}
.iso .cube .lf{fill:#121214;stroke:#1D1D1F;stroke-width:1}
.iso .cube .rf{fill:#0E0E10;stroke:#1D1D1F;stroke-width:1}
.iso .cube .top.lit{animation:isoLit 6s ease-in-out infinite}
@keyframes isoLit{0%,60%,100%{fill:#1D1D1F}70%,85%{fill:#FF5B2E}}
.iso .lane{stroke:rgba(255,91,46,.18);stroke-width:1;stroke-dasharray:3 6}
.iso .pk{fill:#FF5B2E}
.g-hero-d::after{background:linear-gradient(90deg,#0A0A0B 0%,#0A0A0B 30%,rgba(10,10,11,.8) 42%,rgba(10,10,11,.3) 56%,rgba(10,10,11,0) 68%),linear-gradient(0deg,#0A0A0B 0%,rgba(10,10,11,0) 20%),linear-gradient(180deg,#0A0A0B 0%,rgba(10,10,11,0) 18%)}
@media (max-width:900px){.g-hero-iso{width:130vw;right:-55%;opacity:.6}}
@media (prefers-reduced-motion:reduce){.iso .fl.glow,.iso .cube .top.lit{animation:none}.iso .pk{display:none}}

/* =========================================================
   Client and partner logos
   ========================================================= */
.g-logos{background:var(--paper);padding:clamp(56px,7vw,88px) 0;border-top:1px solid var(--platinum)}
.g-logos-h{font-size:16px;font-weight:500;letter-spacing:0;color:var(--dark-grey);text-align:center;margin:0 0 28px}
.logo-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.logo-track{list-style:none;margin:0;padding:0;display:flex;gap:16px;width:max-content;animation:tick 45s linear infinite}
.logo-marquee:hover .logo-track{animation-play-state:paused}
.logo-slot{width:180px;height:84px;flex:none;border-radius:14px;border:1.5px dashed var(--platinum);background:var(--mist);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--grey);font-size:13px}
.logo-slot img{max-width:70%;max-height:44px;filter:grayscale(1);opacity:.7;transition:filter .3s,opacity .3s}
.logo-slot:hover img{filter:none;opacity:1}
.partners{margin-top:56px;display:grid;grid-template-columns:minmax(220px,.8fr) 2fr;gap:32px;align-items:center}
.partners-head h3{font-size:24px}
.partners-head p{margin-top:8px;font-size:16px}
.partner-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.logo-slot.partner{width:auto;height:96px}
.logo-slot.partner small{font-size:11px;color:var(--grey)}
@media (max-width:860px){.partners{grid-template-columns:1fr}.partner-grid{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){.logo-track{animation:none;flex-wrap:wrap;width:auto}}

/* =========================================================
   Brands we supply: large text marquee
   ========================================================= */
.g-brands{background:var(--paper);padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--platinum);overflow:hidden}
.g-brands-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px 32px;margin-bottom:40px}
.g-brands-head h2{font-size:clamp(32px,4vw,48px);letter-spacing:-.04em;line-height:1}
.g-brands-head p{margin:0;max-width:30em}
.brand-rows{display:flex;flex-direction:column;gap:14px}
.brand-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.brand-track{list-style:none;margin:0;padding:0;display:flex;gap:14px;width:max-content;animation:tick 50s linear infinite}
.brand-marquee.rev .brand-track{animation-direction:reverse;animation-duration:58s}
.brand-marquee:hover .brand-track{animation-play-state:paused}
.brand-track li{flex:none;display:flex;align-items:center;height:88px;padding:0 36px;border-radius:16px;background:var(--mist);font-size:clamp(26px,3vw,40px);font-weight:500;letter-spacing:-.04em;color:var(--night);transition:background .3s,color .3s}
.brand-track li:hover{background:var(--night);color:var(--mist)}
.brand-note{margin-top:24px;font-size:12px;color:var(--grey)}
@media (prefers-reduced-motion:reduce){.brand-track{animation:none;flex-wrap:wrap;width:auto;padding:0 20px}}
.brand-marquee.slow .brand-track{animation-duration:64s}
.brand-marquee.rev.slow .brand-track{animation-direction:reverse;animation-duration:70s}
.brand-track li{height:76px;padding:0 30px;font-size:clamp(22px,2.6vw,34px)}
.brand-marquee.rev .brand-track{animation-duration:80s}.brand-marquee.slow .brand-track{animation-duration:68s}

/* headings: keep descenders (g, p, y, j) fully visible inside the line-reveal masks */
.page-hero h1 .line,.g-h1 .line,.hero h1 .line{padding-bottom:.22em;margin-bottom:-.16em}
.g-h1 .rot{padding-bottom:.22em;margin-bottom:-.22em}
.g-h1 .rot::after{bottom:.16em}

/* =========================================================
   Who we work with: interactive selector
   ========================================================= */
.g-serve::before,.g-serve::after{display:none}
.aud{display:grid;grid-template-columns:minmax(260px,.9fr) 1.3fr;gap:16px;align-items:stretch}
.aud-list{display:flex;flex-direction:column;gap:4px}
.aud-tab{appearance:none;border:0;background:transparent;text-align:left;cursor:pointer;display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:12px;font:500 clamp(18px,1.7vw,22px)/1.2 var(--font);letter-spacing:-.4px;color:var(--grey);position:relative;transition:background .25s,color .25s}
.aud-tab .aud-n{font-size:13px;font-weight:400;color:var(--grey);min-width:22px}
.aud-tab:hover{color:var(--night)}
.aud-tab[aria-selected="true"]{background:var(--mist);color:var(--night)}
.aud-tab[aria-selected="true"]::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:2px;background:var(--ember)}
.aud-tab[aria-selected="true"] .aud-n{color:var(--ember)}
.aud-panels{position:relative;background:var(--night);color:var(--mist);border-radius:24px;padding:clamp(28px,4vw,48px);min-height:380px;display:flex;overflow:hidden}
.aud-panels::after{content:"";position:absolute;right:-90px;bottom:-90px;width:240px;height:240px;border-radius:50%;background:var(--ember);opacity:.95}
.aud-panel{position:relative;z-index:1;display:flex;flex-direction:column;gap:20px;animation:audIn .45s var(--ease)}
.aud-panel[hidden]{display:none}
@keyframes audIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.aud-count{font-size:13px;color:var(--grey)}
.aud-panel h3{font-size:clamp(30px,3.4vw,46px);line-height:1.02;letter-spacing:-.04em;max-width:12em}
.aud-panel ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.aud-panel li{display:flex;gap:12px;font-size:17px;color:#C7C7CC}
.aud-panel li::before{content:"";width:8px;height:8px;margin-top:8px;background:var(--ember);flex:none}
.aud-panel .btn{align-self:flex-start;margin-top:auto}
@media (max-width:860px){
  .aud{grid-template-columns:1fr}
  .aud-list{flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:6px}
  .aud-tab{white-space:nowrap;padding:12px 16px;font-size:16px}
  .aud-tab .aud-n{display:none}
  .aud-tab[aria-selected="true"]::before{left:14px;right:14px;top:auto;bottom:6px;width:auto;height:2px}
  .aud-panels{min-height:0}
}
@media (prefers-reduced-motion:reduce){.aud-panel{animation:none}}

/* Story: 2022 in dot matrix on black */
.g-story-dot{background:var(--night);color:var(--mist)}
.g-story-dot .g-story-grid{grid-template-columns:1.1fr 1fr;align-items:center}
.g-story-vis{position:relative}
.story-dots{width:100%;height:auto;display:block}
.story-dots circle{fill:#1D1D1F}
.story-dots circle.lit{fill:#FF5B2E;opacity:0;transform:scale(.3);transform-box:fill-box;transform-origin:center;transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1.4);transition-delay:var(--d)}
.g-story-dot.seen .story-dots circle.lit{opacity:1;transform:none}
.g-story-cap{display:block;margin-top:18px;font-size:14px;color:var(--grey)}
.g-story-dot h2{font-size:clamp(34px,4vw,52px);letter-spacing:-.04em;line-height:1;color:var(--mist)}
.g-story-dot p{margin-top:20px;max-width:32em;color:#C7C7CC}
@media (max-width:820px){.g-story-dot .g-story-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.story-dots circle.lit{opacity:1;transform:none;transition:none}}

/* Story: giant typographic statement */
.g-story-big{background:var(--paper);padding:clamp(96px,12vw,168px) 0}
.big-statement{font-size:clamp(64px,11vw,176px);font-weight:500;line-height:.9;letter-spacing:-.055em;margin:0;color:var(--night)}
.big-statement span{display:block}
.big-statement em{font-style:normal;color:var(--ember);position:relative;display:inline-block}
.big-statement em::after{content:"";position:absolute;left:0;right:0;bottom:-.02em;height:.07em;background:var(--ember);transform:scaleX(0);transform-origin:left;transition:transform 1s cubic-bezier(.2,.7,.1,1) .2s}
.g-story-big.seen .big-statement em::after{transform:scaleX(1)}
.bs-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px 48px;margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:1px solid var(--platinum)}
.bs-foot p{margin:0;max-width:40em;color:var(--dark-grey);font-size:18px}
.bs-foot .btn{min-height:56px;font-size:16px;padding:0 28px}
@media (prefers-reduced-motion:reduce){.big-statement em::after{transform:none;transition:none}}

/* Story: big gradient 2022 on black */
.g-story-dark{background:var(--night);color:var(--mist)}
.g-story-dark .g-story-year{background:linear-gradient(180deg,#FF5B2E 0%,#FF8B6A 55%,#FFD6C8 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.g-story-dark h2{font-size:clamp(34px,4vw,52px);letter-spacing:-.04em;line-height:1;color:var(--mist)}
.g-story-dark p{margin-top:20px;max-width:32em;color:#C7C7CC}
/* story year: solid Ember, no gradient */
.g-story-dark .g-story-year{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--ember)}

/* audience card: mini isometric scene instead of the circle */
.aud-panels::after{display:none}
.aud-panel{position:static}
.aud-panel>*:not(.aud-scene){position:relative;z-index:1}
.aud-scene{position:absolute;right:clamp(8px,2vw,28px);bottom:clamp(8px,2vw,24px);width:clamp(180px,22vw,280px);height:auto;pointer-events:none;animation:audIn .6s var(--ease)}
.aud-scene .fl{fill:transparent;stroke:#2C2C2F;stroke-width:1}
.aud-scene .cube .top.lit{animation:isoLit 4s ease-in-out infinite}
@media (max-width:860px){.aud-scene{width:150px;opacity:.6}}
@media (min-width:861px){.aud-panel h3,.aud-panel ul{max-width:calc(100% - 210px)}}

/* audience card: one fixed size for all six (sized to the tallest) */
.aud-panels{display:grid}
.aud-panel{grid-area:1/1;display:flex}
.aud-panel[hidden]{display:flex!important;visibility:hidden;opacity:0;pointer-events:none;animation:none}
.aud-panel[hidden] .aud-scene{animation:none}
.aud-panel h3{min-height:2.04em}

/* =========================================================
   MOBILE FIXES
   ========================================================= */
@media (max-width:900px){
  /* menu: scrollable panel, compact service links */
  .nav-links{max-height:calc(100vh - 76px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .nav-links .sub a{display:flex!important;flex-direction:column;padding:10px 12px!important}
  .nav-links .sub a span{display:none}
  .nav-links .sub a b{font-size:16px}
  .sub{padding:0 0 8px!important;background:transparent!important}
  .sub-h{padding:10px 12px 2px}

  /* hero: smaller headline, isometric scene visible below the text */
  .g-hero-d{min-height:0;padding:120px 0 280px;align-items:flex-start}
  .g-hero-d .g-h1{font-size:clamp(40px,11vw,56px)}
  .g-hero-iso{top:auto!important;bottom:-60px;right:-35vw!important;width:150vw!important;transform:none!important;opacity:1!important}
  .g-hero-d::after{background:linear-gradient(180deg,#0A0A0B 0%,#0A0A0B 52%,rgba(10,10,11,.35) 72%,rgba(10,10,11,0) 88%)!important}

  /* global reach: map below the text, full width */
  .g-reach{display:block!important;padding-bottom:56px}
  .g-reach::after{display:none}
  .g-reach-bg{position:relative!important;inset:auto!important;margin-top:8px}
  .g-reach-bg .dmap{position:relative!important;top:auto!important;left:auto!important;right:auto!important;transform:none!important;width:100%!important;height:auto!important}
  .g-reach-grid{grid-template-columns:1fr!important}

  /* about: big logo fits the screen */
  .big-lockup{font-size:72px;padding:32px 36px;justify-self:start}

  /* sections with gradient blocks behind glass cards: keep it calm */
  .glass-zone::before{width:100%!important;right:0!important;height:40%!important;opacity:.6}

  /* maps: smaller labels */
  .nm-pin .lab{font-size:11px;padding:5px 8px}
  .nm-pin .lab b{font-size:12px}
  .nm-pin.office .lab{left:0;transform:translateX(-20%)}

  /* footer bar: stacked, no separator dots */
  .ft-legal{flex-direction:column;align-items:flex-start;gap:2px}
  .ft-legal>*+*::before{display:none}
  .ft-bar-in{flex-direction:column;align-items:flex-start}

  /* cards and forms */
  .channel{min-height:0}
  .channels{gap:10px}
  .page-hero h1{font-size:clamp(40px,11vw,60px)}
}
@media (max-width:420px){
  .cta-card{padding:32px 24px!important}
  .cta-card h2{font-size:34px!important;letter-spacing:-1.5px!important}
  .brand-track li{height:60px;padding:0 20px;font-size:22px}
  .aud-panel h3{font-size:28px}
}

/* lazy-loaded maps */
.lazy-svg.dm-svg,.lazy-svg.nm-svg{position:absolute;inset:0}

/* readability: small orange text on light backgrounds becomes Night */
.g-acc details[open] .g-acc-n{color:var(--night);font-weight:600}
.aud-tab[aria-selected="true"] .aud-n{color:var(--night);font-weight:600}
.ft a:hover{color:var(--night);text-decoration-color:var(--ember);text-decoration-thickness:2px}
.sec:not(.sec-dark) .ccard svg,.promise svg{stroke:var(--ember)}

/* print */
@media print{
  .site-header,.menu-btn,.g-hero-iso,.g-hero-map,.lazy-svg,.dmap,.nmap,.brand-marquee,.cta-band,.ft-bar .lang-change{display:none!important}
  body{background:#fff;color:#000}
  .g-hero,.g-reach,.sec-dark,.name,.g-story-dark{background:#fff!important;color:#000!important}
  .g-hero *,.g-reach *,.sec-dark *{color:#000!important}
  a{color:#000;text-decoration:underline}
  section{padding:24px 0!important;break-inside:avoid}
}

/* =========================================================
   Shop: nav link and home band
   ========================================================= */
.nav-shop{display:inline-flex!important;align-items:center;gap:5px}
.nav-shop svg{color:var(--ember)}
.g-shop{background:var(--night);color:var(--mist);padding:clamp(80px,10vw,128px) 0;overflow:hidden}
.g-shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,88px);align-items:center}
.g-shop-tag{display:inline-block;font-size:13px;font-weight:500;padding:6px 12px;border-radius:999px;background:var(--ember);color:var(--night)}
.g-shop h2{margin-top:20px;font-size:clamp(36px,4.4vw,56px);letter-spacing:-.04em;line-height:1}
.g-shop h2 span{color:var(--ember)}
.g-shop p{margin-top:18px;color:#C7C7CC;max-width:32em}
.g-shop-list{list-style:none;margin:24px 0 32px;padding:0;display:flex;flex-direction:column;gap:12px}
.g-shop-list li{display:flex;gap:12px;align-items:center;font-size:17px}
.g-shop-list li::before{content:"";width:8px;height:8px;background:var(--ember);flex:none}
.g-shop-ctas{display:flex;flex-wrap:wrap;gap:12px}
.g-shop-win{background:var(--graphite);border:1px solid #2C2C2F;border-radius:18px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(255,91,46,.35)}
.g-shop-bar{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid #2C2C2F;font-size:12px;color:var(--grey)}
.g-shop-bar i{width:9px;height:9px;border-radius:50%;background:#3A3A3E}
.g-shop-bar span{margin-left:10px;background:var(--night);border-radius:999px;padding:4px 12px}
.g-shop-rows{padding:8px 16px}
.g-shop-row{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid #2C2C2F;font-size:14px}
.g-shop-row b{font-weight:500;color:var(--mist)}
.g-shop-row span{color:var(--grey);font-size:13px}
.g-shop-row em{font-style:normal;font-weight:600;color:var(--mist)}
.g-shop-cart{display:flex;align-items:center;gap:12px;justify-content:flex-end;padding:14px 16px;font-size:13px;color:var(--grey)}
.g-shop-cart b{color:var(--mist);font-weight:500}
.g-shop-go{background:var(--ember);color:var(--night)!important;font-weight:600;padding:9px 14px;border-radius:8px}
@media (max-width:900px){.g-shop-grid{grid-template-columns:1fr}}
.g-shop-brand{display:inline-flex;align-items:center;gap:10px;color:var(--mist)}
.g-shop-brand b{font-size:30px;font-weight:600;letter-spacing:-.05em;line-height:1}
.g-shop-brand small{font-size:13px;color:var(--grey);border-left:1px solid #2C2C2F;padding-left:10px}
.nav-shop svg{color:currentColor}

/* newsletter sign-up */
.ft-news{padding-bottom:40px!important}
.nl-form{background:var(--mist);border-radius:16px;padding:22px 24px;display:grid;grid-template-columns:minmax(200px,1fr) minmax(260px,1.4fr);gap:6px 28px;align-items:center}
.nl-h{font-size:18px;font-weight:500;color:var(--night)}
.nl-p{margin:0;font-size:14px;color:var(--dark-grey);grid-column:1}
.nl-row{display:flex;gap:8px;grid-column:2;grid-row:1/3}
.nl-row input{flex:1;min-height:46px;border-radius:9px;border:1.5px solid var(--platinum);background:var(--paper);padding:0 12px;font:inherit;font-size:15px}
.nl-row input:focus{outline:none;border-color:var(--night)}
.nl-c{grid-column:1/-1;display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--dark-grey);margin-top:8px}
.nl-c input{margin-top:2px;accent-color:var(--night)}
.nl-msg{grid-column:1/-1;margin:0;font-size:13px;color:var(--night)}
@media (max-width:760px){.nl-form{grid-template-columns:1fr}.nl-row{grid-column:1;grid-row:auto}}
.news-sub-card{background:var(--night);color:var(--mist);border-radius:24px;padding:clamp(28px,4vw,48px);display:grid;grid-template-columns:1fr 1.2fr;gap:32px;align-items:center}
.news-sub-card h2{font-size:clamp(28px,3.4vw,40px);letter-spacing:-.03em;line-height:1.05}
.news-sub-card .muted{color:#C7C7CC!important;margin-top:10px}
@media (max-width:860px){.news-sub-card{grid-template-columns:1fr}}

/* today's deals strip */
.g-deals{background:var(--mist);padding:clamp(64px,8vw,104px) 0;border-top:1px solid var(--platinum)}
.g-deals-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:28px}
.g-deals-head h2{font-size:clamp(32px,4vw,48px);letter-spacing:-.04em;line-height:1;margin-top:10px}
.g-live{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:500;color:var(--dark-grey)}
.g-live i{width:8px;height:8px;border-radius:50%;background:var(--ember);box-shadow:0 0 0 4px rgba(255,91,46,.2);animation:livePulse 1.8s ease-in-out infinite}
@keyframes livePulse{50%{box-shadow:0 0 0 8px rgba(255,91,46,0)}}
.g-deals-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.g-deals-list a{background:var(--paper);border-radius:18px;padding:22px;display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--night);min-height:200px;transition:transform .3s var(--ease),box-shadow .3s}
.g-deals-list a:hover{transform:translateY(-4px);box-shadow:0 20px 40px -24px rgba(10,10,11,.3)}
.g-deal-cat{align-self:flex-start;font-size:12px;font-weight:500;padding:4px 10px;border-radius:999px;background:var(--night);color:var(--mist);margin-bottom:10px}
.g-deal-br{font-size:13px;color:var(--grey)}
.g-deals-list b{font-size:20px;font-weight:500;letter-spacing:-.4px;line-height:1.2}
.g-deal-st{display:flex;align-items:center;gap:6px;font-size:13px;margin-top:auto}.g-deal-st i{width:8px;height:8px;border-radius:50%;background:#1F7A3A}
.g-deal-pr{font-size:14px;font-weight:600;color:var(--night);text-decoration:underline;text-decoration-color:var(--ember);text-underline-offset:4px}
.g-deals-note{margin-top:16px;font-size:13px;color:var(--dark-grey)}
@media (max-width:1000px){.g-deals-list{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.g-deals-list{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.g-live i{animation:none}}
.ft-legal a{color:#C7C7CC;text-decoration:underline;text-underline-offset:3px}
.ft-legal a:hover{color:var(--mist)}

/* Kubus section: laptop and phone mockup */
.kb-devices{position:relative;padding:0 0 40px 0}
.kb-laptop{position:relative;width:100%;max-width:560px}
.kb-screen{background:#2C2C30;border-radius:16px 16px 0 0;padding:12px 12px 0;box-shadow:0 40px 80px -40px rgba(255,91,46,.45)}
.kb-ui{background:var(--mist);border-radius:6px 6px 0 0;overflow:hidden;color:var(--night);font-size:11px;aspect-ratio:16/10;display:flex;flex-direction:column}
.kb-top{display:flex;align-items:center;gap:10px;background:var(--paper);padding:10px 12px;border-bottom:1px solid var(--platinum)}
.kb-logo{display:inline-flex;align-items:center;gap:5px}.kb-logo b{font-size:15px;font-weight:600;letter-spacing:-.05em}
.kb-search{flex:1;background:var(--mist);border:1px solid var(--platinum);border-radius:6px;padding:5px 8px;color:var(--grey);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kb-cart{background:var(--night);color:var(--mist);border-radius:6px;padding:5px 8px;font-size:10px;font-weight:500;white-space:nowrap}.kb-cart i{font-style:normal;background:var(--ember);color:var(--night);border-radius:999px;padding:0 5px;margin-left:3px}
.kb-cats{display:flex;gap:12px;background:var(--paper);padding:0 12px;border-bottom:1px solid var(--platinum);font-size:10px;color:var(--dark-grey)}
.kb-cats span{padding:6px 0;border-bottom:2px solid transparent}.kb-cats .on{color:var(--night);font-weight:600;border-color:var(--ember)}.kb-cats .deal{color:#C2410C;font-weight:600}
.kb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:10px 12px;flex:1}
.kb-card{background:var(--paper);border-radius:8px;padding:8px;display:flex;flex-direction:column;gap:2px}
.kb-img{background:linear-gradient(160deg,#FAFAFB,#ECECEF);border-radius:6px;height:58px;display:grid;place-items:center;margin-bottom:4px}.kb-img svg{width:80%;height:auto}
.kb-card small,.kb-devices small{font-size:9px;color:var(--grey)}.kb-card b{font-size:11px;font-weight:600;line-height:1.2}
.kb-st{display:flex;align-items:center;gap:4px;font-size:9px;color:var(--night)}.kb-st i{width:6px;height:6px;border-radius:50%;background:#1F7A3A}
.kb-row{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:4px}
.kb-pr{display:inline-block;width:46px;height:9px;border-radius:5px;background:linear-gradient(90deg,#E2E2E6,#F2F2F4,#E2E2E6);background-size:200% 100%;animation:kbShimmer 2.4s linear infinite}
.kb-add{background:var(--night);color:var(--mist);border-radius:5px;padding:3px 7px;font-size:9px;font-weight:600}
.kb-base{height:16px;margin:0 -6%;background:linear-gradient(#3A3B3F,#2C2C30);border-radius:0 0 18px 18px;position:relative}
.kb-base::before{content:"";position:absolute;left:50%;top:0;width:18%;height:6px;transform:translateX(-50%);background:#1D1D1F;border-radius:0 0 8px 8px}
.kb-phone{position:absolute;right:-4%;bottom:0;width:31%;max-width:180px;background:#1D1D1F;border:1px solid #3A3B3F;border-radius:26px;padding:8px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7)}
.kb-pscreen{background:var(--mist);border-radius:19px;padding:12px 10px 14px;display:flex;flex-direction:column;gap:3px;color:var(--night);aspect-ratio:9/17.5}
.kb-pscreen .kb-logo b{font-size:13px}
.kb-pimg{background:var(--paper);border-radius:10px;height:34%;display:grid;place-items:center;margin:8px 0 6px}.kb-pimg svg{width:82%;height:auto}
.kb-pname{font-size:13px;font-weight:600}
.kb-plabel{font-size:9px;color:var(--dark-grey);margin-top:6px}
.kb-pr-l{width:70%;height:12px}
.kb-pbtn{margin-top:auto;background:var(--ember);color:var(--night);border-radius:8px;text-align:center;font-size:11px;font-weight:600;padding:8px}
@keyframes kbShimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.kb-pr{animation:none}}
@media (max-width:520px){.kb-ui{font-size:9px}.kb-grid{grid-template-columns:repeat(2,1fr)}.kb-grid .kb-card:nth-child(3){display:none}.kb-phone{width:36%;right:-2%}}
.g-shop-grid>*{min-width:0}
.kb-top{min-width:0}.kb-search{min-width:0}
@media (max-width:900px){.kb-devices{max-width:520px;margin-right:6%}}
.g-hero,.g-hero-d{overflow:hidden}
html,body{overflow-x:clip}
/* Kubus section: simpler, like the mockup */
.g-shop h2{font-size:clamp(40px,5vw,64px);margin-top:24px}
.g-shop-ctas{margin-top:36px}
.g-shop-sub{display:inline-block;margin-top:18px;font-size:15px;color:#C7C7CC;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--ember)}
.g-shop-sub:hover{color:var(--mist)}
.g-shop-grid{grid-template-columns:.9fr 1.1fr}
@media (max-width:900px){.g-shop-grid{grid-template-columns:1fr}}

/* newsletter: old box style, simpler text */
.nl-c{align-items:center}
.nl-c a{font-size:12px;color:var(--dark-grey);text-decoration:underline;text-underline-offset:2px}
.nl-c input{width:16px;height:16px;margin:0;accent-color:var(--night);flex:none}
.g-metrics-grid{row-gap:56px}
@media (max-width:900px){.g-metrics-grid{row-gap:40px}}
/* Kubus coming soon page */
.kb-soon{min-height:calc(100vh - 0px);display:flex;align-items:center;padding-top:clamp(120px,12vw,160px)}
.kb-soon-h{font-size:clamp(44px,5.6vw,76px);font-weight:500;letter-spacing:-.045em;line-height:.95;margin-top:24px;color:var(--mist)}
.kb-soon-h span{color:var(--ember)}
.kb-soon-p{margin-top:20px;color:#C7C7CC;max-width:30em;font-size:18px}
/* rotating word: room for the last letter so it is never clipped */
.g-h1 .rot .w{padding-right:.1em}
.g-h1 .rot{margin-right:-.1em}
.g-h1 .rot::after{right:.1em}

/* hero: keep content in the same centred column as the header on wide screens */
.g-hero-d .g-hero-inner{max-width:var(--wrap);margin-left:auto;margin-right:auto}
.g-hero-d .g-h1{max-width:12.5ch}
.g-hero-d .g-hero-side{max-width:560px}

/* large monitors (27"–32"): use more of the screen */
@media (min-width:1920px){:root{--wrap:1520px}}
@media (min-width:2400px){:root{--wrap:1720px}}

/* hero isometric grid: stay inside the screen (no cut-off on the right) */
@media (min-width:901px){
  .g-hero-iso{right:max(24px, calc((100vw - var(--wrap)) / 2));width:min(50vw, 920px)}
}