/* Metaltek 4.0 — Bold Blue Blocks. See DESIGN.md. */
@font-face{font-family:'Archivo Variable';font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url('../fonts/archivo-latin.woff2') format('woff2-variations'),url('../fonts/archivo-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo Variable';font-style:normal;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url('../fonts/archivo-latin-ext.woff2') format('woff2-variations'),url('../fonts/archivo-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-display:swap;font-weight:500;src:url('../fonts/plex-mono-500.woff2') format('woff2')}

:root{
  --blue:#0074bc;--blue-700:#005d97;--blue-300:#6cb8e8;
  --navy:#031a34;--navy-800:#0b2847;--navy-700:#163659;
  --steel:#959a9b;--steel-200:#dfe4e8;--steel-100:#eef1f4;--white:#fff;
  --text:#031a34;--muted:#4a5868;--line:#d3dae1;
  --display:'Archivo Variable','Archivo','Arial Black',Arial,sans-serif;
  --body:'Archivo Variable','Archivo',Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --gutter:clamp(20px,4.2vw,72px);--max:1520px;--header:92px;
  --section:clamp(80px,9vw,160px);
  --ease:cubic-bezier(.22,.8,.2,1);--ease-io:cubic-bezier(.65,0,.35,1);
}

/* Base ---------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 20px);-webkit-text-size-adjust:100%}
body{margin:0;padding-top:var(--header);background:var(--white);color:var(--text);font:400 17px/1.65 var(--body);font-stretch:100%;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
svg.icon{display:block;width:22px;height:22px;flex-shrink:0}
p{margin:0 0 1.1em}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:800;line-height:1.02;letter-spacing:-.01em;text-wrap:balance;overflow-wrap:break-word}
h3{font-size:clamp(22px,1.7vw,28px);font-weight:750;font-stretch:106%;line-height:1.15}
em{font-style:normal;color:var(--blue)}
ul,ol{padding-left:1.2em}
[hidden]{display:none!important}
::selection{background:var(--blue);color:#fff}
:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.blue :focus-visible,.navy :focus-visible,.hero :focus-visible,.page-hero :focus-visible,.site-footer :focus-visible,.send-band :focus-visible,.cta-block :focus-visible,.tone-blue :focus-visible,.tone-navy :focus-visible{outline-color:#fff}
.container{width:min(100% - 2*var(--gutter),var(--max));margin-inline:auto}
.section{padding-block:var(--section)}
.tint{background:var(--steel-100)}
.blue{background:var(--blue);color:#fff}
.navy{background:var(--navy);color:#fff}
.skip-link{position:fixed;left:16px;top:-80px;z-index:300;background:var(--navy);color:#fff;padding:14px 18px;font-weight:700}
.skip-link:focus{top:12px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Type scale ---------------------------------------------------------- */
.display-1,.display-2,.display-3{font-family:var(--display);font-weight:850;font-stretch:116%;text-transform:uppercase;line-height:.92;letter-spacing:-.012em}
.display-1{font-size:clamp(46px,7.2vw,132px)}
.display-2{font-size:clamp(38px,5vw,92px)}
.display-3{font-size:clamp(30px,3.3vw,60px);line-height:.98}
.label{display:inline-flex;align-items:center;gap:12px;margin:0 0 26px;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--blue-700)}
.label::before{content:'';width:11px;height:10px;flex-shrink:0;background:currentColor;clip-path:polygon(0 0,100% 0,50% 100%)}
.label-num{font:500 12px/1 var(--mono);letter-spacing:.06em;color:var(--blue-700)}
.label .label-num{margin-right:4px}
.blue .label,.navy .label,.hero .label,.page-hero .label,.site-footer .label,.send-band .label,.tone-blue .label,.tone-navy .label,.blue .label-num,.navy .label-num,.tone-blue .label-num,.tone-navy .label-num{color:#fff}
.meta{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.body-copy{color:var(--muted)}
.body-copy p:last-child{margin-bottom:0}
.body-copy h2,.body-copy h3,.body-copy h4{color:var(--text);margin:1.5em 0 .6em;font-stretch:104%}
.body-copy h2{font-size:clamp(28px,2.4vw,38px)}
.body-copy h3{font-size:clamp(22px,1.8vw,28px)}
.body-copy a{color:var(--blue-700);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.body-copy ul{list-style:none;padding:0}
.body-copy ul li{position:relative;padding-left:26px;margin-bottom:8px}
.body-copy ul li::before{content:'';position:absolute;left:0;top:.62em;width:11px;height:10px;background:var(--blue);clip-path:polygon(0 0,100% 0,50% 100%)}
.body-copy table{border-collapse:collapse;max-width:100%}
.body-copy td,.body-copy th{border:1px solid var(--line);padding:10px}
.body-copy iframe,.body-copy video{max-width:100%}
.body-lg{font-size:clamp(17px,1.25vw,19px)}
.body-xl{font-size:clamp(20px,1.7vw,26px);line-height:1.5;color:var(--text);font-weight:500}
.navy .body-copy,.blue .body-copy,.tone-blue .body-copy,.tone-navy .body-copy{color:#e7eef5}
.navy .body-copy h2,.navy .body-copy h3,.blue .body-copy h2,.blue .body-copy h3{color:#fff}
.narrow{max-width:760px;margin-inline:auto}

/* Buttons ------------------------------------------------------------- */
.btn{--btn-bg:var(--blue);--btn-fg:#fff;--btn-fill:var(--navy);--btn-fill-fg:#fff;position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:58px;padding:0 26px;background:var(--btn-bg);color:var(--btn-fg);font:700 15px/1.1 var(--body);font-stretch:108%;letter-spacing:.01em;border:2px solid var(--btn-bg);transition:color .35s var(--ease),border-color .35s var(--ease)}
.btn::before{content:'';position:absolute;inset:-2px;z-index:-1;background:var(--btn-fill);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.btn:hover,.btn:focus-visible{color:var(--btn-fill-fg);border-color:var(--btn-fill)}
.btn:hover::before,.btn:focus-visible::before{transform:scaleX(1);transform-origin:left}
.btn .icon{width:20px;height:20px;transition:transform .4s var(--ease)}
.btn:hover .icon{transform:translateX(4px)}
.btn-light{--btn-bg:#fff;--btn-fg:var(--navy);--btn-fill:var(--navy);--btn-fill-fg:#fff}
.btn-navy{--btn-bg:var(--navy);--btn-fill:var(--blue)}
.btn-ghost{--btn-bg:transparent;--btn-fg:currentColor;--btn-fill:var(--navy);border-color:currentColor}
.blue .btn-ghost,.navy .btn-ghost,.hero .btn-ghost,.page-hero .btn-ghost,.send-band .btn-ghost,.cta-block .btn-ghost,.not-found .btn-ghost,.tone-blue .btn-ghost,.tone-navy .btn-ghost{--btn-fill:#fff;--btn-fill-fg:var(--navy)}
.btn-small{min-height:48px;padding:0 18px;font-size:14px;gap:12px}
.btn-small .icon{width:18px;height:18px}
.btn-outline{--btn-bg:transparent;--btn-fg:var(--navy);--btn-fill:var(--navy);border-color:var(--navy)}
.button-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.text-link{display:inline-flex;align-items:center;gap:12px;font-weight:700;font-stretch:106%;font-size:15px}
.text-link .icon{width:18px;height:18px;transition:transform .35s var(--ease)}
a:hover .text-link .icon,.text-link:hover .icon{transform:translateX(5px)}
.square-btn{display:grid;place-items:center;width:56px;height:56px;background:var(--navy);color:#fff;transition:background .3s}
.square-btn:hover{background:var(--blue)}
.square-btn:disabled{opacity:.35;cursor:default;background:var(--navy)}

/* Header -------------------------------------------------------------- */
.site-header{position:fixed;inset:0 0 auto;z-index:100;background:#fff;transition:transform .5s var(--ease),box-shadow .3s}
.site-header.is-scrolled{box-shadow:0 1px 0 var(--line),0 12px 30px -24px #031a3466}
.site-header.is-hidden{transform:translateY(-100%)}
.header-inner{display:flex;align-items:center;gap:28px;height:var(--header)}
.brand{flex-shrink:0;display:block}
.brand img{width:auto;height:64px}
.primary-nav{flex:1;display:flex;align-items:center;justify-content:flex-end;gap:26px;min-width:0}
.nav-list{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px}
.nav-list>li{position:relative}
.nav-list a{position:relative;display:block;padding:12px 11px;font-size:16px;font-weight:650;font-stretch:104%;white-space:nowrap;color:var(--navy);transition:color .25s}
.nav-list>li>a::after{content:'';position:absolute;left:11px;right:11px;bottom:5px;height:3px;background:var(--blue);transform:scaleX(0);transform-origin:right;transition:transform .4s var(--ease)}
.nav-list>li>a:hover,.nav-list>li>a[aria-current=page],.nav-list>.current-menu-item>a{color:var(--blue-700)}
.nav-list>li>a:hover::after,.nav-list>li>a[aria-current=page]::after,.nav-list>.current-menu-item>a::after{transform:scaleX(1);transform-origin:left}
.nav-list .sub-menu{display:none;list-style:none;position:absolute;top:100%;left:0;min-width:240px;padding:10px 0;margin:0;background:#fff;box-shadow:0 18px 40px -20px #031a3466;border-top:3px solid var(--blue)}
.nav-list li:hover>.sub-menu,.nav-list li:focus-within>.sub-menu{display:block}
.nav-list .sub-menu a{padding:10px 20px;font-size:15px}
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.header-send .icon{width:18px;height:18px}
.header-send[aria-current=page]{--btn-bg:var(--navy);--btn-fg:#fff}
.menu-toggle{display:none;margin-left:auto;align-items:center;gap:12px;min-height:48px;padding:0 4px;font:700 14px/1 var(--body);font-stretch:108%;text-transform:uppercase;letter-spacing:.06em;color:var(--navy)}
.menu-lines{position:relative;display:grid;gap:7px;width:30px}
.menu-lines i{display:block;height:2.5px;background:currentColor;transition:transform .4s var(--ease)}
.menu-toggle[aria-expanded=true] .menu-lines i:first-child{transform:translateY(4.75px) rotate(45deg)}
.menu-toggle[aria-expanded=true] .menu-lines i:last-child{transform:translateY(-4.75px) rotate(-45deg)}
.reading-progress{position:absolute;left:0;right:0;bottom:-3px;height:3px;pointer-events:none}
.reading-progress span{display:block;height:100%;background:var(--blue);transform-origin:left;transform:scaleX(0)}

/* Page transition panel ----------------------------------------------- */
.page-wipe{position:fixed;inset:0;z-index:250;pointer-events:none;background:var(--blue);transform:translateY(101%);visibility:hidden;display:grid;place-items:center}
/* The white Metaltek logo is part of this stylesheet, so it is there the moment the panel appears: no separate download
   that a slow connection, a page change or a lazy-loading plugin could hold back. */
.page-wipe-logo{display:block;width:clamp(140px,13vw,200px);aspect-ratio:147/108;background:url("data:image/png;base64,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") center/contain no-repeat;opacity:0;transform:translateY(16px) scale(.96)}
.is-leaving .page-wipe-logo{animation:wipe-logo-in .3s var(--ease) .1s forwards}
.wipe-in .page-wipe-logo{opacity:1;transform:none}
@keyframes wipe-logo-in{to{opacity:1;transform:none}}
.wipe-in .page-wipe{transform:none;visibility:visible;animation:page-wipe-out .75s var(--ease-io) .05s forwards}
.is-leaving .page-wipe{visibility:visible;animation:page-wipe-in .42s var(--ease-io) forwards}
@keyframes page-wipe-out{to{transform:translateY(-101%);visibility:hidden}}
@keyframes page-wipe-in{from{transform:translateY(101%)}to{transform:none}}

/* Motion primitives (only when the visitor allows motion) -------------- */
.motion [data-reveal]{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--delay,0s)}
.motion [data-reveal].is-in{opacity:1;transform:none}
.split-word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.split-word>span{display:inline-block}
.motion [data-split] .split-word>span{transform:translateY(105%);transition:transform 1s var(--ease);transition-delay:calc(var(--w,0) * 45ms)}
.motion [data-split].is-in .split-word>span{transform:none}
.wipe{position:relative;overflow:hidden;margin:0}
.wipe::after{content:'';position:absolute;inset:0;z-index:2;background:var(--blue);transform:scaleX(0);transform-origin:right;pointer-events:none}
.wipe-navy::after{background:var(--navy)}
.motion .wipe::after{transform:scaleX(1);transition:transform 1.1s var(--ease-io)}
.motion .wipe.is-in::after{transform:scaleX(0)}
.motion .wipe>img{transform:scale(1.14);transition:transform 1.6s var(--ease)}
.motion .wipe.is-in>img{transform:none}
/* Safety net: if the script never runs, hidden content appears on its own. design.js adds .js-ready. */
.motion:not(.js-ready) [data-reveal],.motion:not(.js-ready) .wipe>img{animation:safety-show .6s 2.5s forwards}
.motion:not(.js-ready) .wipe::after{animation:safety-wipe .6s 2.5s forwards}
@keyframes safety-show{to{opacity:1;transform:none}}
@keyframes safety-wipe{to{transform:scaleX(0)}}

/* Section heading ----------------------------------------------------- */
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:clamp(40px,4vw,64px)}
.section-head h2{max-width:1000px}
.section-head .label{margin-bottom:22px}
.section-head-action{flex-shrink:0}
.on-blue h2,.on-dark h2{color:#fff}
.section-intro{max-width:620px;margin:-20px 0 clamp(40px,4vw,64px);font-size:clamp(17px,1.3vw,20px);color:var(--muted)}

/* Home hero: full-screen photographs of the work ---------------------- */
.home-hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;height:calc(100svh - var(--header));min-height:580px;overflow:hidden;background:var(--navy);color:#fff}
.home-hero-slides{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-slide{position:absolute;inset:0;margin:0;clip-path:inset(0 0 0 100%);transition:clip-path 1.1s var(--ease-io)}
.hero-slide.is-active{clip-path:inset(0);z-index:2}
.hero-slide.is-prev{clip-path:inset(0);z-index:1}
.hero-slide img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);transition:transform 6s ease-out}
.hero-slide.is-active img{transform:none}
/* Three-photo slide: concept, site photo and the building today, side by side on navy. Instead of the
   sideways wipe, the three panels rise into place one after another. */
.hero-slide.hero-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(5px,.55vw,10px);clip-path:none;transition:none;visibility:hidden}
.hero-trio.is-active,.hero-trio.is-prev{visibility:visible}
.hero-panel{position:relative;min-width:0;min-height:0;overflow:hidden;clip-path:inset(100% 0 0 0);transition:clip-path .95s var(--ease-io) calc(var(--k,0) * 80ms)}
.hero-trio.is-active .hero-panel,.hero-trio.is-prev .hero-panel{clip-path:inset(0)}
.hero-trio.is-prev .hero-panel{transition:none}
.hero-trio img{object-position:50% 28%;transition-delay:calc(var(--k,0) * 80ms)}
.home-hero-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,#031a34e0 0%,#031a3480 20%,#031a3400 46%),linear-gradient(90deg,#031a3459 0%,#031a3400 50%)}
.home-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:28px 48px;padding-bottom:clamp(26px,3.4vw,52px)}
.home-hero-copy{max-width:900px}
.home-hero-copy .label{color:#fff;margin-bottom:18px}
.home-hero-title{font:850 clamp(30px,3.3vw,58px)/.98 var(--display);font-stretch:112%;text-transform:uppercase;letter-spacing:-.01em;text-wrap:balance;text-shadow:0 2px 24px #031a3459}
.home-hero-copy .button-row{margin-top:26px}
/* Hero heading: a blue block sweeps across each word to reveal it, then the closing phrase is
   highlighted in blue. The highlight sweeps again every time the photograph changes. */
.home-hero-title .split-word{position:relative}
.hero-key{padding:0 .12em;margin:0 -.12em;-webkit-box-decoration-break:clone;box-decoration-break:clone;background:linear-gradient(var(--blue),var(--blue)) left center/100% 100% no-repeat}
.motion .home-hero-title .split-word>span{transform:none;opacity:0;transition:none}
.motion .home-hero-title .split-word::after{content:'';position:absolute;left:-.04em;right:-.04em;top:.08em;bottom:.02em;background:var(--blue);transform:scaleX(0);transform-origin:left center;pointer-events:none}
.motion .home-hero-title.is-in .split-word>span{animation:hero-word-text 1s steps(1,end) both;animation-delay:calc(var(--w,0) * 80ms + .15s)}
.motion .home-hero-title.is-in .split-word::after{animation:hero-word-block 1s var(--ease-io) both;animation-delay:calc(var(--w,0) * 80ms + .15s)}
.wipe-in .home-hero-title.is-in .split-word>span,.wipe-in .home-hero-title.is-in .split-word::after{animation-delay:calc(var(--w,0) * 80ms + .7s)}
.motion .hero-key{background-size:0% 100%}
.motion .home-hero-title.is-in .hero-key:not(.is-keyed){animation:hero-key-in .9s var(--ease-io) var(--key-delay,1.2s) forwards}
.motion .hero-key.is-keyed{background-size:100% 100%}
.motion .hero-key.is-keyed.is-sweeping{animation:hero-key-sweep 1.1s var(--ease-io)}
@keyframes hero-word-block{0%{transform:scaleX(0);transform-origin:left center}48%{transform:scaleX(1);transform-origin:left center}52%{transform:scaleX(1);transform-origin:right center}100%{transform:scaleX(0);transform-origin:right center}}
@keyframes hero-word-text{0%{opacity:0}50%{opacity:1}100%{opacity:1}}
@keyframes hero-key-in{from{background-size:0% 100%}to{background-size:100% 100%}}
@keyframes hero-key-sweep{0%{background-size:100% 100%;background-position:right center}45%{background-size:0% 100%;background-position:right center}55%{background-size:0% 100%;background-position:left center}100%{background-size:100% 100%;background-position:left center}}
.hero-controls{display:flex;align-items:center;flex-wrap:wrap;background:var(--navy);color:#fff}
.hero-count{padding-left:18px;margin-right:14px;font:500 13px/1 var(--mono);letter-spacing:.06em;white-space:nowrap}
.hero-progress{width:clamp(60px,6vw,110px);height:2px;margin-right:10px;background:#ffffff40;overflow:hidden}
.hero-progress i{display:block;height:100%;background:var(--blue-300);transform-origin:left;transform:scaleX(0)}
.hero-progress i.is-running{animation:hero-progress var(--slide-ms,3000ms) linear forwards}
@keyframes hero-progress{to{transform:scaleX(1)}}
.hero-btn{display:grid;place-items:center;width:52px;height:52px;color:#fff;transition:background .25s,color .25s}
.hero-btn:hover{background:var(--blue)}
.hero-btn .icon{width:20px;height:20px}
.hero-btn .icon-play,.hero-btn[aria-pressed=true] .icon-pause{display:none}
.hero-btn[aria-pressed=true] .icon-play{display:block}
.hero-full{display:inline-flex;width:auto;gap:10px;padding:0 20px;background:var(--blue);font-weight:700;font-stretch:106%;font-size:15px}
.hero-full:hover{background:#fff;color:var(--navy)}
.home-hero .hero-controls{margin-right:max(0px,calc(90px - var(--gutter)))}

/* Marquee ------------------------------------------------------------- */
.marquee{overflow:hidden;position:relative}
.marquee-track{display:flex;width:max-content}
.marquee-group{display:flex;align-items:center;flex-shrink:0}
.motion .marquee-track{animation:marquee var(--marquee-speed,48s) linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.marquee-words{background:var(--navy);color:#fff;padding-block:clamp(22px,2.4vw,36px)}
.marquee-words .marquee-item{font:850 clamp(34px,4.6vw,84px)/1 var(--display);font-stretch:118%;text-transform:uppercase;white-space:nowrap;padding-inline:clamp(20px,2.2vw,40px)}
.marquee-words .marquee-group>.marquee-item:nth-child(4n+3){color:transparent;-webkit-text-stroke:2px #fff}
.marquee-words .marquee-sep{width:clamp(22px,2.4vw,40px);height:clamp(20px,2.2vw,36px);background:var(--blue);clip-path:polygon(0 0,100% 0,50% 100%);flex-shrink:0}
.marquee-logos{--marquee-speed:36s;margin-top:clamp(40px,4vw,64px)}
.marquee-logos .marquee-item{display:grid;place-items:center;width:clamp(170px,15vw,240px);height:124px;padding:18px 22px;margin-right:16px;background:#fff}
.marquee-logos .marquee-item img{max-height:80px;max-width:100%;width:auto;object-fit:contain;transition:transform .35s var(--ease)}
.marquee-logos .marquee-item:hover img{transform:scale(1.06)}
.marquee-logos .marquee-sep{display:none}

/* Stats --------------------------------------------------------------- */
.stats{padding-block:clamp(56px,6vw,96px)}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.stat{padding:6px clamp(16px,2vw,36px);border-left:3px solid var(--blue)}
.stat strong{display:flex;align-items:flex-start;font:850 clamp(48px,5.6vw,104px)/.95 var(--display);font-stretch:112%;color:var(--blue);letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap}
.stat-suffix{font-size:.5em;margin-left:4px;color:var(--navy)}
.stat p{margin:16px 0 0;font:500 12px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.stats-band{background:var(--steel-100)}

/* Our work: full-screen project photographs that stack as you scroll ---- */
.work{padding-top:var(--section);background:#fff}
.work-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.75fr);gap:28px 60px;align-items:end;margin-bottom:clamp(40px,4vw,64px)}
.work-head .label{margin-bottom:22px}
.work-head-side p{max-width:520px;margin:0 0 22px;font-size:clamp(17px,1.3vw,20px);color:var(--muted)}
.work-panel{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;background:var(--navy);transform-origin:50% 0;transform:scale(var(--scale,1));will-change:transform}
.work-panel::after{content:'';position:absolute;inset:0;z-index:2;background:#031a34;opacity:var(--dim,0);pointer-events:none}
/* The whole photograph is shown, never cropped; a soft, darkened copy of it fills the screen behind. */
.work-backdrop{position:absolute;inset:0;overflow:hidden}
.work-backdrop img{width:100%;height:100%;object-fit:cover;filter:blur(36px) saturate(1.2);transform:scale(1.2);opacity:.55}
.work-backdrop::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#031a34eb 0%,#031a3480 42%,#031a3459 100%)}
.work-stack{background:var(--navy)}
.work-panel-inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(280px,min(380px,27vw)) minmax(0,1fr);gap:clamp(28px,3.5vw,64px);height:100%;padding-top:calc(var(--header) + 24px);padding-bottom:clamp(24px,3vw,48px)}
.work-photo{position:relative;grid-column:2;grid-row:1;min-height:0;margin:0}
.work-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%}
.work-side{grid-column:1;grid-row:1;align-self:end;display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0}
.work-info{--bg:var(--blue);--fg:#fff;display:block;width:100%;padding:clamp(22px,2.2vw,34px);background:var(--bg);color:var(--fg);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.work-info.tone-white{--bg:#fff;--fg:var(--navy)}
.work-info.tone-navy{--bg:var(--navy)}
.work-info:hover{transform:translateY(-6px);box-shadow:0 24px 40px -24px #031a34aa}
.work-index{display:block;margin-bottom:18px;font:500 13px/1 var(--mono);letter-spacing:.06em}
.work-info .label{margin-bottom:12px;color:inherit}
.work-info.tone-white .label{color:var(--blue-700)}
.work-info h3{font:850 clamp(24px,2.3vw,40px)/.98 var(--display);font-stretch:110%;text-transform:uppercase;letter-spacing:-.01em}
.work-location{display:flex;align-items:center;gap:8px;margin:14px 0 0;font-size:15px}
.work-location .icon{width:18px;height:18px}
.work-go{display:flex;align-items:center;justify-content:space-between;margin-top:22px;padding-top:16px;border-top:2px solid currentColor;font-weight:700;font-stretch:106%}
.work-go .icon{transition:transform .4s var(--ease)}
.work-info:hover .work-go .icon{transform:translateX(6px)}
.work-full{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 20px;background:#031a34d9;color:#fff;font-weight:700;font-stretch:106%;font-size:15px;transition:background .3s,color .3s}
.work-full:hover{background:#fff;color:var(--navy)}
.work-full .icon{width:20px;height:20px}

/* Concept vs reality: the architect's render against our site photograph --
   Slider: the concept sits on top of the site photo and is cut away at --pos (0–100).
   Side by side: the two images slide apart. Before the script runs they are shown side by side. */
.compare{--ratio:.62;--gap:24px;overflow:hidden}
.compare-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,480px);gap:36px clamp(40px,6vw,120px);align-items:end;margin-bottom:clamp(40px,4.4vw,72px)}
.compare-head.has-list{align-items:start}
.compare-title .label{margin-bottom:22px}
.compare-intro{max-width:600px;margin:26px 0 0;font-size:clamp(17px,1.3vw,20px);color:#c9d6e3}
.compare-projects .label{margin-bottom:22px}
/* Project list: the chosen project is a blue block with its scope of work; the others are rows to pick from. */
.cmp-projects{--pad:clamp(18px,1.8vw,26px);--indent:calc(var(--pad) + 44px);list-style:none;margin:0;padding:0}
.cmp-projects.is-single{--indent:var(--pad)}
.cmp-project{border-top:1.5px solid #ffffff2e;transition:background .45s var(--ease),border-color .45s}
.cmp-project:last-child{border-bottom:1.5px solid #ffffff2e}
.cmp-project.is-active{background:var(--blue);border-color:var(--blue)}
.cmp-project.is-active+.cmp-project{border-top-color:transparent}
.cmp-project-head{display:grid;grid-template-columns:28px minmax(0,1fr) 20px;align-items:center;gap:0 16px;width:100%;margin:0;padding:20px var(--pad);text-align:left;color:#c9d6e3;transition:color .25s}
.cmp-project-head:not(:only-child){padding-bottom:6px}
.is-single .cmp-project-head{grid-template-columns:minmax(0,1fr);padding-top:26px}
.cmp-project-num{font:500 12px/1 var(--mono);letter-spacing:.08em;color:var(--blue-300);transition:color .25s}
.cmp-project-name{font:850 clamp(19px,1.5vw,26px)/1.04 var(--display);font-stretch:110%;text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
.cmp-project-go{width:20px;height:20px;transition:transform .35s var(--ease),opacity .25s}
.cmp-project:not(.is-active){cursor:pointer}
.cmp-project:not(.is-active):hover .cmp-project-head{color:#fff}
.cmp-project:not(.is-active):hover .cmp-project-go{transform:translateX(5px)}
.cmp-project.is-active .cmp-project-head{color:#fff;cursor:default}
.cmp-project.is-active .cmp-project-num{color:#fff}
.cmp-project.is-active .cmp-project-go{opacity:0;transform:none}
/* Every project keeps its scope of work on show, so the list never changes height as projects change */
.cmp-project-more{padding:0 var(--pad) 20px var(--indent)}
.compare-scope{margin:0;padding-top:12px;border-top:1.5px solid #ffffff1f;font-size:15px;line-height:1.45;color:#c9d6e3;transition:color .45s,border-color .45s}
.compare-scope span{display:block;margin-bottom:4px;font:500 11px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#8fa6bc;transition:color .45s}
.cmp-project.is-active .compare-scope{border-top-color:#ffffff59;color:#fff}
.cmp-project.is-active .compare-scope span{color:#d9eaf7}
.cmp-project-more .text-link{margin-top:14px}
.compare-body{--stage-h:min(76vh,760px,calc((min(100vw - 2 * var(--gutter),var(--max)) - var(--gap) - 24px) / (2 * var(--ratio))));--frame-w:calc(var(--stage-h) * var(--ratio))}
.compare-stage{--pos:50;position:relative;height:var(--stage-h);-webkit-user-select:none;user-select:none}
.cmp-layer{position:absolute;top:0;left:50%;width:var(--frame-w);height:100%;margin:0;overflow:hidden;background:var(--navy-800);transform:translateX(-50%)}
.cmp-layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%;pointer-events:none;-webkit-user-drag:none}
.cmp-concept{z-index:2;clip-path:inset(0 calc(100% - var(--pos) * 1%) 0 0)}
.cmp-tag{position:absolute;top:0;z-index:2;padding:10px 13px;font:500 12px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.cmp-concept .cmp-tag{left:0;background:var(--blue);color:#fff}
.cmp-reality .cmp-tag{right:0;background:#fff;color:var(--navy)}
.cmp-layer::after{content:'';position:absolute;inset:0;z-index:3;background:var(--blue);transform:scaleX(0);transform-origin:left center;pointer-events:none}
.cmp-frame{position:absolute;top:0;left:50%;z-index:4;width:var(--frame-w);height:100%;transform:translateX(-50%);cursor:ew-resize;touch-action:pan-y;transition:opacity .45s var(--ease),visibility .45s}
.cmp-handle{position:absolute;top:0;bottom:0;left:calc(var(--pos) * 1%);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px #031a3426;pointer-events:none}
.cmp-handle::before,.cmp-handle::after{content:'';position:absolute;left:50%;width:16px;height:13px;background:#fff;transform:translateX(-50%)}
.cmp-handle::before{top:0;clip-path:polygon(0 0,100% 0,50% 100%)}
.cmp-handle::after{bottom:0;clip-path:polygon(50% 0,100% 100%,0 100%)}
.cmp-knob{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:60px;height:60px;background:var(--blue);color:#fff;transform:translate(-50%,-50%);transition:transform .35s var(--ease),background .25s,color .25s}
.cmp-knob .icon{width:26px;height:26px}
.is-dragging .cmp-knob{transform:translate(-50%,-50%) scale(1.1);background:#fff;color:var(--navy)}
@media (hover:hover){.cmp-frame:hover .cmp-knob{transform:translate(-50%,-50%) scale(1.1)}}
.cmp-range:focus-visible~.cmp-handle .cmp-knob{outline:3px solid #fff;outline-offset:4px}
/* Outline words beside the frame fill with white as more of their image shows. */
.compare-word{position:absolute;top:50%;z-index:1;font:850 calc(var(--stage-h) * .14)/.8 var(--display);font-stretch:116%;text-transform:uppercase;letter-spacing:.01em;writing-mode:vertical-rl;white-space:nowrap;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px #ffffff80;background:linear-gradient(to bottom,#fff var(--fill),transparent var(--fill)) no-repeat;-webkit-background-clip:text;background-clip:text;pointer-events:none;transition:opacity .45s var(--ease),visibility .45s}
.compare-word.is-concept{--fill:calc(var(--pos) * 1%);right:calc(50% + var(--frame-w) / 2 + clamp(22px,2.6vw,48px));transform:translateY(-50%) rotate(180deg)}
.compare-word.is-reality{--fill:calc((100 - var(--pos)) * 1%);left:calc(50% + var(--frame-w) / 2 + clamp(22px,2.6vw,48px));transform:translateY(-50%)}
.compare-stage.is-split .cmp-concept,.compare:not(.is-ready) .cmp-concept{clip-path:inset(0);transform:translateX(calc(-100% - var(--gap) / 2))}
.compare-stage.is-split .cmp-reality,.compare:not(.is-ready) .cmp-reality{transform:translateX(calc(var(--gap) / 2))}
.compare-stage.is-split :is(.cmp-frame,.compare-word),.compare:not(.is-ready) :is(.cmp-frame,.compare-word){opacity:0;visibility:hidden;pointer-events:none}
.compare-stage.is-animating .cmp-layer{transition:transform .9s var(--ease-io),clip-path .9s var(--ease-io)}
.compare:not(.is-ready) :is(.compare-controls,.compare-how,.cmp-project:not(.is-active)){display:none}
/* Entrance: a blue block covers the images until the section scrolls into view, then wipes away.
   Changing view or mode: the block sweeps across, the images change underneath, and it sweeps off. */
.motion .compare.is-ready:not(.is-entered) .cmp-layer::after{transform:scaleX(1)}
.motion .compare.is-ready:not(.is-entered) :is(.cmp-frame,.compare-word){opacity:0}
.motion .compare.is-entered .cmp-layer::after{transform-origin:right center;transition:transform 1s var(--ease-io)}
.motion .compare-stage.is-changing .cmp-layer::after{animation:cmp-wipe 1s var(--ease-io) both}
.motion .compare-stage.is-changing .cmp-frame{opacity:0;pointer-events:none;transition:opacity .15s,width .45s var(--ease-io)}
.motion .compare-stage.is-changing{transition:height .45s var(--ease-io)}
.motion .compare-stage.is-changing .cmp-layer{transition:width .45s var(--ease-io)}
.motion .compare-stage.is-changing .compare-word{transition:opacity .45s var(--ease),visibility .45s,left .45s var(--ease-io),right .45s var(--ease-io)}
@keyframes cmp-wipe{0%{transform:scaleX(0);transform-origin:left center}40%{transform:scaleX(1);transform-origin:left center}60%{transform:scaleX(1);transform-origin:right center}100%{transform:scaleX(0);transform-origin:right center}}
/* Playback: a progress line under the image, the pause/play button and the name of the pair on show */
.cmp-playback{width:var(--frame-w);max-width:100%;margin:16px auto 0;transition:width .45s var(--ease-io)}
.compare-stage.is-split+.cmp-playback{width:calc(2 * var(--frame-w) + var(--gap))}
.cmp-progress{display:block;height:2px;background:#ffffff26;overflow:hidden}
.cmp-progress i{display:block;height:100%;background:var(--blue-300);transform-origin:left center;transform:scaleX(var(--progress,0))}
.cmp-playline{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px}
.cmp-play{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border:1.5px solid #ffffff4d;color:#fff;transition:background .25s,border-color .25s,color .25s}
.cmp-play:hover{background:#fff;border-color:#fff;color:var(--navy)}
.cmp-play .icon{width:16px;height:16px}
.cmp-play .icon-play,.compare.is-paused .cmp-play .icon-pause{display:none}
.compare.is-paused .cmp-play .icon-play{display:block}
.cmp-caption{margin:0;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#c9d6e3}
.cmp-caption:empty{display:none}
.compare:not(.is-ready) :is(.cmp-progress,.cmp-play){display:none}
.compare-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px;margin-top:clamp(24px,2.6vw,40px);padding-top:clamp(24px,2.6vw,40px);border-top:2px solid #ffffff1f}
.cmp-views{display:flex;flex-wrap:wrap;gap:10px}
.cmp-views.is-single{display:none}
.cmp-view{display:flex;align-items:center;gap:14px;padding:6px 18px 6px 6px;border:1.5px solid #ffffff40;color:#c9d6e3;transition:border-color .25s,background .25s,color .25s}
.cmp-view:hover{border-color:#fff;color:#fff}
.cmp-view[aria-pressed=true]{border-color:var(--blue-300);background:#ffffff14;color:#fff}
.cmp-thumb{display:flex;gap:2px}
.cmp-thumb img{width:30px;height:48px;object-fit:cover}
.cmp-view-label{font:500 12px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.cmp-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-right:max(0px,calc(90px - var(--gutter)))}
.cmp-modes{display:flex;border:1.5px solid #ffffff59}
.cmp-modes button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 18px;font-weight:700;font-size:15px;font-stretch:106%;color:#c9d6e3;transition:background .25s,color .25s}
.cmp-modes button:hover{color:#fff}
.cmp-modes button[aria-pressed=true]{background:#fff;color:var(--navy)}
.cmp-modes .icon,.cmp-full .icon{width:20px;height:20px}
.cmp-full{display:inline-flex;align-items:center;gap:10px;min-height:55px;padding:0 22px;background:var(--blue);color:#fff;font-weight:700;font-size:15px;font-stretch:106%;transition:background .25s,color .25s}
.cmp-full:hover{background:#fff;color:var(--navy)}

/* Statement ----------------------------------------------------------- */
.statement-text{font-size:clamp(30px,4vw,70px);font-weight:780;font-stretch:104%;line-height:1.08;letter-spacing:-.02em;max-width:1300px;margin-bottom:clamp(50px,6vw,96px)}
.statement-text .lit-word{transition:color .4s}
.motion .statement-text[data-light] .lit-word{color:var(--steel-200)}
.motion .statement-text[data-light] .lit-word.is-lit{color:var(--navy)}
.statement-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,96px);align-items:center}
.cut-corner{clip-path:polygon(0 0,100% 0,100% calc(100% - 90px),calc(100% - 90px) 100%,0 100%)}
.statement-media img,.split-media img,.ideology-media img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* Services: photograph tiles ------------------------------------------ */
.tile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
.tile-grid.is-odd>.service-tile:first-child{grid-column:1/-1}
.tile-grid.is-odd>.service-tile:first-child .service-tile-media img{aspect-ratio:21/8}
.service-tile{position:relative;display:block;overflow:hidden;background:var(--navy);color:#fff}
.service-tile-media{margin:0;overflow:hidden}
.service-tile-media img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform 1.2s var(--ease)}
.service-tile:hover .service-tile-media img{transform:scale(1.04)}
.service-tile-body{position:absolute;left:0;bottom:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 20px;width:min(100%,500px);padding:clamp(20px,2vw,30px);background:var(--blue);transition:background .4s var(--ease)}
.service-tile:hover .service-tile-body,.service-tile:focus-visible .service-tile-body{background:var(--navy)}
.service-tile-body .label-num{grid-column:1/-1;color:#fff}
.service-tile-title{grid-column:1;font:850 clamp(22px,2.1vw,36px)/.98 var(--display);font-stretch:110%;text-transform:uppercase}
.service-tile-text{grid-column:1;font-size:15px;line-height:1.5;color:#e1edf7}
.service-tile-go{grid-column:2;grid-row:2/span 2;display:grid;place-items:center;width:52px;height:52px;border:2px solid #fff;transition:background .3s,color .3s}
.service-tile:hover .service-tile-go{background:#fff;color:var(--navy)}
@media (hover:hover){.service-tile-text{max-height:0;opacity:0;overflow:hidden;transition:max-height .5s var(--ease),opacity .4s}.service-tile:hover .service-tile-text,.service-tile:focus-visible .service-tile-text{max-height:6em;opacity:1}}

/* Product rail -------------------------------------------------------- */
.rail-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:40px;align-items:end;margin-bottom:clamp(30px,3vw,48px)}
.rail-intro h3{font-size:clamp(22px,1.8vw,30px)}
.rail-buttons{display:flex;gap:8px}
.rail{display:flex;gap:clamp(14px,1.6vw,24px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:max(var(--gutter),(100vw - var(--max))/2);padding:4px max(var(--gutter),(100vw - var(--max))/2) 24px;scrollbar-width:thin;scrollbar-color:var(--blue) var(--steel-100);cursor:grab}
.rail.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.rail.is-dragging a{pointer-events:none}
.rail-card{flex:0 0 clamp(260px,26vw,400px);scroll-snap-align:start}
.rail-media{overflow:hidden;background:var(--steel-100)}
.rail-media img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform 1s var(--ease)}
.rail-card:hover .rail-media img{transform:scale(1.06)}
.rail-caption{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:18px 0;border-bottom:3px solid var(--navy);transition:border-color .3s}
.rail-caption h3{font-size:clamp(19px,1.5vw,24px)}
.rail-card:hover .rail-caption{border-color:var(--blue)}
.rail-caption .icon{transition:transform .35s var(--ease)}
.rail-card:hover .rail-caption .icon{transform:translateX(5px);color:var(--blue)}

/* Clients ------------------------------------------------------------- */
.clients{overflow:hidden}
.clients-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(30px,5vw,96px);align-items:end}

/* Send Files band (module) -------------------------------------------- */
.send-band{position:relative;overflow:hidden;background:var(--navy);color:#fff;padding-block:clamp(70px,8vw,140px)}
.send-band::after{content:'';position:absolute;right:-6vw;bottom:-14vw;width:42vw;aspect-ratio:1.1;background:var(--blue);opacity:.22;clip-path:polygon(0 0,100% 0,50% 100%);pointer-events:none}
.send-band-grid{position:relative;z-index:1;display:grid;grid-template-columns:auto minmax(0,1.3fr) minmax(0,.8fr);gap:clamp(28px,4vw,72px);align-items:center}
.send-band-icon{display:grid;place-items:center;width:clamp(110px,11vw,180px);aspect-ratio:1;background:var(--blue);color:#fff;transition:transform .5s var(--ease)}
.send-band-icon .icon{width:44%;height:44%;stroke-width:1.4}
.send-band:hover .send-band-icon{transform:translateY(-8px)}
.motion .send-band-icon .icon{animation:send-float 2.8s var(--ease-io) infinite}
@keyframes send-float{0%,100%{transform:translateY(6%)}50%{transform:translateY(-8%)}}
.send-band-copy p:not(.label){max-width:560px;margin:22px 0 0;font-size:clamp(17px,1.3vw,20px);color:#dbe6f0}
.send-band-copy .display-2{font-size:clamp(36px,4.4vw,80px)}
.send-steps{list-style:none;counter-reset:s;margin:26px 0 0;padding:0;display:grid;gap:10px}
.send-steps li{counter-increment:s;display:flex;align-items:center;gap:14px;font:500 13px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.07em;color:#dbe6f0}
.send-steps li::before{content:'0' counter(s);display:grid;place-items:center;width:34px;height:34px;border:1.5px solid var(--blue-300);color:var(--blue-300)}

/* News ---------------------------------------------------------------- */
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,40px)}
.news-archive{row-gap:clamp(40px,4vw,64px)}
.news-card a{display:block}
.news-card-media img{width:100%;aspect-ratio:16/11;object-fit:cover;transition:transform 1s var(--ease)}
.news-card a:hover .news-card-media img{transform:scale(1.05)}
.news-card .meta{margin:20px 0 10px}
.news-card h3{margin-bottom:16px;transition:color .25s}
.news-card a:hover h3{color:var(--blue-700)}
.news-card .text-link{color:var(--blue-700)}

/* Footer -------------------------------------------------------------- */
.site-footer{position:relative;overflow:hidden;background:var(--navy);color:#fff;padding-top:clamp(80px,9vw,150px)}
.footer-callout{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:30px;padding-bottom:clamp(50px,6vw,90px);border-bottom:2px solid #ffffff26}
.footer-callout .label{grid-column:1/-1;margin-bottom:0}
.footer-callout h2{max-width:13em}
.footer-callout em{color:var(--blue-300)}
.footer-go{display:inline-flex;align-items:center;gap:18px;min-height:64px;padding:0 30px;background:var(--blue);font-weight:700;font-stretch:108%;font-size:17px;transition:background .3s,color .3s}
.footer-go:hover{background:#fff;color:var(--navy)}
.footer-go .icon{transition:transform .4s var(--ease)}
.footer-go:hover .icon{transform:translateX(6px)}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:clamp(30px,4vw,70px);padding-block:clamp(50px,6vw,80px)}
.footer-logo img{height:84px;width:auto}
.footer-about p{margin-top:22px;max-width:380px;color:#c7d3df;font-size:15px}
.site-footer h3{margin-bottom:22px;font:500 13px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.09em;color:var(--blue-300)}
.footer-links{list-style:none;margin:0;padding:0}
.footer-links li{margin-bottom:10px}
.footer-links a{font-size:16px;color:#e4ebf2;transition:color .2s}
.footer-links a:hover{color:var(--blue-300)}
.footer-send{display:inline-flex;align-items:center;gap:8px;font-weight:700}
.footer-send .icon{width:18px;height:18px;color:var(--blue-300)}
.footer-contact a{display:flex;gap:12px;margin-bottom:14px;font-size:16px;color:#e4ebf2;transition:color .2s}
.footer-contact a:hover{color:var(--blue-300)}
.footer-contact .icon{width:20px;height:20px;margin-top:2px;color:var(--blue-300)}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 30px;padding:26px 0;border-top:2px solid #ffffff26;font-size:14px;color:#c7d3df}
.footer-bottom p{margin:0}
.social-links{display:flex;flex-wrap:wrap;gap:6px 22px}
.social-links a,.back-top{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;color:#fff}
.social-links a:hover,.back-top:hover{color:var(--blue-300)}
.back-top .icon{width:16px;height:16px;transform:rotate(-45deg)}
.footer-wordmark{font:900 clamp(60px,14.4vw,300px)/.78 var(--display);font-stretch:125%;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:1.5px #ffffff26;white-space:nowrap;text-align:center;margin-bottom:-.06em;user-select:none;transform:translateX(var(--drift,0))}
.whatsapp-link{position:fixed;right:20px;bottom:20px;z-index:90;display:grid;place-items:center;width:58px;height:58px;background:#25d366;color:#fff;box-shadow:0 14px 30px -12px #031a3480;transition:transform .3s var(--ease)}
.whatsapp-link:hover{transform:translateY(-4px)}
.whatsapp-link svg{width:30px;height:30px}

/* Inner page hero ----------------------------------------------------- */
.page-hero{background:#fff}
.page-hero-block{background:var(--blue);color:#fff;padding-block:clamp(40px,5vw,80px) clamp(70px,8vw,130px);position:relative}
.page-hero-block::before{content:'';position:absolute;right:var(--gutter);top:0;width:clamp(120px,16vw,260px);aspect-ratio:1.1;background:#ffffff12;clip-path:polygon(0 0,100% 0,50% 100%)}
.breadcrumbs{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:clamp(28px,3.4vw,52px);font:500 12px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#e1edf7}
.breadcrumbs a{text-decoration:underline;text-decoration-color:#ffffff66;text-underline-offset:4px}
.breadcrumbs a:hover{text-decoration-color:#fff}
.page-hero h1{position:relative;max-width:16em}
.page-hero.has-media{--overlap:clamp(80px,10vw,180px);padding-bottom:var(--overlap)}
.page-hero.has-media .page-hero-block{padding-bottom:0}
.page-hero-media{margin-top:clamp(36px,4vw,64px);margin-bottom:calc(-1 * var(--overlap));height:clamp(240px,34vw,560px)}
.page-hero-media img{width:100%;height:100%;object-fit:cover}

/* Common layouts ------------------------------------------------------ */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,120px);align-items:start;margin-bottom:clamp(50px,6vw,96px)}
.split:last-child{margin-bottom:0}
.split-media{align-items:center}
.split .button-row{margin-top:28px}
.wide-media img{width:100%;aspect-ratio:21/9;object-fit:cover}
.features{display:grid;gap:clamp(60px,7vw,120px)}
.feature{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(30px,5vw,90px);align-items:center}
.feature:nth-child(even) .feature-media{order:2}
.feature-media img{width:100%;aspect-ratio:4/3;object-fit:cover}
.feature-num{display:block;margin-bottom:16px;font:850 clamp(48px,5vw,88px)/.8 var(--display);font-stretch:118%;color:transparent;-webkit-text-stroke:2px var(--blue)}
.feature h2{margin-bottom:24px}
.feature h2 a:hover{color:var(--blue-700)}
.feature .btn{margin-top:28px}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.4vw,36px)}
.dark-card{background:var(--navy-800);padding:0 0 32px}
.dark-card-media img{width:100%;aspect-ratio:3/2;object-fit:cover}
.dark-card .label-num{display:block;margin:26px 28px 10px}
.dark-card h3,.dark-card .body-copy{padding-inline:28px}
.dark-card h3{margin-bottom:12px}
.tiles{display:grid;gap:clamp(14px,1.6vw,20px)}
.tiles-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.tile{--bg:var(--steel-100);--fg:var(--text);background:var(--bg);color:var(--fg);padding:clamp(26px,3vw,44px)}
.tile.tone-blue{--bg:var(--blue);--fg:#fff}
.tile.tone-navy{--bg:var(--navy);--fg:#fff}
.tile.tone-white{--bg:#fff}
.tile.tone-steel{--bg:var(--steel-200)}
.tile-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.tile-num{display:block;margin-bottom:22px;font:500 13px/1 var(--mono);letter-spacing:.06em}
.tile-icon{width:46px;height:46px;object-fit:contain}
.tone-blue .tile-icon,.tone-navy .tile-icon{filter:brightness(0) invert(1)}
.tile h3{font-size:clamp(24px,2.2vw,36px);margin-bottom:14px}
.tile .body-copy{color:inherit;opacity:.9}
.ideology{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);align-items:stretch}
.ideology-media img{height:100%;aspect-ratio:auto;min-height:420px}
.row-links{display:grid;border-top:2px solid var(--navy)}
.row-links a{position:relative;display:grid;grid-template-columns:60px minmax(0,1fr) auto 40px;align-items:center;gap:20px;padding:26px 8px;border-bottom:2px solid var(--line);isolation:isolate;transition:color .3s}
.row-links a::before{content:'';position:absolute;inset:0;z-index:-1;background:var(--blue);transform:scaleY(0);transform-origin:bottom;transition:transform .4s var(--ease)}
.row-links a:hover{color:#fff}
.row-links a:hover::before{transform:scaleY(1);transform-origin:top}
.row-links .row-num{color:var(--blue-700);transition:color .3s}
.row-links a:hover .row-num{color:#fff}
.row-links .row-title{font:800 clamp(22px,2.2vw,36px)/1.1 var(--display);font-stretch:108%}
.row-links .row-meta{font:500 13px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--muted);transition:color .3s}
.row-links a:hover .row-meta{color:#fff}
.row-links .icon{transition:transform .4s var(--ease)}
.row-links a:hover .icon{transform:translateX(6px)}
.archive-list a{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 40px}
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.72fr);gap:clamp(30px,6vw,110px);align-items:start}
.article-copy>*:first-child{margin-top:0}
.cta-block{background:var(--blue);color:#fff;padding-block:clamp(60px,7vw,120px)}
.cta-inner{display:flex;align-items:flex-end;justify-content:space-between;gap:30px 60px;flex-wrap:wrap}
.cta-inner h2{max-width:14em}

/* Projects ------------------------------------------------------------ */
.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.filter-bar button{min-height:48px;padding:0 20px;border:2px solid var(--navy);font-weight:700;font-stretch:106%;font-size:15px;color:var(--navy);transition:background .25s,color .25s,border-color .25s}
.filter-bar button:hover{background:var(--steel-100)}
.filter-bar button[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:#fff}
.filter-status{display:block;margin-bottom:34px;color:var(--muted)}
.filter-status::before{display:none}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,4vw,64px) clamp(20px,2.4vw,40px)}
.project-grid>.project-card:nth-child(4n+2){margin-top:clamp(0px,6vw,110px)}
.project-grid>.project-card:nth-child(4n+3){margin-top:calc(-1 * clamp(0px,6vw,110px))}
.project-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-grid-3>.project-card:nth-child(n){margin-top:0}
.project-card a{display:block}
.project-card-media{background:var(--steel-100)}
.project-card-media img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1.1s var(--ease)}
.project-card a:hover .project-card-media img{transform:scale(1.05)}
.project-card-cta{position:absolute;left:0;bottom:0;z-index:1;display:inline-flex;align-items:center;gap:14px;padding:16px 22px;background:var(--blue);color:#fff;font-weight:700;font-stretch:106%;transform:translateY(101%);transition:transform .45s var(--ease)}
.project-card a:hover .project-card-cta,.project-card a:focus-visible .project-card-cta{transform:none}
.project-card-meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin:18px 0 10px;font:500 12px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.project-card-meta span:first-child{color:var(--blue-700)}
.project-card h3{font-size:clamp(22px,2vw,32px);transition:color .25s}
.project-card a:hover h3{color:var(--blue-700)}
.load-more-wrap{display:flex;justify-content:center;margin-top:clamp(50px,5vw,80px)}
.project-hero{position:relative;min-height:min(86vh,860px);display:flex;align-items:flex-end;overflow:hidden;background:var(--navy)}
.project-hero-media{position:absolute;inset:0;margin:0}
.project-hero-media img{width:100%;height:110%;object-fit:cover}
.project-hero-inner{position:relative;z-index:1}
.project-hero-block{display:inline-block;max-width:min(100%,980px);background:var(--blue);color:#fff;padding:clamp(28px,3.4vw,56px) clamp(24px,3.4vw,56px) clamp(30px,3.4vw,56px) 0;position:relative}
.project-hero-block::before{content:'';position:absolute;top:0;bottom:0;right:100%;width:100vw;background:var(--blue)}
.project-hero-block .breadcrumbs{margin-bottom:24px}
.facts-bar{background:var(--navy);color:#fff;padding-block:clamp(30px,3vw,46px)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px 40px;margin:0}
.facts dt{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--blue-300)}
.facts dd{margin:10px 0 0;font-size:clamp(18px,1.4vw,22px);font-weight:600;font-stretch:104%}
.project-story{margin-bottom:clamp(50px,6vw,96px)}
.project-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
.project-gallery a{display:block;position:relative}
.project-gallery a:first-child:last-child{grid-column:1/-1}
.project-gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform 1s var(--ease)}
.project-gallery a:hover img{transform:scale(1.04)}
.gallery-zoom{position:absolute;right:0;bottom:0;z-index:3;display:grid;place-items:center;width:56px;height:56px;background:var(--blue);color:#fff}

/* Products ------------------------------------------------------------ */
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(36px,4vw,60px) clamp(20px,2.4vw,40px)}
.product-card a{display:block}
.product-card-media img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform 1s var(--ease)}
.product-card a:hover .product-card-media img{transform:scale(1.05)}
.product-card-title{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:18px 0;border-bottom:3px solid var(--navy);transition:border-color .3s}
.product-card-title h2,.product-card-title h3{font-size:clamp(20px,1.6vw,26px);font-weight:750;font-stretch:106%}
.product-card a:hover .product-card-title{border-color:var(--blue)}
.product-card a:hover .icon{color:var(--blue);transform:translateX(5px)}
.product-card .icon{transition:transform .35s var(--ease)}
.product-card p{margin:16px 0 0;color:var(--muted);font-size:16px}
.product-grid-3 .product-card-title{grid-template-columns:minmax(0,1fr) auto}

/* Forms --------------------------------------------------------------- */
.form-panel{padding:clamp(28px,3vw,48px);position:sticky;top:calc(var(--header) + 24px)}
.form-panel.tone-blue{background:var(--blue);color:#fff}
.form-panel.tone-navy{background:var(--navy);color:#fff}
.form-panel h2{font-size:clamp(28px,2.6vw,42px);font-stretch:108%;margin-bottom:26px;text-transform:none}
.form-surface p{margin:0 0 14px}
.form-surface label{display:block;margin:0 0 8px;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.07em}
.form-surface br{display:none}
.form-surface input:not([type=submit]):not([type=checkbox]):not([type=radio]):not([type=file]),.form-surface textarea,.form-surface select{display:block;width:100%;min-height:54px;padding:14px 16px;background:#fff;color:var(--text);border:2px solid #fff;border-radius:0;font-size:16px;line-height:1.4;box-shadow:none;transition:border-color .2s}
.form-surface input,.form-surface textarea,.form-surface select{font-family:var(--body);letter-spacing:0;text-transform:none}
.form-surface textarea{min-height:130px;resize:vertical}
.form-surface input[type=file]::file-selector-button{margin-right:14px;padding:10px 16px;border:0;background:#fff;color:var(--navy);font:700 14px/1 var(--body);cursor:pointer}
.form-surface input:focus,.form-surface textarea:focus,.form-surface select:focus{outline:0;border-color:var(--blue-300)}
.form-surface input::placeholder,.form-surface textarea::placeholder{color:#5f6b78;opacity:1}
.form-surface input[type=file]{width:100%;padding:12px;background:#ffffff14;border:2px dashed #ffffff66;font-size:14px}
.form-surface input[type=submit],.form-surface button[type=submit]{min-height:58px;width:100%;margin-top:10px;padding:0 26px;background:#fff;color:var(--navy);border:0;font:700 16px/1 var(--body);font-stretch:108%;cursor:pointer;transition:background .25s,color .25s}
.tone-navy .form-surface input[type=submit]:hover,.tone-navy .form-surface button[type=submit]:hover{background:var(--blue);color:#fff}
.tone-blue .form-surface input[type=submit]:hover,.tone-blue .form-surface button[type=submit]:hover{background:var(--navy);color:#fff}
.form-surface .row{display:grid;grid-template-columns:1fr;gap:0}
.form-surface .posttitle{display:none}
.form-surface .wpcf7-form-control-wrap{display:block;margin-bottom:12px}
.form-surface .wpcf7-not-valid-tip{margin-top:6px;font:600 14px/1.4 var(--body);letter-spacing:0;text-transform:none;color:#ffd2c7}
.form-surface .wpcf7-response-output{margin:18px 0 0!important;padding:14px!important;font-size:14px;border-color:#fff!important}
.form-surface .wpcf7-spinner{margin:0 10px}
.form-surface a{color:inherit;text-decoration:underline}

/* Contact ------------------------------------------------------------- */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,6vw,110px);align-items:start}
.contact-details dl{margin:clamp(30px,4vw,56px) 0 0;display:grid;gap:0;border-top:2px solid var(--navy)}
.contact-details dl>div{padding:24px 0;border-bottom:2px solid var(--line)}
.contact-details dt{font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--blue-700)}
.contact-details dd{margin:10px 0 0;font:800 clamp(22px,2.2vw,36px)/1.15 var(--display);font-stretch:106%;overflow-wrap:anywhere}
.contact-details dd a:hover{color:var(--blue-700)}
.contact-address{display:inline-flex;align-items:flex-start;gap:12px}
.contact-address .icon{margin-top:.25em;width:24px;height:24px;color:var(--blue)}
.map-section iframe{display:block;width:100%;border:0;filter:grayscale(1) contrast(1.05)}

/* Not found ----------------------------------------------------------- */
.not-found{position:relative;overflow:hidden;background:var(--blue);color:#fff;min-height:calc(100svh - var(--header));display:flex;align-items:center;padding-block:clamp(60px,8vw,120px)}
.not-found .container{position:relative}
.not-found-code{margin:0 0 10px;font:900 clamp(120px,26vw,420px)/.78 var(--display);font-stretch:125%;color:transparent;-webkit-text-stroke:2px #ffffffaa;letter-spacing:-.03em}
.not-found h1{max-width:14em}

/* Photo viewer -------------------------------------------------------- */
.photo-open{overflow:hidden}
.photo-lightbox{position:fixed;inset:0;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:60px 40px 30px;border:0;background:#031a34f2;color:#fff}
.photo-lightbox::backdrop{background:#031a34cc}
.photo-lightbox[open]{display:flex;flex-direction:column;align-items:center;justify-content:center}
.photo-lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;max-width:1300px;width:100%}
.photo-lightbox img{max-width:100%;max-height:76vh;object-fit:contain}
.photo-lightbox figcaption{margin-top:14px;font:500 12px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#c7d3df}
.lightbox-close{position:absolute;top:14px;right:14px;display:grid;place-items:center;width:52px;height:52px;background:var(--blue);color:#fff;font-size:30px;line-height:1}
.lightbox-navigation{display:flex;align-items:center;gap:20px;margin-top:20px}
.lightbox-navigation button{display:grid;place-items:center;width:52px;height:52px;border:2px solid #fff;color:#fff;font-size:22px}
.lightbox-navigation button:hover{background:#fff;color:var(--navy)}
.lightbox-navigation span{font:500 13px/1 var(--mono)}

/* Responsive ---------------------------------------------------------- */
@media (max-width:1280px){
  .nav-list a{font-size:15px;padding-inline:8px}
  .nav-list>li>a::after{left:8px;right:8px}
  .primary-nav{gap:16px}
  .header-inner{gap:20px}
}
@media (max-width:1140px){
  :root{--header:80px}
  .brand img{height:56px}
  .menu-toggle{display:inline-flex}
  .primary-nav{position:fixed;inset:var(--header) 0 0;z-index:99;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:30px;padding:28px var(--gutter) 36px;background:var(--blue);color:#fff;overflow:auto;visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .55s var(--ease-io),visibility 0s .55s}
  .primary-nav.is-open{visibility:visible;clip-path:inset(0);transition:clip-path .55s var(--ease-io)}
  .nav-list{display:block}
  .nav-list>li{overflow:hidden}
  .nav-list>li>a{padding:12px 0;border-bottom:2px solid #ffffff33;color:#fff;font:850 clamp(32px,7vw,56px)/1.05 var(--display);font-stretch:112%;text-transform:uppercase;white-space:normal}
  .nav-list>li>a::after{display:none}
  .nav-list>li>a:hover,.nav-list>li>a[aria-current=page],.nav-list>.current-menu-item>a{color:#fff;opacity:.75}
  .motion .nav-list>li>a{transform:translateY(100%);transition:transform .6s var(--ease)}
  .motion .primary-nav.is-open .nav-list>li>a{transform:none;transition-delay:calc(var(--n,0) * 45ms + .15s)}
  .nav-list .sub-menu{position:static;display:block;background:none;box-shadow:none;border:0;padding:6px 0 10px}
  .nav-list .sub-menu a{color:#fff;font-size:17px;padding:8px 0}
  .header-actions{flex-wrap:wrap}
  .header-actions .btn{flex:1 1 220px;min-height:58px}
  .header-send{--btn-fg:#fff;border-color:#fff}
  .header-contact{--btn-bg:#fff;--btn-fg:var(--navy)}
  .header-send[aria-current=page]{--btn-bg:#fff;--btn-fg:var(--navy)}
  .menu-open .site-header{box-shadow:none}
}
@media (min-width:761px) and (orientation:portrait){
  .hero-slide.hero-trio{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
  .hero-trio .hero-panel:first-child{grid-row:1/span 2}
}
@media (max-width:1050px){
  .home-hero-inner{grid-template-columns:1fr}
  .hero-controls{justify-self:start}
  .work-head{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
  .rail-intro{grid-template-columns:1fr auto}
  .rail-intro .body-copy{grid-column:1/-1;grid-row:2}
  .clients-head,.split,.statement-grid,.feature,.ideology,.contact-grid,.detail-grid{grid-template-columns:1fr}
  .feature:nth-child(even) .feature-media{order:0}
  .send-band-grid{grid-template-columns:auto minmax(0,1fr)}
  .send-band-action{grid-column:1/-1}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-about{grid-column:1/-1}
  .card-grid,.tiles-3,.product-grid,.news-grid,.project-grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-panel{position:static}
  .ideology-media img{min-height:0;aspect-ratio:16/10}
  .work-stack{background:none}
  .work-panel{position:relative;height:auto;min-height:0;transform:none!important;background:var(--navy)}
  .work-panel+.work-panel{margin-top:14px}
  .work-panel::after,.work-backdrop{display:none}
  .work-panel-inner{display:block;width:100%;height:auto;padding:0}
  .work-photo img{position:static;display:block;width:100%;height:auto;max-height:82svh;object-fit:contain;object-position:50% 50%}
  .work-side{display:block}
  .work-full{position:absolute;top:12px;right:12px;z-index:2;min-height:44px;padding:0 14px}
  .compare-head{grid-template-columns:1fr}
  .compare-projects{max-width:560px}
  .compare-stage{width:min(100%,calc(78vh * var(--ratio)));width:min(100%,calc(78svh * var(--ratio)));height:auto;aspect-ratio:var(--ratio);margin-inline:auto}
  .cmp-layer,.cmp-frame{left:0;width:100%;transform:none}
  .compare-word{display:none}
  .compare-stage.is-split,.compare:not(.is-ready) .compare-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:min(100%,calc(2 * 78vh * var(--ratio) + 10px));width:min(100%,calc(2 * 78svh * var(--ratio) + 10px));aspect-ratio:auto}
  .compare-stage.is-split .cmp-layer,.compare:not(.is-ready) .compare-stage .cmp-layer{position:relative;grid-row:1;height:auto;aspect-ratio:var(--ratio);transform:none}
  .cmp-playback{width:min(100%,calc(78vh * var(--ratio)));width:min(100%,calc(78svh * var(--ratio)))}
  .compare-stage.is-split+.cmp-playback{width:min(100%,calc(2 * 78vh * var(--ratio) + 10px));width:min(100%,calc(2 * 78svh * var(--ratio) + 10px))}
  .compare-stage.is-split .cmp-concept,.compare:not(.is-ready) .compare-stage .cmp-concept{grid-column:1}
  .compare-stage.is-split .cmp-reality,.compare:not(.is-ready) .compare-stage .cmp-reality{grid-column:2}
}
@media (max-width:760px){
  :root{--header:72px}
  body{font-size:16px}
  .brand img{height:50px}
  .display-1,.display-2,.display-3,.home-hero-title{font-stretch:100%}
  .display-1{font-size:clamp(36px,10.4vw,64px)}
  .display-2{font-size:clamp(32px,9vw,54px)}
  .display-3{font-size:clamp(27px,7.6vw,40px)}
  .home-hero{display:block;height:auto;min-height:0;background:var(--blue)}
  .home-hero-slides{position:relative;inset:auto;z-index:0;aspect-ratio:4/3;background:var(--navy)}
  .hero-slide.hero-trio{gap:4px}
  .home-hero-shade{display:none}
  .home-hero-inner{padding-top:26px;padding-bottom:28px;gap:24px}
  .home-hero-title{font-size:clamp(26px,7.6vw,40px);text-shadow:none}
  .hero-key{background-image:linear-gradient(var(--navy),var(--navy))}
  .motion .home-hero-title .split-word::after{background:var(--navy)}
  .home-hero .hero-controls{position:absolute;left:0;top:calc(75vw - 48px);width:auto;margin:0}
  .hero-progress{display:none}
  .hero-btn{width:48px;height:48px}
  .hero-full{padding:0;width:48px}
  .hero-full span{display:none}
  .section-head{flex-direction:column;align-items:flex-start;gap:24px}
  .work-info h3{font-stretch:100%}
  .tile-grid{grid-template-columns:1fr}
  .tile-grid.is-odd>.service-tile:first-child .service-tile-media img{aspect-ratio:16/10}
  .service-tile-body{position:relative;width:100%}
  .service-tile-title{font-stretch:100%}
  .marquee-words .marquee-item{font-stretch:100%}
  .stat{padding-inline:14px}
  .stat strong{font-size:clamp(42px,12vw,64px);font-stretch:100%}
  .rail-intro{grid-template-columns:1fr}
  .rail-buttons{display:none}
  .rail-card{flex-basis:76vw}
  .send-band-grid{grid-template-columns:1fr}
  .send-band-icon{width:96px}
  .footer-callout{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-wordmark{font-stretch:100%}
  .card-grid,.tiles-3,.product-grid,.news-grid,.project-grid,.project-grid-3{grid-template-columns:1fr}
  .project-grid>.project-card:nth-child(n){margin-top:0}
  .project-gallery{grid-template-columns:1fr}
  .row-links a{grid-template-columns:40px minmax(0,1fr) 30px;gap:14px;padding-block:20px}
  .row-links .row-meta{grid-column:2;grid-row:2}
  .archive-list a{grid-template-columns:minmax(0,1fr) 30px}
  .archive-list .row-meta{grid-column:1}
  .cut-corner{clip-path:polygon(0 0,100% 0,100% calc(100% - 46px),calc(100% - 46px) 100%,0 100%)}
  .project-hero{min-height:72vh}
  .project-hero-block{padding-right:22px}
  .whatsapp-link{width:52px;height:52px;right:14px;bottom:14px}
  .contact-details dd{font-size:clamp(20px,6vw,28px)}
  .photo-lightbox{padding:72px 10px 24px}
  .photo-lightbox img{max-height:70vh}
  .compare-head{gap:28px}
  .cmp-project-name{font-stretch:100%}
  .cmp-project-head{padding-block:17px}
  .cmp-knob{width:52px;height:52px}
  .cmp-tag{padding:8px 10px;font-size:11px}
  .compare-controls{display:grid;grid-template-columns:minmax(0,1fr);gap:14px}
  .cmp-views{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .cmp-view{flex-direction:column;gap:8px;padding:8px}
  .cmp-actions{gap:8px;margin-right:0}
  .cmp-modes button{padding:0 11px;gap:7px;font-size:14px}
  .cmp-full{width:55px;padding:0;justify-content:center}
  .cmp-full span{display:none}
}
@media (max-width:380px){
  .cmp-modes .icon{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hero-slide{clip-path:inset(0 0 0 100%)}
  .hero-slide.is-active{clip-path:inset(0)}
  .hero-slide img,.wipe>img{transform:none!important}
  .hero-panel{clip-path:none!important}
  .footer-wordmark{transform:none}
}