@font-face{font-family:"Titillium Web";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/titillium-300.woff2") format("woff2")}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/titillium-400.woff2") format("woff2")}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/titillium-600.woff2") format("woff2")}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/titillium-700.woff2") format("woff2")}
:root{--char:#16181B;--char2:#1E2125;--navy:#102033;--red:#C8102E;--red-hi:#EE3B50;--steel:#C9D3DD;--grey:#A7AEB6;--header-h:96px;--wrap:1160px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 8px)}
body{margin:0;font-family:"Titillium Web",system-ui,sans-serif;font-weight:400;color:#fff;background:var(--char);line-height:1.6;font-synthesis:none;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:"Titillium Web",system-ui,sans-serif;margin:0;line-height:1.12}
.wrap{width:min(var(--wrap),calc(100% - 48px));margin-inline:auto}
.eyebrow{display:inline-block;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--red-hi);margin:0 0 10px}
.eyebrow::before{content:"[ "}.eyebrow::after{content:" ]"}
.h2{font-size:clamp(30px,3.4vw,44px);font-weight:300;letter-spacing:.01em}
.rule{display:block;width:64px;border-top:2px dotted rgba(255,255,255,.75);margin:18px 0 0}
.center{text-align:center}.center .rule{margin-inline:auto}

/* buttons with offset outline lines */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 26px;background:#fff;color:#16181B;text-decoration:none;font-weight:700;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;border:0;cursor:pointer;transition:transform .3s ease}
.btn::before,.btn::after{content:"";position:absolute;pointer-events:none;background:rgba(255,255,255,.85);transition:transform .3s ease}
.btn::before{left:6px;right:-8px;bottom:-7px;height:1px}
.btn::after{right:-8px;top:8px;bottom:-7px;width:1px}
.btn:hover{transform:translate(-2px,-2px)}
.btn:hover::before,.btn:hover::after{transform:translate(4px,3px)}
.btn.red{background:var(--red);color:#fff}
.btn.red::before,.btn.red::after{background:rgba(238,59,80,.9)}
.btn:focus-visible,.tab:focus-visible,.node:focus-visible,.arrow:focus-visible,.track:focus-visible{outline:2px solid var(--red-hi);outline-offset:4px}

/* header: transparent over hero, centered logo, split nav, sticky solid on scroll */
.site-header{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .35s ease,box-shadow .35s ease,padding .35s ease;padding:6px 0}
.site-header.stuck{background:rgba(22,24,27,.97);box-shadow:0 6px 24px rgba(0,0,0,.35);padding:0}
.site-header .bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;min-height:var(--header-h)}
.nav{display:flex;align-items:center;gap:30px;margin:0;padding:0;list-style:none}
.nav.left{justify-content:flex-end}.nav.right{justify-content:flex-start}
.nav a{text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#fff;position:relative;padding:6px 0;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
.nav a:hover::after{transform:scaleX(1)}
.nav a.phone{background:var(--red);padding:9px 14px;letter-spacing:.08em;text-shadow:none;white-space:nowrap}
.nav a.phone::after{display:none}
.logo{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:#fff;line-height:1;padding:6px 8px}
.logo .word{font-weight:700;font-size:30px;letter-spacing:.01em;white-space:nowrap}
.logo .bar-mark{width:100%;max-width:190px;height:9px;margin:6px 0;display:block}
.logo .sub{font-size:10.5px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--steel)}
.menu-toggle{display:none;width:46px;height:46px;background:none;border:0;padding:10px;cursor:pointer}
.menu-toggle span{display:block;height:2px;background:#fff;margin:6px 0;transition:transform .3s ease,opacity .3s ease}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
.mobile-nav{display:none}

/* hero slider */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;max-height:1000px;overflow:hidden;background:#0c0d0f var(--hero-poster,none) center/cover no-repeat}
.slide{position:absolute;inset:0;overflow:hidden;visibility:hidden;transform:translateX(100%);transition:transform 1s cubic-bezier(.77,0,.18,1),visibility 0s linear 1s}
.slide.active{visibility:visible;transform:none;transition:transform 1s cubic-bezier(.77,0,.18,1),visibility 0s}
.slide.out{visibility:visible;transform:translateX(-100%)}
.slide.first-load{transition:none}
.slide .media{position:absolute;inset:0;background-position:center;background-size:cover;background-repeat:no-repeat}
.slide .media img,.slide .media video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover}
.slide.kb .media img{transform-origin:50% 60%}
.slide.kb.active .media img{animation:kenburns 10s linear forwards}
@keyframes kenburns{from{transform:scale(1) translateY(0)}to{transform:scale(1.2) translateY(-4%)}}
.slide .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,13,15,.6) 0%,rgba(12,13,15,.3) 40%,rgba(12,13,15,.62) 100%)}
.slide .word{position:absolute;left:0;right:0;top:50%;transform:translateY(-46%);text-align:center;padding:0 24px;margin:0;font-weight:700;text-transform:uppercase;color:transparent;-webkit-text-stroke:2px #fff;font-size:clamp(54px,10.4vw,150px);line-height:1;letter-spacing:.02em}
.slide .word .ln{display:block;overflow:hidden;padding:.06em 0;white-space:nowrap}
.slide .word .ch{display:inline-block;transform:translateY(110%) rotate(-35deg);opacity:0;transform-origin:0 100%}
.slide.active .word .ch{animation:chIn 1.2s cubic-bezier(.77,0,.18,1) forwards;animation-delay:calc(.35s + var(--i) * 60ms)}
@keyframes chIn{to{transform:none;opacity:1}}
.slide .caption{position:absolute;left:50%;bottom:150px;transform:translateX(-50%);margin:0;background:rgba(16,32,51,.92);color:#fff;padding:7px 14px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;opacity:0;transition:opacity .6s ease .9s}
.slide.active .caption{opacity:1}
.hero-intro{position:absolute;left:0;right:0;top:calc(var(--header-h) + 34px);z-index:4;text-align:center;pointer-events:none}
.hero-intro h1{font-size:14px;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:#fff;margin:0 auto;max-width:1000px;text-shadow:0 2px 12px rgba(0,0,0,.7);padding:0 20px}
.hero-ctl{position:absolute;right:max(24px,calc((100% - var(--wrap))/2));bottom:150px;z-index:5;display:flex;gap:8px}
.arrow{width:46px;height:46px;display:grid;place-items:center;background:rgba(22,24,27,.55);border:1px solid rgba(255,255,255,.45);color:#fff;cursor:pointer;transition:background .25s ease,border-color .25s ease}
.arrow:hover{background:var(--red);border-color:var(--red)}
.arrow svg{width:20px;height:20px}
.dots{position:absolute;left:max(24px,calc((100% - var(--wrap))/2));bottom:170px;z-index:5;display:flex;gap:10px}
.dots button{width:34px;height:4px;padding:0;border:0;background:rgba(255,255,255,.4);cursor:pointer;position:relative;overflow:hidden}
.dots button i{position:absolute;inset:0;background:var(--red);transform:scaleX(0);transform-origin:left}
.dots button.on i{animation:dotfill var(--dur,8s) linear forwards}
@keyframes dotfill{to{transform:scaleX(1)}}
.hero .tilt{position:absolute;left:0;right:0;bottom:-1px;z-index:3;height:110px;width:100%;display:block}

/* tilt dividers */
.tilt-top,.tilt-bot{position:absolute;left:0;width:100%;height:90px;display:block;z-index:2;pointer-events:none}
.tilt-top{top:-1px}.tilt-bot{bottom:-1px}

/* intro */
.intro{position:relative;background:var(--char);padding:70px 0 110px}
.intro .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.lead{font-size:clamp(18px,1.6vw,21px);font-weight:600;line-height:1.85;margin:26px 0 0}
.lead p{margin:0}
.hl{position:relative;display:inline-block;color:var(--red-hi);white-space:nowrap}
.hl svg{position:absolute;left:-4%;width:108%;height:20px;bottom:-12px;overflow:visible;pointer-events:none}
.hl path{fill:none;stroke:var(--red);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;vector-effect:non-scaling-stroke}
.hl.draw path{animation:draw 1.2s ease forwards}
.hl.draw path+path{animation-delay:.25s}
@keyframes draw{to{stroke-dashoffset:0}}
.intro .actions{margin-top:34px;display:flex;gap:22px;flex-wrap:wrap}
.intro .body{color:var(--grey);font-size:16px;margin:22px 0 0;max-width:56ch}
.mosaic{display:grid;grid-template-columns:1.05fr 1fr;grid-template-rows:240px 240px;gap:10px;min-width:0}
.mosaic figure{margin:0;position:relative;overflow:hidden;background:#222 center/cover no-repeat;min-width:0}
.mosaic figure:first-child{grid-row:1 / span 2}
.mosaic img,.proj img,.pmedia img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.mosaic figure:hover img,.proj:hover img{transform:scale(1.1)}
.mosaic figcaption,.proj figcaption{position:absolute;left:10px;bottom:10px;z-index:1;background:rgba(16,32,51,.92);color:#fff;font-size:12px;font-weight:600;letter-spacing:.06em;padding:6px 10px;line-height:1.3;max-width:calc(100% - 20px)}

/* counters */
.stats{position:relative;background:var(--char2);padding:54px 0}
.stats .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.stat{text-align:center;border-left:1px solid rgba(255,255,255,.12);padding:6px 10px}
.stat:first-child{border-left:0}
.stat .num{display:block;font-size:clamp(40px,4.4vw,58px);font-weight:300;line-height:1;font-variant-numeric:tabular-nums}
.stat .num small{font-size:.5em;color:var(--red-hi);font-weight:600;margin-left:2px}
.stat .lbl{display:block;margin-top:10px;font-size:12.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--steel)}

/* products suite */
.products{position:relative;background:#0F1113;padding:130px 0 120px}
.products .head{max-width:760px;margin:0 auto 46px}
.products .head p{color:var(--grey);font-size:17px;margin:16px auto 0;max-width:62ch}
.tabs{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;margin:0 0 34px}
.tab{width:100%;background:var(--char2);border:0;border-bottom:2px solid rgba(255,255,255,.25);color:#fff;font:inherit;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:18px 8px 14px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:10px;transition:background .3s ease,border-color .3s ease,transform .35s ease;min-height:118px;line-height:1.25}
.tab svg{width:40px;height:40px;color:var(--steel);transition:transform .35s ease,color .3s ease}
.tab:hover{transform:translateY(-6px)}
.tab[aria-selected="true"]{background:var(--navy);border-color:var(--red)}
.tab[aria-selected="true"] svg{color:#fff}
.panel{display:none;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:44px;align-items:center}
.panel.on{display:grid;animation:panelIn .6s ease both}
@keyframes panelIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.pmedia{position:relative;min-width:0;aspect-ratio:16/10;overflow:hidden;background:#1d2024 center/cover no-repeat}
.pmedia:hover img{transform:scale(1.08)}
.pmedia.draw{background:linear-gradient(135deg,#1A3050,#102033);display:grid;place-items:center}
.pmedia.draw svg{width:78%;height:auto;color:#fff}
.panel h3{font-size:30px;font-weight:300;margin-bottom:14px}
.panel p{color:#D5DBE1;font-size:16.5px;margin:0 0 16px}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ticks li{position:relative;padding-left:28px;font-size:15.5px}
.ticks li::before{content:"";position:absolute;left:0;top:.42em;width:14px;height:8px;border-left:2px solid var(--red-hi);border-bottom:2px solid var(--red-hi);transform:rotate(-45deg)}

/* process */
.process{position:relative;background:var(--char);padding:130px 0 120px;overflow:hidden}
.process .head{margin-bottom:40px;max-width:760px}
.process .head p{color:var(--grey);font-size:17px;margin:16px 0 0}
.arc{display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;align-items:center}
.hub{width:280px;height:280px;border-radius:50%;background:radial-gradient(circle at 50% 40%,#25415f,#102033 70%);border:8px solid #2b3440;box-shadow:0 0 0 10px rgba(255,255,255,.06),0 20px 50px rgba(0,0,0,.5);display:grid;place-items:center;text-align:center}
.hub .word{font-weight:700;font-size:34px;line-height:1}
.hub .bar-mark{display:block;width:170px;height:9px;margin:8px auto}
.hub .sub{font-size:11px;letter-spacing:.3em;font-weight:600;text-transform:uppercase;color:var(--steel)}
.hub .step-now{display:block;margin-top:14px;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--red-hi);font-weight:700;min-height:1.6em;padding:0 22px}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.step{display:grid;grid-template-columns:112px minmax(0,1fr);gap:22px;align-items:center;opacity:0;transform:translateX(40px);transition:opacity .6s ease,transform .6s ease;margin-left:calc(var(--off) * 1px)}
.steps.in .step{opacity:1;transform:none;transition-delay:calc(var(--i) * 140ms)}
.node{position:relative;width:104px;height:104px;border-radius:50%;background:#C9D3DD;color:#102033;border:6px solid #fff;display:grid;place-items:center;text-align:center;font:inherit;font-weight:700;font-size:14px;line-height:1.15;cursor:pointer;transition:transform .35s ease,background .35s ease,color .35s ease,box-shadow .35s ease;padding:6px}
.node .n{display:block;font-size:11px;letter-spacing:.14em;color:#4F5F72;margin-bottom:2px}
.node::before{content:"";position:absolute;left:-44px;top:50%;width:34px;border-top:2px dotted rgba(255,255,255,.45)}
.step.on .node{background:var(--red);color:#fff;transform:scale(1.08);box-shadow:0 0 0 8px rgba(200,16,46,.22)}
.step.on .node .n{color:#FFE3E7}
.step .txt{font-size:16px;font-weight:600;margin:0;max-width:62ch;transition:color .3s ease;color:#fff}
.step:not(.on) .txt{color:#C3CAD2}
.step .txt em{font-style:normal;color:var(--red-hi)}

/* projects carousel */
.projects{position:relative;background:#0F1113;padding:130px 0 70px}
.projects .top{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:34px;flex-wrap:wrap}
.projects .ctl{display:flex;gap:8px}
.track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((min(var(--wrap),100vw - 48px) - 32px) / 3);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:max(24px,calc((100% - var(--wrap))/2));padding:0 max(24px,calc((100% - var(--wrap))/2)) 12px;scrollbar-width:none;cursor:grab}
.track::-webkit-scrollbar{display:none}
.track.drag{cursor:grabbing;scroll-snap-type:none}
.proj{position:relative;margin:0;scroll-snap-align:start;aspect-ratio:4/3;overflow:hidden;background:#222 center/cover no-repeat;min-width:0}
.proj img{pointer-events:none;user-select:none}
.proj figcaption{left:12px;bottom:12px;font-size:13px}
.reach{color:var(--grey);font-size:15px;margin:26px 0 0;max-width:80ch}

/* CTA band */
.cta{position:relative;overflow:hidden;padding:170px 0;background:#0c0d0f}
.cta .bg{position:absolute;inset:-40px;background:#0c0d0f var(--cta-img,none) center 45%/cover no-repeat;will-change:transform;transition:transform .25s ease-out}
.cta .bg img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 45%}
.cta .shade{position:absolute;inset:0;background:rgba(12,13,15,.35)}
.cta .box{position:relative;z-index:3;max-width:760px;margin:0 auto;text-align:center;background:rgba(22,24,27,.92);padding:46px 44px 50px;border-top:3px solid var(--red)}
.cta h2{font-size:clamp(26px,3vw,38px);font-weight:300}
.cta p{color:#D5DBE1;font-size:17px;margin:14px auto 0;max-width:52ch}
.cta .actions{display:flex;justify-content:center;gap:26px;flex-wrap:wrap;margin-top:30px}

/* footer */
.site-footer{background:var(--char);padding:70px 0 0}
.ft{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start;padding-bottom:50px}
.ft .brand{text-align:center;display:flex;flex-direction:column;align-items:center}
.ft .brand .logo .word{font-size:34px}
.ft .tag{font-size:14px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);margin:14px 0 18px}
.ft .row{display:flex;align-items:flex-start;gap:12px;margin:0 0 12px;color:#D5DBE1;font-size:15.5px}
.ft .row svg{width:20px;height:20px;flex:0 0 auto;margin-top:3px;color:var(--steel)}
.ft .row a{text-decoration:none}
.ft .row a:hover{color:#fff;text-decoration:underline}
.ft h3{font-size:15px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:6px 0 18px}
.social{display:flex;gap:10px;margin-top:18px}
.social a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;transition:background .25s ease,border-color .25s ease}
.social a:hover{background:var(--red);border-color:var(--red)}
.social svg{width:16px;height:16px}
.badges{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;align-items:center}
.badge{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-width:0}
.badge b{display:block;font-size:24px;font-weight:700;letter-spacing:.08em;line-height:1}
.badge span{display:block;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);margin-top:6px;font-weight:600;line-height:1.35}
.copy{border-top:1px solid rgba(255,255,255,.12);padding:22px 0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--grey);font-size:14px}
.copy a{text-decoration:none}.copy a:hover{color:#fff}

/* scroll reveal */
.js [data-anim]{opacity:0;transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.js [data-anim="slideInLeft"]{transform:translateX(-80px)}
.js [data-anim="slideInRight"]{transform:translateX(80px)}
.js [data-anim="slideInDown"]{transform:translateY(-40px)}
.js [data-anim="fadeInLeft"]{transform:translateX(-40px)}
.js [data-anim="fadeInUp"]{transform:translateY(40px)}
.js [data-anim].in{opacity:1;transform:none}
[data-delay="1"]{transition-delay:.12s}[data-delay="2"]{transition-delay:.24s}
html:not(.js) .step{opacity:1;transform:none}

@media (max-width:1100px){.nav{gap:18px}.nav a{font-size:12px;letter-spacing:.08em}.tabs{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:960px){
  :root{--header-h:76px}
  .site-header{padding:0;background:rgba(22,24,27,.55)}
  .site-header .bar{grid-template-columns:1fr auto;gap:12px}
  .nav{display:none}
  .site-header .logo{align-items:flex-start;padding:6px 0}
  .site-header .logo .word{font-size:24px}
  .site-header .logo .bar-mark{max-width:150px;height:7px;margin:5px 0}
  .site-header .logo .sub{font-size:9px;letter-spacing:.28em}
  .menu-toggle{display:block}
  .mobile-nav{display:block;position:fixed;left:0;right:0;top:var(--header-h);bottom:0;z-index:49;background:rgba(16,18,21,.985);padding:18px 24px 40px;overflow-y:auto;transform:translateY(-12px);opacity:0;visibility:hidden;transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s;border-top:2px solid var(--red)}
  .mobile-nav.open{opacity:1;transform:none;visibility:visible;transition:opacity .3s ease,transform .3s ease}
  .mobile-nav a{display:block;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.1);text-decoration:none;font-size:15px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
  .mobile-nav .btn{display:flex;margin-top:26px;width:calc(100% - 8px);border-bottom:0;padding:14px}
  body.menu-open{overflow:hidden}
  body.menu-open .site-header{background:rgba(16,18,21,.985)}
  .intro .grid,.panel,.arc{grid-template-columns:minmax(0,1fr)}
  .mosaic{grid-template-rows:210px 210px}
  .stats .grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:34px}
  .stat:nth-child(3){border-left:0}
  .hub{margin:0 auto 10px;width:240px;height:240px}
  .hub .word{font-size:28px}.hub .bar-mark{width:140px}
  .step{margin-left:0}
  .node::before{display:none}
  .track{grid-auto-columns:calc((100vw - 48px - 16px) / 1.6)}
  .ft{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ft .brand{grid-column:1 / -1}
  .hero-ctl{bottom:96px}.dots{bottom:112px}
  .slide .caption{bottom:170px}
  .hero-intro{top:calc(var(--header-h) + 22px)}
  .hero-intro h1{font-size:12px;letter-spacing:.2em}
}
@media (max-width:600px){
  .wrap{width:calc(100% - 32px)}
  .slide .word{-webkit-text-stroke:1.4px #fff;font-size:min(12.4vw,calc(124vw / var(--len,6)));letter-spacing:.04em;padding:0 12px}
  .hero .tilt{height:60px}
  .tilt-top,.tilt-bot{height:46px}
  .tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tabs .tab:last-child{grid-column:1 / -1}
  .tab{min-height:96px;font-size:11.5px}
  .tab svg{width:32px;height:32px}
  .products,.process,.projects{padding:90px 0 80px}
  .cta{padding:110px 0}
  .cta .box{padding:32px 22px 36px}
  .step{grid-template-columns:86px minmax(0,1fr);gap:16px}
  .node{width:84px;height:84px;font-size:12px;border-width:4px}
  .node .n{font-size:10px}
  .step .txt{font-size:15px}
  .track{grid-auto-columns:84%;padding:0 16px 12px;scroll-padding-inline:16px}
  .ft{grid-template-columns:minmax(0,1fr)}
  .mosaic{grid-template-columns:minmax(0,1fr);grid-template-rows:240px 190px 190px}
  .mosaic figure:first-child{grid-row:auto}
  .lead{line-height:1.7}
  .lead p{display:inline}
  .hl{white-space:normal}
  .slide .caption{white-space:normal;text-align:center;max-width:calc(100% - 40px)}
}
@media (max-width:400px){
  .stats .grid{grid-template-columns:minmax(0,1fr)}
  .stat{border-left:0 !important;border-top:1px solid rgba(255,255,255,.12);padding-top:18px}
  .stat:first-child{border-top:0}
  .intro .actions,.cta .actions{flex-direction:column;align-items:stretch}
  .projects .top{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-delay:0s !important;transition-duration:.001ms !important;transition-delay:0s !important}
  .slide.kb.active .media img{animation:none}
  .js [data-anim]{opacity:1;transform:none}
  .slide .word .ch,.steps .step{opacity:1;transform:none}
}
@media (max-width:600px){.eyebrow{letter-spacing:.14em;font-size:11px}}

/* client logo (vector from email signature) */
.logo .logo-img{display:block;height:56px;width:auto;max-width:none}
.ft .brand .logo .logo-img{height:91px;margin-bottom:18px}
.hub-logo{display:block;width:184px;height:auto;margin:0 auto}
@media (max-width:900px){.hub-logo{width:156px}}
@media (max-width:960px){.site-header .logo .logo-img{height:44px}}

/* ===== multi-page additions (shared by all pages) ===== */
html,body{overflow-x:clip}
.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}
.nav a.is-active::after{transform:scaleX(1)}
.nav a.is-active{color:#fff}
.mobile-nav a.is-active{color:var(--red-hi)}
.more{display:inline-flex;align-items:center;gap:8px;margin-top:20px;color:#fff;text-decoration:none;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-bottom:2px solid var(--red);padding-bottom:4px}
.more svg{width:16px;height:16px;transition:transform .3s ease}
.more:hover svg{transform:translateX(4px)}
.sec-more{margin-top:44px}
.reach-row{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap}
.reach-row .reach{flex:1 1 520px}
.ft-nav{display:flex;flex-wrap:wrap;gap:8px 22px;list-style:none;margin:0;padding:0}
.ft-nav a{text-decoration:none}.ft-nav a:hover{color:#fff}

/* official PCI Certified Plant mark, white single-color recolor for dark backgrounds */
.badge.pci{border:0;background:transparent;padding:0}
.badge.pci img{width:132px;height:132px;display:block}
.badge.dot{border:2px solid #fff;background:transparent;padding:10px;width:132px;height:132px;color:#fff;box-sizing:border-box}
.badge.dot b{font-size:26px;color:#fff}
@media (max-width:600px){
  .badge.pci img,.badge.dot{width:120px;height:120px}
  .badge.dot b{font-size:22px}
}
