:root{color-scheme:dark;--bg:#070b17;--surface:#0e1425;--surface2:#111b30;--line:rgba(166,195,230,.16);--ink:#f4f7ff;--muted:#a8b5cb;--blue:#7fb8ff;--cyan:#68eee5;--violet:#a991ff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden}
button,a{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}img{max-width:100%}
::selection{background:#9bdcff;color:#06111e}
.skip-link{position:fixed;z-index:1000;top:-60px;left:20px;padding:12px 18px;background:var(--cyan);color:#07111e;border-radius:8px}
.skip-link:focus{top:12px}
.site-header{height:82px;padding:0 clamp(22px,4.6vw,80px);display:flex;align-items:center;justify-content:space-between;gap:30px;position:absolute;top:0;left:0;right:0;z-index:30;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg,rgba(7,11,23,.76),rgba(7,11,23,0))}
.brand{display:inline-flex;align-items:center;gap:10px;font:700 18px/1 "Space Grotesk",sans-serif;letter-spacing:-.045em;white-space:nowrap}
.brand img{object-fit:contain;filter:drop-shadow(0 0 12px rgba(114,220,255,.3))}
.brand-thin{font-weight:400;color:#b6c6e0}
.desktop-nav{display:flex;gap:clamp(22px,3vw,52px);margin-left:auto;margin-right:auto}
.desktop-nav a,.header-contact{font-size:14px;font-weight:600;letter-spacing:.02em}
.desktop-nav a{color:#c6d1e2;transition:color .2s}.desktop-nav a:hover,.desktop-nav a:focus-visible{color:white}
.header-contact{border:1px solid rgba(147,209,255,.35);border-radius:100px;padding:12px 18px;white-space:nowrap;transition:background .2s,border-color .2s}
.header-contact:hover{background:rgba(119,188,255,.12);border-color:var(--blue)}.header-contact span{margin-left:14px;color:var(--cyan)}
.menu-toggle{display:none;background:none;border:0;width:44px;height:44px;padding:10px}.menu-toggle span{display:block;width:23px;height:2px;background:#e8f3ff;margin:6px auto;transition:transform .2s}.mobile-nav{position:absolute;top:76px;left:16px;right:16px;padding:18px;border:1px solid var(--line);border-radius:16px;background:#101a2d;box-shadow:0 24px 60px #0009}.mobile-nav a{display:block;padding:12px;border-radius:8px}.mobile-nav a:hover{background:#1c2c45}
.hero{--split-distance:clamp(250px,31vw,510px);height:min(880px,100svh);min-height:690px;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse 72% 62% at 50% 48%,#18234a 0%,#0b1328 50%,#070b17 88%)}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 22% 25%,rgba(94,116,255,.11),transparent 27%),radial-gradient(circle at 78% 70%,rgba(61,230,228,.09),transparent 25%);pointer-events:none}
.hero-orbit{position:absolute;left:50%;top:49%;border:1px solid rgba(142,186,248,.11);border-radius:50%;transform:translate(-50%,-50%) rotate(-18deg);pointer-events:none}
.orbit-one{width:min(1000px,94vw);height:min(1000px,94vw)}.orbit-two{width:min(730px,75vw);height:min(730px,75vw);border-style:dashed;opacity:.65;animation:orbit 60s linear infinite}
.hero-glow{position:absolute;width:520px;height:520px;border-radius:50%;left:50%;top:48%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(100,179,255,.2),rgba(94,83,255,.055) 45%,transparent 70%);filter:blur(45px);animation:glow 6s ease-in-out infinite alternate}
.hero-stage{position:absolute;inset:82px 0 0;display:grid;place-items:center;text-align:center}
.logo-split{position:absolute;inset:0;pointer-events:none;z-index:1}
.hero-copy{position:relative;z-index:4;width:min(800px,calc(100% - 48px));padding-bottom:48px;animation:copy-in 1.15s cubic-bezier(.2,.8,.25,1) 1.05s both}
.hero-kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 28px;color:#93deee;font:600 12px/1.2 "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.24em}
.signal-dot{height:7px;width:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 5px rgba(104,238,229,.08),0 0 15px var(--cyan)}
.hero h1{font:600 clamp(70px,9.2vw,150px)/.84 "Space Grotesk",sans-serif;letter-spacing:-.095em;margin:0;text-shadow:0 15px 75px rgba(0,0,0,.45)}
.hero h1 span{font-weight:400;color:transparent;background:linear-gradient(110deg,#dceaff 10%,#91bcff 48%,#9cf6ed 88%);background-clip:text;-webkit-background-clip:text}
.hero-subtitle{max-width:510px;margin:34px auto 0;color:#c5d3e8;font-size:clamp(17px,1.5vw,20px);line-height:1.6}
.hero-actions{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:36px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:14px 22px;font-size:14px;font-weight:700;border-radius:9px;transition:transform .2s,background .2s,border-color .2s}
.button:hover{transform:translateY(-3px)}.button-primary{background:linear-gradient(120deg,#c0e5ff,#86d8e9);color:#07111e;box-shadow:0 10px 40px rgba(90,190,230,.18)}.button-primary:hover{background:#e4f5ff}
.button-text{color:#dce8f8}.button-text span{margin-left:10px;color:var(--cyan)}
.hero-meta{position:absolute;bottom:33px;left:clamp(22px,4.6vw,80px);right:clamp(22px,4.6vw,80px);z-index:5;display:flex;align-items:center;justify-content:space-between;color:#8294b2;font:500 11px/1 "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.18em}
.scroll-cue{display:flex;align-items:center;gap:15px}.scroll-cue i{display:block;width:1px;height:32px;background:linear-gradient(#75dae7,transparent);animation:scroll-line 1.8s ease-in-out infinite}
.section-shell{width:min(1440px,calc(100% - 2 * clamp(24px,6vw,92px)));margin-inline:auto}
.intro,.approach{padding-top:150px;padding-bottom:150px}
.section-index{font:600 13px/1.2 "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.2em;color:#71d8e7;margin:0 0 27px}
.section-heading{border-top:1px solid var(--line);padding-top:24px;margin-bottom:62px}
.section-heading-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:50px;align-items:end}
.section-heading h2,.product-copy h2,.contact-inner h2{font:500 clamp(48px,5.5vw,88px)/1.04 "Space Grotesk",sans-serif;letter-spacing:-.07em;margin:0}
.section-heading h2 span{color:#8ba0bd}.section-heading h2 span:first-child{color:var(--ink)}.section-heading-row>p{max-width:470px;margin:0 0 8px;color:var(--muted);font-size:18px;line-height:1.7}
.expertise-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.expertise-card{min-height:360px;padding:27px;display:flex;flex-direction:column;background:linear-gradient(155deg,#131e32,#0d1423 75%);border:1px solid var(--line);border-radius:16px;transition:transform .25s,border-color .25s,box-shadow .25s}
.expertise-card:hover{transform:translateY(-8px);border-color:rgba(123,222,243,.42);box-shadow:0 24px 55px #0005}
.card-top{display:flex;justify-content:space-between;align-items:start;color:#80a3c6;font:600 13px "Space Grotesk",sans-serif}.card-symbol{font-size:35px;color:#84d4e9;line-height:1}
.expertise-card h3{font:500 clamp(23px,2.15vw,32px)/1.15 "Space Grotesk",sans-serif;letter-spacing:-.05em;margin:75px 0 14px}
.expertise-card p{font-size:15px;line-height:1.6;color:#aebbd0;margin:0 0 30px}
.card-line{height:1px;background:var(--line);margin-top:auto;margin-bottom:16px}.card-label{font:500 11px "Space Grotesk",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#78c6df}
.product-section{padding:115px 0;background:radial-gradient(ellipse 70% 120% at 80% 50%,rgba(44,70,127,.2),transparent),#0b1222;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.product-layout{display:grid;grid-template-columns:minmax(340px,.8fr) minmax(0,1.2fr);gap:clamp(55px,7vw,120px);align-items:center}
.product-badge{display:inline-block;border:1px solid #456981;background:rgba(76,146,176,.12);border-radius:100px;padding:8px 13px;color:#9bdeea;font:600 11px "Space Grotesk",sans-serif;letter-spacing:.12em;text-transform:uppercase;margin-bottom:24px}
.product-copy h2{margin-bottom:25px}.product-copy h2 em{font-style:normal;color:#8cebe3}.product-copy>p:not(.section-index){font-size:18px;line-height:1.7;color:var(--muted);max-width:465px}
.product-features{list-style:none;padding:0;margin:34px 0;display:grid;gap:16px;color:#d1dcec;font-size:15px}.product-features li{display:flex;align-items:center;gap:12px}.product-features li span{width:7px;height:7px;border:1px solid var(--cyan);transform:rotate(45deg)}
.visual-frame{background:#111c30;border:1px solid #41536c;border-radius:16px;padding:10px;box-shadow:0 45px 100px #0009,0 0 85px rgba(85,158,255,.13);transform:perspective(1200px) rotateY(-6deg) rotateX(3deg);transition:transform .4s}
.visual-frame:hover{transform:none}.visual-frame img{display:block;width:100%;height:auto;border-radius:8px}
.visual-bar{height:30px;display:flex;align-items:center;gap:5px;padding:0 10px}.visual-bar span{width:6px;height:6px;border-radius:50%;background:#50647e}.visual-bar p{font:500 10px "Space Grotesk",sans-serif;color:#7992ad;margin:auto;transform:translateX(-15px)}
.visual-caption{display:block;text-align:right;color:#7188a3;font:500 12px "Space Grotesk",sans-serif;letter-spacing:.08em;margin-top:22px}
.approach-list{border-top:1px solid var(--line)}.approach-item{display:grid;grid-template-columns:80px 1fr 1fr;gap:30px;align-items:center;border-bottom:1px solid var(--line);padding:34px 0;transition:padding .25s,color .25s}.approach-item:hover{padding-left:16px;color:var(--cyan)}
.approach-item>span{font:600 13px "Space Grotesk",sans-serif;color:#76d6e2}.approach-item h3{font:500 clamp(27px,3vw,43px)/1.1 "Space Grotesk",sans-serif;letter-spacing:-.05em;margin:0}.approach-item p{font-size:16px;line-height:1.55;color:var(--muted);margin:0}
.contact-section{border-top:1px solid var(--line);background:radial-gradient(ellipse 80% 100% at 50% 110%,rgba(70,95,198,.27),transparent),#0d1629}
.contact-inner{text-align:center;padding-top:130px;padding-bottom:140px}.contact-inner h2{font-size:clamp(50px,7vw,110px)}.contact-inner>p:not(.section-index){font-size:18px;color:var(--muted);line-height:1.6;margin:28px 0 42px}.contact-link{display:inline-flex;gap:30px;align-items:center;border-bottom:1px solid #b0e5f4;padding-bottom:9px;color:#b8edf5;font:500 clamp(17px,2vw,25px) "Space Grotesk",sans-serif;transition:gap .25s}.contact-link:hover{gap:40px}
.site-footer{min-height:230px;padding-top:48px;padding-bottom:38px;display:grid;grid-template-columns:1fr 1fr;gap:25px;color:#8090a9}
.footer-brand{display:flex;align-items:center;gap:9px;color:#e8f2ff;font:600 17px "Space Grotesk",sans-serif}.footer-brand img{object-fit:contain}
.site-footer>p{text-align:right;margin:0}.footer-links{display:flex;gap:30px;font-size:14px}.footer-links a:hover{color:white}.site-footer small{text-align:right;font-size:12px}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
.scroll-drift:not(.expertise-card):not(.visual-frame){display:inline-block;transform:translate3d(0,var(--drift-y,0px),0)}
.expertise-card.reveal.visible{transform:translate3d(0,var(--drift-y,0px),0);box-shadow:0 var(--shadow-y,16px) var(--shadow-blur,32px) rgba(0,0,0,var(--shadow-alpha,.12))}
.expertise-card.reveal.visible:hover{transform:translate3d(0,calc(var(--drift-y,0px) - 8px),0);border-color:rgba(123,222,243,.42);box-shadow:0 28px 65px #0008,0 0 40px rgba(104,238,229,.08)}
.visual-frame.scroll-drift{transform:translate3d(0,var(--drift-y,0px),0) perspective(1200px) rotateY(-6deg) rotateX(3deg);box-shadow:0 var(--shadow-y,38px) var(--shadow-blur,75px) #0009,0 0 85px rgba(85,158,255,.13)}
.visual-frame.scroll-drift:hover{transform:translate3d(0,var(--drift-y,0px),0) perspective(1200px) rotateY(-2deg) rotateX(1deg)}
@keyframes copy-in{0%{opacity:0;filter:blur(18px);transform:translateY(26px) scale(.97)}100%{opacity:1;filter:blur(0);transform:none}}
@keyframes glow{from{opacity:.5;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}
@keyframes orbit{from{transform:translate(-50%,-50%) rotate(-18deg)}to{transform:translate(-50%,-50%) rotate(342deg)}}@keyframes scroll-line{50%{opacity:.25;transform:translateY(5px)}}
@media(max-width:1050px){.expertise-grid{grid-template-columns:repeat(2,1fr)}.product-layout{grid-template-columns:1fr;gap:70px}.product-copy{max-width:620px}.visual-frame{max-width:760px;margin:auto}.section-heading-row{grid-template-columns:1fr}.section-heading-row>p{max-width:650px}.hero h1{font-size:clamp(70px,10vw,115px)}}
@media(max-width:700px){.site-header{height:72px;padding:0 20px}.brand{font-size:16px}.brand img{width:34px;height:34px}.desktop-nav,.header-contact{display:none}.menu-toggle{display:block}.hero{--split-distance:clamp(120px,32vw,190px);min-height:650px;height:100svh}.hero-stage{inset:72px 0 0}.hero h1{font-size:clamp(57px,14.8vw,88px)}.hero-kicker{font-size:10px;letter-spacing:.16em;margin-bottom:23px}.hero-copy{width:calc(100% - 34px);padding-bottom:24px}.hero-subtitle{font-size:16px;max-width:330px;margin-top:27px}.hero-actions{flex-direction:column;gap:8px;margin-top:30px}.hero-actions .button{min-height:48px}.hero-meta{left:22px;right:22px;bottom:22px;font-size:10px}.hero-meta>span:first-child{display:none}.scroll-cue{order:2}.section-shell{width:calc(100% - 40px)}.intro,.approach{padding-top:90px;padding-bottom:90px}.section-heading{margin-bottom:40px}.section-heading h2,.product-copy h2{font-size:clamp(44px,11vw,68px)}.section-heading-row{gap:24px}.section-heading-row>p{font-size:16px}.expertise-grid{grid-template-columns:1fr;gap:12px}.expertise-card{min-height:280px}.expertise-card h3{margin-top:42px}.product-section{padding:85px 0}.product-layout{gap:50px}.visual-frame{transform:none}.visual-frame.scroll-drift{transform:translate3d(0,var(--drift-y,0px),0)}.visual-frame.scroll-drift:hover{transform:translate3d(0,var(--drift-y,0px),0)}.approach-item{grid-template-columns:44px 1fr;gap:10px 15px}.approach-item p{grid-column:2}.contact-inner{padding-top:95px;padding-bottom:105px}.contact-inner h2{font-size:clamp(46px,11vw,72px)}.contact-link{gap:12px;font-size:16px}.site-footer{grid-template-columns:1fr;gap:23px;padding-top:38px}.site-footer>p,.site-footer small{text-align:left}.site-footer>p{display:none}.footer-links{gap:18px;flex-wrap:wrap}}
@media(max-width:480px){.hero-subtitle{max-width:300px}.hero-meta>span:last-child{display:none}.hero-meta{justify-content:center}.card-symbol{font-size:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.hero-copy{opacity:1;filter:none;transform:none}.reveal{opacity:1;transform:none}.scroll-drift,.expertise-card.reveal.visible,.visual-frame.scroll-drift{transform:none!important}}
