:root{--ink:#06111b;--ink2:#0b1d2b;--panel:#102737;--cyan:#26d9d4;--cyan2:#8df6ef;--white:#f4f8fa;--muted:#9bb0bd;--line:rgba(167,208,225,.18);--orange:#ff875c;--sans:"DM Sans",sans-serif;--display:"Manrope",sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--white);font:400 16px/1.6 var(--sans);overflow-x:hidden}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
.skip-link{position:fixed;left:1rem;top:-5rem;z-index:100;background:white;color:#000;padding:.7rem 1rem}
.skip-link:focus{top:1rem}
.site-header{position:absolute;z-index:20;top:0;left:0;right:0;height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1.25rem,5vw,5.5rem);border-bottom:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,rgba(2,9,15,.5),transparent)}
.brand{display:flex;align-items:center;gap:.65rem;font:700 1.05rem/1 var(--display);letter-spacing:.12em}
.brand-mark{width:36px;height:28px;fill:none;stroke:white;stroke-width:2.4;stroke-linejoin:round}
.brand-mark .mark-horizon{stroke:var(--cyan)}
.brand-dot{color:var(--cyan)}
.desktop-nav{display:flex;gap:clamp(.8rem,1.7vw,2.25rem);font-size:.85rem;color:#d9e5ea}
.desktop-nav a{transition:color .2s}
.desktop-nav a:hover{color:var(--cyan)}
.nav-cta{font-size:.84rem;font-weight:600;padding:.7rem 1rem;border:1px solid rgba(255,255,255,.35);border-radius:3px}
.nav-cta:hover{background:white;color:var(--ink)}
.hero{min-height:780px;height:100svh;position:relative;display:flex;align-items:center;overflow:hidden}
.hero-photo{position:absolute;inset:-3%;background:url("./assets/smarttrim-hero.webp") center/cover no-repeat;animation:heroDrift 18s ease-in-out infinite alternate;will-change:transform}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,10,17,.96) 0%,rgba(2,10,17,.82) 33%,rgba(2,10,17,.25) 67%,rgba(2,10,17,.08)),linear-gradient(0deg,rgba(2,10,17,.72),transparent 42%)}
.hero-grid{position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(89,225,221,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(89,225,221,.22) 1px,transparent 1px);background-size:90px 90px;mask-image:linear-gradient(90deg,#000,transparent 62%)}
.hero-scan{position:absolute;left:-20%;top:54%;width:85%;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);box-shadow:0 0 20px var(--cyan);animation:scan 5s ease-in-out infinite}
.hero-content{position:relative;z-index:2;width:min(760px,88vw);margin-left:clamp(1.25rem,8vw,9rem);padding-top:3rem}
.eyebrow,.kicker{text-transform:uppercase;letter-spacing:.17em;font-size:.72rem;font-weight:700;color:var(--cyan)}
.pulse-dot,.chat-pulse{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 0 rgba(38,217,212,.5);animation:pulse 2s infinite;margin-right:.55rem}
.hero h1{margin:1rem 0 1.35rem;font:500 clamp(3.25rem,7.2vw,7.4rem)/.94 var(--display);letter-spacing:-.065em}
.hero h1 span{color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.78)}
.hero-copy{width:min(600px,100%);font-size:clamp(1.05rem,1.4vw,1.28rem);line-height:1.65;color:#c4d2d9}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
.button{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;min-height:52px;padding:.8rem 1.25rem;border-radius:2px;border:1px solid transparent;font-weight:600;font-size:.9rem;cursor:pointer}
.button-primary{background:var(--cyan);color:#031216}
.button-primary:hover{background:var(--cyan2)}
.button-ghost{border-color:rgba(255,255,255,.32);background:rgba(8,24,34,.35);backdrop-filter:blur(10px)}
.play-icon{font-size:.65rem;color:var(--cyan)}
.telemetry-card{position:absolute;z-index:3;right:clamp(1.25rem,5vw,5.5rem);bottom:clamp(5.5rem,10vh,8rem);width:310px;background:rgba(5,18,28,.7);border:1px solid rgba(94,224,219,.38);backdrop-filter:blur(18px);padding:1rem;box-shadow:0 24px 80px rgba(0,0,0,.35)}
.telemetry-top{display:flex;justify-content:space-between;font-size:.62rem;letter-spacing:.13em;color:#a7bac4;border-bottom:1px solid var(--line);padding-bottom:.75rem}
.live-state{color:var(--cyan)}
.attitude{display:grid;grid-template-columns:1.35fr 1fr;gap:1rem;padding-top:1rem}
.attitude-ring{aspect-ratio:1;border:1px solid var(--line);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;background:radial-gradient(circle,rgba(38,217,212,.08),transparent 65%)}
.horizon-line{position:absolute;left:16%;right:16%;top:45%;height:1px;background:var(--cyan);animation:tilt 4s ease-in-out infinite}
.horizon-line span{position:absolute;width:8px;height:8px;border:1px solid var(--cyan);transform:rotate(45deg);left:calc(50% - 4px);top:-4px}
.attitude-ring b{font:600 1.55rem/1 var(--display)}
.attitude-ring small,.metric-stack small{font-size:.55rem;letter-spacing:.15em;color:var(--muted)}
.metric-stack{display:flex;flex-direction:column;justify-content:center;gap:.55rem}
.metric-stack div{border-bottom:1px solid var(--line);padding-bottom:.4rem}
.metric-stack small,.metric-stack strong{display:block}
.metric-stack strong{font-size:.92rem}
.metric-stack em{font-style:normal;font-size:.5rem;color:var(--muted)}
.signal{height:30px;display:flex;align-items:end;gap:4px;margin-top:.8rem;border-top:1px solid var(--line);padding-top:.5rem}
.signal span{flex:1;height:var(--h);background:linear-gradient(var(--cyan),rgba(38,217,212,.18));animation:signal 2.2s ease-in-out infinite alternate}
.signal span:nth-child(2n){animation-delay:-.8s}
.scroll-cue{position:absolute;z-index:3;left:clamp(1.25rem,5vw,5.5rem);bottom:2.1rem;display:flex;align-items:center;gap:.7rem;font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;color:#9db1bc}
.scroll-cue i{width:70px;height:1px;background:rgba(255,255,255,.3);position:relative;overflow:hidden}
.scroll-cue i:after{content:"";position:absolute;width:30px;height:1px;background:var(--cyan);animation:scrollLine 2.2s infinite}
.data-ribbon{height:64px;background:var(--cyan);color:#031216;overflow:hidden;display:flex;align-items:center;white-space:nowrap}
.ribbon-track{display:flex;align-items:center;gap:1.6rem;font-size:.72rem;font-weight:700;letter-spacing:.16em;animation:marquee 25s linear infinite}
.ribbon-track i{width:5px;height:5px;background:#031216;transform:rotate(45deg)}
.section{padding:clamp(6rem,10vw,10rem) clamp(1.25rem,8vw,9rem)}
.section-intro{max-width:900px}
.section h2,.roadmap-section h2,.contact-section h2{font:500 clamp(2.6rem,5vw,5.4rem)/1.03 var(--display);letter-spacing:-.05em;margin:.9rem 0 1.5rem}
.section-intro>p:last-child{max-width:670px;color:var(--muted);font-size:1.08rem}
.control-loop{display:grid;grid-template-columns:1fr 110px 1fr 110px 1fr;align-items:center;margin:5rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.loop-stage{padding:2rem 0;display:grid;grid-template-columns:auto 1fr;gap:.2rem 1rem}
.loop-stage span{grid-row:1/3;font-size:.7rem;color:var(--cyan);padding-top:.22rem}
.loop-stage b{font:.8rem var(--display);letter-spacing:.14em}
.loop-stage small{color:var(--muted)}
.loop-stage.active{color:var(--cyan)}
.loop-link{height:1px;background:var(--line);position:relative;overflow:hidden}
.loop-link i{position:absolute;width:50%;height:100%;background:var(--cyan);animation:loopFlow 2.4s infinite}
.benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.benefit{border-top:1px solid var(--line);padding:2rem 0}
.benefit-num{color:var(--cyan);font-size:.7rem}
.benefit h3{font:500 1.55rem var(--display);margin:1.6rem 0 .6rem}
.benefit p{color:var(--muted);max-width:340px}
.technology-section{padding:clamp(6rem,10vw,10rem) clamp(1.25rem,8vw,9rem);background:#071620;position:relative;overflow:hidden}
.technology-section:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(38,217,212,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(38,217,212,.035) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(#000,transparent 85%)}
.technology-head{position:relative;display:grid;grid-template-columns:1.15fr .65fr;gap:8vw;align-items:end;margin-bottom:4rem}
.technology-head h2{font:500 clamp(2.8rem,5.4vw,5.8rem)/1 var(--display);letter-spacing:-.055em;margin:.9rem 0 0;max-width:850px}
.technology-head>p{color:#9fb2bc;margin:0}
.technology-grid{position:relative;display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(108,188,198,.2);border:1px solid rgba(108,188,198,.2)}
.technology-card{background:#0a1d29;padding:2rem;min-height:420px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.tech-code{font-size:.6rem;letter-spacing:.15em;color:var(--cyan)}
.technology-card h3{font:500 1.8rem var(--display);letter-spacing:-.025em;margin:auto 0 .6rem}
.technology-card p{color:#93a9b4;max-width:520px;margin:0}
.chip-graphic,.sensor-graphic,.network-graphic,.model-graphic{height:190px;position:relative;display:grid;place-items:center;color:var(--cyan);font-size:.68rem;letter-spacing:.12em}
.chip-graphic span{width:116px;height:78px;display:grid;place-items:center;border:1px solid var(--cyan);background:rgba(38,217,212,.05);box-shadow:0 0 40px rgba(38,217,212,.08)}
.chip-graphic:before,.chip-graphic:after{content:"";position:absolute;width:230px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent)}
.chip-graphic:after{transform:rotate(90deg)}
.chip-graphic i{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--cyan);animation:pulse 2s infinite}.chip-graphic i:nth-of-type(1){left:17%;top:28%}.chip-graphic i:nth-of-type(2){right:17%;top:28%}.chip-graphic i:nth-of-type(3){left:17%;bottom:28%}.chip-graphic i:nth-of-type(4){right:17%;bottom:28%}
.sensor-graphic span{width:140px;height:140px;border:1px solid rgba(38,217,212,.45);border-radius:50%;background:radial-gradient(circle,rgba(38,217,212,.15),transparent 60%)}
.sensor-graphic:before,.sensor-graphic:after{content:"";position:absolute;background:var(--cyan);opacity:.8}.sensor-graphic:before{width:230px;height:1px;animation:tilt 4s ease-in-out infinite}.sensor-graphic:after{height:180px;width:1px}.sensor-graphic i{position:absolute;width:9px;height:9px;border:1px solid var(--cyan);transform:rotate(45deg)}.sensor-graphic i:nth-of-type(1){left:25%;top:34%}.sensor-graphic i:nth-of-type(2){right:23%;top:25%}.sensor-graphic i:nth-of-type(3){right:30%;bottom:26%}
.network-graphic{grid-template-columns:1.2fr 34px .8fr 34px .9fr;gap:0}.network-graphic span{border:1px solid rgba(38,217,212,.55);padding:.8rem .45rem;text-align:center;width:100%;line-height:1.35}.network-graphic span b,.network-graphic span small{display:block}.network-graphic span b{font-size:.62rem}.network-graphic span small{margin-top:.35rem;font-size:.47rem;line-height:1.55;color:#86aab3}.network-graphic i{width:34px;height:1px;background:var(--cyan);position:relative}.network-graphic i:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--cyan);top:-3px;animation:networkFlow 2.2s linear infinite}.network-graphic i:nth-of-type(2):after{animation-delay:-1.1s}.network-unit{color:white!important;border-color:var(--cyan)!important;background:rgba(38,217,212,.08)}
.model-graphic{grid-template-columns:repeat(3,40px);gap:45px}.model-graphic span{width:34px;height:34px;border:1px solid var(--cyan);border-radius:50%;background:rgba(38,217,212,.08);z-index:2}.model-graphic i{position:absolute;width:180px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:.5}.model-graphic i:nth-of-type(1){transform:rotate(18deg)}.model-graphic i:nth-of-type(2){transform:rotate(-18deg)}.model-graphic i:nth-of-type(3){transform:rotate(0)}
.technology-strip{position:relative;display:grid;grid-template-columns:repeat(5,1fr);margin-top:1px;background:rgba(108,188,198,.2);gap:1px}
.technology-strip span{background:#0a1d29;padding:1rem;text-align:center;font-size:.62rem;letter-spacing:.12em;color:#77929f}.technology-strip b{color:var(--cyan)}
@keyframes networkFlow{from{left:0}to{left:100%}}
.products-section{background:#f1f5f6;color:#0a1720}
.products-head{display:grid;grid-template-columns:1.5fr .7fr;gap:4rem;align-items:end;margin-bottom:4rem}
.products-head h2{margin-bottom:0}
.products-head>p{color:#526671}
.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.product-card{min-height:390px;padding:2rem;background:white;border:1px solid #d7e1e5;position:relative;overflow:hidden;display:flex;flex-direction:column}
.product-feature{grid-row:span 2;min-height:796px;background:#0a1d2b;color:white}
.card-top{display:flex;justify-content:space-between;align-items:center}
.product-index{font-size:.7rem;color:#78909b}
.product-status{font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;padding:.4rem .55rem;color:#073c3d;background:#a8f6ef}
.product-status.muted{background:#e8eff1;color:#526671}
.product-card h3{font:600 clamp(1.6rem,2.5vw,2.4rem) var(--display);letter-spacing:-.03em;margin:auto 0 .8rem}
.product-card p{color:#526671;max-width:500px}
.product-feature p{color:#aabcc5}
.product-card>a{font-size:.78rem;font-weight:700;color:#0e7676;margin-top:1.2rem}
.product-card ul{padding:0;list-style:none;border-top:1px solid var(--line);margin:1.7rem 0 0}
.product-card li{padding:.75rem 0;border-bottom:1px solid var(--line);font-size:.85rem;color:#c5d4da}
.product-card li:before{content:"+";color:var(--cyan);margin-right:.7rem}
.compatibility-panel{position:relative;overflow:hidden;margin-top:5rem;border:1px solid rgba(108,188,198,.28);background:linear-gradient(135deg,#0b2230,#06131e);padding:clamp(2rem,4vw,4rem);display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,6vw,7rem);align-items:stretch;color:white}
.compatibility-panel:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(38,217,212,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(38,217,212,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,#000,transparent 64%);pointer-events:none}
.compatibility-copy,.vessel-map{position:relative;z-index:1}
.compatibility-panel h3{font:500 clamp(2.25rem,4vw,4.2rem)/1.02 var(--display);letter-spacing:-.05em;color:white;margin:.8rem 0 1.3rem;max-width:620px}
.compatibility-copy>p:not(.kicker){color:#a7bbc5;font-size:1rem;max-width:610px}
.compatibility-features{list-style:none;padding:0;margin:2.2rem 0 0;border-top:1px solid rgba(143,187,198,.22)}
.compatibility-features li{display:grid;grid-template-columns:34px 1fr;gap:.9rem;padding:1rem 0;border-bottom:1px solid rgba(143,187,198,.22)}
.compatibility-features li>span{font-size:.68rem;color:var(--cyan);padding-top:.18rem}.compatibility-features b,.compatibility-features small{display:block}.compatibility-features b{font-size:.9rem}.compatibility-features small{color:#7895a2;font-size:.78rem;margin-top:.22rem;line-height:1.45}
.vessel-map{border:1px solid rgba(87,175,185,.3);background:rgba(2,13,21,.52);padding:clamp(1.25rem,2.5vw,2rem);display:flex;flex-direction:column}
.vessel-map-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem;color:var(--cyan);font-size:.65rem;letter-spacing:.13em}.vessel-map-head small{color:#688894;font-size:.58rem;letter-spacing:.11em;text-align:right}
.vessel-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(100,181,191,.22);border:1px solid rgba(100,181,191,.22)}
.vessel-grid article{min-height:150px;background:#0a1b27;padding:1.35rem;display:flex;flex-direction:column;transition:background .25s ease}.vessel-grid article:hover{background:#0d2836}.vessel-grid article>span{color:var(--cyan);font-size:.62rem}.vessel-grid b{font:500 1.15rem var(--display);letter-spacing:.04em;margin:auto 0 .4rem}.vessel-grid small{color:#809aa5;font-size:.76rem;line-height:1.45;max-width:180px}
.vessel-map>p{color:#95adb7;font-size:.82rem;line-height:1.55;margin:auto 0 0;padding-top:1.4rem}
.controller-visual{height:390px;position:relative;display:grid;place-items:center}
.controller-shell{width:250px;height:170px;border-radius:22px;background:linear-gradient(145deg,#243846,#07111a);border:1px solid #4a626f;box-shadow:0 35px 60px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.2);position:relative;transform:perspective(700px) rotateX(10deg) rotateY(-8deg)}
.controller-screen{position:absolute;inset:25px 34px;background:#07151e;border:1px solid #31515d;padding:1rem;box-shadow:inset 0 0 20px rgba(38,217,212,.08)}
.controller-screen small,.controller-screen b{display:block}
.controller-screen small{font-size:.52rem;letter-spacing:.15em;color:#7fa0ac}
.controller-screen b{font:600 1.6rem var(--display);color:var(--cyan);margin-top:.3rem}
.mini-horizon{height:1px;background:var(--cyan);margin-top:2.4rem;transform:rotate(-3deg);box-shadow:0 0 12px var(--cyan)}
.port{position:absolute;bottom:-6px;width:22px;height:12px;border-radius:2px;background:#061018;border:1px solid #607580}
.p1{left:40px}
.p2{left:78px}
.p3{right:44px}
.orbit{position:absolute;border:1px solid rgba(38,217,212,.22);border-radius:50%;animation:orbit 12s linear infinite}
.o1{width:320px;height:140px;transform:rotate(-13deg)}
.o2{width:370px;height:210px;animation-direction:reverse}
.product-icon{height:135px;position:relative;margin-top:1.5rem}
.logger-icon{display:flex;align-items:end;gap:8px}
.logger-icon i{display:block;width:16px;height:var(--bar,30%);background:#1aa8a5}
.logger-icon i:nth-child(1){--bar:25%}
.logger-icon i:nth-child(2){--bar:55%}
.logger-icon i:nth-child(3){--bar:38%}
.logger-icon i:nth-child(4){--bar:78%}
.logger-icon i:nth-child(5){--bar:65%}
.prop-icon{display:grid;place-items:center}
.prop-icon span{width:16px;height:16px;border-radius:50%;background:#0e7676;z-index:2}
.prop-icon i{position:absolute;width:75px;height:26px;border-radius:70% 15%;background:linear-gradient(90deg,#1aa8a5,#86e4df);transform-origin:left center;left:50%}
.prop-icon i:nth-of-type(1){transform:rotate(0deg)}
.prop-icon i:nth-of-type(2){transform:rotate(120deg)}
.prop-icon i:nth-of-type(3){transform:rotate(240deg)}
.fleet-icon{display:flex;align-items:center;justify-content:center;gap:45px}
.fleet-icon span{width:18px;height:18px;background:#1aa8a5;transform:rotate(45deg);z-index:2}
.fleet-icon i{position:absolute;height:1px;background:#89a2ad;width:90px}
.fleet-icon i:nth-of-type(1){transform:rotate(0)}
.fleet-icon i:nth-of-type(2){transform:rotate(60deg)}
.fleet-icon i:nth-of-type(3){transform:rotate(-60deg)}
.cloud-icon{display:grid;place-items:center}
.cloud-icon span{width:72px;height:50px;border:1px solid #1aa8a5;border-radius:50%;box-shadow:35px 12px 0 -8px #f1f5f6,35px 12px 0 -7px #1aa8a5,-35px 12px 0 -8px #f1f5f6,-35px 12px 0 -7px #1aa8a5}
.cloud-icon i{position:absolute;bottom:16px;width:1px;height:25px;background:#1aa8a5}
.cloud-icon i:nth-of-type(2){transform:translateX(-35px)}
.cloud-icon i:nth-of-type(3){transform:translateX(35px)}
.patent-note{font-size:.75rem;color:#70848d;margin-top:1.2rem}
.roadmap-section{padding:clamp(6rem,10vw,10rem) clamp(1.25rem,8vw,9rem);display:grid;grid-template-columns:.85fr 1.15fr;gap:8vw;background:linear-gradient(145deg,#06111b,#0d2636)}
.roadmap-copy{position:sticky;top:120px;align-self:start}
.roadmap-copy>p:nth-of-type(2){color:var(--muted);max-width:520px}
.text-link{display:inline-block;color:var(--cyan);font-weight:600;margin-top:1.5rem}
.roadmap-stack{display:flex;flex-direction:column;gap:.75rem}
.roadmap-card{display:grid;grid-template-columns:75px 1fr auto;gap:1.3rem;align-items:start;padding:2rem;border:1px solid var(--line);background:rgba(255,255,255,.025);min-height:175px}
.roadmap-card>span,.roadmap-card small{font-size:.6rem;letter-spacing:.15em;color:var(--cyan)}
.roadmap-card h3{font:500 2rem var(--display);margin:.2rem 0}
.roadmap-card p{margin:0;color:var(--muted)}
.roadmap-card>b{font:400 3.8rem/1 var(--display);color:rgba(255,255,255,.08)}
.fleet-roadmap{border-color:rgba(38,217,212,.55);background:linear-gradient(105deg,rgba(38,217,212,.12),rgba(255,255,255,.025))}
.audience-section{padding:6rem 0;overflow:hidden;background:var(--cyan);color:#031216}
.audience-section>.kicker{color:#0a5859;margin-left:8vw}
.audience-marquee{display:flex;align-items:center;gap:2rem;white-space:nowrap;margin-top:1.2rem;transform:translateX(-3%)}
.audience-marquee span{font:600 clamp(2.4rem,5vw,5.5rem)/1 var(--display);letter-spacing:-.05em}
.audience-marquee i{font-style:normal;font-size:2rem}
.creator-section{padding:clamp(6rem,10vw,10rem) clamp(1.25rem,8vw,9rem);display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center;background:#edf3f4;color:#071620}
.creator-art{min-height:570px;position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#06111b,#123244);color:white;border:1px solid #1d4052}
.creator-art:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(38,217,212,.06) 0,rgba(38,217,212,.06) 1px,transparent 1px,transparent 10px);animation:scanTexture 10s linear infinite}
.creator-art>span{font:600 clamp(3rem,7vw,6.6rem)/.82 var(--display);letter-spacing:-.075em;z-index:2;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.72)}
.creator-art>small{position:absolute;bottom:1.5rem;left:1.5rem;font-size:.58rem;letter-spacing:.15em;color:var(--cyan)}
.creator-reticle{position:absolute;width:340px;height:340px;border:1px solid rgba(38,217,212,.22);border-radius:50%;animation:founderOrbit 18s linear infinite}
.creator-reticle:before,.creator-reticle:after{content:"";position:absolute;background:rgba(38,217,212,.28)}
.creator-reticle:before{left:50%;top:-30px;bottom:-30px;width:1px}
.creator-reticle:after{top:50%;left:-30px;right:-30px;height:1px}
.creator-reticle i{position:absolute;width:12px;height:12px;border:1px solid var(--cyan);border-radius:50%;top:18%;left:10%}
.creator-reticle i:last-child{top:70%;left:82%}
.creator-copy h2{font:500 clamp(2.7rem,5vw,5.2rem)/1.02 var(--display);letter-spacing:-.055em;margin:.9rem 0 1.4rem}
.creator-copy>p:not(.kicker){color:#526873;max-width:600px}
.creator-points{display:grid;grid-template-columns:1fr 1fr;margin:2rem 0;border-top:1px solid #cbdadd}
.creator-points span{padding:.75rem 0;border-bottom:1px solid #cbdadd;font-size:.78rem;font-weight:600}
.creator-points span:nth-child(odd){margin-right:1.5rem}
@keyframes scanTexture{to{background-position:0 100px}}
.about-section{padding:clamp(6rem,10vw,10rem) clamp(1.25rem,8vw,9rem);display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;align-items:center;background:#091925}
.founder-signal{min-height:560px;border:1px solid var(--line);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 50%,rgba(38,217,212,.12),transparent 48%),linear-gradient(rgba(38,217,212,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(38,217,212,.04) 1px,transparent 1px);background-size:auto,36px 36px,36px 36px}
.founder-signal:before,.founder-signal:after{content:"";position:absolute;border:1px solid rgba(38,217,212,.2);border-radius:50%;width:360px;height:360px;animation:founderOrbit 14s linear infinite}
.founder-signal:after{width:470px;height:180px;animation-direction:reverse}
.signal-label{position:absolute;top:1.2rem;left:1.2rem;right:1.2rem;display:flex;justify-content:space-between;font-size:.58rem;letter-spacing:.15em;color:var(--cyan)}
.founder-monogram{font:500 clamp(5rem,11vw,9rem)/1 var(--display);letter-spacing:-.08em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.74);z-index:2}
.signal-wave{position:absolute;left:0;right:0;bottom:90px;height:70px;display:flex;align-items:center;gap:6px;padding:0 1.4rem}
.signal-wave i{flex:1;height:var(--wave,25%);background:linear-gradient(var(--cyan),rgba(38,217,212,.08));animation:signal 2s ease-in-out infinite alternate}
.signal-wave i:nth-child(2n){--wave:68%;animation-delay:-.7s}
.signal-wave i:nth-child(3n){--wave:42%;animation-delay:-1.2s}
.signal-wave i:nth-child(5n){--wave:90%}
.signal-meta{position:absolute;bottom:1.2rem;left:1.2rem;right:1.2rem;display:flex;justify-content:space-between;gap:.5rem;font-size:.55rem;letter-spacing:.1em;color:#718d9a}
.about-copy h2{font:500 clamp(2.5rem,4.8vw,5rem)/1.05 var(--display);letter-spacing:-.05em;margin:.9rem 0 1.8rem}
.about-copy>p:not(.kicker){color:#a5b7bf;max-width:650px}
.about-copy strong{color:white}
.about-copy blockquote{margin:2rem 0;padding:1.4rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:500 clamp(1.15rem,2vw,1.55rem)/1.45 var(--display);color:#dce8ec}
.founder-title b,.founder-title span{display:block}
.founder-title b{font-size:.75rem;letter-spacing:.13em}
.founder-title span{font-size:.78rem;color:#78929e}
@keyframes founderOrbit{to{transform:rotate(360deg)}}
.contact-section{padding:clamp(6rem,10vw,10rem) clamp(1.25rem,8vw,9rem);display:grid;grid-template-columns:1fr 1fr;gap:8vw;background:#edf3f4;color:#0a1720}
.contact-copy>p:nth-of-type(2){color:#526671;max-width:540px}
.company-lockup{display:flex;align-items:center;gap:1rem;margin-top:4rem}
.company-lockup svg{width:44px;fill:none;stroke:#0a1720;stroke-width:2}
.company-lockup svg path:first-child{stroke:#0e9f9c}
.company-lockup b,.company-lockup small{display:block}
.company-lockup b{font-size:.72rem;letter-spacing:.11em}
.company-lockup small{font-size:.72rem;color:#657b86}
.contact-form{background:white;padding:clamp(1.5rem,3vw,2.6rem);box-shadow:0 24px 70px rgba(8,32,44,.09)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.contact-form label{display:block;margin-bottom:1.15rem}
.contact-form label>span{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:#506570;margin-bottom:.45rem}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #cfdbdf;border-radius:2px;background:#f8fbfb;padding:.9rem;color:#0a1720;outline:none}
.contact-form textarea{resize:vertical}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#0e9f9c;box-shadow:0 0 0 3px rgba(14,159,156,.12)}
.form-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.form-footer p{font-size:.7rem;color:#71858e;max-width:240px;margin:0}
.honey{position:absolute!important;left:-9999px!important}
.contact-form.is-pending{opacity:.7;pointer-events:none}
footer{min-height:120px;padding:2rem clamp(1.25rem,5vw,5.5rem);display:grid;grid-template-columns:1fr auto auto;gap:2rem;align-items:center;border-top:1px solid var(--line);font-size:.7rem;color:#718b99}
.chat-launch{position:fixed;z-index:50;right:1.25rem;bottom:1.25rem;display:flex;align-items:center;gap:.45rem;background:#f4fafa;color:#07141d;border:0;border-radius:999px;padding:.7rem .85rem .7rem 1rem;box-shadow:0 12px 38px rgba(0,0,0,.28);cursor:pointer}
.chat-launch svg{width:21px;fill:none;stroke:currentColor;stroke-width:1.8}
.chat-launch .chat-pulse{margin:0}
.chat-panel{position:fixed;z-index:60;right:1.25rem;bottom:1.25rem;width:min(390px,calc(100vw - 2rem));height:min(590px,calc(100svh - 2rem));background:#f7fbfb;color:#0b1b25;box-shadow:0 22px 80px rgba(0,0,0,.42);display:flex;flex-direction:column;opacity:0;transform:translateY(16px) scale(.97);pointer-events:none;transition:.25s}
.chat-panel.open{opacity:1;transform:none;pointer-events:auto}
.chat-head{display:flex;align-items:center;justify-content:space-between;background:#0b2231;color:white;padding:1rem}
.chat-head>div{display:flex;align-items:center}
.chat-head b,.chat-head small{display:block}
.chat-head small{color:#91aab7;font-size:.66rem}
.chat-head button{background:none;color:white;border:0;font-size:1.6rem;cursor:pointer}
.chat-messages{flex:1;padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:.7rem}
.message{max-width:84%;padding:.75rem .85rem;border-radius:12px;font-size:.84rem;line-height:1.48}
.message.bot{align-self:flex-start;background:#e4eeee;border-bottom-left-radius:2px}
.message.user{align-self:flex-end;background:#0e9f9c;color:white;border-bottom-right-radius:2px}
.chat-prompts{display:flex;gap:.4rem;overflow-x:auto;padding:.75rem 1rem;border-top:1px solid #d7e3e5}
.chat-prompts button{white-space:nowrap;border:1px solid #b9cccf;background:white;border-radius:999px;padding:.45rem .65rem;font-size:.7rem;cursor:pointer}
.chat-form{display:flex;padding:.75rem 1rem;gap:.5rem}
.chat-form input{flex:1;border:1px solid #c8d7da;padding:.75rem;border-radius:3px;outline:none;min-width:0}
.chat-form button{width:42px;border:0;background:#0e9f9c;color:white;font-size:1.2rem;cursor:pointer}
.chat-disclosure{padding:0 1rem .75rem;color:#72858e;font-size:.58rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.reveal.visible{opacity:1;transform:none}
@keyframes heroDrift{from{transform:scale(1.02) translate3d(0,0,0)}
to{transform:scale(1.08) translate3d(-1%,.5%,0)}
}
@keyframes scan{0%,100%{transform:translateY(-70px);opacity:0}
30%,70%{opacity:.7}
50%{transform:translateY(70px)}
}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(38,217,212,0)}
}
@keyframes tilt{50%{transform:rotate(4deg) translateY(4px)}
}
@keyframes signal{to{height:calc(var(--h) * .58)}
}
@keyframes scrollLine{from{left:-30px}
to{left:100%}
}
@keyframes marquee{to{transform:translateX(-50%)}
}
@keyframes loopFlow{from{left:-50%}
to{left:100%}
}
@keyframes orbit{to{transform:rotate(347deg)}
}

@media(max-width:980px){.telemetry-card{width:270px;right:1.25rem}
.desktop-nav{display:none}
.control-loop{grid-template-columns:1fr}
.loop-link{height:50px;width:1px;margin-left:1rem}
.loop-link i{width:1px;height:50%;animation-name:loopFlowY}
.products-head,.roadmap-section,.contact-section,.about-section,.creator-section,.technology-head{grid-template-columns:1fr}
.compatibility-panel{grid-template-columns:1fr}
.technology-grid{grid-template-columns:1fr}
.technology-strip{grid-template-columns:repeat(2,1fr)}
.roadmap-copy{position:static}
.roadmap-section{gap:4rem}
.contact-section{gap:4rem}
footer{grid-template-columns:1fr}
.product-feature{min-height:720px}
}
@keyframes loopFlowY{from{top:-50%}
to{top:100%}
}
@media(max-width:700px){.site-header{height:72px}
.nav-cta{font-size:0;padding:.7rem}
.nav-cta span{font-size:1rem}
.hero{min-height:760px;align-items:flex-start}
.hero-photo{background-position:62% center}
.hero-shade{background:linear-gradient(90deg,rgba(2,10,17,.94),rgba(2,10,17,.38)),linear-gradient(0deg,rgba(2,10,17,.94),transparent 55%)}
.hero-content{margin:0 1.25rem;padding-top:8.5rem}
.hero h1{font-size:clamp(3rem,15vw,5.3rem)}
.hero-copy{font-size:1rem}
.telemetry-card{right:1.25rem;left:1.25rem;bottom:4.6rem;width:auto;transform:scale(.9);transform-origin:right bottom}
.scroll-cue{display:none}
.section{padding-left:1.25rem;padding-right:1.25rem}
.benefit-grid,.product-grid,.field-row{grid-template-columns:1fr}
.network-graphic{grid-template-columns:1fr;height:auto;min-height:310px;padding:1rem 3rem}
.network-graphic i{width:1px;height:28px;justify-self:center}
.network-graphic i:after{left:-3px;top:0;animation-name:networkFlowY}
.compatibility-panel{padding:1.5rem;margin-top:3.5rem}
.vessel-map-head{align-items:flex-start;flex-direction:column}
.vessel-map-head small{text-align:left}
.vessel-grid{grid-template-columns:1fr}
.vessel-grid article{min-height:125px}
.product-feature{grid-row:auto;min-height:700px}
.controller-visual{height:350px}
.products-head{grid-template-columns:1fr;gap:1.5rem}
.roadmap-card{grid-template-columns:56px 1fr}
.roadmap-card>b{display:none}
.contact-section{padding-left:1.25rem;padding-right:1.25rem}
.form-footer{align-items:flex-start;flex-direction:column}
.form-footer .button{width:100%}
.company-lockup{margin-top:2rem}
.audience-marquee{transform:none}
.chat-launch b{display:none}
}
@keyframes networkFlowY{from{top:0}to{top:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
.reveal{opacity:1;transform:none}
}