@font-face{font-family:Bebas;src:url(../fonts/bebas-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url(../fonts/barlow-900.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:Grotesk;src:url(../fonts/grotesk.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:VT;src:url(../fonts/vt-400.woff2) format("woff2");font-weight:400;font-display:swap}
:root{
 --g:clamp(20px,5.5vw,40px);
 --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;--s10:128px;
 --paper:#f7f5f0;--ink:#1b1917;--ink2:rgba(27,25,23,.62);--line:rgba(27,25,23,.12);
 --red:#e8463a;--cobalt:#2340c8;--night:#17151c;--amber:#f0b429;--navy:#0b1730;
 --d:'Bebas',Impact,'Arial Narrow',sans-serif;--n:'Barlow',Impact,sans-serif;--u:'Grotesk','Helvetica Neue',Arial,sans-serif;--m:'VT',ui-monospace,monospace;
 --eo:cubic-bezier(.22,1,.36,1);--eio:cubic-bezier(.65,0,.35,1);
 --navh:46px;--navt:max(var(--g),env(safe-area-inset-top))
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:auto}
body{font-family:var(--u);color:var(--ink);background:var(--paper);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{display:block;max-width:100%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;top:-60px;left:var(--g);z-index:10050;background:var(--ink);color:#fff;padding:12px 16px;border-radius:10px;font-size:14px}
.skip:focus{top:var(--g)}
:focus-visible{outline:2px solid currentColor;outline-offset:3px}
body.page-home{overflow:hidden;height:100vh;height:100svh}
@media (hover:hover) and (pointer:fine){body.has-cur,body.has-cur a,body.has-cur button{cursor:none}}

/* ===== PRELOADER ===== */
.tv{position:fixed;inset:0;z-index:10000;background:#14110f;display:block}
.seen .tv{display:none}
.tv-screen{position:absolute;inset:0;overflow:hidden;background:#000}
.tv-card{position:absolute;inset:0;animation:tvGlitch 3.2s steps(1) 1 both}
.tv-bars{position:absolute;left:0;right:0;top:0;height:64%;display:flex}
.tv-bars i{flex:1}
.tv-bars i:nth-child(1){background:#c9c9c9}.tv-bars i:nth-child(2){background:#c8c41a}.tv-bars i:nth-child(3){background:#1dc4c4}.tv-bars i:nth-child(4){background:#1cc01f}.tv-bars i:nth-child(5){background:#c21dc0}.tv-bars i:nth-child(6){background:#c01b1b}.tv-bars i:nth-child(7){background:#1d1dc4}
.tv-strip{position:absolute;left:0;right:0;top:64%;height:9%;display:flex}
.tv-strip i{flex:1}
.tv-strip i:nth-child(1){background:#1d1dc4}.tv-strip i:nth-child(2){background:#131313}.tv-strip i:nth-child(3){background:#c21dc0}.tv-strip i:nth-child(4){background:#131313}.tv-strip i:nth-child(5){background:#1dc4c4}.tv-strip i:nth-child(6){background:#131313}.tv-strip i:nth-child(7){background:#c9c9c9}
.tv-foot{position:absolute;left:0;right:0;top:73%;bottom:0;display:flex}
.tv-foot i,.tv-foot b{flex:1.2}
.tv-foot i:nth-child(1){background:#08214a}.tv-foot i:nth-child(2){background:#f2f2f2}.tv-foot i:nth-child(3){background:#2d0b5a}.tv-foot i:nth-child(4){background:#131313}.tv-foot i:nth-child(5){background:#050505}.tv-foot i:nth-child(6){background:#1b1b1b}
.tv-foot b{flex:2;background:repeating-linear-gradient(90deg,#fff 0 3px,#000 3px 6px)}
.tv-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.16) 1px,transparent 1px);background-size:calc(100vw/16) calc(100vh/9);mix-blend-mode:overlay}
.tv-ring{position:absolute;left:50%;top:50%;width:min(76vh,86vw);aspect-ratio:1;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.55);border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.4)}
.tv-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 2*var(--g)));background:#0b0b0d;color:#f2efe6;padding:28px 28px 22px;border:2px solid #f2efe6;box-shadow:8px 8px 0 #000}
.tv-ch{font-family:var(--m);font-size:22px;letter-spacing:.08em;color:var(--amber);margin-bottom:8px}
.tv-msg{font-family:var(--d);font-size:clamp(54px,9vw,84px);line-height:.86;letter-spacing:.01em;text-transform:uppercase}
.tv-load{display:flex;align-items:center;gap:12px;margin-top:20px}
.tv-track{flex:1;height:18px;border:2px solid #f2efe6;padding:2px;display:flex}
.tv-fill{height:100%;width:0;background:repeating-linear-gradient(90deg,#f2efe6 0 calc(var(--seg,14px) - 3px),transparent calc(var(--seg,14px) - 3px) var(--seg,14px))}
.tv-pct{font-family:var(--m);font-size:24px;min-width:4ch;text-align:right}
.tv-skip{font-family:var(--m);font-size:18px;letter-spacing:.06em;color:rgba(242,239,230,.55);margin-top:14px;text-transform:uppercase;opacity:0;transition:opacity .6s}
.tv-skip.on{opacity:1}
.on-m{display:none}
@media (hover:none){.on-d{display:none}.on-m{display:inline}}
.tv-boot{position:absolute;inset:0;background:#050805;color:#9dffb0;font-family:var(--m);font-size:clamp(17px,2.1vw,24px);line-height:1.25;padding:calc(var(--g) + 8px) var(--g);display:none;flex-direction:column;overflow:hidden;text-shadow:0 0 6px rgba(120,255,150,.45)}
.tv-boot.on{display:flex}
.tv-boot .logo{font-size:clamp(34px,5vw,58px);line-height:.95;color:#c8ffd2;margin-bottom:6px;letter-spacing:.04em}
.tv-boot .hr{border-top:2px dashed rgba(157,255,176,.45);margin:10px 0 12px}
.tv-boot .body{flex:1;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
.tv-boot .ln{white-space:pre;overflow:hidden;text-overflow:clip}
.tv-boot .ok{color:#f0e68c}
.tv-boot .cursor{display:inline-block;width:.6em;height:1em;background:#9dffb0;vertical-align:-2px;animation:blink 1s steps(1) infinite}
.tv-grain{position:absolute;inset:0;width:100%;height:100%;opacity:.16;mix-blend-mode:screen;pointer-events:none}
.tv-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px);pointer-events:none}
.tv-sweep span,.crt-sweep span{position:absolute;left:0;right:0;height:14vh;top:-20vh;background:linear-gradient(180deg,transparent,rgba(255,255,255,.07),transparent);animation:sweep 9s linear infinite}
.tv-sweep span:nth-child(2){animation-duration:14s;animation-delay:-6s}
.tv-vig{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.65) 100%);pointer-events:none}
.tv.out{animation:tvOff .5s var(--eio) forwards}
@keyframes tvOff{0%{opacity:1;transform:scale(1)}60%{transform:scaleY(.008) scaleX(1.02);opacity:1;filter:brightness(3)}100%{transform:scaleY(.002) scaleX(0);opacity:0}}
@keyframes blink{50%{opacity:0}}
@keyframes sweep{to{top:110vh}}
@keyframes tvGlitch{
 0%,9%,15%,40%,46%,74%,79%,100%{transform:none;filter:none;clip-path:none}
 10%{transform:translateX(-14px) skewX(-4deg);filter:hue-rotate(90deg) saturate(2)}
 11%{transform:translateX(10px);clip-path:inset(30% 0 40% 0)}
 12%{transform:translateX(-4px);filter:invert(1)}
 13%{transform:translateY(6px);clip-path:inset(0 0 70% 0)}
 41%{transform:translateX(18px);filter:hue-rotate(-60deg) contrast(1.6)}
 42%{transform:translateX(-8px) scaleY(1.04);clip-path:inset(55% 0 15% 0)}
 44%{transform:translateX(3px)}
 75%{transform:translateX(-10px) skewX(6deg);filter:saturate(3)}
 76%{clip-path:inset(10% 0 65% 0);transform:translateX(12px)}
 77%{filter:invert(1) hue-rotate(40deg)}}

/* ===== BACKGROUND ===== */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--paper);transition:background .01s}
.bg-topo,.bg-paint{position:absolute;inset:0;width:100%;height:100%}
.bg-paint{opacity:.9;filter:saturate(1.15)}
.bg-noise{position:absolute;inset:-50%;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
body:not(.page-home) .bg-topo{opacity:.0}
body.page-products .bg{background:var(--red)}
body.page-sites .bg{background:var(--cobalt)}
body.page-contact .bg{background:var(--night)}
body.page-sites .bg-paint{opacity:0}

/* ===== NAV ===== */
.nav{position:fixed;z-index:9000;top:var(--navt);left:var(--g);right:var(--g);height:var(--navh);display:flex;align-items:center;justify-content:space-between;padding:0 22px;border:2px solid var(--nb);border-radius:16px;transition:background .45s,border-color .45s;
 --nb:rgba(27,25,23,.22);--nf:rgba(27,25,23,.72);--nh:#1b1917;--nbg:rgba(247,245,240,.86)}
.nav.solid{background:var(--nbg);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
body.page-products .nav{--nb:rgba(11,23,48,.38);--nf:rgba(11,23,48,.72);--nh:#0b1730;--nbg:rgba(232,70,58,.92)}
body.page-sites .nav{--nb:rgba(255,255,255,.34);--nf:rgba(255,255,255,.78);--nh:#fff;--nbg:rgba(35,64,200,.92)}
body.page-contact .nav{--nb:rgba(255,255,255,.18);--nf:rgba(255,255,255,.6);--nh:#fff;--nbg:rgba(23,21,28,.9)}
.nav-name{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--nf);white-space:nowrap;transition:color .25s;min-height:44px;display:flex;align-items:center}
.nav-name:hover{color:var(--nh)}
.nav-icons{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;gap:28px;color:var(--nf);pointer-events:none}
.ni{width:20px;height:20px;display:block}
.ni svg{width:100%;height:100%;display:block;opacity:.55;transition:opacity .2s,transform .2s}
.ni-mid svg{opacity:.9;transform:scale(1.12)}
.ni.out svg{animation:niOut .15s ease-in forwards}.ni.in svg{animation:niIn .2s ease-out forwards}
@keyframes niOut{to{opacity:0;transform:translateY(-8px)}}@keyframes niIn{from{opacity:0;transform:translateY(8px)}}
.nav-links{display:flex;gap:28px}
.nav-link{position:relative;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--nf);transition:color .25s;min-height:44px;display:flex;align-items:center}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:11px;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .28s var(--eo)}
.nav-link:hover,.nav-link.on{color:var(--nh)}
.nav-link:hover::after{transform:scaleX(1)}.nav-link.on::after{transform:scaleX(1);opacity:.55}
.nav-menu{display:none;position:relative;width:44px;height:44px;margin-right:-12px}
.nav-menu i{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--nf);left:19px;top:19px;transition:transform .5s var(--eo),background .25s}
@media (max-width:820px){
 .nav{padding:0 14px 0 16px}
 .nav-links,.nav-icons{display:none}
 .nav-menu{display:block}
}
.menu{position:fixed;inset:0;z-index:8900;background:#14110f;color:#f2efe6;display:flex;flex-direction:column;justify-content:flex-end;padding:calc(var(--navt) + var(--navh) + var(--s6)) var(--g) calc(var(--g) + env(safe-area-inset-bottom));clip-path:circle(0 at calc(100% - var(--g) - 22px) calc(var(--navt) + 23px));transition:clip-path .7s var(--eio);visibility:hidden}
.menu.open{clip-path:circle(150% at calc(100% - var(--g) - 22px) calc(var(--navt) + 23px));visibility:visible}
body.menu-open .nav{--nb:rgba(255,255,255,.2);--nf:rgba(255,255,255,.75);--nh:#fff;background:transparent}
.menu-list{display:flex;flex-direction:column}
.menu-list a{font-family:var(--d);font-size:clamp(64px,19vw,120px);line-height:.9;letter-spacing:.005em;text-transform:uppercase;display:flex;align-items:flex-start;gap:12px;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.1);transform:translateY(40px);opacity:0;transition:transform .7s var(--eo),opacity .5s,color .2s}
.menu-list a span{font-family:var(--u);font-size:12px;font-weight:600;letter-spacing:.12em;padding-top:12px;opacity:.5;min-width:24px}
.menu-list a:hover{color:var(--amber)}
.menu.open .menu-list a{transform:none;opacity:1}
.menu.open .menu-list a:nth-child(2){transition-delay:.05s}.menu.open .menu-list a:nth-child(3){transition-delay:.1s}.menu.open .menu-list a:nth-child(4){transition-delay:.15s}
.menu-foot{display:flex;flex-wrap:wrap;gap:4px 24px;margin-top:var(--s6);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.menu-foot a{min-height:44px;display:flex;align-items:center}

/* ===== VIEWS ===== */
main{position:relative;z-index:2}
.view[hidden]{display:none!important}
.view-home{position:fixed;inset:0;overflow:hidden}
.stage{position:absolute;inset:0;pointer-events:none}
.portrait{position:absolute;left:50%;bottom:0;width:min(78vw,calc((100svh - 40px)*1.3333));aspect-ratio:4/3;transform:translate3d(-50%,0,0);will-change:transform;pointer-events:auto;touch-action:pan-y}
.pt-photo,.pt-ink{position:absolute;inset:0;width:100%;height:100%;user-select:none;-webkit-user-drag:none}
.pt-photo{opacity:0;transform:translateY(6%) scale(1.02);transition:opacity 1.1s var(--eo),transform 1.4s var(--eo)}
.ready .pt-photo{opacity:1;transform:none}
.pt-ink{pointer-events:none}
.name{position:absolute;left:50%;bottom:calc(var(--g) * .5);transform:translateX(-50%);display:flex;font-family:var(--n);font-weight:900;font-size:var(--nfs,clamp(110px,15vw,220px));line-height:.82;letter-spacing:-.01em;color:var(--ink);text-transform:uppercase;pointer-events:auto;white-space:nowrap;mix-blend-mode:normal}
.slot{display:inline-block;height:.82em;overflow:hidden;position:relative}
.slot-sz{visibility:hidden;display:block;height:.82em;line-height:.82em}
.slot-strip{position:absolute;left:0;right:0;top:0;display:flex;flex-direction:column;transform:translateY(0);will-change:transform}
.slot-strip span{display:block;height:.82em;line-height:.82em;text-align:center}
.home-tag{position:absolute;left:var(--g);top:calc(var(--navt) + var(--navh) + var(--s5));display:flex;gap:8px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);opacity:0;transition:opacity .8s .6s}
.ready .home-tag{opacity:1}
.side{position:absolute;top:50%;z-index:3;display:flex;align-items:center;gap:var(--s3);color:var(--ink);transition:transform .9s var(--eo),opacity .6s}
.side-l{left:var(--g);transform:translate(-160%,-50%)}
.side-r{right:var(--g);transform:translate(160%,-50%)}
.ready .side-l,.ready .side-r{transform:translate(0,-50%)}
.side-txt{writing-mode:vertical-rl;font-size:clamp(11px,1.6vw,22px);font-weight:600;letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;padding:12px 0}
.side-l .side-txt{transform:rotate(180deg)}
.side-txt b{font-weight:600;display:inline-block;transition:transform .35s var(--eo)}
.side-nr{font-family:var(--d);font-size:clamp(50px,13vw,187px);line-height:.88;letter-spacing:-.03em;color:transparent;-webkit-text-stroke:2px var(--ink);transition:color .35s,-webkit-text-stroke-color .35s,transform .5s var(--eo)}
.side-l:hover .side-nr{color:var(--red);-webkit-text-stroke-color:var(--red);transform:translateX(6px)}
.side-r:hover .side-nr{color:var(--cobalt);-webkit-text-stroke-color:var(--cobalt);transform:translateX(-6px)}
.side-l:hover .side-txt b{transform:translateY(4px)}.side-r:hover .side-txt b{transform:translateY(4px)}
@media (max-width:820px){.side-nr{display:none}.side{top:58%}.side-txt{padding:14px 12px;margin:0 -12px}}
@media (max-width:820px){
 .portrait{width:180vw;bottom:0}
 .name{bottom:calc(var(--g) + env(safe-area-inset-bottom))}
}
@media (max-width:820px) and (max-height:700px){.portrait{width:150vw}}

/* ===== PAGE COMMON ===== */
.view-products,.view-sites,.view-contact{padding:calc(var(--navt) + var(--navh) + var(--s8)) var(--g) 0}
.pg-head{margin-bottom:var(--s8)}
.pg-title{font-family:var(--d);font-weight:400;font-size:clamp(96px,24vw,340px);line-height:.8;letter-spacing:-.01em;text-transform:uppercase;color:var(--navy);margin-left:-.04em}
.pg-intro{max-width:34ch;font-family:var(--d);font-size:clamp(26px,3.2vw,44px);line-height:1;color:var(--navy);margin-top:var(--s5);text-transform:uppercase;letter-spacing:.01em}
.view-products{color:var(--navy)}
.plist{list-style:none;border-top:2px solid var(--navy)}
.prow{border-bottom:2px solid var(--navy)}
.prow a{display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:var(--s4);padding:var(--s5) 0;min-height:44px;position:relative}
.prow .pn{font-size:12px;font-weight:700;letter-spacing:.12em}
.prow .pt{font-family:var(--d);font-size:clamp(48px,8.4vw,128px);line-height:.86;text-transform:uppercase;transition:transform .5s var(--eo),color .3s;display:block}
.prow .pk{display:block;font-size:13px;font-weight:600;letter-spacing:.04em;margin-top:var(--s2);opacity:.78}
.prow .pl{display:block;font-size:15px;line-height:1.45;max-width:46ch;margin-top:var(--s1);opacity:.9}
.prow .pg{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border:2px solid currentColor;border-radius:999px;padding:0 14px;height:36px;display:flex;align-items:center;gap:6px;white-space:nowrap;transition:background .25s,color .25s}
.prow a:hover .pt{transform:translateX(14px);color:#fff}
.prow a:hover .pg{background:var(--navy);color:var(--red)}
@media (max-width:640px){
 .prow a{grid-template-columns:1fr auto;gap:var(--s3);padding:var(--s4) 0}
 .prow .pn{grid-column:1/-1}
 .prow .pg{padding:0 12px;height:44px}
}
.marq{margin:var(--s9) calc(var(--g) * -1) 0;overflow:hidden}
.marq-head{padding:0 var(--g) var(--s4);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.marq-win{border-top:2px solid var(--navy);border-bottom:2px solid var(--navy);overflow:hidden;padding:var(--s4) 0}
.marq-track{display:flex;width:max-content;animation:marq 38s linear infinite}
.marq-track span{font-family:var(--d);font-size:clamp(36px,6vw,72px);line-height:1;text-transform:uppercase;padding:0 var(--s5);white-space:nowrap;display:flex;align-items:center;gap:var(--s5)}
.marq-track span::after{content:"";width:14px;height:14px;border-radius:50%;background:var(--navy)}
@keyframes marq{to{transform:translateX(-50%)}}
.series{padding-top:var(--s10)}
.series-title{font-family:var(--d);font-weight:400;font-size:clamp(88px,20vw,280px);line-height:.8;text-transform:uppercase;margin-left:-.04em}
.series-sub{font-size:16px;line-height:1.5;margin-top:var(--s4);max-width:40ch}
.slist{margin-top:var(--s7);border-top:2px solid var(--navy)}
.srow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s5);padding:var(--s5) 0;border-bottom:2px solid var(--navy)}
.srow h5{font-family:var(--d);font-weight:400;font-size:clamp(36px,4.6vw,64px);line-height:.9;text-transform:uppercase}
.srow p{font-size:14px;line-height:1.5;margin-top:var(--s2);opacity:.85;max-width:36ch}
.chips{display:flex;flex-wrap:wrap;gap:var(--s2);align-content:flex-start}
.chip{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 16px;border:2px solid var(--navy);border-radius:999px;font-size:13px;font-weight:600;letter-spacing:.02em;transition:background .2s,color .2s}
.chip:hover{background:var(--navy);color:var(--red)}
.chip small{font-size:11px;opacity:.7;font-weight:500}
@media (max-width:640px){.srow{grid-template-columns:1fr;gap:var(--s4)}}
.series-cta{margin-top:var(--s6)}
.pill{display:inline-flex;align-items:center;gap:var(--s3);height:52px;padding:0 var(--s5);border-radius:999px;background:var(--navy);color:#fff;font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;transition:transform .3s var(--eo)}
.pill:hover{transform:translateY(-3px)}
.kit{margin-top:var(--s9)}
.kit-label,.cta-label{display:block;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-bottom:var(--s4)}
.kit-list{display:flex;flex-wrap:wrap;gap:var(--s2)}
.kit-list span{height:40px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;background:rgba(11,23,48,.1);font-size:13px;font-weight:600}
.cta{margin-top:var(--s9);padding:var(--s9) 0;border-top:2px solid var(--navy);text-align:center}
.cta-head{font-family:var(--d);font-weight:400;font-size:clamp(52px,9vw,140px);line-height:.86;text-transform:uppercase;max-width:12ch;margin:0 auto}
.cta-btn{display:inline-flex;align-items:center;height:56px;padding:0 var(--s6);margin-top:var(--s6);border-radius:999px;border:2px solid var(--navy);font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;transition:background .25s,color .25s}
.cta-btn:hover{background:var(--navy);color:var(--red)}

/* sites */
.view-sites{color:#fff}
.view-sites .pg-title{color:#fff}
.tb{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s5);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.75)}
.tb a{border-bottom:1.5px solid currentColor}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5)}
@media (max-width:1100px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s4) var(--s3)}}
.card{display:block;text-align:left;width:100%;color:#fff}
.card-f{position:relative;aspect-ratio:4/5;overflow:hidden;background:#13204f;border-radius:4px}
.card-f img{width:100%;height:100%;object-fit:cover;object-position:top center;transform:scale(1.02);transition:transform .8s var(--eo),filter .5s;filter:saturate(.9)}
.card:nth-child(4n+2) .card-f{aspect-ratio:1/1}.card:nth-child(4n+3) .card-f{aspect-ratio:3/4}
.card:hover .card-f img{transform:scale(1.07);filter:saturate(1.1)}
.card-f::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);border-radius:4px}
.card-m{display:flex;justify-content:space-between;gap:var(--s2);margin-top:var(--s3);align-items:baseline}
.card-t{font-family:var(--d);font-size:clamp(26px,2.6vw,36px);line-height:.9;text-transform:uppercase}
.card-r{font-family:var(--m);font-size:16px;opacity:.7;white-space:nowrap}
.card-s{display:block;font-size:12px;line-height:1.4;opacity:.72;margin-top:var(--s1)}
.card{opacity:0;transform:translateY(24px);transition:opacity .7s var(--eo),transform .9s var(--eo)}
.card.in{opacity:1;transform:none}

/* contact */
.view-contact{color:#f2efe6;min-height:100svh;display:flex;flex-direction:column}
.ct{position:relative;flex:1;padding-bottom:var(--s9)}
.ct-kick{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,239,230,.6)}
.rec{width:10px;height:10px;border-radius:50%;background:#ff4b3e;box-shadow:0 0 12px #ff4b3e;animation:blink 1.4s steps(1) infinite}
.ct-title{font-family:var(--d);font-weight:400;font-size:clamp(110px,25vw,360px);line-height:.8;text-transform:uppercase;display:flex;flex-direction:column;margin:var(--s5) 0 0 -.04em}
.ct-out{color:transparent;-webkit-text-stroke:2px #f2efe6}
.ct-art{position:absolute;right:0;top:var(--s7);width:clamp(140px,26vw,360px);color:var(--amber)}
.dish{width:100%;height:auto;display:block;transform-origin:60% 60%;animation:dish 6s var(--eio) infinite alternate}
.wave{opacity:.2;animation:wave 1.8s ease-in-out infinite}.w2{animation-delay:.25s}.w3{animation-delay:.5s}
@keyframes wave{50%{opacity:1}}@keyframes dish{to{transform:rotate(-6deg)}}
.ct-rows{margin-top:var(--s8);border-top:1px solid rgba(242,239,230,.18);max-width:880px}
.ct-row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2) var(--s4);min-height:72px;padding:var(--s3) 0;border-bottom:1px solid rgba(242,239,230,.18)}
.ct-k{width:96px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(242,239,230,.55)}
.ct-row a{font-size:clamp(17px,2.2vw,26px);font-weight:500;min-height:44px;display:inline-flex;align-items:center;transition:color .2s;overflow-wrap:anywhere}
.ct-row a:hover{color:var(--amber)}
.ct-mail{font-family:var(--d);font-size:clamp(30px,4.4vw,56px)!important;letter-spacing:.01em}
.copy{margin-left:auto;height:44px;padding:0 18px;border:2px solid rgba(242,239,230,.4);border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,color .2s}
.copy:hover,.copy.done{background:#f2efe6;color:var(--night)}
@media (max-width:640px){.ct-art{top:var(--s1);width:120px}.ct-k{width:100%}.copy{margin-left:0}.ct-row{min-height:0;padding:var(--s4) 0}}

/* footer */
.foot{position:relative;z-index:2;padding:var(--s7) var(--g) calc(var(--s6) + env(safe-area-inset-bottom));color:var(--fc,var(--navy));border-top:2px solid currentColor;margin:0 var(--g)}
.foot{padding-left:0;padding-right:0}
body.page-sites .foot{--fc:#fff;margin-top:var(--s9)}
body.page-contact .foot{--fc:rgba(242,239,230,.85);border-top-width:1px}
.foot-main{display:flex;justify-content:space-between;gap:var(--s5);flex-wrap:wrap}
.foot-nav,.foot-r{display:flex;flex-wrap:wrap;gap:0 var(--s5);align-items:center}
.foot a,.foot-on{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;min-height:44px;display:inline-flex;align-items:center}
.foot a:hover{opacity:.65}
.foot-on{opacity:.65}
.foot-b{display:flex;justify-content:space-between;gap:var(--s4);margin-top:var(--s5);font-size:12px;opacity:.75;align-items:center;flex-wrap:wrap}
.foot-b a{font-size:12px}

/* lightbox */
.lb{position:fixed;inset:0;z-index:9500;background:rgba(9,14,40,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:calc(var(--navt) + 8px) var(--g) var(--g);opacity:0;visibility:hidden;transition:opacity .45s,visibility .45s;color:#fff}
.lb.open{opacity:1;visibility:visible}
.lb-x{position:absolute;top:var(--navt);right:var(--g);width:46px;height:46px;border:2px solid rgba(255,255,255,.35);border-radius:14px;font-size:26px;line-height:1;display:flex;align-items:center;justify-content:center;z-index:2}
.lb-in{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--s7);align-items:center;width:min(1180px,100%);max-height:100%}
.lb-img{position:relative;padding:14px}
.lb-img img{width:100%;max-height:72vh;object-fit:contain;object-position:center;transform:scale(.96);opacity:0;transition:transform .6s var(--eo),opacity .4s}
.lb.open .lb-img img.ld{transform:none;opacity:1}
.c{position:absolute;width:22px;height:22px;border:2px solid #fff}
.c.tl{left:0;top:0;border-right:0;border-bottom:0}.c.tr{right:0;top:0;border-left:0;border-bottom:0}.c.bl{left:0;bottom:0;border-right:0;border-top:0}.c.br{right:0;bottom:0;border-left:0;border-top:0}
.lb-ref{font-family:var(--m);font-size:20px;opacity:.7}
.lb-row{display:flex;align-items:center;gap:var(--s3);margin-top:var(--s3)}
.lb-title{flex:1;font-family:var(--d);font-weight:400;font-size:clamp(44px,5vw,80px);line-height:.88;text-transform:uppercase;min-width:0;overflow-wrap:anywhere}
.lb-nav{width:44px;height:44px;border:2px solid rgba(255,255,255,.35);border-radius:50%;font-size:18px;flex:none;transition:background .2s,color .2s}
.lb-nav:hover{background:#fff;color:var(--cobalt)}
.lb-med{font-size:15px;line-height:1.5;margin-top:var(--s4);opacity:.88}
.lb-url{font-family:var(--m);font-size:19px;margin-top:var(--s2);opacity:.7;overflow-wrap:anywhere}
.lb-rule{height:2px;background:rgba(255,255,255,.2);margin:var(--s5) 0}
.lb-go{display:inline-flex;align-items:center;gap:var(--s3);height:52px;padding:0 var(--s5);border-radius:999px;background:#fff;color:var(--cobalt);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
@media (max-width:760px){.lb{align-items:flex-start;overflow-y:auto;padding-top:calc(var(--navt) + 62px)}.lb-in{grid-template-columns:1fr;gap:var(--s5)}.lb-img img{max-height:46vh}.lb-x{top:var(--navt)}}

/* magnetic preview */
.mag{position:fixed;left:0;top:0;z-index:50;pointer-events:none;width:min(360px,30vw);aspect-ratio:8/5;opacity:0;transform:translate(-50%,-50%) scale(.6);transition:opacity .3s,transform .5s var(--eo)}
.mag.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.mag-f{position:relative;width:100%;height:100%;border-radius:6px;overflow:hidden;box-shadow:0 30px 60px rgba(11,23,48,.4);border:2px solid var(--navy);background:var(--navy)}
.mag-f img{width:100%;height:100%;object-fit:cover;object-position:top}
.mag-g{position:absolute;inset:0;background:radial-gradient(circle at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.35),transparent 55%);mix-blend-mode:overlay}
@media (hover:none){.mag{display:none}}

/* cursor */
.cur{display:none}
@media (hover:hover) and (pointer:fine){.cur{display:block}}
.cur-d,.cur-r{position:fixed;left:-100px;top:-100px;z-index:10020;pointer-events:none;border-radius:50%;transform:translate(-50%,-50%)}
.cur-d{width:6px;height:6px;background:var(--cc,#1b1917)}
.cur-r{width:36px;height:36px;border:1.5px solid var(--cc,#1b1917);opacity:.55;transition:width .3s var(--eo),height .3s var(--eo),opacity .3s}
.cur.big .cur-r{width:64px;height:64px;opacity:.9}
body.page-sites .cur,body.page-contact .cur{--cc:#fff}
body.page-products .cur{--cc:#0b1730}

/* transition */
.tx{position:fixed;inset:0;z-index:9800;background:var(--txc,#1b1917);transform:translateY(101%);display:flex;align-items:center;justify-content:center;pointer-events:none}
.tx-l{font-family:var(--d);font-size:clamp(64px,14vw,200px);line-height:1;color:var(--txf,#fff);letter-spacing:.02em;opacity:0;transform:translateY(30px);transition:opacity .35s,transform .5s var(--eo)}
.tx.show .tx-l{opacity:1;transform:none}

/* CRT */
.crt{position:fixed;inset:0;z-index:9700;pointer-events:none}
.crt-scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(0,0,0,.045) 0 1px,transparent 1px 3px)}
.crt-grain{position:absolute;inset:-128px;opacity:.06;mix-blend-mode:multiply;background-size:256px 256px;animation:grainShift .8s steps(6) infinite}
@keyframes grainShift{0%{transform:translate(0,0)}17%{transform:translate(-61px,37px)}33%{transform:translate(43px,-90px)}50%{transform:translate(-97px,-23px)}67%{transform:translate(77px,64px)}83%{transform:translate(-29px,101px)}100%{transform:translate(0,0)}}
.crt-sweep span:nth-child(2){animation-duration:13s;animation-delay:-4s;opacity:.7}.crt-sweep span:nth-child(3){animation-duration:17s;animation-delay:-11s;opacity:.4}
.crt-glow{position:absolute;inset:0;box-shadow:inset 0 0 120px rgba(255,236,200,.12)}
.crt-vig{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 62%,rgba(0,0,0,.16) 100%)}
.crt-frame{position:fixed;inset:0;z-index:9750;pointer-events:none;background:#0d0b0a;visibility:hidden}
.crt-stroke{position:fixed;inset:0;width:100%;height:100%;z-index:9751;pointer-events:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}}