@font-face{font-family:Manrope;src:url('../fonts/manrope-latin.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'DM Mono';src:url('../fonts/dmmono-latin-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Mono';src:url('../fonts/dmmono-latin-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
:root{--ink:#05080b;--ink-2:#0a0f14;--ink-3:#101820;--paper:#f4f7f9;--paper-2:#e9eef2;--white:#fff;--blue:#2e7cbe;--cyan:#49b1e8;--blue-dark:#123e68;--muted:#82909d;--line:rgba(255,255,255,.14);--line-dark:rgba(5,8,11,.14);--shadow:0 34px 90px rgba(0,0,0,.22);--radius:28px;--header-h:84px;--wrap:1540px;--pad:clamp(20px,3vw,54px)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,Arial,sans-serif;background:var(--ink);color:var(--white);font-size:16px;line-height:1.55;overflow-x:hidden}body.menu-open{overflow:hidden}img{display:block;width:100%;height:auto}a{color:inherit;text-decoration:none}button,select,input,textarea{font:inherit}button{color:inherit}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;left:20px;top:-60px;z-index:9999;background:#fff;color:#000;padding:12px 16px;border-radius:999px}.skip-link:focus{top:14px}.wrap-wide{width:min(var(--wrap),calc(100% - var(--pad)*2));margin-inline:auto}.scene-dark{background:var(--ink);color:#fff}.scene-light{background:var(--paper);color:var(--ink)}.scene-blue{background:linear-gradient(135deg,#174d7b 0%,#2e7cbe 42%,#42aee8 100%);color:#fff}.micro{font-family:'DM Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;line-height:1.45}.status-dot{width:7px;height:7px;background:var(--cyan);border-radius:50%;box-shadow:0 0 0 7px rgba(73,177,232,.12)}em{font-style:normal;color:var(--muted)}.site-noise{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.scroll-progress{position:fixed;left:0;top:0;width:100%;height:2px;z-index:1200;background:transparent}.scroll-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left}

/* Header */
.site-header{position:fixed;z-index:1000;left:0;right:0;top:0;padding:14px var(--pad);transition:padding .35s ease,transform .35s ease}.header-shell{height:70px;max-width:var(--wrap);margin:auto;padding:0 16px 0 22px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(5,8,11,.58);backdrop-filter:blur(18px);display:flex;align-items:center;gap:26px;box-shadow:0 8px 40px rgba(0,0,0,.12);transition:background .3s,border .3s,height .3s}.site-header.is-scrolled{padding-top:8px}.site-header.is-scrolled .header-shell{height:62px;background:rgba(5,8,11,.9)}.brand{display:flex;width:188px;flex:0 0 auto;align-items:center}.brand img{width:100%;height:auto}.desktop-nav{display:flex;align-items:center;gap:25px;margin-left:auto}.nav-link{position:relative;font-size:13px;color:rgba(255,255,255,.78);transition:color .25s}.nav-link:hover,.nav-link.active{color:#fff}.nav-link::after{content:"";position:absolute;left:0;right:100%;bottom:-8px;height:1px;background:var(--cyan);transition:right .25s}.nav-link:hover::after,.nav-link.active::after{right:0}.nav-link span{color:var(--cyan);font-size:11px}.nav-services{position:relative}.mega-menu{position:absolute;top:46px;left:50%;transform:translateX(-50%) translateY(12px);width:min(960px,80vw);padding:28px;background:#0a0f14;border:1px solid rgba(255,255,255,.13);border-radius:24px;display:grid;grid-template-columns:1.1fr 2fr;gap:34px;opacity:0;visibility:hidden;pointer-events:none;box-shadow:var(--shadow);transition:.25s}.nav-services:hover .mega-menu,.nav-services:focus-within .mega-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}.mega-lead{padding:14px 18px 18px 6px;border-right:1px solid rgba(255,255,255,.1)}.mega-lead h3{font-size:32px;line-height:1.03;margin:20px 0}.mega-lead p{color:#95a2ad;font-size:14px;max-width:350px}.mega-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}.mega-grid>div{display:flex;flex-direction:column;gap:8px}.mega-grid .micro{color:#607687;margin-bottom:4px}.mega-grid a{font-size:14px;color:#dfe7ed}.mega-grid a:hover{color:var(--cyan)}.arrow-link{display:inline-flex;align-items:center;gap:10px;font-size:14px;font-weight:650}.arrow-link span,.arrow-link b{color:var(--blue)}.scene-dark .arrow-link span,.scene-dark .arrow-link b,.scene-blue .arrow-link span,.scene-blue .arrow-link b{color:var(--cyan)}.header-actions{display:flex;align-items:center;gap:9px}.language-control select{appearance:none;background:transparent;color:#fff;border:0;padding:8px 4px;font-family:'DM Mono';font-size:11px;outline:none}.language-control option{background:#081018}.header-contact{display:flex;align-items:center;gap:12px;background:#fff;color:#05080b;padding:13px 18px;border-radius:999px;font-size:12px;font-weight:750;white-space:nowrap}.header-contact span{color:var(--blue)}.menu-toggle{display:none;width:42px;height:42px;border:0;background:transparent;position:relative}.menu-toggle span{position:absolute;width:20px;height:1px;background:#fff;left:11px;top:18px;transition:.3s}.menu-toggle span+span{top:24px}.menu-toggle[aria-expanded="true"] span{top:21px;transform:rotate(45deg)}.menu-toggle[aria-expanded="true"] span+span{transform:rotate(-45deg)}.mobile-panel{position:fixed;inset:0;z-index:-1;background:#05080b;padding:120px var(--pad) 40px;opacity:0;visibility:hidden;transform:translateY(-14px)}.mobile-panel-inner{height:100%;display:flex;flex-direction:column}.mobile-panel-inner>a{font-size:clamp(34px,8vw,58px);line-height:1.08;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1)}.mobile-contact{margin-top:auto;display:flex;flex-direction:column;gap:7px;color:#9eabb4}

/* Pills */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:22px;padding:15px 22px;border-radius:999px;border:1px solid transparent;font-size:13px;font-weight:720;transition:transform .25s,background .25s,color .25s,border .25s}.pill:hover{transform:translateY(-2px)}.pill-primary{background:linear-gradient(120deg,var(--blue),var(--cyan));color:white;box-shadow:0 10px 36px rgba(46,124,190,.22)}.pill-invert{background:#fff;color:#061018}.pill-text{padding-left:0;padding-right:0;background:transparent;color:inherit}.pill-text span{color:var(--cyan)}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px}

/* Home hero */
.home-hero{min-height:100svh;position:relative;padding-top:calc(var(--header-h) + 62px);overflow:hidden}.home-hero::before{content:"";position:absolute;width:48vw;height:48vw;border-radius:50%;background:radial-gradient(circle,rgba(52,158,220,.2),transparent 65%);right:-10vw;top:-14vw;filter:blur(10px)}.home-hero-stage{display:grid;grid-template-columns:1.08fr .92fr;min-height:calc(100svh - 190px);align-items:center;gap:40px;position:relative}.home-hero-copy{position:relative;z-index:4}.hero-meta{display:flex;align-items:center;gap:14px;color:#97a5b0;font-family:'DM Mono';font-size:10px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:42px}.hero-meta i{display:block;width:70px;height:1px;background:rgba(255,255,255,.22)}.home-hero h1{font-size:clamp(68px,8.3vw,150px);letter-spacing:-.065em;line-height:.83;margin:0;font-weight:690}.home-hero h1 span{display:block}.home-hero .hero-accent{background:linear-gradient(115deg,#fff 0%,#67c7f5 44%,#2e7cbe 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy-bottom{display:grid;grid-template-columns:minmax(260px,430px) 1fr;align-items:end;gap:28px;margin-top:42px}.hero-copy-bottom p{font-size:17px;color:#aab7c1;margin:0;max-width:430px}.hero-visual{height:min(68vh,760px);position:relative}.hero-frame{position:absolute;margin:0;overflow:hidden;border-radius:24px;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.14)}.hero-frame img{height:100%;object-fit:cover}.hero-frame-a{width:67%;height:72%;right:0;top:4%;z-index:2}.hero-frame-b{width:41%;height:42%;left:0;bottom:2%;z-index:4}.hero-frame-c{width:31%;height:38%;right:7%;bottom:0;z-index:3}.hero-frame-b img,.hero-frame-c img{object-position:center}.hero-badge{position:absolute;z-index:5;left:7%;top:14%;background:rgba(5,8,11,.78);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(14px);border-radius:50%;width:145px;height:145px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.hero-badge span{font-family:'DM Mono';font-size:8px;letter-spacing:.15em;color:#8fa0ac}.hero-badge b{font-size:13px;line-height:1.1;margin-top:8px}.hero-orbit{position:absolute;border:1px solid rgba(72,180,236,.28);border-radius:50%;z-index:1}.orbit-one{width:72%;height:72%;right:-12%;top:-6%}.orbit-two{width:50%;height:50%;left:16%;bottom:-10%}.hero-scroll-cue{height:72px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;color:#6f7e8b;font-family:'DM Mono';font-size:9px;letter-spacing:.13em}.hero-scroll-cue i{height:1px;background:rgba(255,255,255,.13)}

.tool-belt{padding:38px 0;border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);overflow:hidden}.tool-belt-top{display:flex;justify-content:space-between;color:#60707c;margin-bottom:28px}.tool-runner{overflow:hidden}.tool-runner-track{display:flex;width:max-content;align-items:center;gap:34px;font-size:clamp(34px,5.4vw,82px);font-weight:720;letter-spacing:-.045em;white-space:nowrap}.tool-runner-track i{font-style:normal;color:var(--blue);font-size:.48em}

.home-intro{padding:clamp(90px,11vw,180px) 0;position:relative;overflow:hidden}.intro-stage{display:grid;grid-template-columns:.42fr 1.45fr .68fr;gap:clamp(30px,5vw,85px);align-items:start}.intro-index{padding-top:12px}.intro-index i{display:block;width:1px;height:170px;background:var(--line-dark);margin:28px 0}.intro-index p{font-size:12px;color:#70808b}.intro-main h2{font-size:clamp(54px,7.2vw,116px);letter-spacing:-.06em;line-height:.94;margin:0}.intro-main h2 span{display:block;color:#95a2ad}.intro-lower{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:end;margin-top:58px}.intro-lower p{font-size:18px;line-height:1.65;max-width:660px;color:#3f4c56;margin:0}.round-cta{width:86px;height:86px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:28px;transition:.25s}.round-cta:hover{background:var(--blue);transform:rotate(8deg)}.intro-photo{margin:0;align-self:stretch;min-height:520px;overflow:hidden;border-radius:100px 20px 100px 20px}.intro-photo img{height:100%;object-fit:cover}

/* Service story */
.service-story{position:relative;padding:130px 0 90px}.service-story::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 22%,rgba(54,154,212,.15),transparent 28%)}.service-story-shell{position:relative}.service-story-head{display:grid;grid-template-columns:1.4fr .6fr;gap:50px;align-items:end;margin-bottom:80px}.service-story-head h2{font-size:clamp(52px,6.5vw,106px);letter-spacing:-.06em;line-height:.92;margin:16px 0 0}.service-story-head h2 em{display:block}.service-story-head>div:last-child{max-width:430px;justify-self:end}.service-story-head p{color:#9aa8b3}.service-story-stage{display:grid;grid-template-columns:130px 1fr;gap:30px;position:relative}.service-story-index{position:sticky;top:130px;height:max-content;padding-top:20px}.service-story-index strong{display:block;font-size:58px;line-height:1;margin-top:20px}.service-story-index>span:not(.micro){color:#64727e}.local-progress{width:2px;height:180px;background:rgba(255,255,255,.12);margin-top:28px;position:relative}.local-progress i{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--cyan);transform:scaleY(0);transform-origin:top}.service-story-cards{display:grid;gap:26px}.service-panel{min-height:72vh;display:grid;grid-template-columns:1.2fr .8fr;overflow:hidden;border-radius:34px;background:#0d141a;border:1px solid rgba(255,255,255,.1);position:relative;box-shadow:0 35px 80px rgba(0,0,0,.18)}.service-panel-media{position:relative;min-height:540px;overflow:hidden}.service-panel-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(5,8,11,.45))}.service-panel-media img{height:100%;object-fit:cover;transition:transform .7s}.service-panel:hover .service-panel-media img{transform:scale(1.035)}.service-panel-media span{position:absolute;left:24px;bottom:22px;z-index:2;background:rgba(5,8,11,.7);border:1px solid rgba(255,255,255,.12);padding:9px 13px;border-radius:999px;font-family:'DM Mono';font-size:9px;letter-spacing:.1em}.service-panel-copy{padding:clamp(32px,5vw,75px);display:flex;flex-direction:column;justify-content:center}.service-panel-copy .micro{color:#6faed7}.service-panel-copy h3{font-size:clamp(40px,4.4vw,72px);line-height:.98;letter-spacing:-.045em;margin:18px 0 24px}.service-panel-copy p{color:#9aabb8;font-size:17px}.service-panel-link{margin-top:auto;padding-top:40px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;color:#d9e4eb}

/* Manifesto */
.manifesto{min-height:100svh;padding:130px 0;position:relative;overflow:hidden}.manifesto::before{content:"";position:absolute;width:900px;height:900px;border-radius:50%;border:1px solid rgba(255,255,255,.13);right:-200px;top:-280px}.manifesto-stage{position:relative}.manifesto h2{font-size:clamp(70px,11vw,180px);letter-spacing:-.075em;line-height:.81;margin:90px 0 65px}.manifesto h2 span{display:block}.manifesto h2 span:last-child{color:#dff5ff}.manifesto-copy{display:grid;grid-template-columns:1fr .4fr;gap:70px;align-items:end}.manifesto-copy p{font-size:20px;max-width:760px}.principle-row{display:grid;grid-template-columns:repeat(3,1fr);margin-top:120px;border-top:1px solid rgba(255,255,255,.24)}.principle-row article{padding:28px 30px 0 0;border-right:1px solid rgba(255,255,255,.2);min-height:180px}.principle-row article+article{padding-left:30px}.principle-row article:last-child{border-right:0}.principle-row b{font-family:'DM Mono';font-size:11px}.principle-row h3{font-size:26px;margin:24px 0 10px}.principle-row p{color:#d4e6f1;max-width:340px;font-size:14px}

/* Horizontal work */
.work-rail{padding:140px 0 70px;overflow:hidden}.work-rail-head{display:grid;grid-template-columns:1.25fr .75fr;align-items:end;gap:60px;margin-bottom:70px}.work-rail-head h2{font-size:clamp(54px,7.4vw,120px);letter-spacing:-.06em;line-height:.9;margin:16px 0 0}.work-rail-head p{color:#95a4af;max-width:520px}.work-rail-viewport{overflow:hidden;padding-left:max(var(--pad),calc((100vw - var(--wrap))/2 + var(--pad)))}.work-rail-track{display:flex;gap:28px;width:max-content;padding-right:var(--pad)}.work-rail-card{width:clamp(520px,61vw,980px);display:grid;grid-template-columns:1.25fr .75fr;background:#0d1318;border:1px solid rgba(255,255,255,.12);border-radius:30px;overflow:hidden;min-height:600px}.work-rail-card figure{margin:0;position:relative;overflow:hidden}.work-rail-card figure img{height:100%;object-fit:cover}.work-rail-card figure span{position:absolute;left:22px;top:22px;padding:9px 12px;border-radius:999px;background:rgba(5,8,11,.78);font-family:'DM Mono';font-size:9px}.work-rail-card-copy{padding:48px 42px;display:flex;flex-direction:column}.work-rail-card-copy h3{font-size:clamp(42px,4.2vw,70px);line-height:.95;letter-spacing:-.05em;margin:22px 0}.work-rail-card-copy p{color:#97a6b0}.work-rail-card-copy b{margin-top:auto;color:var(--cyan)}.work-rail-progress{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;margin-top:38px;color:#7e8d98;font-family:'DM Mono';font-size:9px;letter-spacing:.09em}.work-rail-progress>div{height:1px;background:rgba(255,255,255,.13)}.work-rail-progress i{display:block;width:100%;height:100%;background:var(--cyan);transform:scaleX(0);transform-origin:left}

/* Capabilities */
.capability-story{padding:140px 0}.capability-story-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px}.capability-sticky{position:sticky;top:130px;height:max-content}.capability-sticky h2{font-size:clamp(48px,5.8vw,92px);line-height:.92;letter-spacing:-.055em;margin:20px 0}.capability-sticky p{color:#566570;max-width:420px}.cap-progress{height:2px;background:var(--line-dark);margin-top:50px;max-width:360px}.cap-progress i{display:block;height:100%;background:var(--blue);transform:scaleX(0);transform-origin:left}.capability-chapters{display:grid;gap:40px}.capability-chapters article{min-height:82vh;border-top:1px solid var(--line-dark);display:grid;grid-template-columns:90px 1fr .9fr;gap:30px;align-items:center;padding:55px 0}.cap-no{font-size:52px;color:#a6b0b8;align-self:start}.capability-chapters h3{font-size:clamp(42px,4.8vw,76px);line-height:.98;letter-spacing:-.05em;margin:18px 0}.capability-chapters p{font-size:17px;color:#55636e;max-width:500px}.capability-chapters figure{height:58vh;min-height:440px;margin:0;overflow:hidden;border-radius:160px 26px 26px 26px}.capability-chapters figure img{height:100%;object-fit:cover}

/* Process */
.process-stage{padding:150px 0}.process-heading{display:grid;grid-template-columns:1fr 1fr;align-items:end}.process-heading h2{grid-column:1/-1;font-size:clamp(58px,8vw,132px);line-height:.88;letter-spacing:-.065em;margin:18px 0 80px}.process-track{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.14)}.process-track article{min-height:320px;padding:28px;border-right:1px solid rgba(255,255,255,.14)}.process-track article:first-child{padding-left:0}.process-track article:last-child{border-right:0}.process-track span{font-family:'DM Mono';font-size:11px;color:var(--cyan)}.process-track h3{font-size:34px;margin:80px 0 14px}.process-track p{color:#95a4ae;max-width:300px}

/* Portfolio stack */
.portfolio-stack{padding:140px 0 160px}.stack-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:60px}.stack-heading h2{font-size:clamp(58px,8vw,128px);line-height:.88;letter-spacing:-.06em;margin:0}.stack-stage{width:min(1240px,calc(100% - var(--pad)*2));margin:auto;display:grid;gap:30px}.stack-project{min-height:76vh;display:grid;grid-template-columns:1.25fr .75fr;background:#0c1217;border:1px solid rgba(255,255,255,.11);border-radius:34px;overflow:hidden;position:relative}.stack-project figure{margin:0;overflow:hidden}.stack-project img{height:100%;object-fit:cover}.stack-project>div{padding:50px;display:flex;flex-direction:column;justify-content:center}.stack-project h3{font-size:clamp(44px,5vw,78px);letter-spacing:-.05em;line-height:.95;margin:20px 0}.stack-project p{color:#97a5af}.stack-project b{margin-top:auto;color:var(--cyan)}

/* CTA */
.closing-cta{padding:clamp(120px,15vw,240px) 0;position:relative;overflow:hidden}.closing-cta::after{content:"";position:absolute;width:660px;height:660px;border-radius:50%;border:1px solid currentColor;opacity:.08;right:-220px;bottom:-360px}.closing-cta h2{font-size:clamp(64px,9.6vw,160px);line-height:.86;letter-spacing:-.07em;margin:28px 0 36px;max-width:1320px}.closing-cta h2 span{color:var(--blue)}.scene-blue.closing-cta h2 span{color:#fff}.closing-cta p{max-width:560px;font-size:18px;color:#5a6974}.scene-blue.closing-cta p{color:#e2f3fc}

/* Inner hero */
.inner-hero{min-height:100svh;padding:calc(var(--header-h) + 80px) 0 90px;display:flex;align-items:center}.inner-hero-grid{display:grid;grid-template-columns:1fr .82fr;gap:70px;align-items:center}.inner-hero h1,.blog-hero h1,.not-found h1{font-size:clamp(66px,8.4vw,142px);letter-spacing:-.065em;line-height:.84;margin:24px 0 36px}.inner-hero p{font-size:18px;color:#a5b1bb;max-width:650px}.inner-hero figure{height:min(72vh,760px);min-height:520px;margin:0;position:relative;overflow:hidden;border-radius:180px 28px 180px 28px}.inner-hero figure img{height:100%;object-fit:cover}.inner-hero figure span{position:absolute;left:22px;bottom:22px;padding:9px 13px;border-radius:999px;background:rgba(5,8,11,.76);font-family:'DM Mono';font-size:9px;letter-spacing:.1em}

/* Services directory */
.service-directory{padding:110px 0 160px}.directory-intro{display:grid;grid-template-columns:.45fr 1fr;gap:60px;padding-bottom:70px;border-bottom:1px solid var(--line-dark)}.directory-intro p{font-size:25px;line-height:1.45;max-width:850px;margin:0}.directory-intro a{color:var(--blue)}.directory-group{display:grid;grid-template-columns:.45fr 1fr;gap:60px;padding:78px 0;border-bottom:1px solid var(--line-dark)}.directory-group>aside{position:sticky;top:120px;height:max-content}.directory-group aside h2{font-size:38px;line-height:1.04;letter-spacing:-.04em;margin:22px 0}.directory-group aside>span:last-child{color:#71808a;font-family:'DM Mono';font-size:11px}.directory-list{display:grid}.directory-row{display:grid;grid-template-columns:54px 170px 1fr 32px;gap:24px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line-dark)}.directory-row figure{height:132px;margin:0;overflow:hidden;border-radius:20px}.directory-row figure img{height:100%;object-fit:cover;transition:.4s}.directory-row:hover figure img{transform:scale(1.05)}.row-index{font-family:'DM Mono';font-size:11px;color:#82919c}.directory-row h3{font-size:30px;letter-spacing:-.03em;margin:6px 0}.directory-row p{margin:0;color:#5c6973;font-size:14px;max-width:650px}.directory-row>b{font-size:24px;color:var(--blue)}

/* Service detail */
.service-detail-hero{min-height:100svh;padding:calc(var(--header-h) + 80px) 0 80px;display:flex;align-items:center}.service-detail-hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:60px;align-items:center}.crumb{display:flex;gap:10px;color:#7e8c97;font-size:12px;margin-bottom:38px}.service-detail-title h1{font-size:clamp(64px,7.7vw,128px);line-height:.86;letter-spacing:-.065em;margin:20px 0 34px}.service-detail-title h1 span{color:var(--cyan)}.service-detail-title>p{font-size:18px;color:#9aa7b1;max-width:650px}.service-collage{height:min(72vh,770px);position:relative}.service-collage figure{position:absolute;margin:0;overflow:hidden;border-radius:26px;border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow)}.service-collage figure img{height:100%;object-fit:cover}.service-collage-1{width:64%;height:76%;right:0;top:0}.service-collage-2{width:44%;height:45%;left:0;bottom:0;z-index:2}.service-collage-3{width:34%;height:34%;right:7%;bottom:0;z-index:3}.service-count{position:absolute;left:8%;top:10%;z-index:4;font-family:'DM Mono';font-size:11px;letter-spacing:.1em;background:rgba(5,8,11,.78);padding:12px;border-radius:999px}.service-value{padding:130px 0}.service-value-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px}.service-value h2{font-size:clamp(44px,5vw,80px);line-height:.95;letter-spacing:-.05em;margin:20px 0}.large-copy{font-size:clamp(26px,3vw,46px);line-height:1.3;letter-spacing:-.035em;margin:14px 0 34px}.service-value-grid>div:last-child>p:last-child{max-width:700px;color:#5c6973}.service-outcomes{padding:130px 0}.section-split-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end;margin-bottom:70px}.section-split-heading h2{font-size:clamp(52px,6.2vw,98px);line-height:.92;letter-spacing:-.055em;margin:18px 0 0}.section-split-heading>p{color:#98a6af}.outcome-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.14)}.outcome-grid article{padding:36px 30px 90px 0;border-right:1px solid rgba(255,255,255,.14)}.outcome-grid article+article{padding-left:30px}.outcome-grid article:last-child{border-right:0}.outcome-grid span{font-family:'DM Mono';font-size:11px;color:var(--cyan)}.outcome-grid h3{font-size:32px;line-height:1.1;margin-top:70px}.service-narrative{padding:140px 0}.service-narrative-grid{display:grid;grid-template-columns:.66fr 1.34fr;gap:80px}.service-narrative aside{position:sticky;top:120px;height:max-content}.service-narrative aside h2{font-size:clamp(44px,5.4vw,86px);line-height:.96;letter-spacing:-.05em}.narrative-progress{height:2px;background:var(--line-dark);margin-top:44px}.narrative-progress i{display:block;height:100%;background:var(--blue);transform-origin:left;transform:scaleX(0)}.service-narrative-grid>div>article{min-height:58vh;padding:50px 0 70px;border-top:1px solid var(--line-dark)}.service-narrative article h3{font-size:42px;letter-spacing:-.035em}.service-narrative article>p{font-size:18px;color:#4f5d67;max-width:800px}.service-narrative blockquote{font-size:30px;line-height:1.3;border-left:3px solid var(--blue);margin:40px 0;padding-left:28px}.mini-process{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.mini-process>div{padding:26px;background:white;border:1px solid var(--line-dark);border-radius:22px}.mini-process b{font-family:'DM Mono';font-size:11px;color:var(--blue)}.mini-process strong{display:block;font-size:25px;margin:25px 0 6px}.mini-process p{color:#66747f;font-size:14px}.editorial-guide{padding:140px 0}.guide-shell{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px}.guide-side{position:sticky;top:110px;height:max-content}.guide-side h2{font-size:clamp(44px,5vw,78px);line-height:.98;letter-spacing:-.05em;margin:20px 0}.guide-side p{color:#9cabba;max-width:500px}.guide-toc{display:grid;margin-top:50px;border-top:1px solid rgba(255,255,255,.12)}.guide-toc a{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:13px;color:#82919d}.guide-toc a.active{color:#fff}.guide-toc span{font-family:'DM Mono';font-size:9px;color:var(--cyan)}.guide-articles article{padding:55px 0 80px;border-top:1px solid rgba(255,255,255,.12)}.guide-articles h3{font-size:clamp(36px,4vw,62px);line-height:1;letter-spacing:-.04em;margin:18px 0 28px}.guide-articles p{font-size:18px;color:#a8b4bd;max-width:820px}.faq-stage{padding:130px 0}.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:80px}.faq-grid>div:first-child{position:sticky;top:120px;height:max-content}.faq-grid h2{font-size:clamp(48px,5vw,80px);line-height:.95;letter-spacing:-.05em}.faq-grid>div:first-child p{color:#65737d}.faq-item{border-top:1px solid var(--line-dark)}.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:20px;padding:26px 0;font-size:20px;font-weight:650}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary b{font-size:26px;color:var(--blue);transition:.25s}.faq-item[open] summary b{transform:rotate(45deg)}.faq-item>p{padding:0 50px 30px 0;color:#5e6b75;max-width:720px}

/* About */
.about-editorial{padding:150px 0}.about-editorial-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px}.about-editorial aside{position:sticky;top:120px;height:max-content}.about-editorial h2{font-size:clamp(48px,5.8vw,92px);line-height:.94;letter-spacing:-.055em}.about-copy>p{font-size:18px;color:#4e5d67;max-width:800px}.about-copy .large-copy{color:#101820}.about-copy figure{height:68vh;margin:70px 0 0;overflow:hidden;border-radius:28px 180px 28px 28px}.about-copy img{height:100%;object-fit:cover}.beliefs{padding:140px 0}.belief-list{display:grid}.belief-list article{display:grid;grid-template-columns:100px 1fr 1fr;gap:40px;align-items:center;padding:42px 0;border-top:1px solid rgba(255,255,255,.13)}.belief-list article>span{font-family:'DM Mono';color:var(--cyan)}.belief-list h3{font-size:clamp(40px,4.5vw,70px);letter-spacing:-.04em;margin:0}.belief-list p{color:#a3b0b9;max-width:500px}.about-process{padding:140px 0}.about-process-media{display:grid;grid-template-columns:1fr .8fr;gap:60px;align-items:stretch}.about-process-media>figure{margin:0;min-height:700px;overflow:hidden;border-radius:30px}.about-process-media>figure img{height:100%;object-fit:cover}.about-process-list{display:grid;border-top:1px solid var(--line-dark)}.about-process-list article{padding:28px 0;border-bottom:1px solid var(--line-dark)}.about-process-list b{font-family:'DM Mono';font-size:10px;color:var(--blue)}.about-process-list h3{font-size:32px;margin:22px 0 8px}.about-process-list p{color:#5f6e78}

/* Capability page */
.capability-page{padding:130px 0}.capability-page-chapter{min-height:95vh;display:grid;grid-template-columns:.72fr 1.28fr;gap:70px;align-items:center;padding:70px 0;border-bottom:1px solid var(--line-dark)}.capability-page-chapter.reverse{grid-template-columns:1.28fr .72fr}.capability-page-chapter.reverse .capability-page-copy{order:2}.capability-page-chapter.reverse figure{order:1}.capability-page-copy h2{font-size:clamp(52px,6.4vw,100px);line-height:.9;letter-spacing:-.055em;margin:18px 0 28px}.capability-page-copy p{font-size:18px;color:#596772;max-width:590px}.capability-page-chapter figure{height:70vh;margin:0;overflow:hidden;border-radius:30px}.capability-page-chapter figure img{height:100%;object-fit:cover}

/* Portfolio */
.portfolio-index{padding:100px 0 150px}.portfolio-note{display:grid;grid-template-columns:.4fr 1fr;gap:60px;padding-bottom:45px;border-bottom:1px solid var(--line-dark)}.portfolio-note p{margin:0;max-width:850px;color:#5d6a74}.portfolio-filter{display:flex;flex-wrap:wrap;gap:9px;padding:32px 0 52px}.filter-button{background:transparent;border:1px solid var(--line-dark);border-radius:999px;padding:11px 17px;font-size:12px;cursor:pointer}.filter-button.active,.filter-button:hover{background:var(--ink);color:#fff}.portfolio-masonry{display:grid;grid-template-columns:1.18fr .82fr;gap:34px}.portfolio-card-new{display:block}.portfolio-card-new:nth-child(3n+1){grid-row:span 2}.portfolio-card-new figure{height:520px;margin:0;position:relative;overflow:hidden;border-radius:26px}.portfolio-card-new:nth-child(3n+1) figure{height:780px}.portfolio-card-new figure img{height:100%;object-fit:cover;transition:transform .6s}.portfolio-card-new:hover figure img{transform:scale(1.035)}.portfolio-card-new figure>span{position:absolute;left:18px;bottom:18px;background:rgba(5,8,11,.76);color:#fff;padding:8px 11px;border-radius:999px;font-family:'DM Mono';font-size:8px}.portfolio-card-new>div{padding:22px 0 45px}.card-meta{display:flex;justify-content:space-between;color:#71808b}.portfolio-card-new h2{font-size:42px;letter-spacing:-.04em;margin:12px 0}.portfolio-card-new p{color:#586670;max-width:650px}.portfolio-card-new .arrow-link{color:var(--blue)}

/* Project */
.project-hero-new{padding:calc(var(--header-h) + 85px) 0 70px}.project-hero-copy{display:grid;grid-template-columns:1fr .55fr;gap:50px;align-items:end;margin-bottom:60px}.project-hero-copy>.micro{grid-column:1/-1}.project-hero-copy h1{font-size:clamp(78px,10vw,170px);line-height:.82;letter-spacing:-.075em;margin:0}.project-hero-copy h1 span{color:var(--cyan)}.project-hero-copy p{color:#a4b0b9;font-size:18px}.project-tags{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap}.project-tags a{padding:9px 14px;border:1px solid rgba(255,255,255,.14);border-radius:999px;font-size:11px}.project-hero-media{height:min(72vh,820px);margin:0;position:relative;overflow:hidden;border-radius:32px}.project-hero-media img{height:100%;object-fit:cover}.project-hero-media span{position:absolute;left:20px;bottom:20px;background:rgba(5,8,11,.76);padding:9px 12px;border-radius:999px;font-family:'DM Mono';font-size:9px}.project-disclaimer-new{padding:34px 0}.project-disclaimer-new .wrap-wide{display:grid;grid-template-columns:40px 1fr;gap:20px;align-items:start}.project-disclaimer-new span{color:var(--blue)}.project-disclaimer-new p{margin:0;color:#63717b;max-width:1000px}.project-story-new{padding:120px 0}.project-story-grid{display:grid;grid-template-columns:.62fr 1.38fr;gap:90px}.project-story-grid>aside{position:sticky;top:120px;height:max-content}.project-story-grid aside h2{font-size:clamp(46px,5.5vw,88px);line-height:.94;letter-spacing:-.05em}.story-progress{height:2px;background:var(--line-dark);margin-top:40px}.story-progress i{height:100%;display:block;background:var(--blue);transform-origin:left;transform:scaleX(0)}.project-story-grid>div>article{min-height:60vh;padding:55px 0;border-top:1px solid var(--line-dark)}.project-story-grid article h3{font-size:clamp(38px,4.5vw,68px);line-height:1;letter-spacing:-.04em}.project-story-grid article>p{font-size:18px;color:#53616b;max-width:800px}.deliverable-cards,.project-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.deliverable-cards div,.project-metrics div{background:#fff;border:1px solid var(--line-dark);padding:26px;border-radius:20px}.deliverable-cards span,.project-metrics span{font-family:'DM Mono';font-size:10px;color:var(--blue)}.deliverable-cards p{font-size:20px;margin:50px 0 0}.project-metrics h4{font-size:24px;margin:45px 0 8px}.project-metrics p{color:#63717a;font-size:14px}

/* Contact */
.contact-new{padding:calc(var(--header-h) + 80px) 0 100px;min-height:100svh}.contact-new-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}.contact-copy-new h1{font-size:clamp(70px,8.3vw,136px);line-height:.84;letter-spacing:-.065em;margin:26px 0 38px}.contact-copy-new>p{color:#a6b2ba;font-size:18px;max-width:580px}.contact-direct-new{display:flex;flex-direction:column;gap:10px;margin:46px 0}.contact-direct-new .micro{color:#6e7d89;margin-bottom:6px}.contact-direct-new a{font-size:18px}.contact-copy-new figure{height:340px;margin:60px 0 0;position:relative;overflow:hidden;border-radius:26px 100px 26px 26px}.contact-copy-new figure img{height:100%;object-fit:cover}.contact-copy-new figure span{position:absolute;left:18px;bottom:16px;background:rgba(5,8,11,.72);padding:8px 12px;border-radius:999px;font-family:'DM Mono';font-size:9px}.contact-form-card{background:#fff;color:var(--ink);border-radius:30px;padding:clamp(26px,4vw,54px);position:sticky;top:108px}.form-card-head{display:flex;justify-content:space-between;padding-bottom:28px;border-bottom:1px solid var(--line-dark)}.form-card-head>span:last-child{font-family:'DM Mono';font-size:10px;color:#71808b}.contact-form{display:grid;gap:22px;margin-top:30px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.contact-form label{display:grid;gap:9px;font-size:12px;font-weight:700}.contact-form label span{color:#89959f;font-weight:500}.contact-form label .field-label{color:inherit;font-weight:inherit}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #d8e0e5;background:#f8fafb;border-radius:14px;padding:15px 16px;outline:none;transition:border .2s,box-shadow .2s}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#5aaee0;box-shadow:0 0 0 3px rgba(73,177,232,.12)}.contact-form textarea{resize:vertical;min-height:150px}.form-submit{display:flex;justify-content:space-between;gap:25px;align-items:center;padding-top:6px}.form-submit>span{font-size:11px;color:#75828b;max-width:280px}.form-notice{padding:13px 15px;background:#e8f6ff;border-radius:12px;margin:18px 0;font-size:13px}.honeypot{position:absolute;left:-9999px}

/* Page field guide */
.page-field-guide{padding:140px 0;border-top:1px solid var(--line-dark)}.field-guide-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:90px}.field-guide-grid>aside{position:sticky;top:120px;height:max-content}.field-guide-grid aside h2{font-size:clamp(42px,5vw,80px);line-height:.98;letter-spacing:-.05em}.field-guide-grid aside>p{color:#5b6872}.field-guide-grid figure{margin:50px 0 0;height:320px;overflow:hidden;border-radius:24px}.field-guide-grid figure img{height:100%;object-fit:cover}.field-guide-grid figcaption{font-size:10px;color:#6d7a84;margin-top:8px}.field-guide-grid>div article{padding:48px 0 65px;border-top:1px solid var(--line-dark)}.field-guide-grid article h3{font-size:clamp(34px,3.8vw,58px);line-height:1.02;letter-spacing:-.035em}.field-guide-grid article p{font-size:17px;color:#53616b;max-width:820px}

/* Footer */
.site-footer{padding:110px 0 28px;border-top:1px solid rgba(255,255,255,.1)}.footer-top{display:grid;grid-template-columns:.65fr 1.35fr;gap:80px;align-items:start;padding-bottom:90px}.footer-logo{width:min(360px,80%)}.footer-top h2{font-size:clamp(62px,8vw,124px);line-height:.86;letter-spacing:-.065em;margin:24px 0 36px}.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:40px 0;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}.footer-grid>div{display:flex;flex-direction:column;gap:10px}.footer-grid .micro{color:#647580;margin-bottom:12px}.footer-grid a{font-size:14px;color:#cbd5dc}.footer-grid a:hover{color:var(--cyan)}.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:28px;color:#687783;font-family:'DM Mono';font-size:9px;letter-spacing:.08em}

.not-found{min-height:100svh;padding:calc(var(--header-h) + 110px) 0;display:flex;align-items:center}.not-found p{color:#9eabb5;font-size:18px;max-width:600px}

/* Animation defaults */
[data-reveal]{opacity:1}.js .motion-item{opacity:0;transform:translateY(28px)}

/* Responsive */
@media(max-width:1180px){
  .desktop-nav{display:none}.menu-toggle{display:block}.header-contact{display:none}.language-control{margin-left:auto}.brand{width:165px}.home-hero-stage{grid-template-columns:1fr}.home-hero{padding-top:150px}.hero-visual{height:54vh;max-width:850px;width:100%;margin-left:auto}.hero-copy-bottom{grid-template-columns:1fr}.intro-stage{grid-template-columns:.34fr 1.2fr}.intro-photo{grid-column:2;min-height:380px}.service-panel{grid-template-columns:1fr}.service-panel-media{min-height:48vh}.service-story-stage{grid-template-columns:90px 1fr}.capability-story-grid{grid-template-columns:1fr}.capability-sticky{position:relative;top:0}.work-rail-card{width:76vw}.service-detail-hero-grid,.inner-hero-grid,.contact-new-grid{grid-template-columns:1fr}.service-collage{height:620px}.contact-form-card{position:relative;top:0}.field-guide-grid,.guide-shell,.service-narrative-grid,.project-story-grid,.about-editorial-grid{grid-template-columns:1fr}.field-guide-grid>aside,.guide-side,.service-narrative aside,.project-story-grid>aside,.about-editorial aside{position:relative;top:0}.field-guide-grid figure{width:min(700px,100%)}
}
@media(max-width:820px){
  :root{--header-h:72px;--pad:20px;--radius:20px}.site-header{padding:10px 12px}.header-shell{height:58px;padding:0 10px 0 14px}.brand{width:145px}.language-control select{font-size:10px}.home-hero{padding-top:118px;min-height:auto}.home-hero-stage{min-height:auto}.hero-meta{margin-bottom:28px}.home-hero h1{font-size:clamp(60px,15vw,98px)}.hero-copy-bottom{margin-top:28px}.hero-visual{height:520px;margin-top:20px}.hero-frame-a{width:76%;height:68%}.hero-frame-b{width:49%;height:42%}.hero-frame-c{width:36%;height:36%}.hero-badge{width:105px;height:105px}.hero-badge b{font-size:10px}.hero-scroll-cue{margin-top:16px}.tool-belt-top{display:none}.tool-runner-track{font-size:46px}.intro-stage{grid-template-columns:1fr}.intro-index{display:grid;grid-template-columns:auto 1fr;gap:20px}.intro-index i{height:1px;width:100%;margin:8px 0}.intro-index p{grid-column:1/-1}.intro-main h2{font-size:56px}.intro-lower{grid-template-columns:1fr}.round-cta{width:64px;height:64px}.intro-photo{grid-column:1;min-height:360px;border-radius:70px 18px 70px 18px}.service-story{padding-top:90px}.service-story-head,.work-rail-head,.section-split-heading,.project-hero-copy{grid-template-columns:1fr}.service-story-head>div:last-child{justify-self:start}.service-story-stage{display:block}.service-story-index{display:none}.service-panel{min-height:0}.service-panel-media{min-height:360px}.service-panel-copy{min-height:380px}.manifesto{padding:100px 0;min-height:auto}.manifesto h2{margin:65px 0 45px}.manifesto-copy{grid-template-columns:1fr}.principle-row{grid-template-columns:1fr;margin-top:70px}.principle-row article{border-right:0;border-bottom:1px solid rgba(255,255,255,.2);padding:28px 0}.principle-row article+article{padding-left:0}.work-rail{padding:100px 0 70px}.work-rail-viewport{padding:0 var(--pad);overflow:visible}.work-rail-track{width:auto;display:grid;gap:20px;padding:0}.work-rail-card{width:100%;grid-template-columns:1fr;min-height:0}.work-rail-card figure{height:420px}.work-rail-card-copy{min-height:360px}.work-rail-progress{display:none}.capability-chapters article{min-height:0;grid-template-columns:50px 1fr;padding:60px 0}.capability-chapters figure{grid-column:1/-1;height:420px;min-height:0;border-radius:90px 20px 20px}.process-track{grid-template-columns:1fr 1fr}.process-track article:nth-child(2){border-right:0}.portfolio-stack{padding:100px 0}.stack-heading{display:block}.stack-project{grid-template-columns:1fr;min-height:0}.stack-project figure{height:420px}.stack-project>div{min-height:340px}.inner-hero{min-height:auto;padding-top:130px}.inner-hero h1,.blog-hero h1{font-size:64px}.inner-hero figure{min-height:440px;height:60vh}.directory-intro,.directory-group{grid-template-columns:1fr}.directory-group>aside{position:relative;top:0}.directory-row{grid-template-columns:40px 100px 1fr 24px}.directory-row figure{height:100px}.directory-row h3{font-size:24px}.directory-row p{display:none}.service-detail-hero{padding-top:130px}.service-detail-title h1{font-size:64px}.service-collage{height:520px}.service-value-grid{grid-template-columns:1fr;gap:30px}.outcome-grid{grid-template-columns:1fr}.outcome-grid article{border-right:0;border-bottom:1px solid rgba(255,255,255,.14);padding:28px 0 55px}.outcome-grid article+article{padding-left:0}.mini-process{grid-template-columns:1fr}.faq-grid{grid-template-columns:1fr}.faq-grid>div:first-child{position:relative;top:0}.about-process-media{grid-template-columns:1fr}.about-process-media>figure{min-height:520px}.belief-list article{grid-template-columns:50px 1fr}.belief-list p{grid-column:2}.capability-page-chapter,.capability-page-chapter.reverse{grid-template-columns:1fr;min-height:0}.capability-page-chapter.reverse .capability-page-copy,.capability-page-chapter.reverse figure{order:initial}.capability-page-chapter figure{height:520px}.portfolio-masonry{grid-template-columns:1fr}.portfolio-card-new:nth-child(3n+1){grid-row:auto}.portfolio-card-new figure,.portfolio-card-new:nth-child(3n+1) figure{height:520px}.deliverable-cards,.project-metrics{grid-template-columns:1fr}.project-hero-copy{margin-bottom:35px}.project-hero-copy h1{font-size:74px}.field-row{grid-template-columns:1fr}.footer-top{grid-template-columns:1fr;gap:50px}.footer-grid{grid-template-columns:1fr 1fr}.footer-bottom{flex-direction:column}.closing-cta{padding:110px 0}.closing-cta h2{font-size:62px}
}
@media(max-width:520px){
  .hero-visual{height:430px}.hero-frame-a{width:82%;height:63%}.hero-frame-b{width:54%;height:39%}.hero-frame-c{width:38%;height:34%}.hero-badge{display:none}.home-hero h1,.inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1{font-size:53px}.hero-copy-bottom p,.inner-hero p,.service-detail-title>p,.contact-copy-new>p{font-size:15px}.hero-actions{gap:12px}.pill{padding:13px 16px}.intro-main h2{font-size:48px}.service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2{font-size:48px}.service-panel-media{min-height:300px}.service-panel-copy{min-height:320px;padding:28px}.service-panel-copy h3{font-size:40px}.manifesto h2{font-size:58px}.work-rail-card figure,.stack-project figure{height:330px}.capability-chapters figure{height:340px}.process-track{grid-template-columns:1fr}.process-track article{border-right:0;border-bottom:1px solid rgba(255,255,255,.14)}.process-track article:first-child{padding-left:28px}.process-track h3{margin-top:38px}.service-collage{height:410px}.service-collage-1{width:76%;height:70%}.service-collage-2{width:54%;height:40%}.service-collage-3{width:38%;height:31%}.directory-row{grid-template-columns:34px 80px 1fr 18px;gap:12px}.directory-row figure{height:82px;border-radius:12px}.directory-row h3{font-size:20px}.directory-row .micro{display:none}.capability-page-chapter figure,.portfolio-card-new figure,.portfolio-card-new:nth-child(3n+1) figure{height:380px}.project-hero-media{height:430px}.contact-form-card{padding:22px;border-radius:22px}.form-submit{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr}.footer-logo{width:230px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.site-noise{display:none}}

/* =========================================================
   BALANCE + MOTION REFINEMENT PASS
   Tighter vertical rhythm, calmer type scale and CTA balance.
   ========================================================= */
:root{
  --section-space:clamp(84px,7.2vw,118px);
  --section-space-tight:clamp(68px,5.6vw,92px);
  --display-xl:clamp(62px,7.25vw,124px);
  --display-lg:clamp(50px,6vw,96px);
  --display-md:clamp(40px,4.6vw,72px);
}
html{scroll-padding-top:96px}
body{line-height:1.5}
.pill{min-height:48px;padding:14px 20px;gap:16px;font-size:13px;line-height:1.1}
.hero-actions{gap:14px}

/* Home / global rhythm */
.home-hero{padding-top:calc(var(--header-h) + 42px)}
.home-hero-stage{min-height:calc(100svh - 154px);gap:clamp(34px,4vw,64px)}
.home-hero h1{font-size:clamp(64px,7.45vw,128px);line-height:.86;letter-spacing:-.06em}
.hero-meta{margin-bottom:30px}
.hero-copy-bottom{margin-top:32px;gap:24px}
.hero-copy-bottom p{font-size:16px;line-height:1.62}
.hero-visual{height:min(64vh,680px)}
.hero-badge{width:126px;height:126px}
.hero-scroll-cue{height:58px}

.tool-belt{padding:30px 0}
.tool-belt-top{margin-bottom:20px}
.tool-runner-track{font-size:clamp(32px,4.7vw,68px)}

.home-intro{padding:var(--section-space) 0}
.intro-stage{grid-template-columns:.38fr 1.35fr .7fr;gap:clamp(28px,4.2vw,70px)}
.intro-main h2{font-size:var(--display-lg);line-height:.96;letter-spacing:-.052em}
.intro-lower{margin-top:42px}
.intro-lower p{font-size:16px;line-height:1.65}
.intro-photo{min-height:450px;border-radius:82px 20px 82px 20px}
.round-cta{width:74px;height:74px;font-size:24px}

.service-story{padding:var(--section-space) 0 var(--section-space-tight)}
.service-story-head{gap:42px;margin-bottom:52px}
.service-story-head h2{font-size:var(--display-lg);line-height:.94}
.service-story-head p{font-size:15px;line-height:1.65}
.service-story-stage{grid-template-columns:108px 1fr;gap:26px}
.service-story-index{top:112px}
.service-story-index strong{font-size:48px}
.local-progress{height:150px;margin-top:22px}
.service-story-cards{gap:20px}
.service-panel{min-height:clamp(520px,62vh,650px);border-radius:28px}
.service-panel-media{min-height:470px}
.service-panel-copy{padding:clamp(30px,4vw,56px)}
.service-panel-copy h3{font-size:clamp(38px,3.75vw,58px);line-height:1;letter-spacing:-.042em;margin:14px 0 18px}
.service-panel-copy p{font-size:15px;line-height:1.65}
.service-panel-link{padding-top:26px}

.manifesto{min-height:88svh;padding:var(--section-space-tight) 0}
.manifesto::before{width:760px;height:760px;right:-180px;top:-250px}
.manifesto h2{font-size:clamp(66px,8.7vw,138px);line-height:.84;margin:48px 0 38px}
.manifesto-copy{grid-template-columns:1fr auto;gap:52px}
.manifesto-copy p{font-size:17px;line-height:1.6}
.principle-row{margin-top:68px}
.principle-row article{min-height:145px;padding-top:24px}
.principle-row h3{font-size:22px;margin:18px 0 8px}

.work-rail{padding:var(--section-space) 0 56px}
.work-rail-head{gap:48px;margin-bottom:44px}
.work-rail-head h2{font-size:var(--display-lg);line-height:.92}
.work-rail-head p{font-size:15px;line-height:1.65}
.work-rail-track{gap:22px}
.work-rail-card{width:clamp(500px,54vw,840px);min-height:510px;border-radius:26px}
.work-rail-card-copy{padding:38px 34px}
.work-rail-card-copy h3{font-size:clamp(38px,3.6vw,56px);line-height:.98;margin:18px 0}
.work-rail-card-copy p{font-size:15px;line-height:1.62}
.work-rail-progress{margin-top:28px}

.capability-story{padding:var(--section-space) 0}
.capability-story-grid{grid-template-columns:.68fr 1.32fr;gap:64px}
.capability-sticky{top:112px}
.capability-sticky h2{font-size:clamp(46px,4.8vw,76px);line-height:.96}
.capability-sticky p{font-size:15px;line-height:1.65}
.cap-progress{margin-top:36px}
.capability-chapters{gap:18px}
.capability-chapters article{min-height:64vh;grid-template-columns:72px 1fr .88fr;gap:26px;padding:42px 0}
.cap-no{font-size:42px}
.capability-chapters h3{font-size:clamp(38px,3.7vw,58px);line-height:1;margin:14px 0}
.capability-chapters p{font-size:15px;line-height:1.65}
.capability-chapters figure{height:50vh;min-height:360px;border-radius:130px 24px 24px}

.process-stage{padding:var(--section-space) 0}
.process-heading h2{font-size:clamp(56px,6.7vw,104px);line-height:.91;margin:16px 0 52px}
.process-track article{min-height:255px;padding:24px}
.process-track h3{font-size:28px;margin:52px 0 12px}
.process-track p{font-size:14px;line-height:1.6}

.portfolio-stack{padding:var(--section-space) 0 clamp(96px,8vw,128px)}
.stack-heading{margin-bottom:42px}
.stack-heading h2{font-size:clamp(56px,6.8vw,106px);line-height:.91}
.stack-stage{width:min(1180px,calc(100% - var(--pad)*2));gap:22px}
.stack-project{min-height:clamp(540px,64vh,680px);border-radius:28px}
.stack-project>div{padding:40px}
.stack-project h3{font-size:clamp(40px,4vw,62px);line-height:.98;margin:16px 0}
.stack-project p{font-size:15px;line-height:1.62}

/* CTA: headline and action now share the frame instead of stacking into a huge empty block */
.closing-cta{padding:clamp(92px,9vw,150px) 0}
.closing-cta::after{width:520px;height:520px;right:-180px;bottom:-300px}
.closing-cta .wrap-wide{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);column-gap:clamp(42px,6vw,96px);row-gap:20px;align-items:end}
.closing-cta .micro{grid-column:1/-1}
.closing-cta h2{grid-column:1;grid-row:2/4;font-size:clamp(58px,7vw,112px);line-height:.9;letter-spacing:-.06em;margin:14px 0 0;max-width:980px}
.closing-cta p{grid-column:2;grid-row:2;margin:0;font-size:16px;line-height:1.65;max-width:460px}
.closing-cta .pill{grid-column:2;grid-row:3;justify-self:start;margin-top:4px}

/* Inner page typography + spacing */
.inner-hero{min-height:88svh;padding:calc(var(--header-h) + 52px) 0 66px}
.inner-hero-grid{gap:56px}
.inner-hero h1,.blog-hero h1,.not-found h1{font-size:clamp(60px,7vw,116px);line-height:.88;margin:20px 0 28px}
.inner-hero p{font-size:16px;line-height:1.65}
.inner-hero figure{height:min(64vh,670px);min-height:460px;border-radius:150px 26px 150px 26px}

.service-directory{padding:var(--section-space-tight) 0 clamp(100px,8vw,128px)}
.directory-intro{gap:52px;padding-bottom:52px}
.directory-intro p{font-size:21px}
.directory-group{gap:52px;padding:58px 0}
.directory-group aside h2{font-size:34px}
.directory-row{grid-template-columns:46px 150px 1fr 28px;gap:20px;padding:20px 0}
.directory-row figure{height:112px;border-radius:18px}
.directory-row h3{font-size:27px}

.service-detail-hero{min-height:88svh;padding:calc(var(--header-h) + 52px) 0 64px}
.service-detail-hero-grid{gap:52px}
.crumb{margin-bottom:28px}
.service-detail-title h1{font-size:clamp(58px,6.5vw,106px);line-height:.89;margin:16px 0 26px}
.service-detail-title>p{font-size:16px;line-height:1.65}
.service-collage{height:min(64vh,680px)}
.service-value,.service-outcomes{padding:var(--section-space) 0}
.service-value-grid{gap:70px}
.service-value h2{font-size:clamp(42px,4.4vw,70px)}
.large-copy{font-size:clamp(24px,2.5vw,38px);line-height:1.34}
.section-split-heading{gap:54px;margin-bottom:50px}
.section-split-heading h2{font-size:clamp(48px,5.3vw,84px);line-height:.95}
.outcome-grid article{padding:30px 26px 66px 0}
.outcome-grid article+article{padding-left:26px}
.outcome-grid h3{font-size:28px;margin-top:48px}
.service-narrative{padding:var(--section-space) 0}
.service-narrative-grid{gap:64px}
.service-narrative aside{top:108px}
.service-narrative aside h2{font-size:clamp(42px,4.5vw,72px)}
.service-narrative-grid>div>article{min-height:46vh;padding:42px 0 54px}
.service-narrative article h3{font-size:36px}
.service-narrative article>p{font-size:16px;line-height:1.7}
.service-narrative blockquote{font-size:25px;margin:30px 0}
.editorial-guide{padding:var(--section-space) 0}
.guide-shell{gap:64px}
.guide-side{top:104px}
.guide-side h2{font-size:clamp(42px,4.4vw,70px)}
.guide-toc{margin-top:34px}
.guide-articles article{padding:44px 0 62px}
.guide-articles h3{font-size:clamp(34px,3.5vw,54px);margin:14px 0 22px}
.guide-articles p{font-size:16px;line-height:1.72}
.faq-stage{padding:var(--section-space) 0}
.faq-grid{gap:64px}
.faq-grid h2{font-size:clamp(44px,4.5vw,70px)}
.faq-item summary{padding:22px 0;font-size:18px}

.about-editorial,.beliefs,.about-process{padding:var(--section-space) 0}
.about-editorial-grid{gap:68px}
.about-editorial h2{font-size:clamp(44px,4.8vw,76px)}
.about-copy>p{font-size:16px;line-height:1.7}
.about-copy figure{height:60vh;margin-top:50px;border-radius:26px 140px 26px 26px}
.belief-list article{grid-template-columns:80px 1fr 1fr;gap:32px;padding:34px 0}
.belief-list h3{font-size:clamp(38px,3.8vw,58px)}
.about-process-media{gap:48px}
.about-process-media>figure{min-height:600px}
.about-process-list article{padding:24px 0}
.about-process-list h3{font-size:28px;margin:16px 0 6px}

.capability-page{padding:var(--section-space-tight) 0}
.capability-page-chapter{min-height:78vh;gap:56px;padding:48px 0}
.capability-page-copy h2{font-size:clamp(48px,5.3vw,84px);line-height:.94;margin:14px 0 22px}
.capability-page-copy p{font-size:16px;line-height:1.68}
.capability-page-chapter figure{height:60vh;border-radius:26px}

.portfolio-index{padding:var(--section-space-tight) 0 clamp(100px,8vw,128px)}
.portfolio-note{gap:48px;padding-bottom:36px}
.portfolio-filter{padding:26px 0 40px}
.portfolio-masonry{gap:28px}
.portfolio-card-new figure{height:450px;border-radius:22px}
.portfolio-card-new:nth-child(3n+1) figure{height:670px}
.portfolio-card-new>div{padding:18px 0 34px}
.portfolio-card-new h2{font-size:34px;margin:9px 0}

.project-hero-new{padding:calc(var(--header-h) + 58px) 0 56px}
.project-hero-copy{gap:42px;margin-bottom:44px}
.project-hero-copy h1{font-size:clamp(68px,8vw,130px);line-height:.86}
.project-hero-copy p{font-size:16px;line-height:1.65}
.project-hero-media{height:min(66vh,720px);border-radius:28px}
.project-story-new{padding:var(--section-space) 0}
.project-story-grid{gap:68px}
.project-story-grid aside h2{font-size:clamp(44px,4.7vw,74px)}
.project-story-grid>div>article{min-height:48vh;padding:44px 0}
.project-story-grid article h3{font-size:clamp(36px,3.8vw,58px)}
.project-story-grid article>p{font-size:16px;line-height:1.7}

.contact-new{padding:calc(var(--header-h) + 52px) 0 78px;min-height:88svh}
.contact-new-grid{gap:64px}
.contact-copy-new h1{font-size:clamp(60px,7vw,112px);line-height:.88;margin:20px 0 28px}
.contact-copy-new>p{font-size:16px;line-height:1.65}
.contact-direct-new{margin:34px 0}
.contact-copy-new figure{height:300px;margin-top:42px}
.contact-form-card{border-radius:26px;padding:clamp(26px,3.2vw,44px);top:96px}
.contact-form{gap:18px;margin-top:24px}

.page-field-guide{padding:var(--section-space) 0}
.field-guide-grid{gap:68px}
.field-guide-grid>aside{top:104px}
.field-guide-grid aside h2{font-size:clamp(40px,4.3vw,68px)}
.field-guide-grid figure{margin-top:36px;height:290px}
.field-guide-grid>div article{padding:40px 0 54px}
.field-guide-grid article h3{font-size:clamp(32px,3.3vw,50px)}
.field-guide-grid article p{font-size:16px;line-height:1.72}

.site-footer{padding:78px 0 24px}
.footer-top{grid-template-columns:.62fr 1.38fr;gap:64px;padding-bottom:58px}
.footer-logo{width:min(320px,78%)}
.footer-top h2{font-size:clamp(54px,6.4vw,96px);line-height:.9;margin:18px 0 28px}
.footer-grid{padding:34px 0;gap:26px}
.footer-bottom{padding-top:22px}

/* Tablet: no pinning in JS; CSS follows a natural document flow. */
@media(max-width:1180px){
  :root{--section-space:84px;--section-space-tight:70px}
  .home-hero{padding-top:132px}
  .home-hero-stage{min-height:auto;gap:28px}
  .home-hero h1{font-size:clamp(62px,10vw,108px)}
  .hero-visual{height:clamp(480px,54vh,650px)}
  .service-story-head,.work-rail-head{margin-bottom:42px}
  .service-panel{min-height:0}
  .service-panel-media{min-height:420px}
  .service-panel-copy{min-height:auto;padding:42px}
  .manifesto{min-height:auto}
  .capability-chapters article{min-height:0;padding:48px 0}
  .capability-chapters figure{height:420px;min-height:0}
  .stack-project{min-height:0}
  .closing-cta .wrap-wide{grid-template-columns:1fr .62fr}
  .inner-hero,.service-detail-hero{min-height:auto}
  .capability-page-chapter{min-height:0}
}

@media(max-width:820px){
  :root{--section-space:70px;--section-space-tight:60px}
  html{scroll-padding-top:76px}
  .home-hero{padding-top:110px}
  .home-hero h1{font-size:clamp(52px,13.5vw,84px)}
  .hero-visual{height:480px}
  .hero-copy-bottom p{font-size:15px}
  .tool-belt{padding:24px 0}
  .home-intro{padding:70px 0}
  .intro-main h2{font-size:clamp(42px,11vw,58px)}
  .intro-lower{margin-top:30px}
  .intro-photo{min-height:330px}
  .service-story{padding:70px 0 56px}
  .service-story-head{margin-bottom:34px}
  .service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2{font-size:clamp(42px,10vw,58px)}
  .service-panel-media{min-height:320px}
  .service-panel-copy{min-height:0;padding:30px}
  .service-panel-copy h3{font-size:clamp(34px,8.5vw,46px)}
  .service-panel-link{margin-top:26px}
  .manifesto{padding:72px 0}
  .manifesto h2{font-size:clamp(50px,13vw,72px);margin:42px 0 30px}
  .manifesto-copy{gap:28px}
  .principle-row{margin-top:46px}
  .work-rail{padding:70px 0 54px}
  .work-rail-head{margin-bottom:34px}
  .work-rail-card-copy{min-height:0;padding:30px}
  .capability-story{padding:72px 0}
  .capability-sticky h2{font-size:clamp(42px,10vw,58px)}
  .capability-chapters article{padding:42px 0}
  .capability-chapters h3{font-size:clamp(34px,8vw,48px)}
  .process-stage{padding:72px 0}
  .process-heading h2{font-size:clamp(48px,11vw,66px);margin-bottom:38px}
  .process-track article{min-height:auto;padding:28px 0}
  .process-track article:first-child{padding-left:0}
  .process-track h3{margin-top:28px}
  .portfolio-stack{padding:72px 0 84px}
  .stack-heading{margin-bottom:34px}
  .stack-project>div{min-height:0;padding:30px}
  .stack-project h3{font-size:clamp(36px,9vw,50px)}

  .closing-cta{padding:76px 0}
  .closing-cta .wrap-wide{display:block}
  .closing-cta h2{font-size:clamp(50px,12.5vw,70px);line-height:.92;margin:18px 0 24px}
  .closing-cta p{font-size:15px;margin:0 0 24px;max-width:520px}
  .closing-cta .pill{margin-top:0}

  .inner-hero{padding-top:118px;padding-bottom:60px}
  .inner-hero h1,.blog-hero h1,.not-found h1{font-size:clamp(50px,12vw,70px);line-height:.9}
  .inner-hero figure{min-height:400px;height:55vh}
  .service-directory{padding:60px 0 84px}
  .directory-intro{padding-bottom:42px}
  .directory-intro p{font-size:19px}
  .directory-group{padding:46px 0}
  .service-detail-hero{padding-top:118px;padding-bottom:56px}
  .service-detail-title h1{font-size:clamp(50px,12vw,70px)}
  .service-collage{height:490px}
  .service-value,.service-outcomes,.service-narrative,.editorial-guide,.faq-stage,.about-editorial,.beliefs,.about-process,.capability-page,.project-story-new,.page-field-guide{padding:70px 0}
  .section-split-heading{margin-bottom:38px}
  .outcome-grid article{padding-bottom:44px}
  .service-narrative-grid>div>article,.project-story-grid>div>article{min-height:0;padding:38px 0}
  .guide-articles article{padding:38px 0 50px}
  .about-copy figure{height:460px;margin-top:40px}
  .about-process-media>figure{min-height:480px}
  .capability-page-chapter{padding:42px 0}
  .capability-page-copy h2{font-size:clamp(42px,10vw,58px)}
  .portfolio-index{padding:60px 0 84px}
  .portfolio-card-new>div{padding-bottom:28px}
  .portfolio-card-new h2{font-size:30px}
  .project-hero-new{padding-top:118px;padding-bottom:48px}
  .project-hero-copy h1{font-size:clamp(56px,14vw,82px)}
  .contact-new{padding-top:118px;padding-bottom:70px;min-height:auto}
  .contact-copy-new h1{font-size:clamp(52px,13vw,72px)}
  .contact-copy-new figure{margin-top:34px}
  .site-footer{padding-top:66px}
  .footer-top{gap:38px;padding-bottom:46px}
  .footer-top h2{font-size:clamp(50px,11vw,66px)}
}

@media(max-width:520px){
  :root{--pad:18px}
  .home-hero h1,.inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1{font-size:clamp(46px,13.2vw,58px)}
  .hero-visual{height:410px}
  .hero-frame-a{width:80%;height:62%}
  .hero-frame-b{width:52%;height:38%}
  .hero-frame-c{width:36%;height:32%}
  .pill{min-height:44px;padding:12px 15px;font-size:12px}
  .intro-main h2{font-size:44px}
  .service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2{font-size:44px}
  .service-panel-media{min-height:280px}
  .service-panel-copy{padding:26px}
  .service-panel-copy h3{font-size:36px}
  .manifesto h2{font-size:52px}
  .work-rail-card figure,.stack-project figure{height:300px}
  .capability-chapters figure{height:310px}
  .service-collage{height:390px}
  .closing-cta{padding:66px 0}
  .closing-cta h2{font-size:48px}
  .portfolio-card-new figure,.portfolio-card-new:nth-child(3n+1) figure{height:350px}
  .project-hero-media{height:390px}
  .contact-form-card{padding:20px}
  .footer-logo{width:210px}
}

/* ===== Precision fixes: header, mega menu, showreel, work rail, branded CTA/footer ===== */
.site-header .header-shell{overflow:visible}
.site-header .brand{width:176px;height:100%;display:flex;align-items:center;overflow:hidden}
.site-header .brand img{width:100%;height:44px;max-height:44px;object-fit:contain;object-position:left center}
.site-header.is-scrolled .brand img{height:40px;max-height:40px}

@media(min-width:1181px){
  .nav-services{align-self:stretch;display:flex;align-items:center}
  .nav-services .mega-menu{top:calc(100% + 8px);left:auto;right:-250px;transform:translateY(10px);width:min(920px,calc(100vw - 48px));max-height:min(620px,calc(100vh - 110px));overflow:auto}
  .nav-services .mega-menu::before{content:"";position:absolute;left:0;right:0;top:-18px;height:18px}
  .nav-services:hover .mega-menu,.nav-services:focus-within .mega-menu,.nav-services.is-open .mega-menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
  .mega-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 30px}
  .mega-grid a{padding:3px 0}
}

/* Homepage film/showreel */
.showreel{padding:clamp(82px,8vw,118px) 0 clamp(92px,9vw,132px);overflow:hidden}
.showreel-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.58fr);gap:clamp(38px,6vw,92px);align-items:end;margin-bottom:34px}
.showreel-head h2{font-size:clamp(52px,6.1vw,96px);line-height:.92;letter-spacing:-.055em;margin:14px 0 0;max-width:980px}
.showreel-head h2 em{color:var(--cyan)}
.showreel-head p{margin:0;color:#94a3ae;max-width:520px;font-size:15px;line-height:1.7}
.showreel-frame{position:relative;height:clamp(430px,67vh,690px);padding:0;overflow:hidden;border-radius:28px;border:1px solid rgba(255,255,255,.12);background:#080d12;box-shadow:0 30px 90px rgba(0,0,0,.25)}
.showreel-frame video{width:100%;height:100%;display:block;object-fit:cover;background:#080d12}
.showreel-overlay{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,8,11,.03) 52%,rgba(5,8,11,.62) 100%)}
.showreel-meta{position:absolute;left:22px;right:22px;bottom:20px;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;font-family:'DM Mono';font-size:9px;letter-spacing:.11em;color:#eaf4fa}
.showreel-meta button{border:1px solid rgba(255,255,255,.28);background:rgba(5,8,11,.55);backdrop-filter:blur(10px);border-radius:999px;padding:9px 14px;cursor:pointer;font-family:'DM Mono';font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.showreel-meta button:hover{background:#fff;color:#081018}

/* Horizontal project story: fit inside common desktop viewports */
.work-rail{padding:clamp(64px,6.3vw,92px) 0 44px}
.work-rail-head{gap:42px;margin-bottom:26px}
.work-rail-head h2{font-size:clamp(44px,5.1vw,82px);line-height:.93;margin-top:10px}
.work-rail-head p{font-size:14px;line-height:1.62}
.work-rail-card{width:clamp(500px,52vw,820px);height:clamp(370px,50vh,490px);min-height:0;border-radius:24px}
.work-rail-card-copy{padding:28px 30px}
.work-rail-card-copy h3{font-size:clamp(34px,3.2vw,50px);margin:14px 0 16px}
.work-rail-card-copy p{font-size:14px;line-height:1.55}
.work-rail-progress{margin-top:22px}

/* One consistent logo-led CTA replaces the repeated large CTAs */
.brand-cta{padding:clamp(72px,7vw,108px) 0;background:linear-gradient(180deg,#05080b 0%,#071019 100%);border-top:1px solid rgba(255,255,255,.09)}
.brand-cta-shell{display:grid;grid-template-columns:minmax(320px,.82fr) minmax(0,1.18fr);gap:clamp(48px,7vw,110px);align-items:center}
.brand-cta-mark{min-height:300px;display:flex;align-items:center;justify-content:center;padding:42px;border:1px solid rgba(255,255,255,.1);border-radius:28px;background:radial-gradient(circle at 18% 20%,rgba(65,172,230,.16),transparent 38%),#090f14;overflow:hidden}
.brand-cta-mark img{width:min(100%,560px);height:auto;object-fit:contain}
.brand-cta-copy h2{font-size:clamp(48px,5.8vw,92px);line-height:.92;letter-spacing:-.055em;margin:16px 0 30px;max-width:900px}
.brand-cta-copy h2 em{color:var(--cyan)}
.brand-cta-action{display:grid;grid-template-columns:minmax(240px,460px) auto;gap:32px;align-items:end}
.brand-cta-action p{margin:0;color:#96a5af;font-size:15px;line-height:1.68}
.brand-cta-action .pill{justify-self:end}

.site-footer{padding:44px 0 28px;border-top:1px solid rgba(255,255,255,.1)}
.footer-brand-row{display:flex;align-items:center;justify-content:space-between;gap:40px;padding-bottom:34px}
.footer-logo{display:flex;width:220px;max-width:42vw;align-items:center;overflow:hidden}
.footer-logo img{width:100%;height:58px;object-fit:contain;object-position:left center}
.footer-brand-row>.micro{color:#687984;text-align:right}
.footer-grid{padding-top:34px}

@media(max-width:1180px){
  .site-header .brand{width:152px}
  .site-header .brand img{height:38px;max-height:38px}
  .showreel{padding:76px 0 86px}
  .showreel-head{grid-template-columns:1fr;gap:18px;margin-bottom:28px}
  .showreel-head h2{font-size:clamp(46px,8vw,68px)}
  .showreel-frame{height:clamp(390px,58vh,580px)}
  .brand-cta-shell{grid-template-columns:1fr;gap:34px}
  .brand-cta-mark{min-height:250px}
  .brand-cta-action{grid-template-columns:1fr auto}
}

@media(max-width:740px){
  .site-header .brand{width:138px}
  .site-header .brand img,.site-header.is-scrolled .brand img{height:34px;max-height:34px}
  .showreel{padding:62px 0 70px}
  .showreel-head{margin-bottom:22px}
  .showreel-head h2{font-size:clamp(40px,11vw,54px)}
  .showreel-head p{font-size:14px}
  .showreel-frame{height:clamp(320px,52vh,470px);border-radius:20px}
  .showreel-meta{left:16px;right:16px;bottom:14px}
  .work-rail{padding:62px 0 48px}
  .work-rail-head{margin-bottom:26px}
  .work-rail-card{height:auto;min-height:0}
  .work-rail-card figure{height:280px}
  .work-rail-card-copy{padding:26px;min-height:260px}
  .brand-cta{padding:64px 0}
  .brand-cta-mark{min-height:210px;padding:28px;border-radius:22px}
  .brand-cta-copy h2{font-size:clamp(42px,11.5vw,58px);margin-bottom:24px}
  .brand-cta-action{grid-template-columns:1fr;gap:22px}
  .brand-cta-action .pill{justify-self:start}
  .footer-brand-row{align-items:flex-start;flex-direction:column;gap:18px;padding-bottom:28px}
  .footer-logo{width:205px;max-width:70vw}
  .footer-logo img{height:52px}
  .footer-brand-row>.micro{text-align:left}
}

@media(max-height:760px) and (min-width:1181px){
  .work-rail{padding-top:52px}
  .work-rail-head{margin-bottom:18px}
  .work-rail-head h2{font-size:clamp(40px,4.5vw,68px)}
  .work-rail-card{height:400px}
  .work-rail-progress{margin-top:16px}
}

/* =========================================================
   V4 — compact sticky icon + calmer responsive type + CTA cleanup
   ========================================================= */

/* The supplied square brand icon becomes the sticky navigation control. */
.header-compact-toggle{
  display:none;
  width:58px;
  height:58px;
  padding:0;
  border:0;
  border-radius:50%;
  overflow:hidden;
  background:#fff;
  cursor:pointer;
  position:relative;
  place-items:center;
  flex:0 0 58px;
  box-shadow:0 14px 42px rgba(0,0,0,.28);
}
.header-compact-toggle img{width:100%;height:100%;object-fit:cover;transition:opacity .2s ease,transform .28s ease}
.header-compact-toggle::before,.header-compact-toggle::after{content:"";position:absolute;left:18px;right:18px;top:28px;height:1.5px;background:#fff;opacity:0;transform-origin:center;transition:opacity .2s,transform .25s}
.header-compact-toggle[aria-expanded="true"] img{opacity:.18;transform:scale(.88)}
.header-compact-toggle[aria-expanded="true"]::before{opacity:1;transform:rotate(45deg)}
.header-compact-toggle[aria-expanded="true"]::after{opacity:1;transform:rotate(-45deg)}

/* Full header at the top, then a single floating round icon on scroll. */
.site-header .header-shell{width:min(var(--wrap),calc(100vw - (var(--pad) * 2)));transition:width .42s cubic-bezier(.2,.8,.2,1),height .35s ease,padding .35s ease,background .3s,border-color .3s,border-radius .35s ease,box-shadow .35s ease}
.site-header.is-compact{pointer-events:none;padding-top:12px}
.site-header.is-compact .header-shell{
  width:58px;
  height:58px;
  min-height:58px;
  margin-left:auto;
  margin-right:0;
  padding:0;
  gap:0;
  border-radius:50%;
  overflow:hidden;
  pointer-events:auto;
  background:rgba(5,8,11,.9);
  border-color:rgba(255,255,255,.18);
  box-shadow:0 15px 48px rgba(0,0,0,.28);
}
.site-header.is-compact .brand,
.site-header.is-compact .desktop-nav,
.site-header.is-compact .header-actions{display:none!important}
.site-header.is-compact .header-compact-toggle{display:grid}
.site-header.is-compact .mega-menu{display:none!important}

/* Keep the navigation overlay below the floating icon but above the page. */
.site-header.is-compact + main{position:relative}
body.menu-open .site-header{pointer-events:none}
body.menu-open .site-header .header-shell{pointer-events:auto}

/* CTA before the footer is intentionally text-led: logo remains exclusive to footer/header. */
.brand-cta{padding:clamp(66px,6vw,92px) 0}
.brand-cta-shell{display:block}
.brand-cta-copy{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(300px,.72fr);column-gap:clamp(42px,6vw,92px);align-items:end}
.brand-cta-copy>.micro{grid-column:1/-1;margin-bottom:12px}
.brand-cta-copy h2{grid-column:1;font-size:clamp(42px,4.8vw,76px);line-height:.93;letter-spacing:-.052em;margin:0;max-width:850px}
.brand-cta-action{grid-column:2;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.brand-cta-action p{font-size:14px;line-height:1.62;max-width:440px}
.brand-cta-action .pill{justify-self:auto}
.brand-cta-mark{display:none!important}

/* Calmer, more balanced display type across all page families. */
.home-hero h1{font-size:clamp(58px,6.55vw,112px);line-height:.88}
.intro-main h2{font-size:clamp(48px,5.8vw,92px);line-height:.96}
.service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2{font-size:clamp(42px,4.65vw,72px)}
.manifesto h2{font-size:clamp(58px,7.2vw,116px);line-height:.86}
.process-heading h2,.stack-heading h2{font-size:clamp(48px,5.55vw,88px)}
.inner-hero h1,.blog-hero h1,.not-found h1{font-size:clamp(52px,5.8vw,94px);line-height:.91}
.service-detail-title h1{font-size:clamp(50px,5.45vw,90px);line-height:.92}
.project-hero-copy h1{font-size:clamp(58px,6.55vw,108px);line-height:.89}
.contact-copy-new h1{font-size:clamp(52px,5.8vw,94px);line-height:.91}
.showreel-head h2{font-size:clamp(44px,4.75vw,76px)}
.capability-page-copy h2{font-size:clamp(42px,4.45vw,70px)}
.project-story-grid aside h2,.service-narrative aside h2,.guide-side h2,.field-guide-grid aside h2{font-size:clamp(38px,3.8vw,62px)}
.project-story-grid article h3,.guide-articles h3,.field-guide-grid article h3{font-size:clamp(30px,3vw,46px)}

@media(max-width:1180px){
  .site-header.is-compact{padding:10px 12px}
  .site-header.is-compact .header-shell{width:56px;height:56px;min-height:56px}
  .header-compact-toggle{width:56px;height:56px;flex-basis:56px}
  .home-hero h1{font-size:clamp(52px,8.8vw,86px)}
  .intro-main h2{font-size:clamp(44px,7.2vw,66px)}
  .inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1{font-size:clamp(46px,8vw,70px)}
  .project-hero-copy h1{font-size:clamp(50px,9vw,78px)}
  .brand-cta-copy{grid-template-columns:1fr .72fr;column-gap:36px}
  .brand-cta-copy h2{font-size:clamp(40px,6.2vw,62px)}
}

@media(max-width:820px){
  body{font-size:15px}
  .site-header.is-compact{padding:10px 12px}
  .site-header.is-compact .header-shell{width:52px;height:52px;min-height:52px}
  .header-compact-toggle{width:52px;height:52px;flex-basis:52px}
  .header-compact-toggle::before,.header-compact-toggle::after{left:16px;right:16px;top:25px}
  .home-hero h1{font-size:clamp(46px,11.8vw,62px)}
  .intro-main h2{font-size:clamp(38px,9.8vw,50px)}
  .service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2{font-size:clamp(36px,9.2vw,48px)}
  .service-panel-copy h3,.capability-chapters h3,.stack-project h3{font-size:clamp(30px,7.8vw,40px)}
  .manifesto h2{font-size:clamp(44px,11vw,60px)}
  .process-heading h2{font-size:clamp(40px,9.8vw,52px)}
  .inner-hero h1,.blog-hero h1,.not-found h1,.service-detail-title h1,.contact-copy-new h1{font-size:clamp(42px,10.5vw,56px)}
  .project-hero-copy h1{font-size:clamp(46px,11.6vw,62px)}
  .showreel-head h2{font-size:clamp(36px,9vw,48px)}
  .capability-page-copy h2{font-size:clamp(36px,8.8vw,48px)}
  .brand-cta{padding:58px 0}
  .brand-cta-copy{display:block}
  .brand-cta-copy>.micro{display:block;margin-bottom:12px}
  .brand-cta-copy h2{font-size:clamp(38px,9.8vw,50px);margin:0 0 24px}
  .brand-cta-action{gap:18px}
  .brand-cta-action p{font-size:14px;margin:0}
}

@media(max-width:520px){
  .home-hero h1{font-size:clamp(42px,11.3vw,52px)}
  .intro-main h2{font-size:clamp(34px,9.5vw,44px)}
  .service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2{font-size:clamp(33px,9vw,42px)}
  .manifesto h2{font-size:clamp(40px,11vw,52px)}
  .inner-hero h1,.blog-hero h1,.not-found h1,.service-detail-title h1,.contact-copy-new h1{font-size:clamp(38px,10.3vw,50px)}
  .project-hero-copy h1{font-size:clamp(42px,11vw,54px)}
  .brand-cta-copy h2{font-size:clamp(35px,9.6vw,44px)}
}

/* =========================================================
   V5 — expanding header navigation (no off-canvas)
   The floating brand icon grows into the header itself.
   ========================================================= */
.header-shell{position:relative;isolation:isolate;overflow:visible}

/* The old fullscreen canvas is now content INSIDE the header shell. */
.mobile-panel{
  position:absolute;
  inset:0;
  z-index:0;
  padding:24px 26px 26px;
  background:transparent;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-8px);
  overflow:auto;
}
.mobile-panel-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px}
.mobile-panel-brand{display:flex;align-items:center;width:180px;max-width:55%;overflow:hidden}
.mobile-panel-brand img{width:100%;height:44px;object-fit:contain;object-position:left center}
.nav-panel-close{
  width:46px;height:46px;flex:0 0 46px;border:1px solid rgba(255,255,255,.15);border-radius:50%;
  background:rgba(255,255,255,.06);position:relative;cursor:pointer;transition:background .2s,border-color .2s,transform .2s
}
.nav-panel-close:hover{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.28);transform:rotate(4deg)}
.nav-panel-close span{position:absolute;left:13px;right:13px;top:22px;height:1.5px;background:#fff;transform:rotate(45deg)}
.nav-panel-close span+span{transform:rotate(-45deg)}
.mobile-panel-inner{height:auto;min-height:calc(100% - 72px);display:flex;flex-direction:column}
.mobile-panel-inner>.micro{color:#698294;margin-bottom:8px}
.mobile-panel-inner>a{font-size:clamp(28px,3.2vw,44px);line-height:1.02;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1);letter-spacing:-.035em;transition:color .2s,padding-left .2s}
.mobile-panel-inner>a:hover,.mobile-panel-inner>a:focus-visible{color:var(--cyan);padding-left:8px}
.mobile-contact{margin-top:auto;padding-top:24px;display:flex;flex-direction:column;gap:6px;color:#91a0aa;font-size:12px}

/* Grow from the current header position rather than opening a canvas. */
.site-header.nav-open{pointer-events:auto!important;padding-top:12px}
.site-header.nav-open .header-shell,
.site-header.is-compact.nav-open .header-shell{
  width:min(560px,calc(100vw - (var(--pad) * 2)));
  height:min(610px,calc(100svh - 28px));
  min-height:520px;
  margin-left:auto;
  margin-right:0;
  padding:0;
  border-radius:30px;
  overflow:hidden;
  background:rgba(5,8,11,.97);
  border-color:rgba(255,255,255,.16);
  box-shadow:0 24px 80px rgba(0,0,0,.42);
  backdrop-filter:blur(24px);
}
.site-header.nav-open .brand,
.site-header.nav-open .desktop-nav,
.site-header.nav-open .header-actions,
.site-header.nav-open .header-compact-toggle{opacity:0;visibility:hidden;pointer-events:none}
.site-header.nav-open .mobile-panel{opacity:1;visibility:visible;pointer-events:auto;transform:none;z-index:2}

/* The floating icon remains the collapsed state only. */
.site-header.is-compact:not(.nav-open) .header-shell{overflow:hidden}
body.menu-open .site-header{pointer-events:auto}
body.menu-open .site-header .header-shell{pointer-events:auto}

/* Mobile/tablet uses exactly the same grow interaction. */
@media(max-width:1180px){
  .site-header:not(.is-compact) .header-shell{transition:width .42s cubic-bezier(.2,.8,.2,1),height .42s cubic-bezier(.2,.8,.2,1),padding .3s,border-radius .38s,background .3s,box-shadow .35s}
  .site-header.nav-open .header-shell,.site-header.is-compact.nav-open .header-shell{
    width:min(560px,calc(100vw - 24px));
    height:min(610px,calc(100svh - 24px));
    min-height:min(520px,calc(100svh - 24px));
  }
}
@media(max-width:820px){
  .site-header.nav-open{padding:10px 12px}
  .site-header.nav-open .header-shell,.site-header.is-compact.nav-open .header-shell{
    width:calc(100vw - 24px);
    height:min(590px,calc(100svh - 20px));
    min-height:min(500px,calc(100svh - 20px));
    border-radius:24px;
  }
  .mobile-panel{padding:20px 20px 22px}
  .mobile-panel-head{margin-bottom:18px}
  .mobile-panel-brand{width:154px}
  .mobile-panel-brand img{height:38px}
  .nav-panel-close{width:42px;height:42px;flex-basis:42px}
  .nav-panel-close span{left:12px;right:12px;top:20px}
  .mobile-panel-inner>a{font-size:clamp(28px,8.4vw,38px);padding:8px 0}
  .mobile-contact{padding-top:18px}
}
@media(max-width:520px){
  .site-header.nav-open .header-shell,.site-header.is-compact.nav-open .header-shell{
    height:min(560px,calc(100svh - 20px));
    min-height:min(470px,calc(100svh - 20px));
  }
  .mobile-panel-inner>a{font-size:clamp(27px,8.2vw,34px)}
}

/* =========================================================
   V6 — true horizontal header morph on desktop
   Desktop: the floating D icon expands into the SAME sticky
   horizontal header. Mobile: keep the fullscreen menu + close.
   ========================================================= */

/* Keep the supplied D artwork in its original blue treatment. */
.header-compact-toggle{
  background:#081018!important;
  border:1px solid rgba(73,177,232,.28)!important;
}
.header-compact-toggle img{
  opacity:1!important;
  transform:none!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}
.header-compact-toggle::before,
.header-compact-toggle::after{display:none!important}

@media(min-width:1181px){
  /* No drawer/popup on desktop. */
  .mobile-panel{display:none!important}
  .site-header.nav-open .header-shell,
  .site-header.is-compact.nav-open .header-shell{height:62px!important;min-height:62px!important}

  /* Collapsed round icon remains right-anchored. */
  .site-header.is-compact:not(.compact-expanded) .header-shell{
    width:58px!important;
    height:58px!important;
    min-height:58px!important;
    margin-left:auto!important;
    margin-right:0!important;
    padding:0!important;
    gap:0!important;
    border-radius:50%!important;
    overflow:hidden!important;
  }
  .site-header.is-compact:not(.compact-expanded) .brand,
  .site-header.is-compact:not(.compact-expanded) .desktop-nav,
  .site-header.is-compact:not(.compact-expanded) .header-actions{display:none!important}
  .site-header.is-compact:not(.compact-expanded) .header-compact-toggle{display:grid!important}

  /* Clicking the icon expands that exact shell HORIZONTALLY. */
  .site-header.is-compact.compact-expanded{
    pointer-events:auto!important;
    padding-top:8px!important;
  }
  .site-header.is-compact.compact-expanded .header-shell{
    width:max-content;
    height:62px!important;
    min-height:62px!important;
    margin-left:auto!important;
    margin-right:0!important;
    padding:0 16px 0 22px!important;
    gap:26px!important;
    border-radius:999px!important;
    overflow:visible!important;
    background:rgba(5,8,11,.94)!important;
    border-color:rgba(255,255,255,.14)!important;
    box-shadow:0 12px 46px rgba(0,0,0,.24)!important;
    transition:width .48s cubic-bezier(.2,.8,.2,1),height .34s ease,padding .34s ease,border-radius .34s ease,background .28s ease,box-shadow .28s ease!important;
  }
  .site-header.is-compact.compact-expanded .brand{
    display:flex!important;
    width:176px!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  .site-header.is-compact.compact-expanded .brand img{height:40px!important;max-height:40px!important}
  .site-header.is-compact.compact-expanded .desktop-nav{
    display:flex!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    margin-left:auto;
  }
  .site-header.is-compact.compact-expanded .header-actions{
    display:flex!important;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  .site-header.is-compact.compact-expanded .header-compact-toggle{display:none!important}
  .site-header.is-compact.compact-expanded .mega-menu{display:grid!important}
}

/* Mobile/tablet returns to the original fullscreen menu pattern. */
@media(max-width:1180px){
  .site-header.compact-expanded{pointer-events:auto}
  .site-header.compact-expanded .header-shell{width:inherit}

  .mobile-panel{
    display:block!important;
    position:fixed!important;
    inset:0!important;
    z-index:1250!important;
    width:100vw!important;
    height:100svh!important;
    min-height:100svh!important;
    padding:112px var(--pad) 32px!important;
    background:#05080b!important;
    border-radius:0!important;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-14px);
    overflow:auto!important;
  }
  .site-header.nav-open .mobile-panel{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }
  .mobile-panel-head{
    position:absolute;
    top:18px;
    left:var(--pad);
    right:var(--pad);
    margin:0!important;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
  }
  .mobile-panel-brand{width:158px!important;max-width:62%!important}
  .mobile-panel-brand img{height:40px!important;max-height:40px!important;object-fit:contain!important}
  .nav-panel-close{
    display:block!important;
    width:46px!important;
    height:46px!important;
    flex:0 0 46px!important;
    z-index:2;
  }
  .mobile-panel-inner{
    height:calc(100svh - 144px)!important;
    min-height:0!important;
  }

  /* Do not let the V5 card-growth rules resize the mobile header. */
  .site-header.nav-open .header-shell{
    width:min(var(--wrap),calc(100vw - 24px))!important;
    height:58px!important;
    min-height:58px!important;
    padding:0 10px 0 14px!important;
    border-radius:999px!important;
  }
  .site-header.is-compact.nav-open .header-shell{
    width:56px!important;
    height:56px!important;
    min-height:56px!important;
    padding:0!important;
    border-radius:50%!important;
  }
  .site-header.nav-open .brand,
  .site-header.nav-open .header-actions,
  .site-header.nav-open .header-compact-toggle{
    opacity:1!important;
    visibility:visible!important;
  }
  .site-header:not(.is-compact).nav-open .brand,
  .site-header:not(.is-compact).nav-open .header-actions{pointer-events:auto!important}
  .site-header.is-compact.nav-open .brand,
  .site-header.is-compact.nav-open .header-actions{display:none!important}
  .site-header.is-compact.nav-open .header-compact-toggle{display:grid!important}
}

@media(max-width:820px){
  .mobile-panel{padding:102px 20px 26px!important}
  .mobile-panel-head{left:20px;right:20px;top:15px}
  .mobile-panel-brand{width:148px!important}
  .mobile-panel-brand img{height:36px!important;max-height:36px!important}
  .mobile-panel-inner{height:calc(100svh - 126px)!important}
  .mobile-panel-inner>a{font-size:clamp(30px,9.4vw,42px)!important;padding:9px 0!important}
  .site-header.is-compact.nav-open .header-shell{width:52px!important;height:52px!important;min-height:52px!important}
}
@media(max-width:1180px){
  .site-header.nav-open .header-shell,
  .site-header.is-compact.nav-open .header-shell{overflow:visible!important}
}

/* =========================================================
   V7 — content-fit horizontal morph refinement
   ========================================================= */
@media(min-width:1181px){
  /* Keep the floating trigger genuinely black, with breathing room around the D mark. */
  .site-header.is-compact:not(.compact-expanded) .header-shell{
    background:#020406!important;
    border-color:rgba(73,177,232,.22)!important;
    box-shadow:0 14px 42px rgba(0,0,0,.36)!important;
  }
  .header-compact-toggle{
    width:58px!important;
    height:58px!important;
    flex-basis:58px!important;
    padding:7px!important;
    background:#020406!important;
    border:0!important;
    border-radius:50%!important;
    overflow:hidden!important;
  }
  .header-compact-toggle img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    border-radius:50%;
    background:transparent!important;
  }

  /* Expanded state hugs its real navigation content instead of spanning the page. */
  .site-header.is-compact.compact-expanded .header-shell{
    width:max-content;
    max-width:calc(100vw - (var(--pad) * 2));
    min-width:0;
    background:#020406!important;
    border-color:rgba(255,255,255,.13)!important;
    gap:22px!important;
    padding:0 15px 0 20px!important;
    box-shadow:0 16px 50px rgba(0,0,0,.34)!important;
    will-change:width;
  }
  .site-header.is-compact.compact-expanded .brand{width:164px!important}
  .site-header.is-compact.compact-expanded .desktop-nav{gap:22px!important}
  .site-header.is-compact.compact-expanded .header-actions{gap:8px!important}
  .site-header.is-compact.compact-expanded .header-contact{padding:12px 16px!important}
}


/* =========================================================
   V8 — precise content-fit morph + persistent compact icon
   ========================================================= */
@media(min-width:1181px){
  /* The scrolled icon gets real inner breathing room so the supplied artwork is not edge-clipped. */
  .site-header.is-compact .header-compact-toggle{
    display:grid!important;
    width:58px!important;
    height:58px!important;
    flex:0 0 58px!important;
    padding:6px!important;
    place-items:center!important;
    background:#020406!important;
    border:0!important;
    border-radius:50%!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }
  .site-header.is-compact .header-compact-toggle img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:contain!important;
    object-position:center!important;
    border-radius:0!important;
    background:transparent!important;
  }

  /* Collapsed: just the black circular D control. */
  .site-header.is-compact:not(.compact-expanded) .header-shell{
    width:58px!important;
    min-width:58px!important;
    max-width:58px!important;
    height:58px!important;
    padding:0!important;
    gap:0!important;
  }

  /* Expanded-after-scroll: keep the D icon, never restore the full wordmark. */
  .site-header.is-compact.compact-expanded .brand{display:none!important}
  .site-header.is-compact.compact-expanded .header-compact-toggle{
    display:grid!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    order:3;
  }
  .site-header.is-compact.compact-expanded .desktop-nav{
    display:flex!important;
    margin-left:0!important;
    order:1;
  }
  .site-header.is-compact.compact-expanded .header-actions{
    display:flex!important;
    order:2;
  }
  .site-header.is-compact.compact-expanded .header-shell{
    width:max-content;
    max-width:calc(100vw - 32px)!important;
    min-width:0!important;
    height:62px!important;
    min-height:62px!important;
    padding:2px 2px 2px 20px!important;
    gap:20px!important;
    overflow:visible!important;
    background:#020406!important;
    border-color:rgba(255,255,255,.13)!important;
    border-radius:999px!important;
    box-shadow:0 16px 50px rgba(0,0,0,.34)!important;
  }
  .site-header.is-compact.compact-expanded .desktop-nav{gap:21px!important}
  .site-header.is-compact.compact-expanded .header-actions{gap:8px!important}
  .site-header.is-compact.compact-expanded .header-contact{padding:12px 15px!important}
}

/* =========================================================
   V9 — left-mark content-fit morph + smooth scroll-collapse
   ========================================================= */
@media(min-width:1181px){
  /* After scroll, the compact D mark always stays on the LEFT of the opened pill. */
  .site-header.is-compact.compact-expanded .header-compact-toggle{
    order:1!important;
    margin:0!important;
  }
  .site-header.is-compact.compact-expanded .desktop-nav{
    order:2!important;
    margin-left:0!important;
  }
  .site-header.is-compact.compact-expanded .header-actions{
    order:3!important;
  }

  /* Only grow as much as the actual navigation content needs. */
  .site-header.is-compact.compact-expanded .header-shell{
    width:max-content;
    max-width:calc(100vw - 32px)!important;
    min-width:0!important;
    padding:2px 16px 2px 2px!important;
    gap:18px!important;
    transform-origin:right center;
    transition:background .32s ease,border-color .32s ease,box-shadow .4s ease,border-radius .5s cubic-bezier(.22,.61,.36,1)!important;
  }

  /* Keep the mark comfortably inside its black circular holder. */
  .site-header.is-compact .header-compact-toggle{
    padding:8px!important;
    background:#020406!important;
    border:1px solid rgba(73,177,232,.20)!important;
  }
  .site-header.is-compact .header-compact-toggle img{
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
  }
}

/* =========================================================
   V10 — premium-speed header morph calibration
   Smooth main-header compact/uncompact + balanced pill close.
   ========================================================= */
@media(min-width:1181px){
  /* One consistent motion curve for the full header -> compact mark transition. */
  .site-header .header-shell{
    overflow:hidden;
    transition:
      width .62s cubic-bezier(.22,.61,.36,1),
      height .50s cubic-bezier(.22,.61,.36,1),
      min-height .50s cubic-bezier(.22,.61,.36,1),
      padding .50s cubic-bezier(.22,.61,.36,1),
      gap .44s cubic-bezier(.22,.61,.36,1),
      border-radius .58s cubic-bezier(.22,.61,.36,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .46s ease!important;
  }

  /* Keep desktop content renderable while the shell contracts so it fades instead of vanishing. */
  .site-header .brand,
  .site-header .desktop-nav,
  .site-header .header-actions{
    opacity:1;
    visibility:visible;
    transform:translate3d(0,0,0);
    transition:
      opacity .30s ease,
      transform .46s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear 0s;
  }
  .site-header.is-compact:not(.compact-expanded) .brand,
  .site-header.is-compact:not(.compact-expanded) .desktop-nav,
  .site-header.is-compact:not(.compact-expanded) .header-actions{
    display:flex!important;
    position:absolute!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(6px,-2px,0) scale(.985)!important;
    transition:
      opacity .24s ease,
      transform .42s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .28s!important;
  }

  /* The compact D mark fades/scales in while the horizontal shell is finishing its morph. */
  .site-header .header-compact-toggle{
    display:grid!important;
    position:absolute;
    right:0;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:scale(.86);
    transition:
      opacity .28s ease .10s,
      transform .52s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .38s!important;
  }
  .site-header.is-compact .header-compact-toggle{
    position:relative;
    right:auto;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:scale(1)!important;
    transition:
      opacity .30s ease .10s,
      transform .52s cubic-bezier(.22,.61,.36,1),
      visibility 0s!important;
  }

  /* Open pill stays responsive, but no abrupt width snap when it closes. */
  .site-header.is-compact.compact-expanded .header-shell{
    transition:
      background .32s ease,
      border-color .32s ease,
      box-shadow .42s ease,
      border-radius .52s cubic-bezier(.22,.61,.36,1)!important;
  }
}

/* =========================================================
   V11 — FINAL RESPONSIVE SYSTEM
   Authoritative responsive/type/header pass. These rules are
   intentionally last so older iteration overrides cannot win.
   ========================================================= */
:root{
  --fluid-body:clamp(15px,.16vw + 14.5px,16px);
  --space-section:clamp(72px,6.5vw,112px);
  --space-section-tight:clamp(56px,5vw,88px);
}
body{font-size:var(--fluid-body);overflow-x:clip}
main,section,footer,.wrap-wide,.header-shell>*{min-width:0}
h1,h2,h3{overflow-wrap:break-word;text-wrap:balance}
p{overflow-wrap:break-word}
figure{max-width:100%}
img,video{max-width:100%}

/* Desktop/laptop header fit before the tablet breakpoint. */
@media(min-width:1181px) and (max-width:1360px){
  :root{--pad:24px}
  .site-header{padding-inline:18px}
  .header-shell{gap:18px;padding-left:18px;padding-right:12px}
  .brand{width:154px!important}
  .brand img{height:38px!important;max-height:38px!important}
  .desktop-nav{gap:18px}
  .nav-link{font-size:12px}
  .header-contact{padding:11px 14px;font-size:11px}
  .site-header.is-compact.compact-expanded .header-shell{gap:15px!important;padding-right:12px!important}
  .site-header.is-compact.compact-expanded .desktop-nav{gap:17px!important}
}

/* Tablet / mobile header: stable pill at top, compact D on scroll, fullscreen menu. */
@media(max-width:1180px){
  :root{--header-h:76px;--pad:clamp(20px,4vw,34px)}
  .site-header{padding:10px 12px!important}
  .header-shell{
    width:min(760px,calc(100vw - 24px))!important;
    height:60px!important;
    min-height:60px!important;
    margin-inline:auto!important;
    padding:0 10px 0 16px!important;
    gap:12px!important;
    border-radius:999px!important;
    overflow:visible!important;
  }
  .site-header:not(.is-compact) .brand{display:flex!important;width:150px!important;height:100%!important;opacity:1!important;visibility:visible!important}
  .site-header:not(.is-compact) .brand img{height:36px!important;max-height:36px!important;object-fit:contain!important}
  .desktop-nav{display:none!important}
  .header-actions{display:flex!important;margin-left:auto!important;gap:6px!important;align-items:center!important}
  .header-contact{display:none!important}
  .language-control{margin:0!important}
  .language-control select{font-size:10px!important;padding:8px 5px!important}
  .menu-toggle{
    display:block!important;width:42px!important;height:42px!important;flex:0 0 42px!important;
    border:1px solid rgba(255,255,255,.12)!important;border-radius:50%!important;background:rgba(255,255,255,.035)!important
  }
  .menu-toggle span{left:10px!important;width:20px!important}

  .site-header.is-compact{padding:10px 12px!important;pointer-events:none!important}
  .site-header.is-compact .header-shell{
    width:54px!important;min-width:54px!important;max-width:54px!important;height:54px!important;min-height:54px!important;
    margin-left:auto!important;margin-right:0!important;padding:0!important;gap:0!important;border-radius:50%!important;
    background:#020406!important;border-color:rgba(73,177,232,.24)!important;overflow:hidden!important;pointer-events:auto!important
  }
  .site-header.is-compact .brand,.site-header.is-compact .header-actions{display:none!important}
  .site-header.is-compact .header-compact-toggle{
    display:grid!important;width:54px!important;height:54px!important;flex:0 0 54px!important;padding:8px!important;
    background:#020406!important;border:0!important;border-radius:50%!important
  }
  .site-header.is-compact .header-compact-toggle img{width:100%!important;height:100%!important;object-fit:contain!important}

  /* Fullscreen mobile/tablet navigation is independent of the small header shell. */
  .mobile-panel{
    display:block!important;position:fixed!important;inset:0!important;z-index:1300!important;width:100vw!important;height:100dvh!important;min-height:100svh!important;
    padding:108px var(--pad) max(26px,env(safe-area-inset-bottom))!important;background:#05080b!important;border-radius:0!important;
    overflow:auto!important;overscroll-behavior:contain;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-8px)
  }
  .site-header.nav-open .mobile-panel{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}
  .mobile-panel-head{position:absolute!important;top:max(14px,env(safe-area-inset-top))!important;left:var(--pad)!important;right:var(--pad)!important;display:flex!important;align-items:center!important;justify-content:space-between!important;margin:0!important}
  .mobile-panel-brand{display:flex!important;width:150px!important;max-width:58vw!important;align-items:center!important;overflow:hidden!important}
  .mobile-panel-brand img{width:100%!important;height:38px!important;max-height:38px!important;object-fit:contain!important;object-position:left center!important}
  .nav-panel-close{display:block!important;width:44px!important;height:44px!important;flex:0 0 44px!important;background:#0a1117!important;border:1px solid rgba(255,255,255,.16)!important}
  .nav-panel-close span{left:12px!important;right:12px!important;top:21px!important}
  .mobile-panel-inner{height:auto!important;min-height:calc(100dvh - 142px)!important;display:flex!important;flex-direction:column!important;padding-bottom:4px}
  .mobile-panel-inner>.micro{margin-bottom:8px!important;color:#708694!important}
  .mobile-panel-inner>a{font-size:clamp(30px,5.3vw,46px)!important;line-height:1.04!important;letter-spacing:-.035em!important;padding:9px 0!important}
  .mobile-languages{display:flex;gap:8px;margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
  .mobile-languages a{display:grid;place-items:center;min-width:44px;height:38px;padding:0 12px;border:1px solid rgba(255,255,255,.13);border-radius:999px;font-family:'DM Mono';font-size:10px;color:#a9b6bf}
  .mobile-languages a[aria-current="page"]{background:#fff;color:#05080b;border-color:#fff}
  .mobile-contact{margin-top:auto!important;padding-top:24px!important;font-size:12px!important;line-height:1.55!important}
  body.menu-open{overflow:hidden!important;touch-action:none}

  /* Global tablet layout rhythm. */
  .home-hero,.inner-hero,.service-detail-hero,.project-hero-new,.contact-new{overflow:hidden}
  .home-hero-stage,.inner-hero-grid,.service-detail-hero-grid,.contact-new-grid{grid-template-columns:1fr!important}
  .hero-copy-bottom,.service-story-head,.work-rail-head,.section-split-heading,.project-hero-copy,.directory-intro,.directory-group{grid-template-columns:1fr!important}
  .hero-copy-bottom{align-items:start!important}
  .hero-visual{width:min(860px,100%)!important;margin-inline:auto!important}
  .service-story-stage{display:block!important}
  .service-story-index{display:none!important}
  .service-panel{grid-template-columns:1fr!important;min-height:0!important}
  .capability-story-grid{grid-template-columns:1fr!important}
  .capability-sticky{position:relative!important;top:0!important}
  .field-guide-grid,.guide-shell,.service-narrative-grid,.project-story-grid,.about-editorial-grid{grid-template-columns:1fr!important}
  .field-guide-grid>aside,.guide-side,.service-narrative aside,.project-story-grid>aside,.about-editorial aside{position:relative!important;top:0!important}
  .contact-form-card{position:relative!important;top:0!important}
  .capability-page-chapter,.capability-page-chapter.reverse{grid-template-columns:1fr!important;min-height:0!important}
  .capability-page-chapter.reverse .capability-page-copy,.capability-page-chapter.reverse figure{order:initial!important}
}

/* Tablet-specific typography / media sizing. */
@media(min-width:821px) and (max-width:1180px){
  :root{--section-space:80px;--section-space-tight:66px}
  .home-hero{padding-top:122px!important}
  .home-hero h1{font-size:clamp(58px,8.6vw,92px)!important;line-height:.9!important}
  .hero-copy-bottom{max-width:700px}
  .hero-visual{height:clamp(500px,58vw,680px)!important;margin-top:24px!important}
  .intro-stage{grid-template-columns:.34fr 1fr!important;gap:34px!important}
  .intro-photo{grid-column:2!important;min-height:400px!important}
  .service-panel-media{min-height:420px!important}
  .service-panel-copy{padding:36px!important}
  .work-rail-card{width:100%!important}
  .work-rail-track{display:grid!important;grid-template-columns:1fr 1fr!important;gap:20px!important;padding:0 var(--pad)!important;width:auto!important}
  .work-rail-card{display:grid!important;grid-template-columns:1fr!important;height:auto!important}
  .work-rail-card figure{height:320px!important}
  .work-rail-card-copy{min-height:240px!important}
  .work-rail-progress{display:none!important}
  .capability-chapters article{grid-template-columns:58px 1fr!important;gap:22px!important;min-height:0!important}
  .capability-chapters figure{grid-column:1/-1!important;height:400px!important}
  .portfolio-masonry{grid-template-columns:1fr 1fr!important}
  .portfolio-card-new:nth-child(3n+1){grid-row:auto!important}
  .portfolio-card-new figure,.portfolio-card-new:nth-child(3n+1) figure{height:420px!important}
  .footer-grid{grid-template-columns:repeat(2,1fr)!important}
}

/* Phone / narrow tablet. */
@media(max-width:820px){
  :root{--pad:20px;--section-space:66px;--section-space-tight:54px;--radius:18px}
  body{font-size:15px!important;line-height:1.58}
  .wrap-wide{width:calc(100% - (var(--pad) * 2))!important}

  /* Mobile header gets a deliberately compact top state. */
  .site-header{padding:9px 10px!important}
  .header-shell{width:calc(100vw - 20px)!important;height:56px!important;min-height:56px!important;padding:0 8px 0 13px!important}
  .site-header:not(.is-compact) .brand{width:132px!important}
  .site-header:not(.is-compact) .brand img{height:32px!important;max-height:32px!important}
  .menu-toggle{width:40px!important;height:40px!important;flex-basis:40px!important}
  .language-control select{font-size:9px!important;padding-inline:3px!important}
  .site-header.is-compact{padding:9px 10px!important}
  .site-header.is-compact .header-shell{width:52px!important;min-width:52px!important;max-width:52px!important;height:52px!important;min-height:52px!important}
  .site-header.is-compact .header-compact-toggle{width:52px!important;height:52px!important;flex-basis:52px!important;padding:8px!important}

  .mobile-panel{padding:92px 20px 24px!important}
  .mobile-panel-head{left:20px!important;right:20px!important;top:13px!important}
  .mobile-panel-brand{width:138px!important}
  .mobile-panel-brand img{height:34px!important;max-height:34px!important}
  .nav-panel-close{width:42px!important;height:42px!important;flex-basis:42px!important}
  .nav-panel-close span{top:20px!important}
  .mobile-panel-inner{min-height:calc(100dvh - 116px)!important}
  .mobile-panel-inner>a{font-size:clamp(29px,8.5vw,40px)!important;padding:8px 0!important}

  /* Fluid mobile typography: no 60–70px headings on 390px screens. */
  .home-hero h1{font-size:clamp(42px,11.7vw,58px)!important;line-height:.94!important;letter-spacing:-.052em!important}
  .inner-hero h1,.blog-hero h1,.not-found h1,.service-detail-title h1,.contact-copy-new h1{font-size:clamp(40px,10.8vw,54px)!important;line-height:.95!important;letter-spacing:-.045em!important}
  .project-hero-copy h1{font-size:clamp(42px,11.2vw,58px)!important;line-height:.94!important}
  .intro-main h2,.service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2,.process-heading h2,.showreel-head h2,.capability-page-copy h2{font-size:clamp(34px,8.9vw,46px)!important;line-height:1!important;letter-spacing:-.042em!important}
  .manifesto h2{font-size:clamp(40px,10.9vw,56px)!important;line-height:.92!important}
  .capability-sticky h2,.service-narrative aside h2,.guide-side h2,.faq-grid h2,.about-editorial h2,.project-story-grid aside h2,.field-guide-grid aside h2{font-size:clamp(34px,8.7vw,44px)!important;line-height:1!important}
  .service-panel-copy h3,.capability-chapters h3,.stack-project h3,.belief-list h3,.guide-articles h3,.project-story-grid article h3,.field-guide-grid article h3{font-size:clamp(28px,7.2vw,38px)!important;line-height:1.05!important}
  .directory-group aside h2{font-size:30px!important}
  .directory-row h3{font-size:clamp(19px,5vw,23px)!important;line-height:1.08!important}
  .portfolio-card-new h2{font-size:clamp(27px,7vw,34px)!important;line-height:1.05!important}
  .brand-cta-copy h2{font-size:clamp(36px,9.3vw,48px)!important;line-height:.98!important}

  /* Home. */
  .home-hero{padding-top:100px!important;min-height:auto!important}
  .home-hero-stage{gap:18px!important}
  .hero-meta{display:flex!important;flex-wrap:wrap!important;gap:8px 10px!important;margin-bottom:22px!important;font-size:8px!important}
  .hero-meta i{display:none!important}
  .hero-copy-bottom{margin-top:22px!important;gap:18px!important}
  .hero-copy-bottom p{font-size:15px!important;line-height:1.62!important}
  .hero-actions{gap:10px!important}
  .pill{min-height:44px!important;padding:12px 15px!important;gap:10px!important;font-size:12px!important}
  .hero-visual{height:clamp(350px,92vw,470px)!important;margin-top:14px!important}
  .hero-frame{border-radius:18px!important}
  .hero-frame-a{width:78%!important;height:64%!important;right:0!important}
  .hero-frame-b{width:50%!important;height:38%!important;left:0!important}
  .hero-frame-c{width:36%!important;height:32%!important;right:5%!important}
  .hero-badge{width:92px!important;height:92px!important;left:4%!important;top:11%!important}
  .hero-badge span{font-size:7px!important}.hero-badge b{font-size:9px!important}
  .hero-scroll-cue{height:48px!important;margin-top:8px!important;gap:10px!important;font-size:8px!important}
  .tool-belt{padding:22px 0!important}
  .tool-runner-track{font-size:clamp(30px,9vw,44px)!important}

  .home-intro{padding:var(--section-space) 0!important}
  .intro-stage{grid-template-columns:1fr!important;gap:28px!important}
  .intro-index{display:grid!important;grid-template-columns:auto 1fr!important;gap:12px!important}
  .intro-index p{grid-column:1/-1!important;margin:0!important}
  .intro-main h2{margin-top:8px!important}
  .intro-lower{grid-template-columns:1fr!important;margin-top:24px!important;gap:18px!important}
  .intro-photo{grid-column:1!important;min-height:0!important;height:auto!important;aspect-ratio:4/3!important;border-radius:54px 16px 54px 16px!important}
  .round-cta{width:58px!important;height:58px!important}

  .showreel{padding:var(--section-space) 0!important}
  .showreel-head{grid-template-columns:1fr!important;gap:14px!important;margin-bottom:20px!important}
  .showreel-head p{font-size:14px!important;line-height:1.62!important}
  .showreel-frame{height:auto!important;aspect-ratio:4/5!important;border-radius:18px!important}
  .showreel-frame video{object-position:center!important}
  .showreel-meta{left:13px!important;right:13px!important;bottom:12px!important;gap:10px!important;font-size:7px!important;letter-spacing:.08em!important}
  .showreel-meta button{padding:8px 10px!important;font-size:8px!important}

  .service-story{padding:var(--section-space) 0!important}
  .service-story-head{gap:16px!important;margin-bottom:28px!important}
  .service-story-head>div:last-child{max-width:none!important}
  .service-panel{border-radius:20px!important;margin-bottom:16px!important}
  .service-panel-media{min-height:0!important;height:auto!important;aspect-ratio:4/3!important}
  .service-panel-copy{min-height:0!important;padding:24px!important}
  .service-panel-copy p{font-size:14.5px!important}
  .service-panel-link{padding-top:20px!important;margin-top:0!important}

  .manifesto{padding:var(--section-space) 0!important;min-height:auto!important}
  .manifesto h2{margin:34px 0 26px!important}
  .manifesto-copy{grid-template-columns:1fr!important;gap:20px!important}
  .manifesto-copy p{font-size:15px!important}
  .principle-row{grid-template-columns:1fr!important;margin-top:34px!important}
  .principle-row article{min-height:0!important;padding:22px 0!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.2)!important}
  .principle-row article+article{padding-left:0!important}
  .principle-row h3{font-size:20px!important;margin:12px 0 6px!important}

  .work-rail{padding:var(--section-space) 0!important}
  .work-rail-head{gap:14px!important;margin-bottom:24px!important}
  .work-rail-viewport{padding:0 var(--pad)!important;overflow:visible!important}
  .work-rail-track{display:grid!important;width:auto!important;gap:18px!important;padding:0!important}
  .work-rail-card{width:100%!important;height:auto!important;min-height:0!important;grid-template-columns:1fr!important;border-radius:20px!important}
  .work-rail-card figure{height:auto!important;aspect-ratio:4/3!important}
  .work-rail-card-copy{min-height:0!important;padding:23px!important}
  .work-rail-card-copy h3{margin:10px 0 12px!important}
  .work-rail-progress{display:none!important}

  .capability-story{padding:var(--section-space) 0!important}
  .capability-story-grid{gap:26px!important}
  .capability-sticky p{font-size:14.5px!important}
  .cap-progress{margin-top:24px!important}
  .capability-chapters{gap:0!important}
  .capability-chapters article{grid-template-columns:42px minmax(0,1fr)!important;gap:14px!important;min-height:0!important;padding:32px 0!important}
  .capability-chapters figure{grid-column:1/-1!important;height:auto!important;min-height:0!important;aspect-ratio:4/3!important;border-radius:54px 16px 16px!important;margin-top:8px!important}
  .cap-no{font-size:28px!important}

  .process-stage{padding:var(--section-space) 0!important}
  .process-heading h2{margin:12px 0 28px!important}
  .process-track{grid-template-columns:1fr!important}
  .process-track article,.process-track article:first-child{min-height:0!important;padding:22px 0!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.14)!important}
  .process-track h3{font-size:24px!important;margin:22px 0 8px!important}

  .portfolio-stack{padding:var(--section-space) 0!important}
  .stack-heading{display:block!important;margin-bottom:24px!important}
  .stack-stage{width:calc(100% - (var(--pad) * 2))!important;gap:16px!important}
  .stack-project{grid-template-columns:1fr!important;min-height:0!important;border-radius:20px!important}
  .stack-project figure{height:auto!important;aspect-ratio:4/3!important}
  .stack-project>div{min-height:0!important;padding:24px!important}

  .brand-cta{padding:58px 0!important}
  .brand-cta-copy{display:block!important}
  .brand-cta-copy h2{margin:8px 0 20px!important}
  .brand-cta-action{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:18px!important}
  .brand-cta-action p{font-size:14px!important;line-height:1.62!important}

  /* Inner hero / service / about / capabilities / portfolio / projects / contact. */
  .inner-hero,.service-detail-hero,.project-hero-new,.contact-new{padding-top:100px!important;padding-bottom:var(--section-space-tight)!important;min-height:auto!important}
  .inner-hero-grid,.service-detail-hero-grid,.contact-new-grid{gap:28px!important}
  .inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1{margin:14px 0 20px!important}
  .inner-hero p,.service-detail-title>p,.contact-copy-new>p{font-size:15px!important;line-height:1.66!important}
  .inner-hero figure{height:auto!important;min-height:0!important;aspect-ratio:4/3!important;border-radius:56px 16px 56px 16px!important}
  .service-collage{height:auto!important;aspect-ratio:1/1!important;min-height:330px!important}
  .service-value,.service-outcomes,.service-narrative,.editorial-guide,.faq-stage,.about-editorial,.beliefs,.about-process,.capability-page,.project-story-new,.page-field-guide,.portfolio-index{padding:var(--section-space) 0!important}
  .service-value-grid,.service-narrative-grid,.guide-shell,.faq-grid,.about-editorial-grid,.project-story-grid,.field-guide-grid{gap:32px!important}
  .large-copy{font-size:clamp(22px,5.8vw,29px)!important;line-height:1.38!important}
  .section-split-heading{gap:16px!important;margin-bottom:30px!important}
  .outcome-grid{grid-template-columns:1fr!important}
  .outcome-grid article,.outcome-grid article+article{padding:24px 0 34px!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.14)!important}
  .outcome-grid h3{font-size:24px!important;margin-top:24px!important}
  .service-narrative-grid>div>article,.project-story-grid>div>article{min-height:0!important;padding:30px 0!important}
  .service-narrative article>p,.project-story-grid article>p,.guide-articles p,.field-guide-grid article p{font-size:15px!important;line-height:1.7!important}
  .service-narrative blockquote{font-size:21px!important;margin:22px 0!important}
  .guide-articles article,.field-guide-grid>div article{padding:30px 0 40px!important}
  .faq-item summary{font-size:16px!important;padding:18px 0!important}
  .about-copy figure{height:auto!important;aspect-ratio:4/3!important;margin-top:30px!important;border-radius:18px 62px 18px 18px!important}
  .belief-list article{grid-template-columns:34px minmax(0,1fr)!important;gap:12px!important;padding:26px 0!important}
  .belief-list p{grid-column:2!important;margin-top:0!important}
  .about-process-media{grid-template-columns:1fr!important;gap:26px!important}
  .about-process-media>figure{min-height:0!important;height:auto!important;aspect-ratio:4/3!important}
  .about-process-list article{padding:20px 0!important}
  .capability-page-chapter{gap:26px!important;padding:30px 0!important}
  .capability-page-chapter figure{height:auto!important;aspect-ratio:4/3!important;border-radius:18px!important}

  .portfolio-note{grid-template-columns:1fr!important;gap:14px!important;padding-bottom:26px!important}
  .portfolio-filter{gap:7px!important;padding:22px 0 30px!important;overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:none}
  .portfolio-filter::-webkit-scrollbar{display:none}
  .filter-button{flex:0 0 auto!important;padding:9px 13px!important;font-size:11px!important}
  .portfolio-masonry{grid-template-columns:1fr!important;gap:20px!important}
  .portfolio-card-new:nth-child(3n+1){grid-row:auto!important}
  .portfolio-card-new figure,.portfolio-card-new:nth-child(3n+1) figure{height:auto!important;aspect-ratio:4/3!important;border-radius:18px!important}
  .portfolio-card-new>div{padding:14px 0 26px!important}

  .project-hero-copy{grid-template-columns:1fr!important;gap:16px!important;margin-bottom:26px!important}
  .project-hero-media{height:auto!important;aspect-ratio:4/3!important;border-radius:18px!important}
  .deliverable-cards,.project-metrics{grid-template-columns:1fr!important}

  .contact-direct-new{margin:26px 0!important}
  .contact-direct-new a{font-size:16px!important}
  .contact-copy-new figure{height:auto!important;aspect-ratio:16/10!important;margin-top:28px!important;border-radius:18px 54px 18px 18px!important}
  .contact-form-card{padding:22px!important;border-radius:20px!important}
  .form-card-head{gap:12px!important;padding-bottom:20px!important}
  .contact-form{gap:16px!important;margin-top:20px!important}
  .field-row{grid-template-columns:1fr!important;gap:16px!important}
  .contact-form input,.contact-form select,.contact-form textarea{padding:13px 14px!important;border-radius:12px!important;font-size:16px!important}
  .form-submit{flex-direction:column!important;align-items:flex-start!important;gap:14px!important}

  /* Footer. */
  .site-footer{padding:50px 0 22px!important}
  .footer-brand-row{align-items:flex-start!important;flex-direction:column!important;gap:14px!important;padding-bottom:26px!important}
  .footer-logo{width:190px!important;max-width:72vw!important}
  .footer-logo img{height:48px!important}
  .footer-brand-row>.micro{text-align:left!important}
  .footer-grid{grid-template-columns:1fr 1fr!important;gap:28px 18px!important;padding:28px 0!important}
  .footer-grid>div{min-width:0}
  .footer-grid a{font-size:14px}
  .footer-bottom{flex-direction:column!important;align-items:flex-start!important;gap:8px!important;font-size:11px!important;padding-top:18px!important}
}

/* Small phones — 360–520px. */
@media(max-width:520px){
  :root{--pad:16px;--section-space:58px;--section-space-tight:48px}
  .site-header{padding:8px!important}
  .header-shell{width:calc(100vw - 16px)!important;height:54px!important;min-height:54px!important;padding-left:11px!important;padding-right:7px!important}
  .site-header:not(.is-compact) .brand{width:122px!important}
  .site-header:not(.is-compact) .brand img{height:29px!important;max-height:29px!important}
  .language-control{display:none!important}
  .menu-toggle{width:40px!important;height:40px!important}
  .site-header.is-compact{padding:8px!important}
  .site-header.is-compact .header-shell{width:50px!important;min-width:50px!important;max-width:50px!important;height:50px!important;min-height:50px!important}
  .site-header.is-compact .header-compact-toggle{width:50px!important;height:50px!important;flex-basis:50px!important;padding:8px!important}
  .mobile-panel{padding:86px 16px 22px!important}
  .mobile-panel-head{left:16px!important;right:16px!important;top:12px!important}
  .mobile-panel-brand{width:128px!important}
  .mobile-panel-brand img{height:31px!important;max-height:31px!important}
  .mobile-panel-inner{min-height:calc(100dvh - 106px)!important}
  .mobile-panel-inner>a{font-size:clamp(27px,8.3vw,34px)!important;padding:7px 0!important}
  .mobile-languages{margin-top:16px!important;padding-top:14px!important}

  .home-hero{padding-top:88px!important}
  .home-hero h1{font-size:clamp(39px,11.1vw,50px)!important}
  .hero-meta{margin-bottom:18px!important}
  .hero-copy-bottom{margin-top:18px!important}
  .hero-actions{align-items:stretch!important;flex-direction:column!important}
  .hero-actions .pill{width:100%!important;justify-content:space-between!important}
  .hero-visual{height:clamp(320px,91vw,400px)!important}
  .hero-badge{display:none!important}
  .tool-runner-track{font-size:30px!important}

  .intro-main h2,.service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2,.process-heading h2,.showreel-head h2,.capability-page-copy h2{font-size:clamp(32px,9vw,40px)!important}
  .manifesto h2{font-size:clamp(38px,10.7vw,48px)!important}
  .inner-hero h1,.blog-hero h1,.not-found h1,.service-detail-title h1,.contact-copy-new h1{font-size:clamp(37px,10.4vw,46px)!important}
  .project-hero-copy h1{font-size:clamp(39px,10.8vw,49px)!important}
  .service-panel-copy h3,.capability-chapters h3,.stack-project h3,.belief-list h3,.guide-articles h3,.project-story-grid article h3,.field-guide-grid article h3{font-size:clamp(27px,7.6vw,34px)!important}

  .showreel-frame{aspect-ratio:3/4!important}
  .showreel-meta>span{max-width:58%;line-height:1.35}
  .service-panel-media,.work-rail-card figure,.stack-project figure,.portfolio-card-new figure,.portfolio-card-new:nth-child(3n+1) figure,.capability-page-chapter figure,.project-hero-media{aspect-ratio:1.15/1!important}
  .capability-chapters figure,.inner-hero figure,.about-copy figure,.about-process-media>figure{aspect-ratio:1.18/1!important}
  .service-collage{min-height:300px!important}
  .directory-row{grid-template-columns:28px 72px minmax(0,1fr)!important;gap:10px!important;padding:14px 0!important;position:relative!important}
  .directory-row figure{height:72px!important;border-radius:11px!important}
  .directory-row .micro,.directory-row p{display:none!important}
  .directory-row>b{position:absolute!important;right:0!important;top:14px!important;font-size:12px!important;color:var(--blue)!important}
  .directory-row>div{padding-right:18px}
  .directory-group{gap:24px!important;padding:34px 0!important}
  .directory-intro{gap:12px!important;padding-bottom:30px!important}
  .directory-intro p{font-size:17px!important}
  .portfolio-filter{margin-right:-16px!important;padding-right:16px!important}
  .footer-grid{grid-template-columns:1fr!important;gap:24px!important}
  .footer-logo{width:176px!important}
  .footer-logo img{height:44px!important}
}

@media(max-width:380px){
  :root{--pad:14px}
  .home-hero h1{font-size:38px!important}
  .inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1{font-size:36px!important}
  .project-hero-copy h1{font-size:38px!important}
  .hero-visual{height:320px!important}
  .pill{font-size:11px!important;padding:11px 13px!important}
  .mobile-panel-inner>a{font-size:28px!important}
  .service-panel-copy,.stack-project>div{padding:20px!important}
  .contact-form-card{padding:18px!important}
}

/* =========================================================
   V13 — smooth primary header collapse (V12 behavior reverted)
   Preserve V11 scroll logic; only make the full horizontal
   shell -> compact D transition interpolate instead of snap.
   ========================================================= */
@media (min-width:1181px){
  /* A real numeric width is required for CSS to animate into 58px.
     The previous full header used width:auto, which caused the apparent snap. */
  .site-header:not(.is-compact) .header-shell{
    width:min(var(--wrap),calc(100vw - (var(--pad) * 2)))!important;
    max-width:var(--wrap)!important;
    transition:
      width .68s cubic-bezier(.22,.61,.36,1),
      height .56s cubic-bezier(.22,.61,.36,1),
      min-height .56s cubic-bezier(.22,.61,.36,1),
      padding .56s cubic-bezier(.22,.61,.36,1),
      gap .50s cubic-bezier(.22,.61,.36,1),
      border-radius .62s cubic-bezier(.22,.61,.36,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .46s ease!important;
    will-change:width,height,border-radius;
  }

  .site-header.is-compact:not(.compact-expanded) .header-shell{
    transition:
      width .68s cubic-bezier(.22,.61,.36,1),
      height .56s cubic-bezier(.22,.61,.36,1),
      min-height .56s cubic-bezier(.22,.61,.36,1),
      padding .56s cubic-bezier(.22,.61,.36,1),
      gap .50s cubic-bezier(.22,.61,.36,1),
      border-radius .62s cubic-bezier(.22,.61,.36,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .46s ease!important;
  }

  /* Let the original logo/nav disappear progressively while the shell contracts. */
  .site-header .brand,
  .site-header .desktop-nav,
  .site-header .header-actions{
    transition:
      opacity .34s cubic-bezier(.22,.61,.36,1),
      transform .52s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear 0s!important;
  }

  .site-header.is-compact:not(.compact-expanded) .brand,
  .site-header.is-compact:not(.compact-expanded) .desktop-nav,
  .site-header.is-compact:not(.compact-expanded) .header-actions{
    transition:
      opacity .30s cubic-bezier(.22,.61,.36,1),
      transform .52s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .32s!important;
  }

  /* Compact mark enters in sync with the latter half of shell contraction. */
  .site-header .header-compact-toggle{
    transition:
      opacity .32s ease .15s,
      transform .58s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .42s!important;
  }
  .site-header.is-compact .header-compact-toggle{
    transition:
      opacity .32s ease .14s,
      transform .58s cubic-bezier(.22,.61,.36,1),
      visibility 0s!important;
  }
}

/* =========================================================
   V14 — directional primary-header morph polish
   Down-scroll collapse now matches the smooth return motion.
   ========================================================= */
@media (min-width:1181px){
  .site-header:not(.is-compact) .header-shell,
  .site-header.is-compact:not(.compact-expanded) .header-shell{
    transition:
      width .78s cubic-bezier(.22,.61,.36,1),
      height .62s cubic-bezier(.22,.61,.36,1),
      min-height .62s cubic-bezier(.22,.61,.36,1),
      padding .60s cubic-bezier(.22,.61,.36,1),
      gap .54s cubic-bezier(.22,.61,.36,1),
      border-radius .70s cubic-bezier(.22,.61,.36,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .46s ease!important;
  }

  .site-header .brand,
  .site-header .desktop-nav,
  .site-header .header-actions{
    transition:
      opacity .38s cubic-bezier(.22,.61,.36,1),
      transform .58s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear 0s!important;
  }

  .site-header.is-compact:not(.compact-expanded) .brand,
  .site-header.is-compact:not(.compact-expanded) .desktop-nav,
  .site-header.is-compact:not(.compact-expanded) .header-actions{
    transition:
      opacity .36s cubic-bezier(.22,.61,.36,1),
      transform .58s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .36s!important;
  }

  .site-header .header-compact-toggle,
  .site-header.is-compact .header-compact-toggle{
    transition:
      opacity .34s ease .16s,
      transform .62s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear .40s!important;
  }
}
\n\n/* =========================================================
   V15 — header polish only
   - subtle frosted blur
   - restore desktop Services mega-menu visibility
   - keep Services + chevron on one line while morphing
   - compact expanded nav starts closing on continued scroll
   ========================================================= */
@media (min-width:1181px){
  /* Premium frosted shell without changing the approved layout. */
  .site-header .header-shell{
    -webkit-backdrop-filter:blur(24px) saturate(132%)!important;
    backdrop-filter:blur(24px) saturate(132%)!important;
  }
  .site-header:not(.is-compact) .header-shell,
  .site-header.is-compact.compact-expanded .header-shell{
    overflow:visible!important;
  }
  .site-header.is-compact:not(.compact-expanded) .header-shell{
    overflow:hidden!important;
  }

  /* Never allow Services/chevron or header actions to wrap during the morph. */
  .desktop-nav,
  .nav-services,
  .nav-services > .nav-link,
  .header-actions{
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
  }
  .nav-services > .nav-link{
    display:inline-flex!important;
    align-items:center!important;
    gap:4px!important;
  }
  .nav-services > .nav-link span{
    display:inline-block!important;
    flex:0 0 auto!important;
    line-height:1!important;
  }

  /* The V10 morph used shell overflow:hidden, which clipped the normal
     header mega menu. Restore a proper floating layer for both normal and
     expanded compact headers. */
  .nav-services{position:relative!important;overflow:visible!important}
  .nav-services .mega-menu{
    display:grid!important;
    z-index:1400!important;
    overflow:auto!important;
    -webkit-backdrop-filter:blur(22px) saturate(125%);
    backdrop-filter:blur(22px) saturate(125%);
  }
  .nav-services:hover .mega-menu,
  .nav-services:focus-within .mega-menu,
  .nav-services.is-open .mega-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
  }

  /* Do not expose the mega menu while the header is only the round D mark. */
  .site-header.is-compact:not(.compact-expanded) .mega-menu{
    display:none!important;
  }
}

/* =========================================================
   V16 — definitive desktop header fixes
   Only header/mega-menu behavior is changed in this pass.
   ========================================================= */
@media (min-width:1181px){
  /* Make the frosted treatment visible without turning the header grey/white. */
  .site-header .header-shell,
  .site-header:not(.is-compact) .header-shell,
  .site-header.is-compact.compact-expanded .header-shell{
    background:rgba(2,4,6,.74)!important;
    -webkit-backdrop-filter:blur(18px) saturate(138%)!important;
    backdrop-filter:blur(18px) saturate(138%)!important;
    border-color:rgba(255,255,255,.12)!important;
  }
  .site-header.is-compact:not(.compact-expanded) .header-shell{
    background:rgba(2,4,6,.86)!important;
    -webkit-backdrop-filter:blur(14px) saturate(128%)!important;
    backdrop-filter:blur(14px) saturate(128%)!important;
  }

  /* Lock nav geometry so Services + never wraps while the shell morphs. */
  .desktop-nav{
    display:flex;
    flex-wrap:nowrap!important;
    width:max-content;
    min-width:max-content;
    align-items:center;
  }
  .desktop-nav > *,
  .nav-services,
  .nav-services > .nav-link{
    flex:0 0 auto!important;
    width:max-content;
    min-width:max-content;
    white-space:nowrap!important;
  }
  .nav-services > .nav-link{
    display:inline-flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
  }
  .nav-services > .nav-link > span{
    display:inline-flex!important;
    flex:0 0 auto!important;
    width:auto!important;
    min-width:0!important;
    line-height:1!important;
  }
  .header-actions{
    flex:0 0 auto!important;
    width:max-content;
    min-width:max-content;
    flex-wrap:nowrap!important;
  }

  /* Use a viewport floating mega menu. This removes all clipping/overflow
     conflicts caused by the many shell morph states while keeping it attached
     to the Services trigger semantically. */
  .nav-services .mega-menu{
    position:fixed!important;
    top:88px!important;
    right:max(var(--pad), calc((100vw - var(--wrap))/2))!important;
    left:auto!important;
    width:min(920px,calc(100vw - 48px))!important;
    max-height:min(620px,calc(100vh - 112px))!important;
    margin:0!important;
    transform:translate3d(0,12px,0)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    z-index:5000!important;
    overflow:auto!important;
    overscroll-behavior:contain;
    background:rgba(7,12,17,.94)!important;
    -webkit-backdrop-filter:blur(22px) saturate(132%)!important;
    backdrop-filter:blur(22px) saturate(132%)!important;
    transition:opacity .22s ease,transform .28s cubic-bezier(.22,.61,.36,1),visibility 0s linear .28s!important;
  }
  .site-header.is-scrolled .nav-services .mega-menu,
  .site-header.is-compact.compact-expanded .nav-services .mega-menu{
    top:76px!important;
  }
  .nav-services:hover .mega-menu,
  .nav-services:focus-within .mega-menu,
  .nav-services.is-open .mega-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(0,0,0)!important;
    transition:opacity .22s ease,transform .28s cubic-bezier(.22,.61,.36,1),visibility 0s!important;
  }
  .site-header.is-compact:not(.compact-expanded) .nav-services .mega-menu{
    display:none!important;
  }
}

/* =========================================================
   V17 — remove header morph/collapse completely.
   Full header stays structurally unchanged; after scroll it is
   replaced visually by an independent small sticky D control.
   Desktop Services mega menu uses a stable anchored overlay.
   ========================================================= */
.sticky-mini-header{display:none}

@media (min-width:1181px){
  /* No compact/morph state on the main header. */
  .site-header.is-compact,
  .site-header.is-compact.compact-expanded{
    pointer-events:auto!important;
    padding:14px var(--pad)!important;
  }
  .site-header .header-compact-toggle{display:none!important}

  .site-header .header-shell,
  .site-header:not(.is-compact) .header-shell,
  .site-header.is-scrolled .header-shell,
  .site-header.is-compact .header-shell,
  .site-header.is-compact.compact-expanded .header-shell{
    width:min(var(--wrap),calc(100vw - (var(--pad) * 2)))!important;
    min-width:0!important;
    max-width:var(--wrap)!important;
    height:70px!important;
    min-height:70px!important;
    margin:auto!important;
    padding:0 16px 0 22px!important;
    border-radius:999px!important;
    overflow:visible!important;
    background:rgba(2,4,6,.76)!important;
    -webkit-backdrop-filter:blur(18px) saturate(138%)!important;
    backdrop-filter:blur(18px) saturate(138%)!important;
    border:1px solid rgba(255,255,255,.12)!important;
    opacity:1;
    visibility:visible;
    transform:none;
    transition:opacity .34s ease,transform .42s cubic-bezier(.22,.61,.36,1),visibility 0s linear 0s!important;
  }
  .site-header.is-scrolled{padding-top:14px!important}

  /* The full main header simply leaves; it does not shrink/morph. */
  .site-header.is-mini-sticky .header-shell{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-18px)!important;
    transition:opacity .24s ease,transform .34s cubic-bezier(.4,0,.2,1),visibility 0s linear .34s!important;
  }

  /* Independent small sticky control shown after scrolling. */
  .sticky-mini-header{
    position:fixed;
    display:grid;
    place-items:center;
    top:12px;
    right:max(18px,var(--pad));
    width:58px;
    height:58px;
    padding:9px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(0,0,0,.88);
    -webkit-backdrop-filter:blur(16px) saturate(125%);
    backdrop-filter:blur(16px) saturate(125%);
    box-shadow:0 12px 34px rgba(0,0,0,.3);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-8px) scale(.92);
    transition:opacity .28s ease,transform .38s cubic-bezier(.22,.61,.36,1),visibility 0s linear .38s;
    z-index:1010;
  }
  .sticky-mini-header img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
  }
  .site-header.is-mini-sticky .sticky-mini-header{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
    transition:opacity .28s ease,transform .38s cubic-bezier(.22,.61,.36,1),visibility 0s;
  }

  /* Reset any old compact-state hiding rules. */
  .site-header .brand,
  .site-header .desktop-nav,
  .site-header .header-actions,
  .site-header.is-compact .brand,
  .site-header.is-compact .desktop-nav,
  .site-header.is-compact .header-actions{
    display:flex!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
  }
  .site-header .brand{width:176px!important;height:100%!important}
  .site-header .brand img{height:44px!important;max-height:44px!important;object-fit:contain!important}

  /* Stable desktop Services target + hover bridge. */
  .desktop-nav{overflow:visible!important;position:relative;z-index:4}
  .nav-services{
    position:relative!important;
    overflow:visible!important;
    padding-bottom:18px!important;
    margin-bottom:-18px!important;
  }
  .nav-services::after{
    content:"";
    position:absolute;
    left:-30px;
    right:-30px;
    top:100%;
    height:28px;
    pointer-events:auto;
  }
  .nav-services .mega-menu{
    position:absolute!important;
    top:calc(100% + 12px)!important;
    left:50%!important;
    right:auto!important;
    width:min(920px,calc(100vw - 72px))!important;
    max-height:min(620px,calc(100vh - 112px))!important;
    margin:0!important;
    transform:translate(-50%,10px)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    z-index:10050!important;
    overflow:auto!important;
    overscroll-behavior:contain;
    background:rgba(7,12,17,.97)!important;
    -webkit-backdrop-filter:blur(22px) saturate(132%)!important;
    backdrop-filter:blur(22px) saturate(132%)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    box-shadow:0 28px 80px rgba(0,0,0,.42)!important;
    transition:opacity .2s ease,transform .28s cubic-bezier(.22,.61,.36,1),visibility 0s linear .28s!important;
  }
  .nav-services:hover .mega-menu,
  .nav-services:focus-within .mega-menu,
  .nav-services.is-open .mega-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate(-50%,0)!important;
    transition:opacity .2s ease,transform .28s cubic-bezier(.22,.61,.36,1),visibility 0s!important;
  }

  /* If the small sticky control is active, the hidden full header cannot
     accidentally expose its mega menu. */
  .site-header.is-mini-sticky .nav-services .mega-menu{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

/* On tablet/mobile keep the normal mobile header + fullscreen nav. No morph. */
@media (max-width:1180px){
  .sticky-mini-header{display:none!important}
  .site-header.is-compact{pointer-events:auto!important}
  .site-header.is-compact .header-shell{
    width:calc(100vw - 24px)!important;
    max-width:none!important;
    height:58px!important;
    min-height:58px!important;
    padding:0 10px 0 14px!important;
    border-radius:999px!important;
  }
  .site-header.is-compact .brand,
  .site-header.is-compact .header-actions{
    display:flex!important;
    opacity:1!important;
    visibility:visible!important;
  }
  .site-header.is-compact .header-compact-toggle{display:none!important}
}

/* =========================================================
   V19 — desktop main header -> independent sticky mini header.
   No collapse/morph. Crossfade only. Mega menu is viewport-safe.
   ========================================================= */
@media (min-width:1181px){
  /* Full header remains a full header; it only fades/slides away. */
  .site-header{
    overflow:visible!important;
    transition:opacity .34s ease,transform .44s cubic-bezier(.22,.61,.36,1),padding .3s ease!important;
  }
  .site-header .header-shell{
    overflow:visible!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(0,0,0)!important;
    transition:opacity .34s ease,transform .44s cubic-bezier(.22,.61,.36,1),background .3s ease,border .3s ease!important;
  }
  .site-header.is-mini-sticky .header-shell{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(0,-14px,0)!important;
    transition:opacity .28s ease,transform .40s cubic-bezier(.22,.61,.36,1),visibility 0s linear .40s!important;
  }

  /* Separate sticky mini control: always independent of main header DOM. */
  .sticky-mini-header{
    position:fixed!important;
    top:12px!important;
    right:max(18px,var(--pad))!important;
    z-index:12050!important;
    display:grid!important;
    place-items:center!important;
    width:60px!important;
    height:60px!important;
    padding:10px!important;
    margin:0!important;
    border-radius:999px!important;
    border:1px solid rgba(255,255,255,.15)!important;
    background:rgba(0,0,0,.76)!important;
    -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
    backdrop-filter:blur(20px) saturate(135%)!important;
    box-shadow:0 14px 40px rgba(0,0,0,.34)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(0,-10px,0) scale(.9)!important;
    transition:opacity .30s ease,transform .44s cubic-bezier(.22,.61,.36,1),visibility 0s linear .44s!important;
  }
  .sticky-mini-header.is-visible{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(0,0,0) scale(1)!important;
    transition:opacity .30s ease,transform .44s cubic-bezier(.22,.61,.36,1),visibility 0s!important;
  }
  .sticky-mini-header img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
  }

  /* Old compact control/morph is fully disabled on desktop. */
  .site-header .header-compact-toggle,
  .site-header.is-compact .header-compact-toggle,
  .site-header.compact-expanded .header-compact-toggle{
    display:none!important;
  }

  /* Desktop Services mega menu: fixed to viewport, never spills outside. */
  .site-header .desktop-nav,
  .site-header .nav-services{
    overflow:visible!important;
  }
  .site-header .nav-services{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    white-space:nowrap!important;
  }
  .site-header .nav-services > .nav-link{
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
    white-space:nowrap!important;
  }
  .site-header .nav-services > .nav-link span{
    display:inline-block!important;
    flex:0 0 auto!important;
    line-height:1!important;
  }
  .site-header .nav-services .mega-menu{
    position:fixed!important;
    top:94px!important;
    left:50vw!important;
    right:auto!important;
    width:min(1040px,calc(100vw - 48px))!important;
    max-width:1040px!important;
    max-height:calc(100vh - 118px)!important;
    margin:0!important;
    padding:28px!important;
    grid-template-columns:minmax(250px,.9fr) minmax(0,1.65fr)!important;
    gap:28px!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    border-radius:24px!important;
    background:rgba(7,12,17,.94)!important;
    -webkit-backdrop-filter:blur(24px) saturate(138%)!important;
    backdrop-filter:blur(24px) saturate(138%)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    box-shadow:0 30px 90px rgba(0,0,0,.48)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(-50%,10px,0)!important;
    z-index:12020!important;
    transition:opacity .20s ease,transform .30s cubic-bezier(.22,.61,.36,1),visibility 0s linear .30s!important;
  }
  .site-header .nav-services:hover .mega-menu,
  .site-header .nav-services:focus-within .mega-menu,
  .site-header .nav-services.is-open .mega-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(-50%,0,0)!important;
    transition:opacity .20s ease,transform .30s cubic-bezier(.22,.61,.36,1),visibility 0s!important;
  }
  .site-header.is-mini-sticky .nav-services .mega-menu{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  .site-header .mega-grid{
    min-width:0!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:24px 30px!important;
  }
  .site-header .mega-grid > div,
  .site-header .mega-grid a{
    min-width:0!important;
  }
  .site-header .mega-grid a{
    overflow-wrap:anywhere!important;
  }
}

@media (min-width:1181px) and (max-width:1360px){
  .site-header .nav-services .mega-menu{
    top:88px!important;
    width:calc(100vw - 36px)!important;
    padding:22px!important;
    gap:22px!important;
  }
  .site-header .mega-lead h3{font-size:28px!important}
  .site-header .mega-grid{gap:20px 24px!important}
  .site-header .mega-grid a{font-size:13px!important}
}

@media (max-width:1180px){
  .sticky-mini-header{display:none!important}
}

/* =========================================================
   V20 — compact sticky navigation (no click-to-expand).
   The full header hands off to a smaller horizontal pill after
   scroll: D mark + nav + language + CTA.
   ========================================================= */
@media (min-width:1181px){
  /* Smooth handoff from full header to the independent mini header. */
  .site-header .header-shell{
    transform-origin:50% 0!important;
    transition:opacity .30s ease, transform .44s cubic-bezier(.22,.61,.36,1), visibility 0s linear 0s!important;
  }
  .site-header.is-mini-sticky .header-shell{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-14px) scale(.985)!important;
    transition:opacity .24s ease, transform .38s cubic-bezier(.4,0,.2,1), visibility 0s linear .38s!important;
  }

  .sticky-mini-header,
  .site-header.is-mini-sticky .sticky-mini-header{
    position:fixed!important;
    top:12px!important;
    left:50%!important;
    right:auto!important;
    width:max-content!important;
    max-width:calc(100vw - 32px)!important;
    height:56px!important;
    min-height:56px!important;
    padding:6px 7px 6px 8px!important;
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    border-radius:999px!important;
    border:1px solid rgba(255,255,255,.14)!important;
    background:rgba(0,0,0,.82)!important;
    -webkit-backdrop-filter:blur(18px) saturate(132%)!important;
    backdrop-filter:blur(18px) saturate(132%)!important;
    box-shadow:0 14px 42px rgba(0,0,0,.32)!important;
    z-index:12000!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(-50%,-10px,0) scale(.965)!important;
    transform-origin:50% 0!important;
    transition:opacity .28s ease, transform .44s cubic-bezier(.22,.61,.36,1), visibility 0s linear .44s!important;
  }
  .sticky-mini-header.is-visible{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(-50%,0,0) scale(1)!important;
    transition:opacity .28s ease, transform .44s cubic-bezier(.22,.61,.36,1), visibility 0s!important;
  }

  .sticky-mini-header .mini-brand{
    flex:0 0 42px!important;
    width:42px!important;
    height:42px!important;
    display:grid!important;
    place-items:center!important;
    padding:6px!important;
    border-radius:50%!important;
    background:#050505!important;
    border:1px solid rgba(255,255,255,.10)!important;
  }
  .sticky-mini-header .mini-brand img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
  }

  .sticky-mini-header .mini-nav{
    display:flex!important;
    align-items:center!important;
    gap:2px!important;
    white-space:nowrap!important;
  }
  .sticky-mini-header .mini-nav a{
    display:flex!important;
    align-items:center!important;
    height:40px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    color:rgba(255,255,255,.72)!important;
    font-size:12.5px!important;
    line-height:1!important;
    font-weight:650!important;
    letter-spacing:-.01em!important;
    text-decoration:none!important;
    transition:background .2s ease,color .2s ease!important;
  }
  .sticky-mini-header .mini-nav a:hover,
  .sticky-mini-header .mini-nav a:focus-visible,
  .sticky-mini-header .mini-nav a.active{
    color:#fff!important;
    background:rgba(255,255,255,.075)!important;
  }

  .sticky-mini-header .mini-language{
    height:40px!important;
    display:flex!important;
    align-items:center!important;
    margin-left:2px!important;
  }
  .sticky-mini-header .mini-language select{
    height:40px!important;
    min-width:58px!important;
    padding:0 24px 0 10px!important;
    border-radius:999px!important;
    border:1px solid rgba(255,255,255,.10)!important;
    background-color:rgba(255,255,255,.055)!important;
    color:#fff!important;
    font:600 11px/1 var(--mono)!important;
    cursor:pointer!important;
  }

  .sticky-mini-header .mini-contact{
    height:42px!important;
    display:flex!important;
    align-items:center!important;
    gap:9px!important;
    padding:0 15px!important;
    margin-left:2px!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,#2d73b9,#38a9ea)!important;
    color:#fff!important;
    font-size:12.5px!important;
    font-weight:750!important;
    line-height:1!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    box-shadow:0 8px 20px rgba(45,115,185,.18)!important;
    transition:transform .2s ease,filter .2s ease!important;
  }
  .sticky-mini-header .mini-contact:hover{transform:translateY(-1px)!important;filter:brightness(1.07)!important}
  .sticky-mini-header .mini-contact span{font-size:14px!important}
}

@media (max-width:1180px){
  .sticky-mini-header{display:none!important}
}

/* =========================================================
   V21 — single-header smooth compact sticky state.
   Same header, same DOM, no separate mini header and no collapse.
   ========================================================= */
@media (min-width:1181px){
  .sticky-mini-header{display:none!important}

  .site-header{
    padding:14px var(--pad)!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:padding .52s cubic-bezier(.22,.61,.36,1)!important;
  }

  .site-header .header-shell,
  .site-header:not(.is-mini-sticky) .header-shell,
  .site-header.is-mini-sticky .header-shell{
    box-sizing:border-box!important;
    width:min(1390px,calc(100vw - (var(--pad) * 2)))!important;
    max-width:none!important;
    height:70px!important;
    min-height:70px!important;
    margin:0 auto!important;
    padding:0 16px 0 22px!important;
    gap:26px!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
    overflow:visible!important;
    border-radius:999px!important;
    background:rgba(5,8,11,.62)!important;
    border:1px solid rgba(255,255,255,.12)!important;
    -webkit-backdrop-filter:blur(16px) saturate(125%)!important;
    backdrop-filter:blur(16px) saturate(125%)!important;
    box-shadow:0 10px 34px rgba(0,0,0,.18)!important;
    transition:
      width .58s cubic-bezier(.22,.61,.36,1),
      height .52s cubic-bezier(.22,.61,.36,1),
      min-height .52s cubic-bezier(.22,.61,.36,1),
      padding .52s cubic-bezier(.22,.61,.36,1),
      gap .52s cubic-bezier(.22,.61,.36,1),
      background .38s ease,
      border-color .38s ease,
      box-shadow .38s ease!important;
  }

  .site-header.is-mini-sticky{
    padding:10px var(--pad)!important;
  }
  .site-header.is-mini-sticky .header-shell{
    width:min(760px,calc(100vw - 32px))!important;
    height:56px!important;
    min-height:56px!important;
    padding:0 8px 0 8px!important;
    gap:8px!important;
    background:rgba(0,0,0,.84)!important;
    border-color:rgba(255,255,255,.14)!important;
    -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
    backdrop-filter:blur(20px) saturate(135%)!important;
    box-shadow:0 14px 42px rgba(0,0,0,.30)!important;
  }

  .site-header .brand,
  .site-header.is-mini-sticky .brand{
    position:relative!important;
    display:grid!important;
    place-items:center!important;
    flex:0 0 auto!important;
    width:188px!important;
    height:52px!important;
    overflow:visible!important;
    transition:width .52s cubic-bezier(.22,.61,.36,1),height .52s cubic-bezier(.22,.61,.36,1)!important;
  }
  .site-header.is-mini-sticky .brand{
    width:42px!important;
    height:42px!important;
    border-radius:50%!important;
    background:#050505!important;
    border:1px solid rgba(255,255,255,.10)!important;
  }
  .site-header .brand img{
    grid-area:1/1!important;
    display:block!important;
    object-fit:contain!important;
    transition:opacity .28s ease,transform .52s cubic-bezier(.22,.61,.36,1)!important;
  }
  .site-header .brand-full{
    width:100%!important;
    height:auto!important;
    opacity:1!important;
    transform:scale(1)!important;
  }
  .site-header .brand-compact{
    width:30px!important;
    height:30px!important;
    opacity:0!important;
    transform:scale(.82)!important;
    pointer-events:none!important;
  }
  .site-header.is-mini-sticky .brand-full{
    opacity:0!important;
    transform:scale(.88)!important;
    pointer-events:none!important;
  }
  .site-header.is-mini-sticky .brand-compact{
    opacity:1!important;
    transform:scale(1)!important;
  }

  .site-header .desktop-nav,
  .site-header.is-mini-sticky .desktop-nav{
    display:flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
    margin-left:auto!important;
    gap:25px!important;
    min-width:0!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:gap .52s cubic-bezier(.22,.61,.36,1)!important;
  }
  .site-header.is-mini-sticky .desktop-nav{gap:8px!important}

  .site-header .nav-link,
  .site-header.is-mini-sticky .nav-link{
    display:inline-flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
    font-size:13px!important;
    line-height:1!important;
    padding:0!important;
    transition:font-size .42s ease,color .22s ease!important;
  }
  .site-header.is-mini-sticky .nav-link{
    height:38px!important;
    padding:0 8px!important;
    border-radius:999px!important;
    font-size:12px!important;
  }
  .site-header.is-mini-sticky .nav-link:hover,
  .site-header.is-mini-sticky .nav-link.active{
    background:rgba(255,255,255,.07)!important;
  }
  .site-header.is-mini-sticky .nav-link::after{display:none!important}
  .site-header .nav-services{position:relative!important;display:flex!important;align-items:center!important;white-space:nowrap!important}
  .site-header .nav-services > .nav-link{gap:5px!important;white-space:nowrap!important;flex-wrap:nowrap!important}
  .site-header .nav-services > .nav-link span{display:inline-block!important;flex:0 0 auto!important;line-height:1!important}
  .site-header .nav-services::after{
    content:"";
    position:absolute;
    left:-10px;
    right:-10px;
    top:100%;
    height:18px;
    pointer-events:auto;
  }

  .site-header .header-actions,
  .site-header.is-mini-sticky .header-actions{
    display:flex!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
    gap:9px!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:gap .52s cubic-bezier(.22,.61,.36,1)!important;
  }
  .site-header.is-mini-sticky .header-actions{gap:5px!important}

  .site-header .language-control,
  .site-header.is-mini-sticky .language-control{display:flex!important;align-items:center!important;flex:0 0 auto!important}
  .site-header .language-control select{
    height:38px!important;
    padding:0 6px!important;
    transition:height .42s ease,padding .42s ease,font-size .42s ease,background .3s ease!important;
  }
  .site-header.is-mini-sticky .language-control select{
    height:36px!important;
    padding:0 5px!important;
    font-size:10px!important;
    background:transparent!important;
  }

  .site-header .header-contact,
  .site-header.is-mini-sticky .header-contact{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    transition:height .42s ease,padding .42s ease,font-size .42s ease,background .3s ease,color .3s ease!important;
  }
  .site-header.is-mini-sticky .header-contact{
    height:42px!important;
    padding:0 14px!important;
    font-size:11.5px!important;
    background:linear-gradient(135deg,#2d73b9,#38a9ea)!important;
    color:#fff!important;
  }
  .site-header.is-mini-sticky .header-contact span{color:#fff!important}

  .site-header .header-compact-toggle,
  .site-header.is-mini-sticky .header-compact-toggle{display:none!important}

  /* One mega-menu works in both the full and compact sticky states. */
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    position:fixed!important;
    top:92px!important;
    left:50%!important;
    right:auto!important;
    width:min(960px,calc(100vw - 40px))!important;
    max-width:960px!important;
    max-height:min(72vh,650px)!important;
    overflow:auto!important;
    padding:26px!important;
    display:grid!important;
    grid-template-columns:minmax(250px,.9fr) minmax(0,1.8fr)!important;
    gap:28px!important;
    border-radius:24px!important;
    background:rgba(7,11,15,.97)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    -webkit-backdrop-filter:blur(22px) saturate(130%)!important;
    backdrop-filter:blur(22px) saturate(130%)!important;
    box-shadow:0 26px 80px rgba(0,0,0,.46)!important;
    z-index:20000!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translate3d(-50%,10px,0)!important;
    transition:opacity .22s ease,transform .30s cubic-bezier(.22,.61,.36,1),visibility 0s linear .30s!important;
  }
  .site-header.is-mini-sticky .nav-services .mega-menu{top:78px!important}
  .site-header .nav-services:hover .mega-menu,
  .site-header .nav-services:focus-within .mega-menu,
  .site-header .nav-services.is-open .mega-menu,
  .site-header.is-mini-sticky .nav-services:hover .mega-menu,
  .site-header.is-mini-sticky .nav-services:focus-within .mega-menu,
  .site-header.is-mini-sticky .nav-services.is-open .mega-menu{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translate3d(-50%,0,0)!important;
    transition:opacity .22s ease,transform .30s cubic-bezier(.22,.61,.36,1),visibility 0s!important;
  }
  .site-header .mega-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px 28px!important;min-width:0!important}
  .site-header .mega-grid>div{min-width:0!important}
  .site-header .mega-grid a{overflow-wrap:anywhere!important}
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{width:min(720px,calc(100vw - 28px))!important}
  .site-header.is-mini-sticky .desktop-nav{gap:4px!important}
  .site-header.is-mini-sticky .nav-link{padding-inline:6px!important;font-size:11.5px!important}
  .site-header.is-mini-sticky .header-contact{padding-inline:12px!important;font-size:11px!important}
}

/* V21.1 — keep viewport-positioned mega menu independent from the blurred pill. */
@media (min-width:1181px){
  .site-header .header-shell,
  .site-header.is-mini-sticky .header-shell{
    position:relative!important;
    isolation:isolate!important;
    background:transparent!important;
    border-color:transparent!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
  }
  .site-header .header-shell::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:0;
    border-radius:inherit;
    background:rgba(5,8,11,.62);
    border:1px solid rgba(255,255,255,.12);
    -webkit-backdrop-filter:blur(16px) saturate(125%);
    backdrop-filter:blur(16px) saturate(125%);
    box-shadow:0 10px 34px rgba(0,0,0,.18);
    pointer-events:none;
    transition:background .38s ease,border-color .38s ease,box-shadow .38s ease,backdrop-filter .38s ease;
  }
  .site-header.is-mini-sticky .header-shell::before{
    background:rgba(0,0,0,.84);
    border-color:rgba(255,255,255,.14);
    -webkit-backdrop-filter:blur(20px) saturate(135%);
    backdrop-filter:blur(20px) saturate(135%);
    box-shadow:0 14px 42px rgba(0,0,0,.30);
  }
  .site-header .brand,
  .site-header .desktop-nav,
  .site-header .header-actions{
    position:relative!important;
    z-index:2!important;
  }
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    position:fixed!important;
  }
}

/* =========================================================
   V22 — compact header alignment, contained mega menu,
   and full-reach horizontal project rail.
   ========================================================= */
@media (min-width:1181px){
  /* Keep the SAME header, but let the compact state finish on the right. */
  .site-header .header-shell,
  .site-header.is-mini-sticky .header-shell{
    margin-left:auto!important;
    margin-right:auto!important;
    transform:translateX(0)!important;
    transition:
      width .62s cubic-bezier(.22,.61,.36,1),
      height .52s cubic-bezier(.22,.61,.36,1),
      min-height .52s cubic-bezier(.22,.61,.36,1),
      padding .52s cubic-bezier(.22,.61,.36,1),
      gap .52s cubic-bezier(.22,.61,.36,1),
      transform .62s cubic-bezier(.22,.61,.36,1),
      background .38s ease,
      border-color .38s ease,
      box-shadow .38s ease!important;
  }
  .site-header.is-mini-sticky .header-shell{
    width:710px!important;
    height:60px!important;
    min-height:60px!important;
    padding:0 10px!important;
    gap:9px!important;
    transform:translateX(calc(50vw - var(--pad) - 355px))!important;
  }

  /* Compact mark: more presence, no tiny-logo feel. */
  .site-header.is-mini-sticky .brand{
    width:46px!important;
    height:46px!important;
  }
  .site-header.is-mini-sticky .brand-compact{
    width:34px!important;
    height:34px!important;
  }

  /* Do not shrink the compact navigation typography too far. */
  .site-header.is-mini-sticky .desktop-nav{
    gap:7px!important;
  }
  .site-header.is-mini-sticky .nav-link{
    height:40px!important;
    padding:0 8px!important;
    font-size:13px!important;
  }
  .site-header.is-mini-sticky .language-control select{
    height:38px!important;
    min-width:42px!important;
    padding:0 5px!important;
    font-size:11px!important;
  }
  .site-header.is-mini-sticky .header-contact{
    height:44px!important;
    padding:0 16px!important;
    font-size:12.5px!important;
  }

  /* A smaller, right-anchored mega menu with hard column boundaries. */
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    top:94px!important;
    left:auto!important;
    right:max(var(--pad),24px)!important;
    width:min(880px,calc(100vw - 48px))!important;
    max-width:880px!important;
    max-height:min(70vh,610px)!important;
    padding:24px!important;
    grid-template-columns:minmax(240px,270px) minmax(0,1fr)!important;
    gap:28px!important;
    transform:translate3d(0,10px,0)!important;
    overflow:auto!important;
  }
  .site-header.is-mini-sticky .nav-services .mega-menu{
    top:80px!important;
  }
  .site-header .nav-services:hover .mega-menu,
  .site-header .nav-services:focus-within .mega-menu,
  .site-header .nav-services.is-open .mega-menu,
  .site-header.is-mini-sticky .nav-services:hover .mega-menu,
  .site-header.is-mini-sticky .nav-services:focus-within .mega-menu,
  .site-header.is-mini-sticky .nav-services.is-open .mega-menu{
    transform:translate3d(0,0,0)!important;
  }
  .site-header .mega-lead{
    min-width:0!important;
    width:100%!important;
    padding:10px 24px 12px 2px!important;
    overflow:hidden!important;
  }
  .site-header .mega-lead h3{
    font-size:30px!important;
    line-height:1.02!important;
    margin:16px 0!important;
  }
  .site-header .mega-lead p{
    display:block!important;
    width:100%!important;
    max-width:235px!important;
    margin:0 0 18px!important;
    font-size:13px!important;
    line-height:1.6!important;
    overflow-wrap:break-word!important;
  }
  .site-header .mega-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:20px 28px!important;
    min-width:0!important;
    align-content:start!important;
  }
  .site-header .mega-grid>div{
    min-width:0!important;
  }
  .site-header .mega-grid .micro{
    font-size:9px!important;
    line-height:1.35!important;
  }
  .site-header .mega-grid a{
    display:block!important;
    min-width:0!important;
    font-size:13.5px!important;
    line-height:1.38!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
  }

  /* Put equal breathing room on both ends of the pinned horizontal rail.
     This makes the fourth/final project fully reachable instead of stopping clipped. */
  .work-rail-viewport{
    padding-left:0!important;
    padding-right:0!important;
  }
  .work-rail-track{
    padding-left:max(var(--pad),calc((100vw - var(--wrap))/2 + var(--pad)))!important;
    padding-right:max(var(--pad),calc((100vw - var(--wrap))/2 + var(--pad)))!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{
    width:680px!important;
    transform:translateX(calc(50vw - var(--pad) - 340px))!important;
  }
  .site-header.is-mini-sticky .desktop-nav{gap:4px!important}
  .site-header.is-mini-sticky .nav-link{padding-inline:6px!important;font-size:12.5px!important}
  .site-header.is-mini-sticky .header-contact{padding-inline:13px!important;font-size:12px!important}
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    width:min(820px,calc(100vw - 36px))!important;
    right:18px!important;
    grid-template-columns:minmax(220px,250px) minmax(0,1fr)!important;
  }
}

/* =========================================================
   V23 — right-anchored desktop header resize
   Keep the shell's right edge fixed so compact -> full grows
   from right to left instead of appearing to grow from center.
   ========================================================= */
@media (min-width:1181px){
  .site-header .header-shell,
  .site-header.is-mini-sticky .header-shell{
    margin-left:auto!important;
    margin-right:0!important;
    transform:none!important;
    transform-origin:100% 50%!important;
  }

  .site-header:not(.is-mini-sticky) .header-shell{
    width:min(var(--wrap),calc(100vw - var(--pad) - var(--pad)))!important;
  }

  .site-header.is-mini-sticky .header-shell{
    width:710px!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{
    width:680px!important;
  }
}

/* =========================================================
   V24 — hard right-anchored desktop header morph
   Compact -> full changes ONLY the left edge. The right edge
   stays fixed. Full desktop width caps at 1390px.
   ========================================================= */
@media (min-width:1181px){
  .site-header{
    --header-full-w:min(1390px,calc(100vw - (var(--pad) * 2)));
  }

  .site-header .header-shell,
  .site-header.is-mini-sticky .header-shell{
    box-sizing:border-box!important;
    max-width:none!important;
    min-width:0!important;
    margin-left:auto!important;
    margin-right:0!important;
    transform:none!important;
    translate:none!important;
    transform-origin:right center!important;
    will-change:width,height,padding,border-radius!important;
    transition:
      width .68s cubic-bezier(.22,.61,.36,1),
      height .54s cubic-bezier(.22,.61,.36,1),
      min-height .54s cubic-bezier(.22,.61,.36,1),
      padding .54s cubic-bezier(.22,.61,.36,1),
      gap .54s cubic-bezier(.22,.61,.36,1),
      border-radius .54s cubic-bezier(.22,.61,.36,1),
      background .38s ease,
      border-color .38s ease,
      box-shadow .38s ease!important;
  }

  /* Top/full state: exactly the requested 1390px maximum, right anchored. */
  .site-header:not(.is-mini-sticky) .header-shell{
    width:var(--header-full-w)!important;
  }

  /* Compact state keeps its V22 dimensions but shares the same right edge. */
  .site-header.is-mini-sticky .header-shell{
    width:710px!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{width:680px!important}
}

/* V24.1 — remove any remaining center-layout influence from the desktop shell. */
@media (min-width:1181px){
  .site-header{
    display:flex!important;
    justify-content:flex-end!important;
    align-items:flex-start!important;
  }
  .site-header .header-shell,
  .site-header.is-mini-sticky .header-shell{
    flex:0 0 auto!important;
    margin:0!important;
  }
}

/* =========================================================
   V25 — verified right-to-left return morph.
   Desktop only. The shell is absolutely positioned inside the
   fixed header so no flex/margin centering can influence width.
   Compact state sits at the viewport-right gutter. Returning to
   the top expands mainly to the LEFT, then lands on the centered
   1390px full-header container position.
   ========================================================= */
@media (min-width:1181px){
  .site-header{
    display:block!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    top:0!important;
    width:100%!important;
  }

  .site-header .header-shell,
  .site-header.is-mini-sticky .header-shell{
    position:absolute!important;
    left:auto!important;
    margin:0!important;
    transform:none!important;
    translate:none!important;
    box-sizing:border-box!important;
    max-width:none!important;
    transform-origin:right center!important;
    transition:
      width .72s cubic-bezier(.22,.61,.36,1),
      right .72s cubic-bezier(.22,.61,.36,1),
      height .54s cubic-bezier(.22,.61,.36,1),
      min-height .54s cubic-bezier(.22,.61,.36,1),
      padding .54s cubic-bezier(.22,.61,.36,1),
      gap .54s cubic-bezier(.22,.61,.36,1),
      border-radius .54s cubic-bezier(.22,.61,.36,1),
      background .38s ease,
      border-color .38s ease,
      box-shadow .38s ease!important;
  }

  /* Full state: 1390px max and visually centered at rest. */
  .site-header:not(.is-mini-sticky) .header-shell{
    width:min(1390px,calc(100vw - (var(--pad) * 2)))!important;
    right:max(var(--pad),calc((100vw - 1390px) / 2))!important;
  }

  /* Compact state: keep the small header on the right. */
  .site-header.is-mini-sticky .header-shell{
    width:710px!important;
    right:var(--pad)!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{width:680px!important}
}

/* V25.1 — make the return motion read clearly as RIGHT -> LEFT.
   On the way back to the top, width starts first while the compact
   right edge briefly holds; the final centering glide follows after. */
@media (min-width:1181px){
  .site-header:not(.is-mini-sticky) .header-shell{
    transition:
      width .74s cubic-bezier(.22,.61,.36,1),
      right .46s cubic-bezier(.22,.61,.36,1) .18s,
      height .54s cubic-bezier(.22,.61,.36,1),
      min-height .54s cubic-bezier(.22,.61,.36,1),
      padding .54s cubic-bezier(.22,.61,.36,1),
      gap .54s cubic-bezier(.22,.61,.36,1),
      border-radius .54s cubic-bezier(.22,.61,.36,1),
      background .38s ease,
      border-color .38s ease,
      box-shadow .38s ease!important;
  }
  .site-header.is-mini-sticky .header-shell{
    transition:
      width .62s cubic-bezier(.22,.61,.36,1),
      right .48s cubic-bezier(.22,.61,.36,1),
      height .50s cubic-bezier(.22,.61,.36,1),
      min-height .50s cubic-bezier(.22,.61,.36,1),
      padding .50s cubic-bezier(.22,.61,.36,1),
      gap .50s cubic-bezier(.22,.61,.36,1),
      border-radius .50s cubic-bezier(.22,.61,.36,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .34s ease!important;
  }
}

/* =========================================================
   V26 — premium two-piece compact sticky header
   Full/top header remains one unified 1390px pill.
   On scroll the SAME header becomes a transparent parent row:
   [ round D mark ] 10px [ nav + language + CTA pill ]
   ========================================================= */
@media (min-width:1181px){
  /* Structural wrapper: invisible in the full state, functional in compact. */
  .site-header .header-nav-cluster{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:26px!important;
    flex:1 1 auto!important;
    min-width:0!important;
    height:100%!important;
    border:1px solid transparent!important;
    border-radius:999px!important;
    background:transparent!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
    transition:
      gap .52s cubic-bezier(.22,.61,.36,1),
      padding .52s cubic-bezier(.22,.61,.36,1),
      background .38s ease,
      border-color .38s ease,
      box-shadow .38s ease,
      -webkit-backdrop-filter .38s ease,
      backdrop-filter .38s ease!important;
  }

  /* With the new wrapper, nav no longer needs to create its own auto spacer. */
  .site-header .header-nav-cluster .desktop-nav{
    margin-left:auto!important;
  }
  .site-header .header-nav-cluster .header-actions{
    margin-left:0!important;
  }

  /* Full state keeps the original single-glass-pill appearance. */
  .site-header:not(.is-mini-sticky) .header-shell::before{
    opacity:1!important;
  }
  .site-header:not(.is-mini-sticky) .header-nav-cluster{
    padding:0!important;
    border-color:transparent!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  /* Compact shell is only a transparent positioning row. */
  .site-header.is-mini-sticky .header-shell{
    width:710px!important;
    height:60px!important;
    min-height:60px!important;
    padding:0!important;
    gap:10px!important;
    background:transparent!important;
    border-color:transparent!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
  }
  .site-header.is-mini-sticky .header-shell::before{
    opacity:0!important;
    background:transparent!important;
    border-color:transparent!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
  }

  /* Piece 1 — independent perfectly-round D mark. */
  .site-header.is-mini-sticky .brand{
    width:60px!important;
    height:60px!important;
    min-width:60px!important;
    min-height:60px!important;
    flex:0 0 60px!important;
    padding:8px!important;
    border-radius:50%!important;
    background:rgba(0,0,0,.92)!important;
    border:1px solid rgba(255,255,255,.14)!important;
    -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
    backdrop-filter:blur(20px) saturate(135%)!important;
    box-shadow:0 14px 42px rgba(0,0,0,.30)!important;
  }
  .site-header.is-mini-sticky .brand-compact{
    width:38px!important;
    height:38px!important;
    max-width:38px!important;
    max-height:38px!important;
  }

  /* Piece 2 — menu/language/CTA live in their own floating pill. */
  .site-header.is-mini-sticky .header-nav-cluster{
    height:60px!important;
    min-height:60px!important;
    padding:0 10px 0 16px!important;
    gap:10px!important;
    border-color:rgba(255,255,255,.14)!important;
    background:rgba(0,0,0,.86)!important;
    -webkit-backdrop-filter:blur(20px) saturate(135%)!important;
    backdrop-filter:blur(20px) saturate(135%)!important;
    box-shadow:0 14px 42px rgba(0,0,0,.30)!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster .desktop-nav{
    margin-left:0!important;
    flex:1 1 auto!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster .header-actions{
    flex:0 0 auto!important;
  }

  /* Keep the floating pair visually clean and aligned. */
  .site-header.is-mini-sticky .nav-link{
    height:40px!important;
  }
  .site-header.is-mini-sticky .language-control select{
    height:40px!important;
  }
  .site-header.is-mini-sticky .header-contact{
    height:44px!important;
  }

  /* Mega menu still belongs to Services and remains available in compact mode. */
  .site-header.is-mini-sticky .nav-services .mega-menu{
    top:82px!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{
    width:680px!important;
  }
  .site-header.is-mini-sticky .brand{
    width:56px!important;
    height:56px!important;
    min-width:56px!important;
    min-height:56px!important;
    flex-basis:56px!important;
    padding:8px!important;
  }
  .site-header.is-mini-sticky .brand-compact{
    width:34px!important;
    height:34px!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster{
    height:56px!important;
    min-height:56px!important;
    padding-left:12px!important;
    padding-right:8px!important;
    gap:7px!important;
  }
}

/* Preserve the existing tablet/mobile header structure exactly. */
@media (max-width:1180px){
  .header-nav-cluster{display:contents!important}
}


/* v32: process + selected concepts refinement */
.process-stage{
  background:
    radial-gradient(circle at 82% 18%, rgba(54, 136, 184, 0.14), transparent 30%),
    linear-gradient(180deg, #070c11 0%, #091018 100%) !important;
}
.process-stage .wrap-wide{
  position: relative;
}
.portfolio-stack{
  background:
    radial-gradient(circle at 18% 10%, rgba(88, 177, 224, 0.10), transparent 28%),
    linear-gradient(180deg, #0d141b 0%, #0b1218 100%) !important;
  border-top: 1px solid rgba(255,255,255,.08);
}
.portfolio-stack .stack-stage{
  width: min(var(--wrap), calc(100% - var(--pad) * 2)) !important;
  gap: 24px;
}
.portfolio-stack .stack-project{
  min-height: clamp(440px, 58vh, 560px) !important;
  border-radius: 28px;
}
.portfolio-stack .stack-project > div{
  padding: clamp(28px, 3.1vw, 42px) !important;
}
.portfolio-stack .stack-project figure img{
  height: 100%;
  object-fit: cover;
}
@media (max-width: 1000px){
  .portfolio-stack .stack-stage{
    width: calc(100% - (var(--pad) * 2)) !important;
  }
  .portfolio-stack .stack-project{
    min-height: 0 !important;
  }
}
@media (max-width: 740px){
  .process-stage{
    background: linear-gradient(180deg, #070c11 0%, #091018 100%) !important;
  }
  .portfolio-stack{
    background: linear-gradient(180deg, #0d141b 0%, #0b1218 100%) !important;
  }
  .portfolio-stack .stack-project figure{
    height: auto !important;
    aspect-ratio: 1.18 / 1 !important;
  }
}

/* v33 — selected concept card width + compact height */
@media (min-width: 1001px){
  .portfolio-stack .stack-heading,
  .portfolio-stack .stack-stage{
    width:min(var(--wrap), calc(100% - (var(--pad) * 2))) !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .portfolio-stack .stack-project{
    width:100% !important;
    min-height:clamp(400px, 47vh, 500px) !important;
    grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr) !important;
  }
  .portfolio-stack .stack-project figure{
    height:clamp(400px, 47vh, 500px) !important;
    min-height:0 !important;
  }
  .portfolio-stack .stack-project > div{
    min-height:0 !important;
    padding:clamp(28px,2.7vw,40px) !important;
  }
}


/* v34 — selected concepts professional compact proportions */
@media (min-width: 1001px){
  .portfolio-stack{
    padding:82px 0 94px !important;
  }
  .portfolio-stack .stack-heading{
    margin-bottom:30px !important;
  }
  .portfolio-stack .stack-stage{
    width:min(var(--wrap), calc(100% - (var(--pad) * 2))) !important;
    margin-inline:auto !important;
  }
  .portfolio-stack .stack-project{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    grid-template-columns:minmax(0,1.42fr) minmax(320px,.58fr) !important;
    border-radius:26px !important;
  }
  .portfolio-stack .stack-project figure{
    height:100% !important;
    min-height:0 !important;
  }
  .portfolio-stack .stack-project figure img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }
  .portfolio-stack .stack-project > div{
    height:100% !important;
    min-height:0 !important;
    padding:34px 38px !important;
    justify-content:flex-start !important;
  }
  .portfolio-stack .stack-project h3{
    margin:14px 0 18px !important;
    font-size:clamp(42px,3.8vw,60px) !important;
  }
  .portfolio-stack .stack-project p{
    max-width:390px;
    margin:0 !important;
  }
  .portfolio-stack .stack-project b{
    margin-top:auto !important;
    padding-top:24px;
  }
}
@media (max-width:1000px){
  .portfolio-stack{padding:72px 0 82px !important}
}


/* v35: selected-concepts compact spacing + showreel parent color */
.showreel{
  background: linear-gradient(180deg, #09131c 0%, #0c1720 100%) !important;
}
.portfolio-stack{
  padding: 64px 0 72px !important;
}
.portfolio-stack .stack-stage{
  margin-top: 10px;
  margin-bottom: 0 !important;
  height: clamp(350px, 44vh, 430px) !important;
}
.portfolio-stack .stack-project{
  min-height: clamp(350px, 44vh, 430px) !important;
}
.portfolio-stack .stack-project figure{
  min-height: 100%;
  height: 100%;
}
.portfolio-stack .stack-project > div{
  min-height: 100% !important;
  justify-content: space-between;
}
@media (max-width:1000px){
  .portfolio-stack{padding:56px 0 62px !important;}
  .portfolio-stack .stack-stage,
  .portfolio-stack .stack-project{height:auto !important;min-height:0 !important;}
}


/* ==========================================================================\n   Production QA pass — typography, responsive rhythm and compact portfolio stack\n   ========================================================================== */

/* Distinct parent treatment for the film chapter. */
.showreel{
  background:
    radial-gradient(circle at 84% 18%, rgba(55,151,205,.12), transparent 31%),
    linear-gradient(180deg,#07131c 0%,#0a1720 100%) !important;
}

/* Selected concepts: the visible card stays compact while the scroll story is active.\n   Desktop scrolling is handled by a CSS-sticky stage in site.js, so no pinSpacing tail remains. */
@media (min-width:1181px){
  .portfolio-stack{
    padding:72px 0 0 !important;
    overflow:clip;
  }
  .portfolio-stack .stack-heading{
    width:min(var(--wrap),calc(100% - (var(--pad) * 2))) !important;
    margin:0 auto 30px !important;
  }
  .portfolio-stack .stack-stage{
    width:min(var(--wrap),calc(100% - (var(--pad) * 2))) !important;
    margin:0 auto !important;
  }
  .portfolio-stack .stack-project{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    grid-template-columns:minmax(0,1.42fr) minmax(320px,.58fr) !important;
    border-radius:26px !important;
  }
  .portfolio-stack .stack-project figure{
    width:100%;
    height:100% !important;
    min-height:0 !important;
  }
  .portfolio-stack .stack-project figure img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
  }
  .portfolio-stack .stack-project>div{
    height:100% !important;
    min-height:0 !important;
    padding:32px 38px !important;
    justify-content:flex-start !important;
  }
  .portfolio-stack .stack-project h3{
    margin:13px 0 16px !important;
    font-size:clamp(40px,3.5vw,56px) !important;
    line-height:.96 !important;
  }
  .portfolio-stack .stack-project p{
    max-width:400px;
    margin:0 !important;
    font-size:14px !important;
    line-height:1.65 !important;
  }
  .portfolio-stack .stack-project b{
    margin-top:auto !important;
    padding-top:20px;
  }
}

/* Shared type QA. Keep display type tight, but never so tight that translated text collides. */
.home-hero h1,
.inner-hero h1,.blog-hero h1,
.service-detail-title h1,
.contact-copy-new h1,
.project-hero-copy h1{
  text-wrap:balance;
  line-height:.92;
}
.intro-main h2,
.service-story-head h2,
.work-rail-head h2,
.section-split-heading h2,
.stack-heading h2,
.process-heading h2,
.showreel-head h2,
.capability-page-copy h2,
.brand-cta-copy h2{
  text-wrap:balance;
  line-height:.98;
}
.service-narrative h3,
.guide-articles h3,
.project-story-grid h3,
.field-guide-grid h3,
.directory-row h3{
  line-height:1.12;
}

/* French/German copy generally runs longer than English. Slightly relax tracking and scale\n   the largest display type so the hierarchy survives without awkward 1-word lines. */
html[lang="fr"] .home-hero h1{font-size:clamp(62px,6.35vw,106px);letter-spacing:-.055em;line-height:.93}
html[lang="de"] .home-hero h1{font-size:clamp(60px,6.15vw,102px);letter-spacing:-.052em;line-height:.94}
html[lang="fr"] :is(.inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1,.project-hero-copy h1),
html[lang="de"] :is(.inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1,.project-hero-copy h1){
  letter-spacing:-.048em;
  line-height:.96;
}
html[lang="fr"] :is(.stack-heading h2,.process-heading h2,.brand-cta-copy h2,.capability-page-copy h2),
html[lang="de"] :is(.stack-heading h2,.process-heading h2,.brand-cta-copy h2,.capability-page-copy h2){
  letter-spacing:-.045em;
  line-height:1;
}
html[lang="de"] :is(h1,h2,h3),
html[lang="fr"] :is(h1,h2,h3){hyphens:auto;overflow-wrap:break-word}

/* Laptop/tablet QA: preserve hierarchy while preventing oversized blocks and accidental overflow. */
@media (max-width:1180px){
  .portfolio-stack{padding:68px 0 76px !important;overflow:visible}
  .portfolio-stack .stack-stage{height:auto !important;position:relative !important;top:auto !important}
  .portfolio-stack .stack-project{height:auto !important;min-height:0 !important}
  .portfolio-stack .stack-project+ .stack-project{margin-top:18px}
  .showreel-head h2{line-height:1 !important}
  .inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1{line-height:.98}
}

@media (max-width:740px){
  body{font-size:15px;line-height:1.62}
  .wrap-wide{width:calc(100% - 36px) !important}
  .home-hero h1{font-size:clamp(43px,12vw,58px) !important;line-height:.96 !important;letter-spacing:-.045em !important}
  html[lang="fr"] .home-hero h1{font-size:clamp(40px,10.7vw,53px) !important;line-height:1 !important}
  html[lang="de"] .home-hero h1{font-size:clamp(40px,10.5vw,52px) !important;line-height:1 !important}
  .inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1,.project-hero-copy h1{
    font-size:clamp(40px,10.5vw,54px) !important;
    line-height:.99 !important;
    letter-spacing:-.043em !important;
  }
  .intro-main h2,.service-story-head h2,.work-rail-head h2,.section-split-heading h2,.stack-heading h2,.process-heading h2,.showreel-head h2,.capability-page-copy h2,.brand-cta-copy h2{
    font-size:clamp(32px,8.8vw,43px) !important;
    line-height:1.02 !important;
    letter-spacing:-.038em !important;
  }
  .service-panel-copy h3,.capability-chapters h3,.stack-project h3,.belief-list h3,.guide-articles h3,.project-story-grid article h3,.field-guide-grid article h3{
    font-size:clamp(25px,7vw,34px) !important;
    line-height:1.08 !important;
  }
  .micro{line-height:1.5}
  .portfolio-stack{padding:58px 0 66px !important}
  .portfolio-stack .stack-heading{margin-bottom:24px !important}
  .portfolio-stack .stack-project{border-radius:20px !important}
  .portfolio-stack .stack-project figure{aspect-ratio:1.3/1 !important;height:auto !important}
  .portfolio-stack .stack-project>div{padding:22px !important}
  .showreel{padding-top:64px !important;padding-bottom:72px !important}
}

@media (max-width:390px){
  .wrap-wide{width:calc(100% - 28px) !important}
  .home-hero h1{font-size:clamp(39px,11.2vw,47px) !important}
  .inner-hero h1,.blog-hero h1,.service-detail-title h1,.contact-copy-new h1,.project-hero-copy h1{font-size:clamp(36px,10.5vw,46px) !important}
  .pill{max-width:100%;white-space:normal;text-align:center;line-height:1.25}
}

/* Production QA corrections from automated viewport audit */
.manifesto h2{line-height:.92!important}
.belief-list h3{line-height:1.05!important}
.about-process-list h3{line-height:1.12!important}
.portfolio-card-new h2{line-height:1.06!important}

@media(max-width:740px){
  .belief-list h3{line-height:1.06!important}
  .about-process-list h3{line-height:1.1!important}
  .portfolio-card-new h2{line-height:1.08!important}
  .portfolio-filter{
    width:100%!important;
    max-width:100%!important;
    margin-right:0!important;
    padding-right:0!important;
    overflow-x:visible!important;
    flex-wrap:wrap!important;
  }
  .filter-button{flex:0 0 auto!important}
}
@media(min-width:1181px){
  .manifesto h2{font-size:clamp(56px,7vw,112px)!important}
}

/* Long localized service names must never widen the mobile grid. */
.service-detail-hero-grid>* , .service-value-grid>*{min-width:0}
@media(max-width:740px){
  html[lang="de"] .service-detail-title h1,
  html[lang="de"] .service-value h2,
  html[lang="fr"] .service-detail-title h1,
  html[lang="fr"] .service-value h2{
    overflow-wrap:anywhere!important;
    word-break:normal;
    hyphens:auto;
  }
  .service-detail-hero-grid,.service-value-grid{width:100%;max-width:100%;min-width:0}
  .service-collage{width:100%!important;max-width:100%!important}
}
@media(min-width:1181px){.manifesto h2{font-size:clamp(54px,6.7vw,108px)!important}}

/* Mobile drawer must be viewport-relative, not the blurred header shell's containing block. */
@media(max-width:1180px){
  .site-header.nav-open .header-shell{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}


/* v37: selected concepts — no synthetic scroll spacer */
@media(min-width:1181px){
  .portfolio-stack{
    padding:64px 0 72px!important;
  }
  .portfolio-stack .stack-heading{
    margin-bottom:34px!important;
  }
  .portfolio-stack .stack-stage{
    position:relative!important;
    top:auto!important;
    margin-bottom:0!important;
    height:clamp(390px,46vh,470px)!important;
  }
  .portfolio-stack .stack-project{
    min-height:0!important;
    height:100%!important;
  }
  .portfolio-stack .stack-project figure,
  .portfolio-stack .stack-project>div{
    height:100%!important;
    min-height:0!important;
  }
}


/* v38: pin the complete selected-concepts parent scene on desktop */
@media(min-width:1181px){
  .portfolio-stack{
    min-height:100svh!important;
    padding:clamp(54px,6vh,72px) 0 clamp(50px,5vh,64px)!important;
    display:flex;
    flex-direction:column;
    justify-content:center;
    overflow:hidden;
  }
  .portfolio-stack .stack-heading{
    margin-bottom:26px!important;
  }
  .portfolio-stack .stack-stage{
    height:clamp(360px,41vh,430px)!important;
    flex:0 0 auto;
  }
}
\n\n/* =========================================================\n   V33 — scroll response polish\n   Faster, smoother hero/header response without layout changes.\n   ========================================================= */\n@media (min-width:1181px){\n  .site-header .header-shell,\n  .site-header.is-mini-sticky .header-shell{\n    transition:\n      width .44s cubic-bezier(.22,.72,.24,1),\n      right .38s cubic-bezier(.22,.72,.24,1),\n      height .36s cubic-bezier(.22,.72,.24,1),\n      min-height .36s cubic-bezier(.22,.72,.24,1),\n      padding .36s cubic-bezier(.22,.72,.24,1),\n      gap .34s cubic-bezier(.22,.72,.24,1),\n      border-radius .38s cubic-bezier(.22,.72,.24,1),\n      background .26s ease-out,\n      border-color .26s ease-out,\n      box-shadow .30s ease-out!important;\n  }\n\n  .site-header .brand,\n  .site-header .brand-full,\n  .site-header .brand-compact,\n  .site-header .desktop-nav,\n  .site-header .header-actions,\n  .site-header .header-nav-cluster{\n    transition-duration:.30s!important;\n    transition-timing-function:cubic-bezier(.22,.72,.24,1)!important;\n  }\n\n  .site-header .header-nav-cluster{\n    transition-property:gap,padding,background,border-color,box-shadow,-webkit-backdrop-filter,backdrop-filter!important;\n  }\n}\n

/* =========================================================
   V22 — immediate scroll response / no trailing hang
   Keeps the V21 layout but removes long reflow-heavy easing.
   ========================================================= */
@media (min-width:1181px){
  .site-header{
    transition:padding .24s cubic-bezier(.2,.75,.25,1)!important;
    will-change:padding;
  }
  .site-header .header-shell,
  .site-header:not(.is-mini-sticky) .header-shell,
  .site-header.is-mini-sticky .header-shell{
    transition:
      width .28s cubic-bezier(.2,.75,.25,1),
      height .24s cubic-bezier(.2,.75,.25,1),
      min-height .24s cubic-bezier(.2,.75,.25,1),
      padding .24s cubic-bezier(.2,.75,.25,1),
      gap .22s cubic-bezier(.2,.75,.25,1)!important;
    will-change:width,height,padding;
  }
  .site-header .brand,
  .site-header.is-mini-sticky .brand{
    transition:width .24s cubic-bezier(.2,.75,.25,1),height .24s cubic-bezier(.2,.75,.25,1)!important;
  }
  .site-header .brand img{
    transition:opacity .16s ease,transform .22s cubic-bezier(.2,.75,.25,1)!important;
  }
  .site-header .desktop-nav,
  .site-header.is-mini-sticky .desktop-nav,
  .site-header .header-actions,
  .site-header.is-mini-sticky .header-actions{
    transition:gap .22s cubic-bezier(.2,.75,.25,1)!important;
  }
  .site-header .nav-link,
  .site-header.is-mini-sticky .nav-link{
    transition:font-size .18s ease,color .16s ease,background .16s ease!important;
  }
  .site-header .language-control select,
  .site-header .header-contact,
  .site-header.is-mini-sticky .header-contact{
    transition:height .20s ease,padding .20s ease,font-size .18s ease,background .18s ease,color .18s ease!important;
  }
  .site-header .header-shell::before{
    transition:background .20s ease,border-color .20s ease,box-shadow .22s ease!important;
    will-change:background,box-shadow;
  }
}

/* GPU hints only for the hero elements that animate during the pinned scene. */
@media (min-width:1181px){
  [data-hero-scene] .home-hero-copy,
  [data-hero-scene] .hero-frame,
  [data-hero-scene] .orbit-one,
  [data-hero-scene] .orbit-two,
  [data-hero-scene] .hero-scroll-cue{
    will-change:transform,opacity;
    backface-visibility:hidden;
    transform-style:preserve-3d;
  }
}


/* =========================================================
   V35 — seamless header/hero morph
   Scroll-locked hero + ultra-short header layout morph so the
   compact state reads as one continuous transformation.
   ========================================================= */
@media (min-width:1181px){
  .site-header{
    transform:translateZ(0);
    backface-visibility:hidden;
    contain:layout style;
  }

  .site-header .header-shell,
  .site-header:not(.is-mini-sticky) .header-shell,
  .site-header.is-mini-sticky .header-shell{
    transition:
      width .16s cubic-bezier(.16,1,.3,1),
      height .15s cubic-bezier(.16,1,.3,1),
      min-height .15s cubic-bezier(.16,1,.3,1),
      padding .14s cubic-bezier(.16,1,.3,1),
      gap .14s cubic-bezier(.16,1,.3,1),
      border-radius .15s cubic-bezier(.16,1,.3,1)!important;
    transform:translateZ(0);
    backface-visibility:hidden;
    will-change:width,height,padding,transform;
  }

  .site-header .brand,
  .site-header.is-mini-sticky .brand{
    transition:
      width .14s cubic-bezier(.16,1,.3,1),
      height .14s cubic-bezier(.16,1,.3,1),
      min-width .14s cubic-bezier(.16,1,.3,1),
      min-height .14s cubic-bezier(.16,1,.3,1),
      padding .14s cubic-bezier(.16,1,.3,1),
      border-radius .14s cubic-bezier(.16,1,.3,1),
      background .12s ease-out,
      border-color .12s ease-out,
      box-shadow .14s ease-out!important;
    transform:translateZ(0);
  }

  .site-header .header-nav-cluster,
  .site-header.is-mini-sticky .header-nav-cluster{
    transition:
      height .14s cubic-bezier(.16,1,.3,1),
      min-height .14s cubic-bezier(.16,1,.3,1),
      gap .14s cubic-bezier(.16,1,.3,1),
      padding .14s cubic-bezier(.16,1,.3,1),
      background .12s ease-out,
      border-color .12s ease-out,
      box-shadow .14s ease-out,
      backdrop-filter .12s ease-out!important;
    transform:translateZ(0);
    backface-visibility:hidden;
  }

  .site-header .brand img,
  .site-header .brand-full,
  .site-header .brand-compact{
    transition:opacity .10s linear,transform .14s cubic-bezier(.16,1,.3,1)!important;
    backface-visibility:hidden;
  }

  .site-header .desktop-nav,
  .site-header .header-actions,
  .site-header .nav-link,
  .site-header .language-control select,
  .site-header .header-contact{
    transition-duration:.12s!important;
    transition-timing-function:cubic-bezier(.16,1,.3,1)!important;
  }

  [data-hero-scene],
  [data-hero-scene] .home-hero-copy,
  [data-hero-scene] .hero-frame,
  [data-hero-scene] .orbit-one,
  [data-hero-scene] .orbit-two,
  [data-hero-scene] .hero-scroll-cue{
    transform:translateZ(0);
    backface-visibility:hidden;
  }
}


/* =========================================================
   V36 — larger desktop Services mega menu with bigger type
   and visible VFX / creative services.
   ========================================================= */
@media (min-width:1181px){
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    top:96px!important;
    right:max(var(--pad),24px)!important;
    left:auto!important;
    width:min(1180px,calc(100vw - 48px))!important;
    max-width:1180px!important;
    max-height:min(76vh,720px)!important;
    padding:30px 32px!important;
    grid-template-columns:minmax(280px,320px) minmax(0,1fr)!important;
    gap:34px!important;
    border-radius:28px!important;
  }

  .site-header.is-mini-sticky .nav-services .mega-menu{
    top:84px!important;
  }

  .site-header .mega-lead{
    padding:12px 28px 14px 6px!important;
  }

  .site-header .mega-lead .micro{
    font-size:11px!important;
    letter-spacing:.22em!important;
  }

  .site-header .mega-lead h3{
    font-size:42px!important;
    line-height:1.02!important;
    margin:18px 0 16px!important;
  }

  .site-header .mega-lead p{
    max-width:280px!important;
    margin:0 0 22px!important;
    font-size:15px!important;
    line-height:1.65!important;
  }

  .site-header .mega-lead .arrow-link{
    font-size:16px!important;
  }

  .site-header .mega-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:26px 34px!important;
    align-content:start!important;
  }

  .site-header .mega-grid > div{
    gap:10px!important;
  }

  .site-header .mega-grid .micro{
    display:block!important;
    margin-bottom:6px!important;
    font-size:10.5px!important;
    line-height:1.45!important;
    letter-spacing:.18em!important;
    color:#6f8796!important;
  }

  .site-header .mega-grid a{
    display:block!important;
    font-size:17px!important;
    line-height:1.42!important;
    padding:2px 0!important;
    color:#e7eef3!important;
  }

  .site-header .mega-grid a:hover{
    color:var(--cyan)!important;
  }
}

@media (min-width:1181px) and (max-width:1360px){
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    width:min(1040px,calc(100vw - 36px))!important;
    max-width:1040px!important;
    padding:28px 28px!important;
    grid-template-columns:minmax(255px,295px) minmax(0,1fr)!important;
    gap:28px!important;
  }

  .site-header .mega-lead h3{
    font-size:36px!important;
  }

  .site-header .mega-grid{
    gap:22px 26px!important;
  }

  .site-header .mega-grid a{
    font-size:15.5px!important;
  }
}

/* =========================================================
   V37 — paragraph rhythm, readable line lengths and mega-menu QA
   ========================================================= */
p{
  text-wrap:pretty;
  overflow-wrap:break-word;
}

@media (min-width:1181px){
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    width:min(1240px,calc(100vw - 48px))!important;
    max-width:1240px!important;
    max-height:min(82vh,780px)!important;
    padding:32px 34px!important;
    grid-template-columns:minmax(300px,340px) minmax(0,1fr)!important;
    gap:38px!important;
    overflow:auto!important;
  }

  .site-header .mega-lead{
    overflow:visible!important;
    padding-right:30px!important;
  }

  .site-header .mega-lead p{
    width:100%!important;
    max-width:310px!important;
    margin:0 0 24px!important;
    font-size:15px!important;
    line-height:1.7!important;
    color:#9eabb4!important;
    overflow:visible!important;
  }

  .site-header .mega-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:28px 36px!important;
  }

  .site-header .mega-grid > div{
    align-content:start!important;
  }

  .site-header .mega-grid a{
    font-size:16.5px!important;
    line-height:1.38!important;
    padding:3px 0!important;
  }
}

.inner-hero-grid > div > p,
.service-detail-title > p,
.project-hero-copy > p,
.contact-copy-new > p{
  max-width:62ch;
  line-height:1.7;
}

.service-panel-copy p,
.directory-row p,
.work-rail-card-copy p,
.portfolio-card-new p,
.capability-page-copy p,
.about-copy p,
.page-field-guide p,
.editorial-guide p{
  line-height:1.68;
}

.directory-row p,
.service-panel-copy p,
.portfolio-card-new p{
  max-width:58ch;
}

.about-copy > p,
.page-field-guide article > p,
.editorial-guide article > p{
  max-width:68ch;
}


/* =========================================================
   V38 — compact desktop Services mega menu
   Featured services only; full catalogue remains on /services/.
   ========================================================= */
@media (min-width:1181px){
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    width:min(940px,calc(100vw - 48px))!important;
    max-width:940px!important;
    max-height:min(70vh,600px)!important;
    padding:26px 28px!important;
    grid-template-columns:minmax(235px,270px) minmax(0,1fr)!important;
    gap:30px!important;
    overflow:auto!important;
  }

  .site-header .mega-lead{
    padding:8px 24px 10px 2px!important;
  }

  .site-header .mega-lead .micro{
    font-size:9.5px!important;
  }

  .site-header .mega-lead h3{
    font-size:32px!important;
    line-height:1.03!important;
    margin:14px 0!important;
  }

  .site-header .mega-lead p{
    max-width:245px!important;
    margin-bottom:18px!important;
    font-size:13.5px!important;
    line-height:1.58!important;
  }

  .site-header .mega-lead .arrow-link{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:42px!important;
    padding:10px 15px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.05)!important;
    font-size:13px!important;
    line-height:1!important;
    transition:background .2s ease,border-color .2s ease,transform .2s ease!important;
  }

  .site-header .mega-lead .arrow-link:hover{
    background:rgba(255,255,255,.1)!important;
    border-color:rgba(255,255,255,.28)!important;
    transform:translateY(-1px)!important;
  }

  .site-header .mega-grid.mega-grid-featured{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:20px 24px!important;
    align-items:start!important;
  }

  .site-header .mega-grid.mega-grid-featured > div{
    gap:7px!important;
  }

  .site-header .mega-grid.mega-grid-featured .micro{
    margin-bottom:7px!important;
    font-size:9px!important;
    line-height:1.35!important;
  }

  .site-header .mega-grid.mega-grid-featured a{
    font-size:14px!important;
    line-height:1.35!important;
    padding:3px 0!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    width:min(860px,calc(100vw - 36px))!important;
    max-width:860px!important;
    grid-template-columns:minmax(215px,245px) minmax(0,1fr)!important;
    gap:24px!important;
  }
  .site-header .mega-grid.mega-grid-featured{gap:18px 20px!important}
  .site-header .mega-grid.mega-grid-featured a{font-size:13px!important}
}


/* =========================================================
   V39 — balanced compact mega menu
   Fill the available list area with 6 key services per column.
   ========================================================= */
@media (min-width:1181px){
  .site-header .nav-services .mega-menu,
  .site-header.is-mini-sticky .nav-services .mega-menu{
    padding-bottom:24px!important;
  }

  .site-header .mega-grid.mega-grid-featured{
    align-self:stretch!important;
    align-items:start!important;
  }

  .site-header .mega-grid.mega-grid-featured > div{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    min-height:100%!important;
  }

  .site-header .mega-grid.mega-grid-featured a{
    font-size:14px!important;
    line-height:1.28!important;
    padding:3px 0!important;
  }

  .site-header .mega-grid.mega-grid-featured .micro{
    margin-bottom:6px!important;
  }
}

/* Keep an open FAQ control inside its mobile content column. The rotated plus otherwise
   extends a few pixels beyond the viewport on long-question service pages. */
@media(max-width:820px){
  .faq-item summary{padding-right:16px!important}
  .faq-item summary>span{min-width:0}
}

/* =========================================================
   V40 — targeted portfolio grid consistency + qualified enquiry form.
   These rules intentionally reuse the existing cards, form controls, palette and spacing.
   ========================================================= */
.portfolio-index .portfolio-masonry{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-auto-rows:1fr;
  align-items:stretch;
  gap:clamp(22px,2.35vw,34px)!important;
}
.portfolio-index .portfolio-card-new{
  display:flex!important;
  min-width:0;
  height:100%;
  flex-direction:column;
  align-self:stretch;
}
.portfolio-index .portfolio-card-new:nth-child(3n+1){grid-row:auto!important}
.portfolio-index .portfolio-card-new figure,
.portfolio-index .portfolio-card-new:nth-child(3n+1) figure{
  height:auto!important;
  min-height:0;
  aspect-ratio:4 / 3;
  flex:0 0 auto;
}
.portfolio-index .portfolio-card-new figure img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.portfolio-index .portfolio-card-new>div{
  display:flex;
  min-height:0;
  flex:1 1 auto;
  flex-direction:column;
  padding:20px 0 34px;
}
.portfolio-index .portfolio-card-new .arrow-link{
  margin-top:auto;
  padding-top:18px;
}

.contact-form-step{gap:18px}
.contact-form fieldset{min-width:0;margin:0;padding:0;border:0}
.contact-service-field{display:grid;gap:11px}
.contact-service-field legend{padding:0;font-size:12px;font-weight:700;color:var(--ink)}
.contact-service-field legend>span:last-child{margin-left:7px;color:#89959f;font-size:11px;font-weight:500}
.contact-service-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.contact-form label.contact-check{
  display:flex!important;
  min-width:0;
  min-height:42px;
  align-items:center;
  gap:9px;
  padding:9px 11px;
  border:1px solid #d8e0e5;
  border-radius:12px;
  background:#f8fafb;
  color:var(--ink);
  font-size:11px;
  font-weight:650;
  line-height:1.28;
  cursor:pointer;
}
.contact-form label.contact-check:hover{border-color:#9ecce5;background:#f3f9fc}
.contact-form label.contact-check input{
  width:16px;
  height:16px;
  min-width:16px;
  margin:0;
  padding:0;
  accent-color:var(--blue);
}
.contact-form label.contact-check span{color:inherit;font-weight:inherit}
.contact-form .industry-other-field[hidden]{display:none!important}
.contact-form-card .form-notice-success{background:#edf9f2;color:#176947}
.contact-form-card .form-notice-error{background:#fff3f2;color:#a13d36}
.contact-form[data-submitting="true"] [data-contact-submit]{opacity:.72;cursor:wait;pointer-events:none}

@media (min-width:681px) and (max-width:1180px){
  .portfolio-index .portfolio-masonry{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .portfolio-index .portfolio-card-new figure,
  .portfolio-index .portfolio-card-new:nth-child(3n+1) figure{aspect-ratio:4 / 3!important;height:auto!important}
}
@media (max-width:680px){
  .portfolio-index .portfolio-masonry{grid-template-columns:1fr!important;grid-auto-rows:auto;gap:20px!important}
  .portfolio-index .portfolio-card-new{height:auto}
  .portfolio-index .portfolio-card-new figure,
  .portfolio-index .portfolio-card-new:nth-child(3n+1) figure{aspect-ratio:4 / 3!important;height:auto!important}
  .portfolio-index .portfolio-card-new>div{padding-bottom:26px}
  .contact-service-options{gap:8px}
  .contact-form label.contact-check{min-height:40px;padding:8px 9px;font-size:10px}
}
@media (max-width:380px){
  .contact-service-options{grid-template-columns:1fr}
}

/* =========================================================
   ENTERPRISE PRODUCTS + HOME INSIGHTS + SOFTMATRIX PARTNER
   ========================================================= */
.products-hero{padding:calc(var(--header-h) + 76px) 0 108px;min-height:86svh;display:flex;align-items:center}
.products-hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:clamp(50px,7vw,120px);align-items:end}
.products-hero h1{font-size:clamp(62px,7vw,116px);line-height:.88;letter-spacing:-.06em;margin:22px 0 34px;max-width:1050px}
.products-hero h1 em{color:var(--cyan);font-style:normal}
.products-hero p{max-width:720px;color:#9eabb5;font-size:17px;line-height:1.68}
.products-hero aside{border-left:1px solid rgba(255,255,255,.14);padding:24px 0 24px 36px}
.products-hero aside strong{display:block;font-size:clamp(76px,9vw,146px);line-height:.84;letter-spacing:-.07em;color:#fff;margin:28px 0}
.products-hero aside p{font-size:14px;max-width:300px}
.products-intro{padding:var(--section-space) 0 var(--section-space-tight)}
.products-intro-grid{display:grid;grid-template-columns:.5fr 1.5fr;gap:70px;align-items:start}
.products-intro h2{font-size:clamp(46px,5.2vw,82px);line-height:.96;letter-spacing:-.05em;margin:0 0 30px}
.products-intro p{max-width:760px;color:#596873;font-size:17px;line-height:1.7}
.products-suite{padding:0 0 var(--section-space)}
.product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.product-card{background:#fff;border:1px solid var(--line-dark);border-radius:28px;overflow:hidden;display:grid;grid-template-columns:.9fr 1.1fr;min-height:560px}
.product-card figure{position:relative;margin:0;min-height:100%;overflow:hidden;background:#0a0f14}
.product-card figure img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.product-card:hover figure img{transform:scale(1.035)}
.product-card figure>span{position:absolute;left:18px;top:18px;background:rgba(6,10,14,.78);color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:9px 12px;font-family:'DM Mono';font-size:9px;letter-spacing:.08em}
.product-card-body{padding:36px 34px 32px;display:flex;flex-direction:column}
.product-card-body h2{font-size:clamp(31px,2.7vw,45px);line-height:1;letter-spacing:-.04em;margin:16px 0 18px}
.product-card-body>p{font-size:15px;line-height:1.65;color:#62707a}
.product-card ul{list-style:none;padding:0;margin:26px 0;display:grid;gap:0;border-top:1px solid var(--line-dark)}
.product-card li{padding:12px 0 12px 21px;border-bottom:1px solid var(--line-dark);font-size:13px;position:relative;color:#2c3942}
.product-card li::before{content:'↗';position:absolute;left:0;color:var(--blue);font-size:10px;top:14px}
.product-fit{margin-top:auto;padding:18px 0 20px}
.product-fit>span{font-family:'DM Mono';font-size:9px;letter-spacing:.1em;color:#81909a}
.product-fit p{font-size:13px;line-height:1.55;color:#53616b;margin:7px 0 0}
.product-foundation{padding:var(--section-space) 0}
.product-foundation-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.14)}
.product-foundation-grid article{padding:32px 26px 52px 0;border-right:1px solid rgba(255,255,255,.14)}
.product-foundation-grid article+article{padding-left:26px}
.product-foundation-grid article:last-child{border-right:0}
.product-foundation-grid span{font-family:'DM Mono';font-size:10px;color:var(--cyan)}
.product-foundation-grid h3{font-size:27px;line-height:1.08;margin:48px 0 16px}
.product-foundation-grid p{color:#94a2ac;font-size:14px;line-height:1.6}

.home-insights{padding:var(--section-space) 0}
.home-insights-head{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end;margin-bottom:52px}
.home-insights-head h2{font-size:var(--display-lg);line-height:.94;letter-spacing:-.05em;margin:16px 0 0}
.home-insights-head>div:last-child{max-width:480px;justify-self:end}
.home-insights-head p{color:#66747f;font-size:15px;line-height:1.65;margin-bottom:18px}
.home-insights-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.home-insight-card{border:1px solid var(--line-dark);border-radius:22px;overflow:hidden;background:#fff;display:flex;flex-direction:column;min-width:0}
.home-insight-card figure{margin:0;position:relative;height:210px;overflow:hidden;background:#0a0f14}
.home-insight-card figure img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.home-insight-card:hover figure img{transform:scale(1.035)}
.home-insight-card figure span{position:absolute;left:12px;bottom:12px;background:rgba(6,10,14,.8);color:#fff;border-radius:999px;padding:7px 10px;font-family:'DM Mono';font-size:8px;letter-spacing:.08em}
.home-insight-card>div{padding:22px;display:flex;flex-direction:column;flex:1}
.home-insight-card h3{font-size:clamp(21px,1.7vw,27px);line-height:1.08;letter-spacing:-.035em;margin:13px 0 28px}
.home-insight-card .arrow-link{margin-top:auto;font-size:12px}

.partner-production{padding:var(--section-space) 0}
.partner-production-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:center}
.partner-production h2{font-size:clamp(48px,5.5vw,86px);line-height:.95;letter-spacing:-.052em;margin:18px 0 28px}
.partner-production p{color:#9daab4;max-width:760px;font-size:16px;line-height:1.7}
.partner-service-list{border-top:1px solid rgba(255,255,255,.14)}
.partner-service-list a{display:flex;justify-content:space-between;gap:20px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,.14);font-size:19px;color:#f3f6f8}
.partner-service-list a:hover{color:var(--cyan)}
.partner-service-list b{font-weight:400;color:var(--cyan)}
.service-partner-showcase{padding:var(--section-space) 0}
.partner-video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.partner-video-grid>a{min-height:300px;border:1px solid rgba(255,255,255,.14);border-radius:24px;padding:30px;display:flex;flex-direction:column;background:linear-gradient(150deg,rgba(255,255,255,.04),rgba(255,255,255,.01));transition:.25s}
.partner-video-grid>a:hover{transform:translateY(-4px);border-color:rgba(72,194,255,.5)}
.partner-video-grid h3{font-size:31px;line-height:1.05;margin:54px 0 16px}
.partner-video-grid p{color:#96a4ae;font-size:14px;line-height:1.6}
.partner-video-grid b{margin-top:auto;color:var(--cyan);font-size:12px}
.partner-credit{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.14);display:flex;justify-content:space-between;gap:24px;font-family:'DM Mono';font-size:10px;letter-spacing:.08em;color:#7d8c97}
.partner-credit a{color:#fff}

@media(max-width:1180px){
  .product-grid{grid-template-columns:1fr}.product-card{min-height:520px}.home-insights-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .products-hero{min-height:auto;padding-top:130px}.products-hero-grid,.products-intro-grid,.partner-production-grid,.home-insights-head{grid-template-columns:1fr}.products-hero aside{border-left:0;border-top:1px solid rgba(255,255,255,.14);padding:28px 0 0}.product-card{grid-template-columns:1fr;min-height:0}.product-card figure{height:380px}.product-foundation-grid{grid-template-columns:1fr 1fr}.product-foundation-grid article:nth-child(2){border-right:0}.product-foundation-grid article{border-bottom:1px solid rgba(255,255,255,.14)}.home-insights-head>div:last-child{justify-self:start}.partner-video-grid{grid-template-columns:1fr}.partner-credit{flex-direction:column}
}
@media(max-width:520px){
  .products-hero h1{font-size:53px}.products-intro h2{font-size:44px}.product-card figure{height:300px}.product-card-body{padding:26px 22px}.product-card-body h2{font-size:32px}.product-foundation-grid,.home-insights-grid{grid-template-columns:1fr}.product-foundation-grid article{border-right:0;padding:26px 0 38px}.product-foundation-grid article+article{padding-left:0}.home-insight-card figure{height:230px}.partner-production h2{font-size:46px}.partner-video-grid h3{font-size:28px}
}

/* =========================================================
   PRODUCT SYSTEM — FINAL TYPOGRAPHY + DETAIL PAGES
   Aligns with the main site scale and removes oversized product UI.
   ========================================================= */
.products-hero{padding:calc(var(--header-h) + 72px) 0 92px;min-height:auto}
.products-hero-grid{grid-template-columns:minmax(0,1.35fr) minmax(240px,.45fr);align-items:end}
.products-hero h1{font-size:clamp(52px,5.8vw,94px);line-height:.91;letter-spacing:-.055em;margin:20px 0 28px;max-width:980px}
.products-hero p{font-size:16px;line-height:1.65;max-width:700px}
.products-hero aside{padding:18px 0 18px 30px}
.products-hero aside strong{font-size:clamp(64px,7vw,104px);margin:20px 0 16px}
.products-intro{padding:var(--section-space-tight) 0 72px}
.products-intro-grid{grid-template-columns:.42fr 1.58fr;gap:64px}
.products-intro h2{font-size:var(--display-lg);line-height:.94;letter-spacing:-.05em;margin:0 0 26px;max-width:980px}
.products-intro p{font-size:16px;line-height:1.68}
.products-suite{padding:0 0 var(--section-space)}
.product-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
a.product-card{display:flex;flex-direction:column;min-height:100%;border-radius:22px;color:inherit;text-decoration:none;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
a.product-card:hover{transform:translateY(-4px);border-color:#b8c7d1;box-shadow:0 18px 45px rgba(13,29,40,.08)}
.product-card figure{height:210px;min-height:210px}
.product-card figure>span{left:12px;top:12px;padding:7px 10px;font-size:8px}
.product-card-body{padding:23px 21px 20px;display:flex;flex:1;flex-direction:column}
.product-card-body h2{font-size:clamp(21px,1.7vw,27px);line-height:1.06;letter-spacing:-.035em;margin:12px 0 14px}
.product-card-body>p{font-size:13px;line-height:1.62;color:#62707a;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.product-card-foot{margin-top:auto;padding-top:24px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line-dark);font-family:'DM Mono';font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:#24343e}
.product-card-foot b{font-size:15px;font-weight:400;color:var(--blue)}

.product-detail-hero{padding:calc(var(--header-h) + 68px) 0 88px}
.product-detail-hero-grid{display:grid;grid-template-columns:1fr .78fr;gap:clamp(48px,7vw,105px);align-items:center}
.product-detail-hero .crumb{display:flex;gap:10px;align-items:center;color:#7f8d97;font-family:'DM Mono';font-size:9px;letter-spacing:.08em;margin-bottom:34px;text-transform:uppercase}
.product-detail-hero .crumb a{color:#fff}
.product-detail-hero h1{font-size:clamp(52px,5.8vw,94px);line-height:.91;letter-spacing:-.055em;margin:17px 0 26px;max-width:900px}
.product-detail-hero h1>span{color:var(--cyan)}
.product-detail-hero p{font-size:17px;line-height:1.65;color:#a0adb7;max-width:700px}
.product-detail-hero figure{height:min(68vh,700px);min-height:520px;margin:0;position:relative;overflow:hidden;border-radius:120px 24px 120px 24px;background:#101820}
.product-detail-hero figure img{width:100%;height:100%;object-fit:cover}
.product-detail-hero figure span{position:absolute;left:18px;bottom:18px;background:rgba(5,9,13,.78);border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#fff;padding:8px 11px;font-family:'DM Mono';font-size:8px;letter-spacing:.08em}

.product-detail-overview{padding:var(--section-space) 0}
.product-detail-overview-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(55px,8vw,130px);align-items:start}
.product-detail-overview aside{position:sticky;top:110px}
.product-detail-overview h2,.product-video-head h2,.product-booking h2{font-size:var(--display-lg);line-height:.94;letter-spacing:-.05em;margin:18px 0 0}
.product-lede{font-size:clamp(20px,2vw,28px);line-height:1.38;letter-spacing:-.02em;color:#22313a;margin:0 0 46px;max-width:820px}
.product-module-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line-dark)}
.product-module-grid article{padding:25px 24px 31px 0;border-bottom:1px solid var(--line-dark);min-height:145px}
.product-module-grid article:nth-child(even){padding-left:24px;border-left:1px solid var(--line-dark)}
.product-module-grid span{font-family:'DM Mono';font-size:9px;color:var(--blue)}
.product-module-grid h3{font-size:22px;line-height:1.13;letter-spacing:-.025em;margin:30px 0 0;max-width:280px}
.product-fit-detail{margin-top:38px;padding:24px 0 0;border-top:1px solid var(--line-dark);display:grid;grid-template-columns:150px 1fr;gap:30px}
.product-fit-detail p{margin:0;color:#5d6b74;font-size:14px;line-height:1.65;max-width:680px}

.product-video-section{padding:var(--section-space) 0}
.product-video-head{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:end;margin-bottom:48px}
.product-video-head>p{color:#94a3ad;font-size:15px;line-height:1.68;max-width:520px;justify-self:end}
.product-video-frame{position:relative;border-radius:26px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#070b0f}
.product-video-frame video{width:100%;aspect-ratio:16/9;display:block;object-fit:cover;background:#070b0f}
.product-video-caption{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:14px 18px;border-top:1px solid rgba(255,255,255,.12);font-family:'DM Mono';font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:#8e9ca6}
.product-video-caption span{color:#fff}
.product-video-caption b{font-weight:400;color:var(--cyan)}

.product-booking{padding:var(--section-space) 0}
.product-booking-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(60px,9vw,140px);align-items:start}
.product-booking-grid>div:first-child{position:sticky;top:110px}
.product-booking-grid>div:first-child>p{font-size:15px;line-height:1.68;color:#63717b;max-width:570px;margin:28px 0 0}
.product-booking-points{margin-top:34px;border-top:1px solid var(--line-dark)}
.product-booking-points span{display:block;padding:14px 0;border-bottom:1px solid var(--line-dark);font-size:13px;color:#34424c}
.product-booking-form{background:#f5f8fa;border:1px solid var(--line-dark);border-radius:24px;padding:32px;display:grid;gap:18px}
.product-booking-form label{display:grid;gap:8px}
.product-booking-form label>span{font-family:'DM Mono';font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:#52616c}
.product-booking-form input,.product-booking-form textarea{width:100%;border:1px solid #ced8df;background:#fff;border-radius:12px;padding:14px 15px;font:inherit;color:#111b22;outline:none;transition:border-color .2s,box-shadow .2s}
.product-booking-form input:focus,.product-booking-form textarea:focus{border-color:#5db9ea;box-shadow:0 0 0 3px rgba(58,170,231,.1)}
.product-booking-form textarea{resize:vertical;min-height:130px}
.product-booking-form .pill{justify-self:start;border:0;cursor:pointer}
.product-booking-form .form-privacy{font-size:11px;color:#74828c;margin:0}

/* SoftMatrix blocks should join the preceding content without a dead top gap. */
.partner-production,.service-partner-showcase{padding-top:0}

@media(max-width:1180px){
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-card figure{height:250px;min-height:250px}
}
@media(max-width:820px){
  .products-hero-grid,.products-intro-grid,.product-detail-hero-grid,.product-detail-overview-grid,.product-video-head,.product-booking-grid{grid-template-columns:1fr}
  .products-hero{padding-top:128px}
  .products-hero aside{border-left:0;border-top:1px solid rgba(255,255,255,.14);padding:26px 0 0}
  .products-intro{padding-top:80px}
  .product-detail-hero{padding-top:128px}
  .product-detail-hero figure{height:520px;min-height:0;border-radius:80px 20px 80px 20px}
  .product-detail-overview aside,.product-booking-grid>div:first-child{position:relative;top:auto}
  .product-video-head>p{justify-self:start}
  .product-booking-form{padding:26px}
}
@media(max-width:520px){
  .products-hero h1,.product-detail-hero h1{font-size:clamp(42px,10.5vw,56px);line-height:.95}
  .products-intro h2,.product-detail-overview h2,.product-video-head h2,.product-booking h2{font-size:48px}
  .product-grid{grid-template-columns:1fr}
  .product-card figure{height:240px;min-height:240px}
  .product-card-body h2{font-size:24px}
  .product-detail-hero figure{height:380px;border-radius:58px 16px 58px 16px}
  .product-detail-hero p{font-size:15px}
  .product-module-grid{grid-template-columns:1fr}
  .product-module-grid article,.product-module-grid article:nth-child(even){padding:22px 0;border-left:0}
  .product-fit-detail{grid-template-columns:1fr;gap:12px}
  .product-video-caption{align-items:flex-start;flex-direction:column}
  .product-booking-form{padding:22px}
}

/* =========================================================
   V34 — compact desktop header content-fit fix
   Products increased the menu width; the previous fixed 710px
   sticky shell compressed Insights + language. Keep every item
   on one line and size the floating pair from its real content.
   ========================================================= */
@media (min-width:1181px){
  .site-header.is-mini-sticky .header-shell{
    width:max-content!important;
    max-width:calc(100vw - 36px)!important;
    min-width:0!important;
    justify-content:flex-end!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster{
    flex:0 0 auto!important;
    width:max-content!important;
    max-width:calc(100vw - 106px)!important;
    padding:0 10px 0 16px!important;
    gap:10px!important;
    overflow:visible!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster .desktop-nav{
    flex:0 0 auto!important;
    width:max-content!important;
    gap:18px!important;
    white-space:nowrap!important;
  }
  .site-header.is-mini-sticky .nav-link,
  .site-header.is-mini-sticky .nav-services,
  .site-header.is-mini-sticky .language-control,
  .site-header.is-mini-sticky .header-contact{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
  .site-header.is-mini-sticky .header-actions{
    flex:0 0 auto!important;
    min-width:max-content!important;
    gap:8px!important;
  }
  .site-header.is-mini-sticky .language-control select{
    width:auto!important;
    min-width:34px!important;
    padding:8px 3px!important;
  }
}

@media (min-width:1181px) and (max-width:1320px){
  .site-header.is-mini-sticky .header-shell{
    width:max-content!important;
    max-width:calc(100vw - 28px)!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster{
    max-width:calc(100vw - 94px)!important;
    padding-left:12px!important;
    padding-right:8px!important;
    gap:7px!important;
  }
  .site-header.is-mini-sticky .header-nav-cluster .desktop-nav{gap:14px!important}
  .site-header.is-mini-sticky .nav-link{font-size:11.5px!important}
  .site-header.is-mini-sticky .header-contact{padding:11px 13px!important;font-size:11px!important}
}

/* =========================================================
   FINAL PRODUCTION QA — TYPOGRAPHY + RESPONSIVE CONSISTENCY
   Authoritative last-pass rules. Keep page families visually
   aligned without flattening the intentional homepage hierarchy.
   ========================================================= */
:root{
  --qa-page-h1:clamp(50px,5.7vw,92px);
  --qa-section-h2:clamp(42px,4.6vw,72px);
  --qa-card-h3:clamp(24px,2.15vw,34px);
  --qa-copy:clamp(15px,.22vw + 14px,16px);
}
body{font-size:var(--qa-copy)}

/* Primary page titles */
.inner-hero h1,
.blog-hero h1,
.products-hero h1,
.product-detail-hero h1,
.service-detail-title h1,
.contact-copy-new h1{font-size:var(--qa-page-h1)!important;line-height:.94!important;letter-spacing:-.052em!important}
.project-hero-copy h1{font-size:clamp(54px,6.2vw,102px)!important;line-height:.92!important}
.home-hero h1{font-size:clamp(62px,7vw,112px)!important;line-height:.9!important}

/* Major section headings */
.intro-main h2,
.service-story-head h2,
.work-rail-head h2,
.section-split-heading h2,
.process-heading h2,
.stack-heading h2,
.showreel-head h2,
.capability-page-copy h2,
.products-intro h2,
.product-detail-overview h2,
.product-video-head h2,
.product-booking h2,
.partner-production h2,
.brand-cta-copy h2{font-size:var(--qa-section-h2)!important;line-height:.97!important;letter-spacing:-.047em!important}

/* Secondary editorial headings */
.capability-sticky h2,
.service-narrative aside h2,
.guide-side h2,
.field-guide-grid aside h2,
.project-story-grid aside h2,
.about-editorial h2,
.faq-grid h2{font-size:clamp(36px,3.7vw,58px)!important;line-height:1!important}

/* Card / chapter titles */
.service-panel-copy h3,
.capability-chapters h3,
.stack-project h3,
.belief-list h3,
.guide-articles h3,
.project-story-grid article h3,
.field-guide-grid article h3{font-size:var(--qa-card-h3)!important;line-height:1.06!important}
.product-card-body h2{font-size:clamp(21px,1.65vw,26px)!important;line-height:1.08!important}
.blog-grid .blog-card h2{font-size:clamp(20px,1.55vw,24px)!important;line-height:1.12!important}
.home-insight-card h3{font-size:clamp(20px,1.55vw,24px)!important;line-height:1.12!important}

/* Body copy rhythm */
.inner-hero p,.products-hero p,.product-detail-hero p,.service-detail-title>p,.contact-copy-new>p{font-size:16px!important;line-height:1.68!important}
.product-card-body>p,.blog-card>div>p:not(.micro),.home-insight-card>div>p:not(.micro){line-height:1.62!important}

/* Grid safety */
.product-grid,.home-insights-grid,.blog-grid,.portfolio-masonry,.partner-video-grid{min-width:0}
.product-card,.home-insight-card,.blog-card,.portfolio-card-new,.partner-video-grid>a{min-width:0}
.product-card h2,.blog-card h2,.home-insight-card h3,.portfolio-card-new h2{overflow-wrap:anywhere}

@media(max-width:1180px){
  :root{--qa-page-h1:clamp(46px,7.5vw,68px);--qa-section-h2:clamp(38px,6vw,58px);--qa-card-h3:clamp(24px,3.2vw,32px)}
  .home-hero h1{font-size:clamp(54px,8.8vw,82px)!important}
  .project-hero-copy h1{font-size:clamp(50px,8vw,76px)!important}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .home-insights-grid,.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media(max-width:820px){
  :root{--qa-page-h1:clamp(40px,9vw,52px);--qa-section-h2:clamp(34px,8vw,46px);--qa-card-h3:clamp(25px,6.5vw,32px)}
  .home-hero h1{font-size:clamp(48px,11vw,68px)!important}
  .project-hero-copy h1{font-size:clamp(42px,10vw,58px)!important}
  .product-detail-hero-grid,.product-detail-overview-grid,.product-video-head,.product-booking-grid{grid-template-columns:1fr!important}
  .product-detail-overview aside,.product-booking-grid>div:first-child{position:relative!important;top:auto!important}
  .product-detail-hero figure{min-height:0!important;height:auto!important;aspect-ratio:4/3!important}
  .product-video-frame video{aspect-ratio:16/9!important}
  .service-panel-copy h3{font-size:clamp(28px,7vw,36px)!important}
  .partner-video-grid{grid-template-columns:1fr!important}
}

@media(max-width:520px){
  :root{--qa-page-h1:clamp(38px,11vw,48px);--qa-section-h2:clamp(32px,9vw,40px);--qa-card-h3:clamp(24px,7vw,30px)}
  .home-hero h1{font-size:clamp(44px,12.5vw,58px)!important}
  .project-hero-copy h1{font-size:clamp(40px,11vw,52px)!important}
  .inner-hero p,.products-hero p,.product-detail-hero p,.service-detail-title>p,.contact-copy-new>p{font-size:15px!important}
  .product-grid,.home-insights-grid,.blog-grid{grid-template-columns:1fr!important}
  .product-card figure,.home-insight-card figure,.blog-card figure{height:auto!important;aspect-ratio:4/3!important}
  .product-card-body h2{font-size:23px!important}
  .blog-grid .blog-card h2,.home-insight-card h3{font-size:21px!important}
  .product-booking-form{padding:20px!important}
}

/* Final footer expansion: newsletter + full service directory. */
.footer-newsletter{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.72fr);gap:clamp(40px,7vw,110px);align-items:end;padding:70px 0;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.footer-newsletter h2{font-size:clamp(38px,4.4vw,68px);line-height:.98;letter-spacing:-.045em;margin:16px 0 18px;max-width:760px}
.footer-newsletter h2 em{color:#7e8b96}.footer-newsletter p{color:#9aa8b3;max-width:620px}
.footer-newsletter-form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:start;position:relative}
.footer-newsletter-form input{width:100%;min-height:54px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);color:#fff;border-radius:999px;padding:0 20px;outline:none}
.footer-newsletter-form input:focus{border-color:#47afe8;box-shadow:0 0 0 3px rgba(71,175,232,.12)}
.footer-newsletter-form button{min-height:54px;border:0;border-radius:999px;padding:0 22px;background:#349bdb;color:#fff;font-weight:700;cursor:pointer;white-space:nowrap}
.newsletter-status{grid-column:1/-1;margin:4px 8px 0!important;font-size:13px!important}.newsletter-status.success{color:#8de0b2}.newsletter-status.error{color:#ff9e9e}
.footer-grid-main{grid-template-columns:.7fr 2.2fr .85fr .7fr;gap:clamp(28px,4vw,72px)}
.footer-services-all{min-width:0}.footer-service-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 22px}.footer-service-links a{font-size:12px;line-height:1.35;color:#aab5bd}.footer-service-links a:hover{color:#fff}
@media(max-width:1180px){.footer-newsletter{grid-template-columns:1fr}.footer-grid-main{grid-template-columns:1fr 2fr}.footer-service-links{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.footer-newsletter{padding:48px 0}.footer-newsletter h2{font-size:42px}.footer-newsletter-form{grid-template-columns:1fr}.footer-newsletter-form button{width:100%}.footer-grid-main{grid-template-columns:1fr}.footer-service-links{grid-template-columns:1fr 1fr;gap:9px 14px}}
@media(max-width:430px){.footer-service-links{grid-template-columns:1fr}}


/* Compact footer newsletter + visitor live chat */
.footer-follow-column{gap:18px!important}.footer-mini-newsletter{display:flex;flex-direction:column;gap:9px;margin-bottom:12px}.footer-mini-newsletter .micro{margin-bottom:0!important}.footer-mini-newsletter-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:7px;max-width:260px}.footer-mini-newsletter input{width:100%;height:38px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.035);color:#fff;padding:0 13px;font-size:11px;outline:none}.footer-mini-newsletter input:focus{border-color:rgba(71,175,232,.8);box-shadow:0 0 0 3px rgba(71,175,232,.1)}.footer-mini-newsletter button{height:38px;width:38px;border-radius:50%;border:0;background:#339dde;color:#fff;font-size:15px;cursor:pointer}.footer-mini-newsletter .newsletter-status{font-size:10px!important;margin:0!important;line-height:1.35}.footer-grid-main{align-items:start}.footer-newsletter{display:none!important}
.live-chat{position:fixed;right:22px;bottom:22px;z-index:9996;font-family:'Manrope',sans-serif}.live-chat-launcher{height:52px;min-width:52px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:#101920;color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.32);display:flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;cursor:pointer}.live-chat-launcher:hover{transform:translateY(-2px)}.live-chat-dot{width:8px;height:8px;border-radius:50%;background:#72e2a4;box-shadow:0 0 0 4px rgba(114,226,164,.1)}.live-chat-icon{font-size:18px;color:#63c5ff}.live-chat-label{font-size:13px;font-weight:700}.live-chat-panel{position:absolute;right:0;bottom:64px;width:min(360px,calc(100vw - 28px));height:min(520px,calc(100vh - 110px));border:1px solid rgba(255,255,255,.13);border-radius:24px;background:rgba(8,16,22,.97);box-shadow:0 30px 90px rgba(0,0,0,.45);overflow:hidden;display:flex;flex-direction:column;opacity:0;transform:translateY(12px) scale(.98);pointer-events:none;transition:.2s ease}.live-chat.is-open .live-chat-panel{opacity:1;transform:none;pointer-events:auto}.live-chat-head{padding:16px 16px 14px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,rgba(49,157,222,.13),transparent)}.live-chat-head>div{display:flex;align-items:center;gap:10px}.live-chat-avatar{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#339dde;color:#fff;font-weight:800}.live-chat-head strong{display:block;font-size:14px}.live-chat-head small{display:flex;align-items:center;gap:5px;color:#91a0aa;font-size:10px;margin-top:2px}.live-chat-head small i{width:6px;height:6px;border-radius:50%;background:#72e2a4}.live-chat-head button{border:0;background:transparent;color:#8f9ca5;font-size:24px;cursor:pointer}.live-chat-messages{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:9px;scrollbar-width:thin}.live-chat-bubble{max-width:84%;border-radius:16px;padding:10px 12px;font-size:12px;line-height:1.45;white-space:pre-wrap;word-break:break-word}.live-chat-bubble.is-admin{align-self:flex-start;background:#17242c;color:#e9f3f8;border-bottom-left-radius:6px}.live-chat-bubble.is-visitor{align-self:flex-end;background:#349bdb;color:#fff;border-bottom-right-radius:6px}.live-chat-time{display:block;font-size:8px;opacity:.58;margin-top:4px}.live-chat-form{display:grid;grid-template-columns:1fr 42px;gap:8px;padding:12px 12px 8px;border-top:1px solid rgba(255,255,255,.08)}.live-chat-form textarea{resize:none;max-height:92px;min-height:42px;border:1px solid rgba(255,255,255,.12);border-radius:16px;background:rgba(255,255,255,.05);color:#fff;padding:11px 12px;font:inherit;font-size:12px;outline:none}.live-chat-form textarea:focus{border-color:#399fdc}.live-chat-form button{width:42px;height:42px;border-radius:14px;border:0;background:#349bdb;color:#fff;font-size:18px;cursor:pointer}.live-chat-note{font-size:8px;color:#65737d;padding:0 15px 10px;margin:0}.live-chat.has-unread .live-chat-launcher:after{content:'';position:absolute;right:3px;top:1px;width:10px;height:10px;border-radius:50%;background:#ff6a75;border:2px solid #101920}
@media(max-width:760px){.live-chat{right:14px;bottom:14px}.live-chat-launcher{height:48px;padding:0 14px}.live-chat-panel{position:fixed;left:10px;right:10px;bottom:72px;width:auto;height:min(560px,calc(100vh - 94px));border-radius:22px}.footer-mini-newsletter-row{max-width:100%}}

/* Final footer polish + chat identity gate */
.footer-mini-idea{display:grid;gap:6px;padding:13px 14px;margin-bottom:4px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:linear-gradient(135deg,rgba(64,169,225,.09),rgba(255,255,255,.025));max-width:260px}
.footer-mini-idea span{font:8px 'DM Mono',monospace;letter-spacing:.12em;color:#6f8594}
.footer-mini-idea a{color:#eaf7ff;text-decoration:none;font-size:11px;font-weight:700}.footer-mini-idea a:hover{color:#68c8ff}
.live-chat-icon{width:25px;height:25px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#08131c}.live-chat-icon img{display:block;width:100%;height:100%;object-fit:contain}
.live-chat-avatar{overflow:hidden;background:#07121a!important;padding:5px}.live-chat-avatar img{display:block;width:100%;height:100%;object-fit:contain}
.live-chat-profile{display:flex;flex-direction:column;gap:12px;padding:20px 18px 18px;overflow:auto}.live-chat-profile[hidden],.live-chat-conversation[hidden]{display:none!important}
.live-chat-profile .micro{font-size:8px!important;color:#60bce9;margin:0}.live-chat-profile h3{margin:0;color:#fff;font-size:22px;letter-spacing:-.045em}.live-chat-profile>p{margin:0 0 2px;color:#92a3ad;font-size:11px;line-height:1.55}
.live-chat-profile label{display:grid;gap:6px;color:#c8d6de;font-size:9px;font-weight:700}.live-chat-profile input{height:42px;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:rgba(255,255,255,.045);color:#fff;padding:0 12px;outline:none;font-size:12px}.live-chat-profile input:focus{border-color:#399fdc;box-shadow:0 0 0 3px rgba(57,159,220,.1)}
.live-chat-profile button{margin-top:2px;height:43px;border:0;border-radius:13px;background:linear-gradient(120deg,#298fcf,#55b9e9);color:#fff;font-weight:800;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;padding:0 14px}.live-chat-profile button:disabled{opacity:.6;cursor:wait}
.live-chat-profile>small{color:#657781;font-size:8px;line-height:1.45}.live-chat-profile-error{margin:0!important;color:#ff9f9f!important;font-size:9px!important}.live-chat-conversation{min-height:0;flex:1;display:flex;flex-direction:column}
@media(max-width:760px){.footer-mini-idea{max-width:100%}.live-chat-profile{padding:18px 16px}}

.live-chat-optional{float:right;color:#6c7d87;font-size:8px;font-weight:600}.live-chat-profile label:has(.live-chat-optional){position:relative}

/* Final chat launcher polish — requested compact logo treatment */
.live-chat-launcher{
  display:block;
  padding:0;
}
.live-chat-launcher .live-chat-dot{
  display:none!important;
}
.live-chat-launcher .live-chat-icon{
  margin:0 auto -7px auto;
  position:relative;
  z-index:1;
  box-shadow:0 0 0 0 rgba(52,155,219,.55);
  animation:liveChatLogoPulse 1.9s ease-out infinite;
}
.live-chat-launcher .live-chat-label{
  display:block;
  font-size:12px;
  line-height:1;
  text-align:center;
  position:relative;
  z-index:2;
}
@keyframes liveChatLogoPulse{
  0%{box-shadow:0 0 0 0 rgba(52,155,219,.58);filter:drop-shadow(0 0 0 rgba(52,155,219,0))}
  55%{box-shadow:0 0 0 9px rgba(52,155,219,0);filter:drop-shadow(0 0 5px rgba(52,155,219,.34))}
  100%{box-shadow:0 0 0 0 rgba(52,155,219,0);filter:drop-shadow(0 0 0 rgba(52,155,219,0))}
}
@media (prefers-reduced-motion:reduce){
  .live-chat-launcher .live-chat-icon{animation:none}
}

/* Final launcher correction: pulse lives outside the button, not on the logo */
.live-chat-launcher{
  position:relative;
  width:52px;
  min-width:52px;
  height:52px;
  padding:0!important;
  display:block!important;
  overflow:visible;
  isolation:isolate;
}
.live-chat-launcher::before{
  content:'';
  position:absolute;
  inset:-1px;
  border:1.5px solid rgba(52,155,219,.72);
  border-radius:inherit;
  pointer-events:none;
  z-index:-1;
  opacity:0;
  transform:scale(1);
  animation:liveChatButtonPulse 2s ease-out infinite;
}
.live-chat-launcher .live-chat-icon{
  width:25px;
  height:25px;
  margin:4px auto -4px auto!important;
  position:relative;
  z-index:2;
  box-shadow:none!important;
  filter:none!important;
  animation:none!important;
}
.live-chat-launcher .live-chat-label{
  display:block;
  margin:0;
  font-size:12px!important;
  line-height:14px;
  text-align:center;
  position:relative;
  z-index:2;
  color:#fff;
}
.live-chat-launcher:hover::before{
  border-color:rgba(81,187,238,.95);
}
@keyframes liveChatButtonPulse{
  0%{opacity:.58;transform:scale(1);box-shadow:0 0 0 0 rgba(52,155,219,.18)}
  70%{opacity:0;transform:scale(1.34);box-shadow:0 0 0 7px rgba(52,155,219,0)}
  100%{opacity:0;transform:scale(1.34);box-shadow:0 0 0 0 rgba(52,155,219,0)}
}
@media(max-width:760px){
  .live-chat-launcher{width:48px;min-width:48px;height:48px;padding:0!important}
  .live-chat-launcher .live-chat-icon{width:23px;height:23px;margin:3px auto -4px auto!important}
  .live-chat-launcher .live-chat-label{font-size:11px!important;line-height:13px}
}
@media (prefers-reduced-motion:reduce){
  .live-chat-launcher::before{animation:none;opacity:.35;transform:none}
}


/* Final contact inquiry experience */
.contact-form-card{box-shadow:0 30px 80px rgba(0,0,0,.16);overflow:hidden}
.form-card-head{align-items:center}.form-card-head [data-contact-progress]{padding:7px 10px;border:1px solid #dce4e9;border-radius:999px;background:#f8fafb;color:#4e6575!important}
.contact-form-step{display:none;animation:contactStepIn .28s ease both}.contact-form-step.is-active{display:block}
@keyframes contactStepIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.contact-step-intro{display:grid;grid-template-columns:46px 1fr;gap:16px;align-items:start;margin:0 0 26px;padding:0 0 22px;border-bottom:1px solid #e5eaee}
.contact-step-intro>span{width:42px;height:42px;border-radius:14px;background:#09131b;color:#fff;display:grid;place-items:center;font-family:'DM Mono';font-size:11px;letter-spacing:.08em}
.contact-step-intro h3{margin:0 0 5px;font-size:clamp(25px,2.2vw,34px);letter-spacing:-.035em;line-height:1}
.contact-step-intro p{margin:0;color:#7b8993;font-size:13px}
.contact-choice-field{border:0;padding:0;margin:0;min-width:0}.contact-choice-field legend{font-size:12px;font-weight:700;margin-bottom:9px}
.contact-choice-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.contact-choice-card{position:relative!important;display:block!important;cursor:pointer}.contact-choice-card input{position:absolute;opacity:0;pointer-events:none}.contact-choice-card>span{min-height:82px;border:1px solid #d8e0e5;border-radius:14px;padding:14px 38px 14px 14px;background:#f8fafb;display:flex;flex-direction:column;justify-content:center;transition:.2s ease}.contact-choice-card b{font-size:13px;color:#111c24}.contact-choice-card small{font-size:10.5px;color:#82909a;font-weight:500;margin-top:3px}.contact-choice-card i{position:absolute;right:12px;top:12px;width:20px;height:20px;border-radius:50%;border:1px solid #cdd8df;display:grid;place-items:center;font-style:normal;font-size:10px;color:transparent;transition:.2s}.contact-choice-card:hover>span{border-color:#8ccbed;background:#fff}.contact-choice-card input:checked+span{border-color:#43a9df;background:#eef8fd;box-shadow:0 0 0 3px rgba(67,169,223,.1)}.contact-choice-card input:checked~i{background:#289bd8;border-color:#289bd8;color:#fff}
.contact-service-options{display:flex!important;flex-wrap:wrap;gap:9px!important}.contact-check{display:block!important;position:relative}.contact-check input{position:absolute;opacity:0;pointer-events:none}.contact-check span{display:block;padding:10px 13px;border:1px solid #d8e0e5;border-radius:999px;background:#f8fafb;color:#51616c!important;font-size:11.5px!important;font-weight:650!important;cursor:pointer;transition:.2s}.contact-check input:checked+span{background:#0c1821;color:#fff!important;border-color:#0c1821;box-shadow:0 6px 18px rgba(12,24,33,.12)}
.contact-form-buttons{display:flex;gap:10px;align-items:center}.contact-form .pill-text{border:1px solid #dce4e9;border-radius:999px;padding:13px 18px}
@media(max-width:760px){.contact-choice-cards{grid-template-columns:1fr}.contact-step-intro{grid-template-columns:38px 1fr}.contact-step-intro>span{width:36px;height:36px;border-radius:12px}.contact-step-intro h3{font-size:25px}.contact-form-buttons{width:100%;justify-content:space-between}}


/* Final contact-form polish: dark, aligned, stable multi-step card */
.contact-new .contact-form-card{background:linear-gradient(145deg,#101a22 0%,#0a1218 100%);color:#f5f8fa;border:1px solid rgba(255,255,255,.1);box-shadow:0 28px 80px rgba(0,0,0,.28);min-height:620px;display:flex;flex-direction:column}
.contact-new .form-card-head{border-color:rgba(255,255,255,.12)}
.contact-new .form-card-head .micro,.contact-new .form-card-head>span:last-child{color:#98a8b4}
.contact-new .contact-form{flex:1;display:flex;flex-direction:column;margin-top:26px;gap:0}
.contact-new .contact-form-step{min-height:468px;flex:1}
.contact-new .contact-form-step.is-active{display:flex;flex-direction:column}
.contact-new .contact-step-intro{border-color:rgba(255,255,255,.11)}
.contact-new .contact-step-intro h3,.contact-new .contact-form .field-label,.contact-new .contact-choice-card b{color:#f7fafc}
.contact-new .contact-step-intro p,.contact-new .contact-form label>span:not(.field-label),.contact-new .contact-choice-card small,.contact-new .form-submit>span{color:#8fa0ac}
.contact-new .field-row{align-items:start;grid-auto-rows:1fr}
.contact-new .contact-form label,.contact-new .contact-choice-field{align-content:start}
.contact-new .contact-form input,.contact-new .contact-form select,.contact-new .contact-form textarea{background:#121e27;border-color:#283945;color:#eef5f8;min-height:52px}
.contact-new .contact-form textarea{min-height:132px}
.contact-new .contact-form input::placeholder,.contact-new .contact-form textarea::placeholder{color:#6f828f}
.contact-new .contact-form select{color-scheme:dark}
.contact-new .contact-choice-card>span{background:#121e27;border-color:#283945;min-height:86px}
.contact-new .contact-choice-card:hover>span{background:#162631;border-color:#4aa8db}
.contact-new .contact-choice-card input:checked+span{background:#102d3e;border-color:#40ace5;box-shadow:0 0 0 3px rgba(64,172,229,.1)}
.contact-new .contact-choice-card i{border-color:#425461;background:#13212a}
.contact-new .contact-choice-card input:checked~i{background:#2c9ed9;border-color:#2c9ed9}
.contact-new .form-submit{margin-top:auto;padding-top:22px;border-top:1px solid rgba(255,255,255,.08)}
.contact-new .pill-text{color:#dce8ee}
.contact-new .form-notice{margin:18px 0 0}
@media(max-width:1180px){.contact-new .contact-form-card{min-height:0}.contact-new .contact-form-step{min-height:0}.contact-new .contact-form-step.is-active{display:block}.contact-new .form-submit{margin-top:24px}}
@media(max-width:760px){.contact-new .field-row{grid-template-columns:1fr}.contact-new .contact-form-card{padding:20px}.contact-new .contact-choice-cards{grid-template-columns:1fr}.contact-new .form-submit{border-top:0}}

/* FINAL CONTACT FORM REDESIGN — fixed desktop height, branded validation, stable steps */
.contact-new .contact-form-card{
  height:700px!important;min-height:700px!important;max-height:700px!important;
  padding:28px 30px!important;border-radius:28px!important;
  background:linear-gradient(160deg,#0b151d 0%,#0e1b24 52%,#091118 100%)!important;
  border:1px solid rgba(121,174,204,.22)!important;
  box-shadow:0 32px 90px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.contact-new .form-card-head{padding:0 0 20px!important;border-bottom:1px solid rgba(255,255,255,.09)!important;align-items:center}
.contact-new .form-card-head .micro{letter-spacing:.18em;color:#8ba1b0}
.contact-new .contact-form{margin-top:22px!important;display:flex!important;flex:1;min-height:0}
.contact-new .contact-form-step{display:none!important;width:100%;height:100%;min-height:0!important;overflow:hidden}
.contact-new .contact-form-step.is-active{display:flex!important;flex-direction:column}
.contact-new .contact-step-intro{display:flex!important;gap:14px!important;align-items:center!important;padding:0 0 18px!important;margin:0 0 20px!important}
.contact-new .contact-step-intro>span{flex:0 0 40px;width:40px;height:40px;border-radius:50%!important;background:linear-gradient(145deg,#173044,#0b1822)!important;border:1px solid rgba(93,184,233,.24);color:#6cc8fa!important}
.contact-new .contact-step-intro h3{font-size:28px!important;line-height:1.05!important;letter-spacing:-.035em!important;margin:0 0 4px!important}
.contact-new .contact-step-intro p{font-size:12px!important;color:#8295a3!important}
.contact-new .field-row{gap:14px!important}
.contact-new .contact-form label,.contact-new .contact-choice-field{font-size:11px!important;gap:7px!important}
.contact-new .contact-form input,.contact-new .contact-form select,.contact-new .contact-form textarea{
  background:#101d26!important;border:1px solid #263b49!important;color:#eef6fb!important;
  border-radius:14px!important;padding:13px 14px!important;box-shadow:none!important;
}
.contact-new .contact-form input,.contact-new .contact-form select{height:50px!important}
.contact-new .contact-form textarea{min-height:104px!important;max-height:126px!important;resize:none!important}
.contact-new .contact-form input::placeholder,.contact-new .contact-form textarea::placeholder{color:#647986!important}
.contact-new .contact-form input:focus,.contact-new .contact-form select:focus,.contact-new .contact-form textarea:focus{border-color:#42b5ee!important;box-shadow:0 0 0 3px rgba(66,181,238,.10)!important}
.contact-new .contact-choice-cards{gap:8px!important}
.contact-new .contact-choice-card>span{min-height:70px!important;padding:11px 34px 11px 12px!important;border-radius:13px!important;background:#101d26!important;border-color:#263b49!important}
.contact-new .contact-choice-card b{font-size:12px!important}.contact-new .contact-choice-card small{font-size:9.5px!important;line-height:1.3}
.contact-new .contact-choice-card i{width:18px;height:18px;right:10px;top:10px}
.contact-new .contact-choice-card input:checked+span{background:linear-gradient(145deg,#123249,#102536)!important;border-color:#4dbcf4!important}
.contact-new .contact-service-options{max-height:176px;overflow:auto;padding-right:4px;scrollbar-width:thin}
.contact-new .contact-check span{background:#101d26!important;border-color:#263b49!important;color:#dce8ef!important}
.contact-new .contact-check input:checked+span{background:#153a50!important;border-color:#4dbcf4!important;color:#fff!important}
.contact-new .form-submit{margin-top:auto!important;padding-top:16px!important;border-top:1px solid rgba(255,255,255,.08)!important;min-height:66px;align-items:center!important}
.contact-new .form-submit>span{font-size:10px!important;color:#718693!important}
.contact-new .contact-form-buttons{display:flex;align-items:center;gap:10px;margin-left:auto}
.contact-new .form-submit .pill{min-height:44px;padding:11px 17px!important}
.contact-new .field-error{display:block;color:#ff8f87!important;font-size:10px!important;font-weight:600!important;margin-top:1px}
.contact-new .is-invalid input,.contact-new .is-invalid select,.contact-new .is-invalid textarea{border-color:#e86962!important;box-shadow:0 0 0 3px rgba(232,105,98,.08)!important}
.contact-new .contact-choice-field.is-invalid .contact-choice-card>span,.contact-new .contact-service-field.is-invalid .contact-check span{border-color:#e86962!important}
.contact-new [data-contact-progress]{border:1px solid rgba(115,172,203,.22);border-radius:999px;padding:7px 10px;color:#9bb3c2!important;background:#0d1a23}
@media(max-width:1180px){
  .contact-new .contact-form-card{height:auto!important;min-height:0!important;max-height:none!important}
  .contact-new .contact-form-step{height:auto!important;overflow:visible!important}
  .contact-new .contact-service-options{max-height:none}
}
@media(max-width:760px){
  .contact-new .contact-form-card{padding:18px!important;border-radius:20px!important}
  .contact-new .contact-step-intro h3{font-size:24px!important}
  .contact-new .contact-choice-card>span{min-height:58px!important}
}

/* FINAL PRE-LIVE: Insights load-more + completely redesigned contact inquiry */
.blog-card.is-load-more-hidden{display:none!important}
.blog-load-more-wrap{display:flex;justify-content:center;padding-top:44px}
.blog-load-more{min-width:200px;justify-content:center;gap:10px}
.blog-card.is-load-more-revealed{display:grid}

.contact-new .contact-form-card{
  height:680px!important;min-height:680px!important;max-height:680px!important;
  padding:0!important;overflow:hidden!important;border-radius:30px!important;
  background:#08131b!important;border:1px solid rgba(111,176,211,.22)!important;
  box-shadow:0 36px 100px rgba(0,0,0,.38)!important;
}
.contact-new .form-card-head{
  height:72px;padding:0 28px!important;margin:0!important;display:flex!important;align-items:center!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;background:rgba(255,255,255,.018)!important;
}
.contact-new .form-card-head [data-contact-progress]{margin-left:auto;background:#eaf7ff!important;color:#102430!important;border:0!important;font-size:10px!important;font-weight:700!important}
.contact-new .contact-form{margin:0!important;display:block!important;height:calc(100% - 72px)!important;min-height:0!important}
.contact-new .contact-form-workspace{display:grid;grid-template-columns:170px minmax(0,1fr);height:100%;min-height:0}
.contact-new .contact-step-rail{padding:30px 18px;border-right:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,#0a1720 0%,#071119 100%);display:flex;flex-direction:column;gap:9px}
.contact-new .contact-step-rail-item{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;padding:11px 9px;border-radius:14px;color:#6f8390;transition:.2s ease}
.contact-new .contact-step-rail-item>span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;border:1px solid #243844;font:10px 'DM Mono',monospace;color:#7892a1}
.contact-new .contact-step-rail-item b{display:block;color:#899aa5;font-size:12px;line-height:1.1}
.contact-new .contact-step-rail-item small{display:block;margin-top:3px;font-size:9.5px;color:#5e727f;line-height:1.2}
.contact-new .contact-step-rail-item.is-active{background:#102533;color:#fff}
.contact-new .contact-step-rail-item.is-active>span{background:#34a9e5;border-color:#34a9e5;color:#fff;box-shadow:0 0 0 4px rgba(52,169,229,.10)}
.contact-new .contact-step-rail-item.is-active b{color:#fff}.contact-new .contact-step-rail-item.is-active small{color:#8fb2c6}
.contact-new .contact-step-rail-item.is-complete>span{border-color:#2c7b9f;color:#63c4f2}.contact-new .contact-step-rail-item.is-complete b{color:#c8d6de}
.contact-new .contact-step-rail-note{margin-top:auto;padding:15px 8px 2px}.contact-new .contact-step-rail-note i{display:block;width:24px;height:2px;background:#34a9e5;margin-bottom:10px}.contact-new .contact-step-rail-note p{font-size:9.5px;line-height:1.55;color:#617784;margin:0}
.contact-new .contact-step-stage{height:100%;min-width:0;padding:28px 30px 24px;overflow:hidden}
.contact-new .contact-form-step{display:none!important;height:100%!important;min-height:0!important;overflow:hidden!important}
.contact-new .contact-form-step.is-active{display:flex!important;flex-direction:column!important}
.contact-new .contact-step-intro{display:block!important;padding:0 0 18px!important;margin:0 0 18px!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
.contact-new .contact-step-intro>span{display:none!important}
.contact-new .contact-step-intro h3{font-size:34px!important;line-height:.98!important;letter-spacing:-.045em!important;margin:0 0 7px!important;color:#fff!important}
.contact-new .contact-step-intro p{font-size:12px!important;color:#78909e!important;margin:0!important}
.contact-new .field-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
.contact-new .contact-form label,.contact-new .contact-choice-field,.contact-new .contact-service-field{gap:7px!important}
.contact-new .contact-form .field-label{font-size:10.5px!important;color:#dce8ee!important;font-weight:700!important}
.contact-new .contact-form label>span:not(.field-label),.contact-new .contact-service-field legend>span:not(.field-label){font-size:9.5px!important;color:#718895!important}
.contact-new .contact-form input,.contact-new .contact-form select,.contact-new .contact-form textarea{background:#0d1b24!important;border:1px solid #233845!important;border-radius:12px!important;color:#f3f8fa!important;padding:12px 13px!important}
.contact-new .contact-form input,.contact-new .contact-form select{height:46px!important;min-height:46px!important}
.contact-new .contact-form textarea{min-height:100px!important;max-height:118px!important}
.contact-new .contact-form input:focus,.contact-new .contact-form select:focus,.contact-new .contact-form textarea:focus{border-color:#40b3ec!important;box-shadow:0 0 0 3px rgba(64,179,236,.09)!important}
.contact-new .contact-choice-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.contact-new .contact-choice-card>span{min-height:64px!important;background:#0d1b24!important;border:1px solid #233845!important;border-radius:12px!important;padding:11px 28px 10px 11px!important}
.contact-new .contact-choice-card b{font-size:11.5px!important}.contact-new .contact-choice-card small{font-size:9px!important;color:#6f8490!important}
.contact-new .contact-choice-card i{width:17px;height:17px;right:9px;top:9px}
.contact-new .contact-choice-card input:checked+span{background:#102b3a!important;border-color:#39afe8!important;box-shadow:inset 0 0 0 1px rgba(57,175,232,.18)!important}
.contact-new .contact-service-options{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px!important;max-height:164px!important;overflow:auto!important;padding:1px 4px 4px 1px}
.contact-new .contact-check span{border-radius:10px!important;background:#0d1b24!important;border-color:#233845!important;padding:9px 10px!important;font-size:10px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.contact-new .contact-check input:checked+span{background:#143247!important;border-color:#40b3ec!important;color:#fff!important}
.contact-new .form-submit{margin-top:auto!important;padding-top:14px!important;border-top:1px solid rgba(255,255,255,.07)!important;min-height:58px!important;display:flex!important;align-items:center!important}
.contact-new .form-submit>span{font-size:9.5px!important;max-width:360px;color:#657d8a!important}
.contact-new .form-submit .pill{min-height:42px!important;padding:10px 17px!important}
.contact-new .contact-form-buttons{margin-left:auto!important}
.contact-new .field-error{font-size:9px!important;color:#ff9a93!important}
@media(max-width:1180px){
  .contact-new .contact-form-card{height:auto!important;min-height:0!important;max-height:none!important}
  .contact-new .contact-form{height:auto!important}.contact-new .contact-form-workspace{grid-template-columns:1fr;height:auto}.contact-new .contact-step-rail{display:grid;grid-template-columns:repeat(3,1fr);padding:14px 18px;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
  .contact-new .contact-step-rail-note{display:none}.contact-new .contact-step-rail-item{grid-template-columns:28px 1fr;padding:8px}.contact-new .contact-step-rail-item>span{width:27px;height:27px}.contact-new .contact-step-stage{padding:24px}.contact-new .contact-form-step{height:auto!important;overflow:visible!important}.contact-new .contact-service-options{max-height:none!important}
}
@media(max-width:760px){
  .blog-load-more-wrap{padding-top:30px}.contact-new .contact-step-rail{grid-template-columns:1fr 1fr 1fr;padding:10px}.contact-new .contact-step-rail-item{display:block;text-align:center}.contact-new .contact-step-rail-item>span{margin:0 auto}.contact-new .contact-step-rail-item div{display:none}.contact-new .contact-step-stage{padding:20px 16px 18px}.contact-new .contact-step-intro h3{font-size:27px!important}.contact-new .field-row{grid-template-columns:1fr!important}.contact-new .contact-choice-cards{grid-template-columns:1fr!important}.contact-new .contact-service-options{grid-template-columns:1fr 1fr!important}.contact-new .form-submit{align-items:flex-end!important;gap:12px}.contact-new .form-submit>span{display:none}
}

/* FINAL CONTACT OPTION POLISH — single-layer chips + compact contact selector */
.contact-new .contact-service-field{gap:9px!important}
.contact-new .contact-service-field legend{display:flex;align-items:baseline;gap:8px;margin:0 0 2px!important;color:#dce8ee!important}
.contact-new .contact-service-field legend>span:last-child{margin:0!important;font-size:9.5px!important;color:#6f8490!important}
.contact-new .contact-service-options{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  max-height:152px!important;
  overflow:auto!important;
  padding:2px 6px 2px 1px!important;
  scrollbar-width:thin;
  scrollbar-color:#2d556b transparent;
}
.contact-new .contact-service-options::-webkit-scrollbar{width:5px}
.contact-new .contact-service-options::-webkit-scrollbar-track{background:transparent}
.contact-new .contact-service-options::-webkit-scrollbar-thumb{background:#2d556b;border-radius:10px}
.contact-new .contact-form label.contact-check{
  display:block!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:inherit!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
.contact-new .contact-form label.contact-check:hover{border:0!important;background:transparent!important}
.contact-new .contact-check input{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}
.contact-new .contact-check span{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-height:42px!important;
  padding:9px 32px 9px 12px!important;
  border:1px solid #263b49!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,#10202a 0%,#0d1a23 100%)!important;
  color:#aab9c2!important;
  font-size:10.5px!important;
  font-weight:650!important;
  line-height:1.25!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease!important;
}
.contact-new .contact-check span::after{
  content:'+';
  position:absolute;
  right:11px;top:50%;transform:translateY(-50%);
  width:17px;height:17px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid #38505e;color:#718995;
  font-size:11px;font-weight:700;
  transition:.16s ease;
}
.contact-new .contact-check:hover span{border-color:#3d657a!important;background:#112631!important;color:#e6f0f5!important;transform:translateY(-1px)}
.contact-new .contact-check input:checked+span{
  background:linear-gradient(135deg,#12364b 0%,#0e2b3c 100%)!important;
  border-color:#42b8ee!important;
  color:#fff!important;
  box-shadow:0 0 0 1px rgba(66,184,238,.12),0 8px 22px rgba(0,0,0,.13)!important;
}
.contact-new .contact-check input:checked+span::after{content:'✓';background:#35aee8;border-color:#35aee8;color:#fff}

.contact-new .contact-choice-field{gap:8px!important}
.contact-new .contact-choice-cards{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
  padding:4px!important;
  border:1px solid #243946!important;
  border-radius:15px!important;
  background:#0a1720!important;
}
.contact-new .contact-choice-card{display:block!important;position:relative!important;margin:0!important}
.contact-new .contact-choice-card>span{
  min-height:48px!important;
  padding:9px 28px 9px 11px!important;
  border:1px solid transparent!important;
  border-radius:11px!important;
  background:transparent!important;
  box-shadow:none!important;
  justify-content:center!important;
}
.contact-new .contact-choice-card b{font-size:11.5px!important;line-height:1.15!important;color:#d7e2e8!important}
.contact-new .contact-choice-card small{display:none!important}
.contact-new .contact-choice-card i{
  right:9px!important;top:50%!important;transform:translateY(-50%)!important;
  width:16px!important;height:16px!important;
  border-color:#3d5360!important;background:transparent!important;
  font-size:9px!important;
}
.contact-new .contact-choice-card:hover>span{background:#10232e!important;border-color:#294655!important}
.contact-new .contact-choice-card input:checked+span{
  background:linear-gradient(135deg,#16405a,#123246)!important;
  border-color:#45b8ef!important;
  box-shadow:0 5px 16px rgba(0,0,0,.16)!important;
}
.contact-new .contact-choice-card input:checked~i{background:#35aee8!important;border-color:#35aee8!important;color:#fff!important}

@media(max-width:760px){
  .contact-new .contact-service-options{grid-template-columns:1fr 1fr!important;max-height:210px!important}
  .contact-new .contact-choice-cards{grid-template-columns:1fr!important;padding:5px!important}
  .contact-new .contact-choice-card>span{min-height:44px!important}
}
@media(max-width:460px){
  .contact-new .contact-service-options{grid-template-columns:1fr!important;max-height:230px!important}
}


/* FINAL STEP LAYOUT UPDATE */
.contact-new .field-row.is-single{grid-template-columns:1fr!important}
.contact-new .field-row.is-single>label,
.contact-new .field-row.is-single>.contact-choice-field{grid-column:1/-1}
.contact-new .contact-step-rail-item:nth-child(2) b::after{content:''}
.contact-new .contact-step-rail-item:nth-child(2) div b{font-size:12px}
.contact-new .contact-step-rail-item:nth-child(3) div b{font-size:12px}
.contact-new .contact-service-field{display:flex!important;flex-direction:column!important;min-height:0!important;flex:1 1 auto!important}
.contact-new .contact-service-field legend{margin-bottom:6px!important}
.contact-new .contact-service-options{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:2px!important;
  max-height:none!important;
  height:100%!important;
  min-height:280px!important;
  flex:1 1 auto!important;
  padding:0 4px 0 0!important;
}
.contact-new .contact-check span{min-height:38px!important;padding:8px 30px 8px 10px!important;font-size:10px!important}
.contact-new .contact-form-step[data-contact-step="1"] .contact-choice-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.contact-new .contact-form-step[data-contact-step="1"] .contact-choice-card>span{min-height:58px!important}
.contact-new .contact-form-step[data-contact-step="2"] textarea[name="message"]{min-height:140px!important;max-height:180px!important}
.contact-new .contact-form-step[data-contact-step="3"] .form-submit{margin-top:14px!important}
.contact-new .contact-form-step[data-contact-step="3"]{justify-content:flex-start!important}
@media(max-width:760px){
  .contact-new .contact-service-options{grid-template-columns:1fr 1fr!important;min-height:240px!important}
}
@media(max-width:460px){
  .contact-new .contact-service-options{grid-template-columns:1fr!important}
}

/* FINAL ACTION ROW VISIBILITY FIX */
.contact-new .contact-form-step{min-height:0!important}
.contact-new .contact-form-step .form-submit{
  flex:0 0 auto!important;
  flex-shrink:0!important;
  position:relative!important;
  z-index:4!important;
  background:#08131b!important;
}
.contact-new .contact-form-step[data-contact-step="3"]{
  display:none!important;
  min-height:0!important;
}
.contact-new .contact-form-step[data-contact-step="3"].is-active{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .contact-step-intro{
  flex:0 0 auto!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .contact-service-field{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
  flex:1 1 auto!important;
  height:auto!important;
  min-height:0!important;
  max-height:330px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain;
  padding-right:5px!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .form-submit{
  margin-top:10px!important;
  padding-top:12px!important;
  min-height:56px!important;
}
@media(max-width:1180px){
  .contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{max-height:360px!important;min-height:220px!important}
}
@media(max-width:760px){
  .contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{max-height:320px!important;min-height:200px!important}
  .contact-new .contact-form-step[data-contact-step="3"] .form-submit{position:sticky!important;bottom:0!important;padding-bottom:4px!important}
}

/* FINAL CONTACT SHELL — dynamic header, number rail, progress bar, fixed footer */
.contact-new .contact-form-card{
  display:flex!important;
  flex-direction:column!important;
}
.contact-new .form-card-head{
  flex:0 0 auto!important;
  min-height:116px!important;
  height:auto!important;
  padding:20px 28px 18px!important;
  align-items:flex-start!important;
  gap:20px!important;
}
.contact-new .form-card-title{min-width:0;max-width:680px}
.contact-new .form-card-title .micro{display:block;margin-bottom:8px!important;color:#7f96a5!important}
.contact-new .form-card-title h3{
  margin:0 0 5px!important;
  font-size:30px!important;
  line-height:1!important;
  letter-spacing:-.04em!important;
  color:#fff!important;
}
.contact-new .form-card-title p{margin:0!important;font-size:11.5px!important;line-height:1.45!important;color:#78909e!important}
.contact-new .form-card-head [data-contact-progress]{margin-left:auto!important;flex:0 0 auto;margin-top:4px!important}
.contact-new .contact-progress-track{
  flex:0 0 3px;height:3px;background:rgba(255,255,255,.06);overflow:hidden;
}
.contact-new .contact-progress-track>i{
  display:block;height:100%;width:33.333%;background:linear-gradient(90deg,#268fd0,#46c1f5);transition:width .28s ease;
  box-shadow:0 0 14px rgba(56,177,233,.38)
}
.contact-new .contact-form{height:auto!important;flex:1 1 auto!important;min-height:0!important}
.contact-new .contact-form-workspace{
  grid-template-columns:76px minmax(0,1fr)!important;
  height:100%!important;min-height:0!important;
}
.contact-new .contact-step-rail{
  padding:28px 14px!important;
  gap:18px!important;
  align-items:center!important;
  justify-content:flex-start!important;
  background:linear-gradient(180deg,#09161f,#071119)!important;
}
.contact-new .contact-step-rail-item{
  display:grid!important;place-items:center!important;
  width:44px!important;height:44px!important;padding:0!important;margin:0!important;
  border:0!important;background:transparent!important;border-radius:14px!important;cursor:pointer!important;
}
.contact-new .contact-step-rail-item>span{
  width:38px!important;height:38px!important;border-radius:12px!important;
  font-size:10px!important;
}
.contact-new .contact-step-rail-item.is-active{background:rgba(52,169,229,.08)!important}
.contact-new .contact-step-rail-item.is-active>span{box-shadow:0 0 0 4px rgba(52,169,229,.09)!important}
.contact-new .contact-step-rail-item div,.contact-new .contact-step-rail-note{display:none!important}
.contact-new .contact-step-stage{
  display:grid!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  padding:22px 26px 0!important;
  min-height:0!important;height:100%!important;overflow:hidden!important;
}
.contact-new .contact-form-step{
  grid-row:1!important;
  min-height:0!important;
  overflow:auto!important;
  padding:0 2px 18px!important;
  scrollbar-width:thin;scrollbar-color:#294b5f transparent;
}
.contact-new .contact-form-step::-webkit-scrollbar{width:5px}
.contact-new .contact-form-step::-webkit-scrollbar-thumb{background:#294b5f;border-radius:10px}
.contact-new .contact-form-step.is-active{display:flex!important;flex-direction:column!important;gap:14px!important}
.contact-new .contact-step-intro{display:none!important}
.contact-new .contact-form-step>.field-row,
.contact-new .contact-form-step>label,
.contact-new .contact-form-step>.contact-service-field{
  width:100%!important;max-width:760px!important;margin-left:auto!important;margin-right:auto!important;
}
.contact-new .contact-form-step[data-contact-step="3"]>.contact-service-field{max-width:860px!important}
.contact-new .contact-form-footer{
  grid-row:2!important;
  min-height:72px!important;
  padding:12px 2px 16px!important;
  border-top:1px solid rgba(255,255,255,.08)!important;
  display:flex!important;align-items:center!important;gap:10px!important;
  background:#08131b!important;z-index:5!important;
}
.contact-new .contact-form-footer .pill{min-height:42px!important;padding:10px 18px!important}
.contact-new .contact-footer-note{font-size:9px;color:#617987;max-width:300px;margin-right:auto}
.contact-new .contact-footer-back[hidden],
.contact-new .contact-footer-next[hidden],
.contact-new .contact-footer-submit[hidden]{display:none!important}
.contact-new .contact-form-footer .contact-footer-next,
.contact-new .contact-form-footer .contact-footer-submit{margin-left:auto}
.contact-new .contact-form-footer .contact-footer-back:not([hidden]) + .contact-footer-note + .contact-footer-next,
.contact-new .contact-form-footer .contact-footer-back:not([hidden]) + .contact-footer-note + .contact-footer-submit{margin-left:0}
.contact-new .form-submit{display:none!important}

@media(max-width:1180px){
  .contact-new .contact-form-card{height:auto!important;min-height:0!important;max-height:none!important}
  .contact-new .form-card-head{min-height:108px!important;padding:18px 22px 16px!important}
  .contact-new .form-card-title h3{font-size:27px!important}
  .contact-new .contact-form-workspace{grid-template-columns:1fr!important;height:auto!important}
  .contact-new .contact-step-rail{
    display:flex!important;flex-direction:row!important;justify-content:center!important;
    padding:10px 16px!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.08)!important;
  }
  .contact-new .contact-step-stage{height:auto!important;min-height:560px!important;padding:20px 20px 0!important}
  .contact-new .contact-form-step{overflow:visible!important}
}
@media(max-width:760px){
  .contact-new .form-card-head{min-height:112px!important;padding:16px 16px 14px!important;gap:10px!important}
  .contact-new .form-card-title h3{font-size:24px!important}
  .contact-new .form-card-title p{font-size:10.5px!important}
  .contact-new .contact-step-rail-item{width:40px!important;height:40px!important}
  .contact-new .contact-step-rail-item>span{width:34px!important;height:34px!important}
  .contact-new .contact-step-stage{padding:18px 14px 0!important;min-height:620px!important}
  .contact-new .contact-form-footer{min-height:68px!important;padding-bottom:12px!important}
  .contact-new .contact-footer-note{display:none!important}
  .contact-new .contact-form-footer .contact-footer-next,
  .contact-new .contact-form-footer .contact-footer-submit{margin-left:auto!important}
}
\n\n/* THANK YOU + 404 TARGET GAME */\n.thank-you-page{min-height:78vh;display:flex;align-items:center;padding:150px 0 110px}.thank-you-shell{max-width:1080px}.thank-you-mark{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:#2fa8e6;color:#fff;font-size:28px;margin:28px 0}.thank-you-page h1{font-size:clamp(62px,7vw,118px);line-height:.9;letter-spacing:-.065em;margin:0}.thank-you-page h1 em{color:#84929d;font-style:normal}.thank-you-page>div>p{max-width:680px;color:#93a1ab;font-size:18px;line-height:1.6;margin:28px 0}.thank-you-next{display:grid;grid-template-columns:1.1fr repeat(3,1fr);gap:1px;margin-top:72px;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}.thank-you-next>span,.thank-you-next>div{padding:22px 18px}.thank-you-next>span{font:10px 'DM Mono',monospace;letter-spacing:.15em;color:#6f7f89}.thank-you-next>div{border-left:1px solid rgba(255,255,255,.1)}.thank-you-next b{font:11px 'DM Mono',monospace;color:#36abe6}.thank-you-next p{margin:8px 0 0;color:#d8e1e6;font-size:13px}\n.not-found-game{min-height:100vh;padding:120px 0 80px;overflow:hidden}.game404-shell{display:grid;grid-template-columns:minmax(320px,.75fr) minmax(520px,1.25fr);gap:46px;align-items:start}.game404-copy h1{font-size:clamp(64px,6vw,105px);line-height:.9;letter-spacing:-.06em;margin:24px 0}.game404-copy h1 em{font-style:normal;color:#84929d}.game404-copy>p{max-width:520px;color:#92a0aa;font-size:16px;line-height:1.6}.game404-stats{display:flex;gap:8px;margin:30px 0 20px;flex-wrap:wrap}.game404-stats span{border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:9px 12px;color:#8797a1;font-size:11px}.game404-stats b{color:#fff;margin-left:4px}.game404-board{position:relative;height:580px;border:1px solid rgba(104,167,200,.25);border-radius:28px;background:radial-gradient(circle at 60% 40%,rgba(27,109,151,.22),transparent 48%),#07121a;overflow:hidden}.game404-number{position:absolute;left:50%;top:34px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;font-size:88px;line-height:1;font-weight:800;letter-spacing:-.08em;color:rgba(255,255,255,.14);z-index:4;pointer-events:none}.game404-target{position:absolute;width:86px;height:86px;border-radius:50%;border:2px solid #48b9ef;background:#0b1b25;color:#fff;font-size:48px;font-weight:800;cursor:crosshair;box-shadow:0 0 0 8px rgba(72,185,239,.09),0 0 42px rgba(72,185,239,.24);z-index:6;transition:box-shadow .16s ease,transform .12s ease}.game404-target:hover{box-shadow:0 0 0 12px rgba(72,185,239,.1),0 0 54px rgba(72,185,239,.35)}.game404-target:active{transform:scale(.9)}.game404-arena{position:absolute;inset:0;cursor:crosshair}.game404-crosshair{position:absolute;width:22px;height:22px;border:1px solid rgba(255,255,255,.12);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}.game404-crosshair:before,.game404-crosshair:after{content:'';position:absolute;background:rgba(255,255,255,.16)}.game404-crosshair:before{width:30px;height:1px;left:-5px;top:10px}.game404-crosshair:after{height:30px;width:1px;top:-5px;left:10px}.game404-overlay,.game404-gameover{position:absolute;inset:0;display:grid;place-items:center;text-align:center;background:rgba(4,11,16,.72);backdrop-filter:blur(8px);z-index:8}.game404-overlay h2,.game404-gameover h2{font-size:44px;letter-spacing:-.04em;margin:10px 0}.game404-overlay p{color:#91a1ab}.game404-gameover>div,.game404-gameover{padding:28px}.game404-gameover form{display:flex;gap:10px;justify-content:center;align-items:end;margin:20px 0 10px}.game404-gameover label{text-align:left;font-size:11px;color:#9aabb5}.game404-gameover input{display:block;margin-top:7px;height:48px;min-width:220px;padding:0 14px;border-radius:12px;border:1px solid #2c4554;background:#0d1b24;color:#fff}.game404-leaderboard{grid-column:2;display:block;border:1px solid rgba(255,255,255,.11);border-radius:20px;padding:18px 20px;background:rgba(255,255,255,.018)}.game404-leaderboard ol{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;counter-reset:rank}.game404-leaderboard li{counter-increment:rank;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:10px;color:#dfe8ed;font-size:12px}.game404-leaderboard li:before{content:counter(rank) '. ';color:#37abe6}.game404-leaderboard small{display:block;color:#71838e;margin-top:4px}.game404-hit{animation:game404Hit .18s ease}@keyframes game404Hit{50%{transform:scale(1.25)}}\n@media(max-width:980px){.game404-shell{grid-template-columns:1fr}.game404-leaderboard{grid-column:1}.game404-board{height:520px}.thank-you-next{grid-template-columns:1fr 1fr}}\n@media(max-width:620px){.not-found-game{padding-top:105px}.game404-board{height:470px;border-radius:20px}.game404-number{font-size:64px}.game404-target{width:72px;height:72px;font-size:38px}.game404-leaderboard ol{grid-template-columns:1fr 1fr}.game404-gameover form{flex-direction:column;align-items:stretch}.thank-you-page{padding-top:120px}.thank-you-next{grid-template-columns:1fr}.thank-you-next>div{border-left:0;border-top:1px solid rgba(255,255,255,.08)}}\n

/* FINAL DEEP FIX — contact submit reliability + polished services step */
.honeypot{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;left:-10000px!important;top:auto!important}
.contact-new .contact-form-step[data-contact-step="3"]{overflow:hidden!important}
.contact-new .contact-service-field{display:flex!important;flex-direction:column!important;min-height:0!important;height:100%!important}
.contact-new .contact-service-field legend{display:flex!important;align-items:baseline!important;gap:10px!important;margin:0 0 10px!important}
.contact-new .contact-service-options{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  max-height:none!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  padding:0!important;
  align-content:start!important;
}
.contact-new .contact-form label.contact-check{display:block!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;min-width:0!important}
.contact-new .contact-check span{
  min-height:44px!important;
  height:100%!important;
  padding:10px 34px 10px 12px!important;
  border-radius:12px!important;
  border:1px solid rgba(93,137,160,.30)!important;
  background:rgba(15,31,41,.72)!important;
  color:#9fb0ba!important;
  font-size:10px!important;
  font-weight:600!important;
  line-height:1.25!important;
  display:flex!important;
  align-items:center!important;
  transition:.16s ease!important;
}
.contact-new .contact-check span::after{right:10px!important;width:18px!important;height:18px!important;border-color:#3f5f70!important;color:#78909d!important}
.contact-new .contact-check:hover span{background:#122a37!important;border-color:#3d718a!important;color:#eef6fa!important;transform:none!important}
.contact-new .contact-check input:checked+span{
  background:linear-gradient(135deg,#16445f,#10364c)!important;
  border-color:#40b8ef!important;
  color:#fff!important;
  box-shadow:0 0 0 1px rgba(64,184,239,.12),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.contact-new .contact-check input:checked+span::after{background:#38afe8!important;border-color:#38afe8!important;color:#fff!important}
.contact-new .contact-form-step[data-contact-step="3"] .contact-form-footer{margin-top:auto!important}
@media(max-width:1180px){
  .contact-new .contact-service-options{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-height:360px!important;overflow:auto!important;padding-right:4px!important}
}
@media(max-width:620px){
  .contact-new .contact-service-options{grid-template-columns:1fr!important;max-height:380px!important}
}

/* FINAL 404 FULL ARENA REWORK */
.not-found-game{min-height:100svh!important;height:100svh!important;padding:94px 20px 20px!important;overflow:hidden!important;display:flex;align-items:stretch}
.game404-shell{width:min(1390px,100%)!important;height:100%!important;margin:0 auto!important;display:block!important}
.game404-board{position:relative!important;width:100%!important;height:100%!important;min-height:0!important;border:1px solid rgba(86,163,201,.28)!important;border-radius:30px!important;background:radial-gradient(circle at 50% 45%,rgba(42,151,207,.14),transparent 44%),linear-gradient(180deg,#07121a 0%,#050d13 100%)!important;overflow:hidden!important;box-shadow:0 34px 100px rgba(0,0,0,.35)!important}
.game404-hud{position:absolute;z-index:20;left:0;right:0;top:0;height:70px;padding:0 24px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(4,12,17,.74);backdrop-filter:blur(12px)}
.game404-home,.game404-leaderboard-toggle{color:#cbd8df;font-size:12px;font-weight:700;text-decoration:none;background:none;border:0;cursor:pointer}
.game404-leaderboard-toggle{justify-self:end}.game404-home:hover,.game404-leaderboard-toggle:hover{color:#43b5ed}
.game404-hud-center{display:flex;align-items:center;gap:8px}.game404-hud-center span{border:1px solid rgba(255,255,255,.11);border-radius:999px;padding:8px 11px;color:#7f919c;font-size:10.5px}.game404-hud-center b{color:#fff;margin-left:4px}
.game404-playfield{position:absolute!important;inset:70px 0 0!important;cursor:crosshair!important;overflow:hidden!important}
.game404-number{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;display:flex!important;align-items:center!important;gap:.04em!important;font-size:clamp(150px,21vw,330px)!important;line-height:.75!important;font-weight:800!important;letter-spacing:-.09em!important;color:rgba(255,255,255,.09)!important;z-index:1!important;pointer-events:none!important;user-select:none!important}
.game404-zero-placeholder{visibility:visible}
.game404-target{position:absolute!important;width:92px!important;height:92px!important;border-radius:50%!important;border:2px solid #43b8ef!important;background:#07141d!important;color:#fff!important;font-size:52px!important;font-weight:800!important;line-height:1!important;cursor:crosshair!important;z-index:10!important;box-shadow:0 0 0 10px rgba(67,184,239,.07),0 0 44px rgba(67,184,239,.28)!important;transition:box-shadow .14s ease,transform .1s ease!important}
.game404-target:hover{box-shadow:0 0 0 14px rgba(67,184,239,.09),0 0 62px rgba(67,184,239,.38)!important}.game404-target:active{transform:scale(.92)!important}
.game404-crosshair{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:30px!important;height:30px!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:50%!important;pointer-events:none!important;z-index:2!important}.game404-crosshair:before,.game404-crosshair:after{content:'';position:absolute;background:rgba(255,255,255,.18)}.game404-crosshair:before{width:42px;height:1px;left:-7px;top:14px}.game404-crosshair:after{height:42px;width:1px;top:-7px;left:14px}
.game404-overlay,.game404-gameover{position:absolute!important;inset:70px 0 0!important;z-index:30!important;display:grid!important;place-items:center!important;background:rgba(3,9,13,.52)!important;backdrop-filter:blur(8px)!important;padding:20px!important;text-align:center!important}
.game404-overlay[hidden],.game404-gameover[hidden]{display:none!important}
.game404-start-card,.game404-gameover-card{width:min(520px,90%);padding:34px;border:1px solid rgba(255,255,255,.11);border-radius:24px;background:rgba(8,20,29,.92);box-shadow:0 28px 80px rgba(0,0,0,.4)}
.game404-start-card strong,.game404-gameover-card>strong{display:block;margin:10px 0 8px;color:#fff;font-size:clamp(32px,4vw,54px);line-height:.98;letter-spacing:-.05em}.game404-start-card p{margin:0 auto 22px;max-width:410px;color:#82949f;font-size:13px;line-height:1.55}
.game404-gameover-card>strong b{color:#44b8ef}.game404-gameover-card form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;margin:22px 0 10px}.game404-gameover-card label{text-align:left;color:#8ea0aa;font-size:10px}.game404-gameover-card label span{display:block;margin-bottom:7px}.game404-gameover-card input{height:48px;width:100%;border:1px solid #2b4554;border-radius:12px;background:#0d1b24;color:#fff;padding:0 14px}.game404-gameover-card .pill-text{margin-top:6px}
.game404-leaderboard{position:absolute!important;z-index:40!important;top:84px!important;right:14px!important;width:320px!important;max-height:calc(100% - 98px)!important;overflow:auto!important;border:1px solid rgba(255,255,255,.11)!important;border-radius:18px!important;padding:16px!important;background:rgba(7,18,26,.96)!important;box-shadow:0 24px 70px rgba(0,0,0,.42)!important;transform:translateX(calc(100% + 28px));opacity:0;pointer-events:none;transition:.22s ease!important}
.game404-leaderboard.is-open{transform:translateX(0);opacity:1;pointer-events:auto}.game404-leaderboard-head{display:flex;justify-content:space-between;align-items:center}.game404-leaderboard-head button{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.12);background:transparent;color:#fff;cursor:pointer}.game404-leaderboard ol{display:grid!important;grid-template-columns:1fr!important;gap:6px!important;margin:12px 0 0!important}.game404-leaderboard li{padding:10px 11px!important}
@media(max-width:900px){.not-found-game{padding:86px 12px 12px!important}.game404-hud{grid-template-columns:auto 1fr auto;padding:0 14px}.game404-hud-center{justify-content:center}.game404-hud-center span{padding:7px 8px;font-size:9px}.game404-number{font-size:clamp(120px,31vw,240px)!important}.game404-target{width:78px!important;height:78px!important;font-size:43px!important}.game404-leaderboard{width:min(300px,calc(100% - 28px))!important}}
@media(max-width:600px){.not-found-game{padding:78px 8px 8px!important}.game404-board{border-radius:20px!important}.game404-hud{height:62px;padding:0 10px}.game404-playfield{inset:62px 0 0!important}.game404-overlay,.game404-gameover{inset:62px 0 0!important}.game404-home{font-size:0}.game404-home:before{content:'←';font-size:18px}.game404-leaderboard-toggle{font-size:10px}.game404-hud-center{gap:3px}.game404-hud-center span{padding:6px 7px}.game404-number{font-size:clamp(105px,38vw,190px)!important}.game404-target{width:68px!important;height:68px!important;font-size:36px!important}.game404-start-card,.game404-gameover-card{padding:24px 18px}.game404-gameover-card form{grid-template-columns:1fr}.game404-gameover-card form .pill{width:100%}}

/* FINAL CLEANUP — thank-you, contact services, arcade 404 */
.thank-you-page{min-height:calc(100svh - 86px)!important;padding:110px 20px 40px!important;display:grid!important;place-items:center!important}
.thank-you-shell{width:min(720px,100%)!important;margin:0 auto!important;text-align:center!important;padding:44px 36px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:28px!important;background:linear-gradient(180deg,rgba(12,27,36,.88),rgba(7,17,24,.9))!important;box-shadow:0 30px 90px rgba(0,0,0,.35)!important}
.thank-you-mark{width:50px!important;height:50px!important;margin:0 auto 18px!important;font-size:22px!important}
.thank-you-page h1{font-size:clamp(42px,5vw,66px)!important;line-height:.96!important;letter-spacing:-.05em!important;margin:10px 0 16px!important}
.thank-you-page>div>p{max-width:560px!important;margin:0 auto 24px!important;font-size:14px!important;line-height:1.6!important;color:#8fa0aa!important}
.thank-you-page .hero-actions{justify-content:center!important;margin-top:0!important}
.thank-you-mini{display:flex!important;justify-content:center!important;gap:8px!important;margin-top:28px!important;padding-top:20px!important;border-top:1px solid rgba(255,255,255,.08)!important}
.thank-you-mini span{padding:8px 11px;border:1px solid rgba(255,255,255,.08);border-radius:999px;color:#7f919d;font-size:10px}
.thank-you-mini b{color:#42b7ee;margin-right:5px}

.contact-new .contact-new-grid{align-items:center!important}
.contact-new .contact-form-card{align-self:center!important}
.contact-new .contact-form-step[data-contact-step="3"]{justify-content:center!important}
.contact-new .contact-form-step[data-contact-step="3"]>.contact-service-field{max-width:780px!important;height:auto!important;max-height:100%!important;justify-content:center!important}
.contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  max-height:calc(100% - 42px)!important;
  min-height:0!important;
  overflow:auto!important;
  padding:2px 7px 2px 2px!important;
  align-content:start!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .contact-check span{min-height:46px!important;padding:10px 34px 10px 13px!important;font-size:10.5px!important}
.contact-new .contact-form-footer{flex:0 0 auto!important}
@media(max-width:760px){.contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{grid-template-columns:1fr!important;max-height:380px!important}}

.not-found-game{height:100svh!important;min-height:100svh!important;padding:92px 18px 18px!important;display:flex!important;align-items:stretch!important;overflow:hidden!important}
.game404-board{width:min(1390px,100%)!important;height:100%!important;margin:0 auto!important;position:relative!important;border-radius:28px!important;overflow:hidden!important;border:1px solid rgba(73,174,223,.28)!important;background:radial-gradient(circle at 50% 45%,rgba(38,145,196,.18),transparent 42%),linear-gradient(180deg,#06121a,#040b10)!important}
.game404-playfield{position:absolute!important;inset:70px 0 0!important;overflow:hidden!important;cursor:crosshair!important}
.game404-grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.95),transparent 96%)}
.game404-center-copy{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;user-select:none}
.game404-center-copy strong{display:block;font-size:clamp(120px,18vw,290px);line-height:.7;letter-spacing:-.09em;color:rgba(255,255,255,.055)}
.game404-center-copy strong span{color:rgba(61,181,238,.12)}
.game404-center-copy small{display:block;margin-top:28px;font:10px 'DM Mono',monospace;letter-spacing:.28em;color:rgba(147,169,181,.32)}
.game404-target,.game404-decoy{position:absolute!important;border-radius:50%!important;display:grid!important;place-items:center!important;cursor:crosshair!important;z-index:12!important;user-select:none!important;transition:transform .12s ease,box-shadow .12s ease!important}
.game404-target{width:78px!important;height:78px!important;border:2px solid #46baf1!important;background:radial-gradient(circle at 35% 30%,#174662,#081821 68%)!important;color:#fff!important;font-size:42px!important;font-weight:800!important;box-shadow:0 0 0 8px rgba(70,186,241,.08),0 0 34px rgba(70,186,241,.32)!important;animation:targetPulse 1.25s ease-in-out infinite!important}
@keyframes targetPulse{50%{box-shadow:0 0 0 14px rgba(70,186,241,.04),0 0 54px rgba(70,186,241,.5)}}
.game404-decoy{width:56px!important;height:56px!important;border:1px solid rgba(255,104,104,.5)!important;background:rgba(61,17,21,.65)!important;color:#ff8d8d!important;font-size:25px!important;font-weight:800!important;box-shadow:0 0 28px rgba(255,75,75,.08)!important;opacity:.78}
.game404-toast{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);padding:8px 12px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(4,12,17,.66);color:#78909e;font-size:10px;pointer-events:none}
.game404-toast.is-hit{color:#8ee0ff;border-color:rgba(70,186,241,.3)}.game404-toast.is-miss{color:#ff9696;border-color:rgba(255,95,95,.3)}
.game404-gameover-card p{color:#7f919d;font-size:12px;margin:0 0 8px}
@media(max-width:700px){.not-found-game{padding:78px 8px 8px!important}.game404-hud-center span:nth-child(4){display:none}.game404-target{width:66px!important;height:66px!important;font-size:34px!important}.game404-decoy{width:48px!important;height:48px!important}.game404-center-copy strong{font-size:clamp(100px,34vw,180px)}}


/* FINAL: professional 404 + endless D runner + compact thank-you + card spacing */
.thank-you-page{padding:96px 20px 34px!important}
.thank-you-shell{width:min(620px,100%)!important;padding:36px 30px!important;border-radius:24px!important}
.thank-you-mark{width:44px!important;height:44px!important;font-size:18px!important;margin-bottom:14px!important}
.thank-you-page h1{font-size:clamp(34px,4vw,50px)!important;line-height:1!important;margin:8px 0 13px!important}
.thank-you-page .thank-you-shell>p{font-size:13px!important;line-height:1.55!important;max-width:510px!important;margin-bottom:20px!important}
.thank-you-mini{margin-top:22px!important;padding-top:16px!important}

.contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{gap:9px 10px!important;padding:3px 8px 5px 2px!important}
.contact-new .contact-form-step[data-contact-step="3"] .contact-check span{min-height:44px!important;padding:10px 34px 10px 12px!important;border-radius:12px!important}

.not-found-pro{min-height:100svh;padding:112px 20px 34px;display:grid;align-items:center}
.not-found-pro-shell{width:min(1390px,100%);margin:0 auto;display:grid;grid-template-columns:minmax(0,.8fr) minmax(620px,1.2fr);gap:48px;align-items:center}
.not-found-pro-copy{max-width:560px}
.not-found-pro-copy h1{font-size:clamp(58px,7vw,104px);line-height:.88;letter-spacing:-.065em;margin:16px 0 24px;color:#fff}
.not-found-pro-copy h1 em{color:#7f909b;font-style:normal}
.not-found-pro-copy p{max-width:500px;color:#8d9aa3;font-size:15px;line-height:1.6}
.runner404-card{border:1px solid rgba(75,169,217,.24);border-radius:28px;background:linear-gradient(180deg,#081720,#061119);padding:22px;box-shadow:0 26px 80px rgba(0,0,0,.32)}
.runner404-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:16px}.runner404-head strong{display:block;color:#fff;font-size:28px;letter-spacing:-.03em}.runner404-head>span{color:#8094a0;font-size:12px}.runner404-head b{color:#45b9ef;font-size:20px}
.runner404-track{position:relative;height:310px;overflow:hidden;border:1px solid rgba(255,255,255,.07);border-radius:20px;background:radial-gradient(circle at 65% 25%,rgba(57,166,218,.10),transparent 34%),linear-gradient(180deg,#0a1821 0%,#09151d 72%,#071018 72%);outline:none;cursor:pointer}
.runner404-floor{position:absolute;left:0;right:0;bottom:54px;height:2px;background:linear-gradient(90deg,transparent,#315365,#315365,transparent)}
.runner404-player{position:absolute;left:70px;bottom:56px;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;z-index:4;will-change:transform;background:#07131b;border:1px solid #2c819f;box-shadow:0 0 0 7px rgba(61,184,239,.06),0 12px 28px rgba(0,0,0,.24)}
.runner404-player img{width:36px;height:36px;object-fit:contain}
.runner404-obstacle{position:absolute;bottom:56px;width:26px;height:44px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,#4bb9eb,#1b6486);box-shadow:0 0 20px rgba(67,178,225,.15)}
.runner404-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:9px 12px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(4,12,17,.62);color:#79909d;font-size:11px;transition:.2s}.runner404-hint.is-hidden{opacity:0;pointer-events:none}
.runner404-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;color:#6f828d;font-size:11px}.runner404-jump{border:1px solid #2f6077;border-radius:999px;background:#0f2633;color:#eaf7fd;padding:10px 16px;cursor:pointer}
@media(max-width:1050px){.not-found-pro-shell{grid-template-columns:1fr;gap:28px}.not-found-pro-copy{max-width:700px}.runner404-track{height:270px}}
@media(max-width:620px){.not-found-pro{padding:92px 12px 24px}.not-found-pro-copy h1{font-size:54px}.runner404-card{padding:14px;border-radius:20px}.runner404-track{height:220px}.runner404-player{left:40px;width:48px;height:48px}.runner404-player img{width:31px;height:31px}.runner404-foot span{display:none}}

/* DOT SURFER — final 404 game treatment */
.runner404-card{position:relative;overflow:hidden}
.runner404-head{gap:18px;align-items:center!important}
.runner404-stats{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.runner404-stats span{padding:7px 9px;border:1px solid rgba(255,255,255,.07);border-radius:999px;background:#0a1720;color:#758b97;font-size:10px;white-space:nowrap}
.runner404-stats b{color:#49baf0;font-size:12px;margin-left:3px}
.runner404-track{isolation:isolate;background:radial-gradient(circle at 70% 18%,rgba(61,184,239,.10),transparent 26%),linear-gradient(180deg,#0b1922 0%,#09161e 70%,#061018 70%)!important}
.runner404-track::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.018),transparent);transform:translateX(-100%);animation:dotSurferSweep 5.5s linear infinite;pointer-events:none}
@keyframes dotSurferSweep{to{transform:translateX(100%)}}
.runner404-sky{position:absolute;inset:0 0 58px;overflow:hidden;pointer-events:none;opacity:.65}
.runner404-sky i{position:absolute;width:3px;height:3px;border-radius:50%;background:#5ebde8;box-shadow:0 0 10px rgba(94,189,232,.6);animation:dotStar 4s linear infinite}
.runner404-sky i:nth-child(1){left:20%;top:24%;animation-delay:-.8s}.runner404-sky i:nth-child(2){left:48%;top:16%;animation-delay:-2.2s}.runner404-sky i:nth-child(3){left:72%;top:34%;animation-delay:-1.4s}.runner404-sky i:nth-child(4){left:88%;top:20%;animation-delay:-3.1s}
@keyframes dotStar{0%{transform:translateX(40px);opacity:0}20%{opacity:.8}100%{transform:translateX(-180px);opacity:0}}
.runner404-player{transition:filter .15s ease;overflow:hidden}.runner404-player::after{content:'';position:absolute;right:100%;top:50%;width:32px;height:8px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,rgba(64,180,235,.65));filter:blur(2px);opacity:.55}.runner404-player img{position:relative;z-index:2}
.runner404-obstacle{border:1px solid rgba(99,204,251,.28);background:linear-gradient(180deg,#56c3f3,#1c607d)!important;box-shadow:0 0 18px rgba(68,183,232,.14),inset 0 1px rgba(255,255,255,.2)!important}
.runner404-obstacle.is-tall{border-radius:10px 10px 4px 4px!important;background:linear-gradient(180deg,#6fd0fa,#225d79)!important}.runner404-obstacle.is-wide{border-radius:14px 14px 4px 4px!important;background:linear-gradient(180deg,#389bc7,#17465e)!important}
.runner404-hint{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 16px!important}.runner404-hint b{color:#edf8fd;font-size:15px}.runner404-hint span{font-size:10px;color:#738b98}
.runner404-gameover{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:rgba(3,10,15,.74);backdrop-filter:blur(10px)}.runner404-gameover[hidden]{display:none!important}.runner404-gameover>div{text-align:center;width:min(360px,calc(100% - 32px));padding:28px;border:1px solid rgba(80,183,232,.22);border-radius:22px;background:#081720;box-shadow:0 30px 80px rgba(0,0,0,.35)}.runner404-gameover h3{font-size:36px;letter-spacing:-.05em;color:#fff;margin:8px 0}.runner404-gameover p{color:#8094a0;margin:0 0 20px}.runner404-gameover p b{color:#fff}
.runner404-actions{display:flex;align-items:center;gap:8px}.runner404-audio,.runner404-jump{min-height:40px;border:1px solid #2f6077;border-radius:999px;background:#0f2633;color:#eaf7fd;padding:9px 14px;cursor:pointer;font-size:11px}.runner404-audio{background:transparent;color:#8da2ae}.runner404-audio[aria-pressed="false"]{opacity:.65}.runner404-jump:hover,.runner404-audio:hover{border-color:#49baf0;color:#fff}
.runner404-card.is-gameover .runner404-player{filter:grayscale(.4) brightness(.75)}
@media(max-width:1050px){.runner404-head{align-items:flex-start!important;flex-direction:column}.runner404-stats{justify-content:flex-start}.runner404-foot{gap:12px;flex-wrap:wrap}.runner404-actions{margin-left:auto}}
@media(max-width:620px){.runner404-stats{gap:5px}.runner404-stats span{font-size:9px;padding:6px 7px}.runner404-head strong{font-size:24px!important}.runner404-foot{align-items:center}.runner404-actions{width:100%;margin-left:0}.runner404-actions button{flex:1}.runner404-gameover h3{font-size:30px}.runner404-track{height:230px!important}}
@media(prefers-reduced-motion:reduce){.runner404-track::before,.runner404-sky i{animation:none!important}}


/* FINAL FOOTER WIDTH BALANCE */
@media(min-width:1181px){
  .footer-grid-main{grid-template-columns:.68fr 2.12fr .82fr 1.08fr!important;gap:clamp(30px,3.3vw,60px)!important}
  .footer-follow-column{min-width:290px!important}
  .footer-mini-newsletter-row{max-width:100%!important;grid-template-columns:minmax(0,1fr) 40px!important}
  .footer-mini-idea{max-width:100%!important}
}


/* FINAL TINY PASS: mobile header mark, footer rhythm, Dot Surfer power-ups */
@media(max-width:1180px){
  .site-header .brand-compact{display:none!important;opacity:0!important;visibility:hidden!important}
  .site-header .brand-full{display:block!important;opacity:1!important;visibility:visible!important}
}
@media(min-width:1181px){
  .footer-grid-main{grid-template-columns:.72fr 2.16fr .82fr 1.18fr!important;column-gap:clamp(32px,3vw,52px)!important;row-gap:32px!important}
  .footer-service-links{column-gap:clamp(28px,2.3vw,44px)!important}
  .footer-follow-column{min-width:0!important}
  .footer-mini-newsletter-row{max-width:320px!important}
}
.runner404-powerups,.runner404-projectiles{position:absolute;inset:0;pointer-events:none;z-index:6}
.runner404-powerup{position:absolute;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,255,255,.26);box-shadow:0 0 0 6px rgba(68,184,235,.06),0 10px 24px rgba(0,0,0,.28);animation:dotPowerFloat 1.25s ease-in-out infinite alternate}
.runner404-powerup span{font-size:18px;line-height:1;color:#fff;text-shadow:0 0 12px currentColor}
.runner404-powerup.is-shield{background:linear-gradient(145deg,#1f6c92,#12374b);border-color:#62c8f3}
.runner404-powerup.is-fire{background:linear-gradient(145deg,#b05b2b,#62301b);border-color:#ffae67}
.runner404-projectile{position:absolute;width:18px;height:4px;border-radius:999px;background:#ffb46f;box-shadow:0 0 12px #ff9448,0 0 3px #fff;z-index:7}
.runner404-power-status{border-color:rgba(87,201,247,.44)!important;color:#8edcff!important}.runner404-power-status b{color:#fff!important;white-space:nowrap}
.runner404.has-shield .runner404-player{box-shadow:0 0 0 8px rgba(81,204,255,.16),0 0 30px rgba(81,204,255,.4),0 12px 28px rgba(0,0,0,.24)}
.runner404.has-shield .runner404-player::before{content:'';position:absolute;inset:-8px;border:2px solid rgba(100,215,255,.7);border-radius:50%;animation:dotShieldPulse .8s ease-in-out infinite alternate}
.runner404.has-fire .runner404-player{filter:drop-shadow(0 0 8px rgba(255,150,80,.45))}
@keyframes dotPowerFloat{from{transform:translateY(-4px) rotate(-5deg)}to{transform:translateY(5px) rotate(5deg)}}
@keyframes dotShieldPulse{from{transform:scale(.94);opacity:.55}to{transform:scale(1.08);opacity:1}}
@media(max-width:620px){.runner404-powerup{width:34px;height:34px}.runner404-powerup span{font-size:16px}.runner404-power-status{display:none!important}}
@media(prefers-reduced-motion:reduce){.runner404-powerup,.runner404.has-shield .runner404-player::before{animation:none!important}}

/* FINAL FOOTER RHYTHM + SHIELD STATE COLOR */
@media (min-width:1181px){
  .footer-grid-main{
    grid-template-columns:160px minmax(560px,1fr) 190px 320px!important;
    column-gap:36px!important;
    row-gap:28px!important;
    align-items:start!important;
  }
  .footer-service-links{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    column-gap:26px!important;
    row-gap:10px!important;
  }
  .footer-follow-column{width:100%!important;min-width:0!important}
  .footer-mini-idea,.footer-mini-newsletter-row{max-width:none!important;width:100%!important}
}
.runner404.has-shield .runner404-player{
  background:linear-gradient(145deg,#46c9ff 0%,#1685ba 58%,#0e4d70 100%)!important;
  border-color:#9be7ff!important;
  box-shadow:0 0 0 8px rgba(81,204,255,.2),0 0 34px rgba(81,204,255,.5),0 12px 28px rgba(0,0,0,.24)!important;
}
.runner404.has-shield .runner404-player img{filter:brightness(1.28) saturate(1.35) drop-shadow(0 0 5px rgba(255,255,255,.28))!important}


/* FINAL POWER TIMER HUD */
.runner404-power-timer{transition:border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease}
.runner404-power-timer.is-shield.is-active{border-color:rgba(78,203,255,.58)!important;background:rgba(34,154,211,.13)!important;color:#aee9ff!important;box-shadow:0 0 0 2px rgba(43,183,242,.06)}
.runner404-power-timer.is-fire.is-active{border-color:rgba(255,169,74,.58)!important;background:rgba(230,121,24,.12)!important;color:#ffd2a1!important;box-shadow:0 0 0 2px rgba(255,145,48,.05)}
.runner404-power-timer.is-shield.is-active b{color:#55cfff!important}
.runner404-power-timer.is-fire.is-active b{color:#ffad55!important}
@media(max-width:620px){.runner404-power-timer{display:inline-flex!important}.runner404-stats{row-gap:6px!important}}

/* Public content-copy deterrence. Form controls remain usable/selectable. */
.content-protected body,
.content-protected main,
.content-protected header,
.content-protected footer,
.content-protected section,
.content-protected article,
.content-protected figure,
.content-protected nav,
.content-protected .site-header,
.content-protected .site-footer{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
.content-protected img,
.content-protected video,
.content-protected picture,
.content-protected svg{
  -webkit-user-drag:none;
  user-drag:none;
}
.content-protected input,
.content-protected textarea,
.content-protected select,
.content-protected [contenteditable="true"],
.content-protected .live-chat-panel,
.content-protected .live-chat-panel *{
  -webkit-user-select:text;
  user-select:text;
  -webkit-touch-callout:default;
}
@media print{
  body{display:none!important}
}


/* FINAL LIVE FIX — contact-card spacing + smooth mobile nav close */
.contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
  gap:10px!important;
}
@media(max-width:760px){
  .contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:3px 6px 5px 2px!important;
  }
}
@media(max-width:1180px){
  .mobile-panel{transition:opacity .30s ease,transform .30s ease,visibility 0s linear .30s!important}
  .site-header.nav-open .mobile-panel{transition:opacity .30s ease,transform .30s ease,visibility 0s!important}
}

/* FINAL ACTUAL MOBILE FIX — authoritative last rules */
@media (max-width:760px){
  .contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:10px!important;
    row-gap:10px!important;
    padding:4px 6px 8px 2px!important;
    max-height:410px!important;
    min-height:0!important;
    overflow-y:auto!important;
    align-content:start!important;
  }
  .contact-new .contact-form-step[data-contact-step="3"] .contact-check{
    min-width:0!important;
    margin:0!important;
  }
  .contact-new .contact-form-step[data-contact-step="3"] .contact-check span{
    min-height:48px!important;
    height:100%!important;
    display:flex!important;
    align-items:center!important;
    padding:10px 32px 10px 11px!important;
    line-height:1.25!important;
    font-size:10px!important;
  }
}
@media (max-width:380px){
  .contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:8px!important;
    row-gap:8px!important;
  }
  .contact-new .contact-form-step[data-contact-step="3"] .contact-check span{
    min-height:46px!important;
    padding:9px 28px 9px 9px!important;
    font-size:9.4px!important;
  }
}

/* Closing state must override GSAP's inline open styles until the transition finishes. */
@media (max-width:1180px){
  .site-header .mobile-panel{
    transition:opacity .34s cubic-bezier(.4,0,.2,1),transform .34s cubic-bezier(.4,0,.2,1),visibility 0s linear .34s!important;
  }
  .site-header.nav-open:not(.nav-closing) .mobile-panel{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:translateY(0)!important;
    transition:opacity .34s cubic-bezier(.4,0,.2,1),transform .34s cubic-bezier(.4,0,.2,1),visibility 0s!important;
  }
  .site-header.nav-open.nav-closing .mobile-panel{
    opacity:0!important;
    visibility:visible!important;
    pointer-events:none!important;
    transform:translateY(-18px)!important;
    transition:opacity .34s cubic-bezier(.4,0,.2,1),transform .34s cubic-bezier(.4,0,.2,1),visibility 0s linear .34s!important;
  }
}

/* FINAL CONTACT STEP-3 CARD LAYOUT — no overlap, natural rows */
.contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  column-gap:12px!important;
  row-gap:12px!important;
  align-items:start!important;
  align-content:start!important;
  grid-auto-rows:max-content!important;
  padding:4px 8px 8px 2px!important;
  box-sizing:border-box!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .contact-check{
  display:block!important;
  position:relative!important;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
.contact-new .contact-form-step[data-contact-step="3"] .contact-check span{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  height:auto!important;
  min-height:48px!important;
  margin:0!important;
  padding:11px 36px 11px 13px!important;
  box-sizing:border-box!important;
  line-height:1.3!important;
  white-space:normal!important;
  overflow:visible!important;
  transform:none!important;
}
@media(max-width:760px){
  .contact-new .contact-form-step[data-contact-step="3"] .contact-service-options{
    grid-template-columns:1fr!important;
    row-gap:10px!important;
    column-gap:0!important;
    max-height:430px!important;
    overflow-y:auto!important;
    padding:4px 6px 8px 2px!important;
  }
  .contact-new .contact-form-step[data-contact-step="3"] .contact-check span{
    min-height:48px!important;
    font-size:10.5px!important;
    padding:11px 36px 11px 12px!important;
  }
}

/* Live chat voice notes */
.live-chat-mic{width:42px;height:42px;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:rgba(255,255,255,.05);color:#fff;display:grid;place-items:center;flex:0 0 auto;cursor:pointer}.live-chat-mic.is-recording{background:#ff4d67;border-color:#ff4d67;animation:dotMicPulse 1s infinite}.live-chat-bubble audio{width:220px;max-width:100%;display:block}@keyframes dotMicPulse{50%{transform:scale(.94);opacity:.72}}

/* Audio-only support call */
.live-chat-call-btn{width:36px;height:36px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.05);color:#64d98b;font-size:18px;display:grid;place-items:center;cursor:pointer;margin-left:auto;margin-right:6px}.live-call-layer{position:absolute;inset:0;z-index:12;background:rgba(4,10,15,.94);backdrop-filter:blur(16px);display:grid;place-items:center;padding:22px}.live-call-layer[hidden]{display:none!important}.live-call-card{text-align:center;display:grid;justify-items:center;gap:10px;color:#fff}.live-call-avatar{width:76px;height:76px;border-radius:24px;background:linear-gradient(145deg,#168ec9,#55c6f2);display:grid;place-items:center;font-size:34px;font-weight:900;box-shadow:0 16px 50px rgba(37,159,220,.25)}.live-call-card strong{font-size:18px}.live-call-card span{font-size:12px;color:#95aab7}.live-call-actions{display:flex;gap:14px;margin-top:14px}.live-call-actions button{min-width:112px;height:46px;border:0;border-radius:999px;color:#fff;font-weight:800;cursor:pointer}.live-call-actions .is-danger{background:#e64f5f}.live-call-actions .is-accept{background:#27b86f}.live-call-actions .is-accept[hidden]{display:none}

/* FINAL LIVE CHAT COMPOSER — mic | message | send */
.live-chat-form{
  display:grid!important;
  grid-template-columns:42px minmax(0,1fr) 42px!important;
  align-items:end!important;
  gap:8px!important;
  padding:12px 12px 8px!important;
}
.live-chat-form .live-chat-mic{
  grid-column:1!important;
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  margin:0!important;
  padding:0!important;
  align-self:end!important;
}
.live-chat-form textarea{
  grid-column:2!important;
  width:100%!important;
  min-width:0!important;
  min-height:42px!important;
  max-height:96px!important;
  margin:0!important;
  padding:11px 12px!important;
  line-height:1.4!important;
  overflow-y:auto!important;
  resize:none!important;
}
.live-chat-form > button[type="submit"]{
  grid-column:3!important;
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  margin:0!important;
  padding:0!important;
  align-self:end!important;
}
@media(max-width:480px){
  .live-chat-form{
    grid-template-columns:40px minmax(0,1fr) 40px!important;
    gap:7px!important;
    padding:10px 10px 7px!important;
  }
  .live-chat-form .live-chat-mic,
  .live-chat-form > button[type="submit"]{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
  }
  .live-chat-form textarea{
    min-height:40px!important;
    font-size:16px!important;
  }
}

/* FINAL LIVE CHAT MICROPHONE PERMISSION UX */
.live-chat-permission{
  margin:0 12px 8px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.045);
  color:#aebbc4;
  font-size:10px;
  line-height:1.45;
  display:flex;
  align-items:center;
  gap:8px;
}
.live-chat-permission[hidden]{display:none!important}
.live-chat-permission span{min-width:0;flex:1}
.live-chat-permission button{
  flex:0 0 auto;
  min-height:30px;
  padding:0 11px;
  border:1px solid rgba(74,180,235,.4);
  border-radius:999px;
  background:rgba(52,155,219,.14);
  color:#dff4ff;
  font:inherit;
  font-weight:700;
  cursor:pointer;
}
.live-chat-permission.is-error{border-color:rgba(255,92,111,.28);background:rgba(255,77,103,.07);color:#ffc8d0}
.live-chat-permission.is-info{border-color:rgba(74,180,235,.22);background:rgba(52,155,219,.07);color:#bfe8ff}

/* FINAL VOICE UPLOAD FALLBACK + CALL POLISH */
.live-chat-permission .live-chat-upload-audio{background:transparent!important;border-color:rgba(255,255,255,.16)!important;color:#c9d6de!important}
.live-chat-call-btn{transition:transform .18s ease,background .18s ease,border-color .18s ease}.live-chat-call-btn:hover{transform:translateY(-1px);background:rgba(54,210,122,.1);border-color:rgba(54,210,122,.34)}
.live-call-card{min-width:240px}.live-call-card [data-call-status]{min-height:18px}
@media(max-width:480px){.live-chat-permission{flex-wrap:wrap}.live-chat-permission span{flex-basis:100%}.live-chat-permission button{min-height:32px}}
/* V6 compact voice-note player */
.live-chat-bubble:has(.live-chat-voice){padding:10px 11px;min-width:220px}
.live-chat-voice{width:100%;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;border:0;background:transparent;color:inherit;padding:0;cursor:pointer;text-align:left}
.live-chat-voice-play{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);font-size:12px;line-height:1}
.live-chat-voice-bars{height:26px;display:flex;align-items:center;gap:3px;overflow:hidden}.live-chat-voice-bars i{display:block;width:3px;border-radius:3px;background:currentColor;opacity:.6}.live-chat-voice-bars i:nth-child(1){height:8px}.live-chat-voice-bars i:nth-child(2){height:14px}.live-chat-voice-bars i:nth-child(3){height:20px}.live-chat-voice-bars i:nth-child(4){height:12px}.live-chat-voice-bars i:nth-child(5){height:18px}.live-chat-voice-bars i:nth-child(6){height:10px}
.live-chat-voice-dur{font-size:11px;opacity:.82;font-variant-numeric:tabular-nums}.live-chat-voice.is-playing .live-chat-voice-bars i{animation:dotVoiceBars .8s ease-in-out infinite alternate}.live-chat-voice.is-playing .live-chat-voice-bars i:nth-child(2){animation-delay:.1s}.live-chat-voice.is-playing .live-chat-voice-bars i:nth-child(3){animation-delay:.2s}.live-chat-voice.is-playing .live-chat-voice-bars i:nth-child(4){animation-delay:.3s}.live-chat-voice.is-playing .live-chat-voice-bars i:nth-child(5){animation-delay:.15s}@keyframes dotVoiceBars{to{transform:scaleY(.45);opacity:1}}


/* V7 — full-screen incoming voice call */
.live-call-layer{position:fixed!important;inset:0!important;z-index:2147483000!important;background:radial-gradient(circle at 50% 22%,rgba(45,174,232,.18),transparent 30%),rgba(3,10,15,.96)!important;backdrop-filter:blur(22px)!important;padding:24px!important;place-items:center!important}
.live-call-card{width:min(390px,calc(100vw - 32px));padding:34px 26px 28px;border:1px solid rgba(255,255,255,.1);border-radius:30px;background:linear-gradient(180deg,rgba(15,31,42,.96),rgba(7,19,29,.98));box-shadow:0 30px 90px rgba(0,0,0,.5);gap:12px!important}
.live-call-avatar{width:96px!important;height:96px!important;border-radius:50%!important;background:#0b2231 url('/assets/compact-mark.png') center/62px 62px no-repeat!important;color:transparent!important;border:1px solid rgba(73,189,239,.35);box-shadow:0 0 0 12px rgba(53,174,232,.05),0 0 0 24px rgba(53,174,232,.025);animation:dotIncomingPulse 1.9s ease-in-out infinite}
.live-call-card strong{font-size:24px!important;letter-spacing:-.025em}.live-call-card span{font-size:14px!important;color:#9fb1bd!important}.live-call-actions{width:100%;justify-content:center;gap:18px!important;margin-top:22px!important}.live-call-actions button{min-width:132px!important;height:56px!important;font-size:15px!important;box-shadow:0 10px 28px rgba(0,0,0,.2)}
.live-call-actions .is-danger{background:#e94f61!important}.live-call-actions .is-accept{background:#23bb72!important}
@keyframes dotIncomingPulse{0%,100%{transform:scale(1);box-shadow:0 0 0 12px rgba(53,174,232,.05),0 0 0 24px rgba(53,174,232,.025)}50%{transform:scale(1.035);box-shadow:0 0 0 18px rgba(53,174,232,.07),0 0 0 34px rgba(53,174,232,.02)}}
@media(max-width:600px){.live-call-layer{padding:16px!important}.live-call-card{padding:30px 20px 24px;border-radius:26px}.live-call-avatar{width:88px!important;height:88px!important;background-size:56px 56px!important}.live-call-actions button{min-width:118px!important;height:54px!important}}

/* V8 — compact smart voice-call card */
.live-call-layer{
  position:fixed!important;
  inset:auto 24px 96px auto!important;
  width:min(340px,calc(100vw - 32px))!important;
  min-height:0!important;
  z-index:2147483000!important;
  display:block!important;
  padding:0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  pointer-events:none!important;
}
.live-call-layer[hidden]{display:none!important}
.live-call-card{
  pointer-events:auto!important;
  width:100%!important;
  display:grid!important;
  grid-template-columns:58px 1fr!important;
  grid-template-areas:"avatar title" "avatar status" "actions actions"!important;
  align-items:center!important;
  justify-items:start!important;
  gap:3px 14px!important;
  padding:18px!important;
  border:1px solid rgba(111,195,238,.24)!important;
  border-radius:22px!important;
  background:linear-gradient(155deg,rgba(9,28,40,.98),rgba(5,17,25,.98))!important;
  box-shadow:0 22px 70px rgba(0,0,0,.38),0 0 0 1px rgba(255,255,255,.02) inset!important;
  text-align:left!important;
}
.live-call-avatar{grid-area:avatar;width:58px!important;height:58px!important;border-radius:18px!important;font-size:0!important;background:#0b2231 url('/assets/compact-mark.png') center/38px 38px no-repeat!important;box-shadow:none!important}
.live-call-card strong{grid-area:title;font-size:15px!important;line-height:1.2!important;margin:0!important}
.live-call-card span{grid-area:status;font-size:12px!important;color:#91a7b5!important}
.live-call-actions{grid-area:actions;width:100%!important;display:flex!important;gap:10px!important;margin-top:14px!important}
.live-call-actions button{flex:1!important;min-width:0!important;height:42px!important;border-radius:14px!important;font-size:13px!important}
@media(max-width:600px){
  .live-call-layer{right:12px!important;left:12px!important;bottom:88px!important;width:auto!important}
  .live-call-card{padding:15px!important;border-radius:20px!important;grid-template-columns:52px 1fr!important}
  .live-call-avatar{width:52px!important;height:52px!important;border-radius:16px!important;background-size:34px 34px!important}
  .live-call-actions button{height:40px!important}
}