:root{color-scheme:dark;--bg:#0b1220;--paper:#f2f6ff;--ink:#17253d;--muted:#aab8ce;--accent:#4d9aff;--accent-hover:#83baff;--accent-ink:#081323;--accent-deep:#185eb5;--line:#293b56;--display:'Bricolage Grotesque','Trebuchet MS',sans-serif;--body:'DM Sans','Trebuchet MS',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--bg);color:var(--paper);font-family:var(--body);line-height:1.65}
main,.site-footer{position:relative;z-index:1}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
button[hidden]{display:none}
a,button{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
::selection{background:var(--accent);color:var(--bg)}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:var(--display)}
h1,h2{font-weight:600;letter-spacing:-.055em;line-height:1.04}
h2{font-size:clamp(2.5rem,4.7vw,4.8rem)}
em{font-style:normal;color:var(--accent)}
.skip-link{position:fixed;top:10px;left:20px;z-index:20;padding:12px 20px;background:var(--paper);color:var(--bg);transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}
.site-header{position:absolute;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:27px 5.5%;border-bottom:1px solid #ffffff18}
.wordmark{display:inline-flex;align-items:center;font-family:var(--display);font-weight:800;font-size:1.65rem;letter-spacing:-.07em;white-space:nowrap}
.brand-logo{display:block;width:232px;max-width:100%;height:auto}
.site-footer .brand-logo{width:200px}
@media(max-width:700px){.brand-logo{width:190px}}
nav{display:flex;gap:32px;align-items:center;font-size:.86rem}
nav a{transition:color .2s}
nav a:hover{color:var(--accent)}
.nav-contact{padding:9px 17px;border:1px solid #4d9aff60;border-radius:8px;background:#4d9aff12}
.nav-contact span{margin-left:20px}
.menu-toggle{display:none;border:1px solid var(--line);padding:8px 12px;background:var(--bg);border-radius:4px}
.hero{min-height:850px;min-height:max(850px,100svh);position:relative;overflow:hidden;isolation:isolate;padding:205px 5.5% 150px}
.space-scene{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--bg);pointer-events:none}
.space-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b1220ed 0%,#0b1220c4 28%,#0b122040 53%,#0b122030 75%),linear-gradient(0deg,#0b1220a0,transparent 40%)}
#stars{width:100%;height:100%;opacity:.65}
.planet-position{position:absolute;width:min(64vw,920px);right:-4%;top:13%;transform-origin:54% 50%}
.planet-arrival{position:relative}
.planet{display:block;width:100%;height:auto;border-radius:50%}
.descent-layer{position:absolute;inset:0;opacity:0}
.descent-layer img{width:100%;height:100%;object-fit:cover}
.clouds-layer img{object-position:50% 40%}
.aerial-layer img{object-position:50% 65%}
.ground-layer img{object-position:50% 60%}
.orbit{position:absolute;inset:-8%;border:1px solid #8eafd830;border-radius:50%;transform:rotate(-25deg) scaleY(.43)}
.orbit-two{inset:-20%;transform:rotate(42deg) scaleY(.75);border-style:dashed;opacity:.5}
.hero-content{max-width:720px}
.eyebrow{font-size:.67rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;display:flex;align-items:center;gap:9px;margin-bottom:26px}
.status-dot{display:inline-block;width:6px;height:6px;flex-shrink:0;border-radius:50%;background:var(--accent)}
h1{font-size:clamp(3.5rem,6.5vw,6.6rem)}
.hero-description{font-size:1.05rem;max-width:425px;color:var(--muted);margin-top:28px}
.hero-actions{display:flex;align-items:center;gap:25px;flex-wrap:wrap;margin-top:32px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:26px;padding:16px 22px;background:var(--accent);color:var(--accent-ink);font-size:.83rem;font-weight:700;border-radius:8px;transition:transform .2s,background .2s}
.button:hover{background:var(--accent-hover);transform:translateY(-3px)}
.button:active{transform:translateY(0)}
.button span{font-size:1.2rem}
.text-link{display:inline-flex;align-items:center;gap:18px;font-weight:500;font-size:.86rem;border-bottom:1px solid currentColor;padding:5px 0;transition:color .2s}
.text-link:hover{color:var(--accent)}
.hero-note{font-size:.68rem;color:var(--muted);margin-top:19px}
.hero-bottom{position:absolute;bottom:30px;left:5.5%;right:5.5%;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:.67rem;color:var(--muted)}
.scroll-cue{display:flex;gap:15px;align-items:center}
.scroll-cue span{font-size:1.5rem;color:var(--accent)}
.motion-toggle{border:0;border-bottom:1px solid #617ca1;background:transparent;padding:7px 0;font-size:.67rem}
.motion-toggle span{margin-left:8px}
.platform-strip{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:25px 5.5%;border-block:1px solid var(--line);font-size:.76rem;background:#0b1220e8}
.platform-strip>span:first-child{color:var(--muted)}
.platform-strip ul{list-style:none;display:flex;gap:45px;margin:0;padding:0;font-weight:600}
.format-label{color:var(--muted);font:.62rem monospace;letter-spacing:.1em}
.section-wrap{padding:115px 8%}
.section-intro>p:not(.eyebrow){max-width:430px;color:var(--muted);margin-top:26px;font-size:.94rem}
.section-intro>.text-link{margin-top:28px}
.offer{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:8%;background:#0b1220be}
.edit-visual{border:1px solid var(--line);padding:17px;background:#132137;transform:rotate(2deg);border-radius:6px}
.editor-top{display:flex;justify-content:space-between;gap:10px;align-items:center;color:var(--muted);font:.6rem monospace;margin-bottom:16px}
.editor-top>span:first-child{display:flex;align-items:center;gap:7px}
.footage{aspect-ratio:1.55;position:relative;overflow:hidden;background:#d3aa85;border-radius:2px}
.footage-photo{display:block;width:100%;height:100%;object-fit:cover}
.crop-frame{position:absolute;top:7%;bottom:7%;left:36%;width:31%;border:1.5px solid #cce3ff;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:11px 4px;box-shadow:0 0 0 400px #0b122055;color:#e8f3ff}
.crop-label,.crop-bottom{font:.5rem monospace;letter-spacing:.1em;text-align:center}
.crop-cross{font-size:2rem;font-weight:400}
.footage-label{position:absolute;bottom:8px;left:10px;color:#f2f6ff;font:.45rem monospace;letter-spacing:.06em}
.timeline{display:flex;gap:10px;align-items:center;margin-top:18px;color:var(--muted);font:.55rem monospace}
.timeline-track{display:flex;gap:3px;align-items:center;flex:1;height:27px;border-block:1px solid var(--line)}
.timeline-track i{flex:1;height:12px;background:#5e7fa9}
.timeline-track i:nth-child(3n){height:20px;background:var(--accent)}
.timeline-track i:nth-child(2n){height:7px}
.edit-visual>p{font-size:.68rem;color:var(--muted);margin-top:17px}
.process{background:#f2f6fff5;color:var(--ink);display:grid;grid-template-columns:1fr 1.1fr;gap:8%;color-scheme:light}
.process em{color:#185eb5}
.process .section-intro>p:not(.eyebrow){color:#4b5e79}
.process .eyebrow{color:#4b5e79}
.steps{list-style:none;margin:0;padding:0}
.steps li{display:grid;grid-template-columns:38px 1fr 25px;gap:18px;padding:28px 0;border-top:1px solid #c1cfe3}
.steps li:last-child{border-bottom:1px solid #c1cfe3}
.step-number{font:.75rem monospace;color:#185eb5;padding-top:5px}
.steps h3{font-size:1.35rem;font-weight:600;letter-spacing:-.03em}
.steps p{margin-top:8px;font-size:.86rem;color:#4b5e79;max-width:340px}
.step-icon{font-size:1.3rem;color:#185eb5}
.audience{display:grid;grid-template-columns:1.1fr 1fr;gap:9%;align-items:start;border-bottom:1px solid var(--line);background:#0b1220de}
.audience-copy{padding-top:42px}
.audience-copy>p{max-width:410px;color:var(--muted);font-size:.94rem}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 0;padding:0}
.tags li{padding:9px 16px;border:1px solid #456187;border-radius:3px;font-size:.8rem}
.tags span{color:var(--accent);margin-left:14px}
.contact{position:relative;overflow:hidden;min-height:630px;background:#152a47d9}
.contact-content{position:relative;max-width:650px}
.contact h2{font-size:clamp(3.5rem,7vw,7rem)}
.contact p:not(.eyebrow){max-width:390px;color:var(--muted);margin:25px 0 30px;font-size:.94rem}
.contact-email{display:block;width:fit-content;margin-top:20px;font-size:.8rem;color:var(--muted);text-decoration:underline;text-underline-offset:4px}
.contact-email:hover{color:var(--paper)}
.contact-orbit{position:absolute;width:650px;height:650px;right:-180px;top:10px;border:1px solid #4d9aff50;border-radius:50%}
.contact-orbit::before,.contact-orbit::after{content:'';position:absolute;inset:75px;border:1px solid #4d9aff50;border-radius:50%}
.contact-orbit::after{inset:150px}
.site-footer{display:flex;gap:28px;align-items:center;justify-content:space-between;padding:35px 5.5% max(115px,env(safe-area-inset-bottom));color:var(--muted);font-size:.7rem;background:var(--bg)}
.site-footer .wordmark{font-size:1.35rem;color:var(--paper)}
.site-footer{flex-wrap:wrap}
.social-links{display:flex;flex-wrap:wrap;gap:12px 24px;font-size:.8rem}
.social-links a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:4px}
.social-links a:hover,.social-links a:focus-visible{color:var(--accent)}
.footer-social{flex-basis:100%;order:1;grid-column:1/-1;grid-row:4}
.site-footer>a:last-child:hover{color:var(--accent)}
.journey-controls{position:fixed;bottom:20px;right:24px;z-index:6;display:flex;align-items:center;gap:15px;padding:12px 17px;background:#0b1220f5;border:1px solid #456187;border-radius:5px;box-shadow:0 8px 30px #0b122030}
.journey-controls[hidden]{display:none}
.journey-stage{font:.62rem monospace;color:var(--paper);min-width:143px}
.journey-progress{width:38px;height:2px;background:#456187;overflow:hidden}
.journey-progress span{display:block;height:100%;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left}
.journey-controls .motion-toggle{color:var(--muted);min-height:30px}
.story-example{display:grid;grid-template-columns:.9fr 1.1fr;gap:8%;align-items:center;padding-block:145px;background:linear-gradient(90deg,#0b1220eb,#0b122050);border-block:1px solid #ffffff15}
.example-reverse .example-copy{grid-column:2;grid-row:1}
.example-reverse .example-media{grid-column:1;grid-row:1}
.example-category{color:var(--accent);font-size:.78rem;margin-bottom:14px}
.example-copy h2{font-size:clamp(2.3rem,3.9vw,4rem)}
.example-copy>p:not(.eyebrow):not(.example-category){margin-top:23px;max-width:380px;font-size:.9rem;color:var(--muted)}
.example-copy .example-result{color:var(--paper)!important;font-size:.75rem!important;border-top:1px solid #ffffff38;padding-top:18px}
.example-result span{color:var(--accent);margin-right:12px}
.example-media{margin:0;background:var(--bg);border:1px solid #456187;padding:10px;border-radius:5px}
.example-image{position:relative;aspect-ratio:1.4;overflow:hidden;background:#17253d}
.example-image>img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.example-crop{position:absolute;inset:0;display:grid;place-items:end center;pointer-events:none;opacity:0;transition:opacity .3s}
.example-crop::before{content:'';position:absolute;top:0;bottom:0;width:40.18%;border-inline:1px solid var(--accent);box-shadow:0 0 0 600px #0b1220bf}
.example-crop span{z-index:1;margin-bottom:20px;max-width:35%;padding:6px;background:#0b1220e8;color:var(--paper);font:.55rem/1.6 monospace;text-align:center}
.is-cropped .example-crop{opacity:1}
.is-cropped .example-image>img{transform:scale(1.12)}
.media-badge{position:absolute;top:15px;left:15px;padding:6px 9px;background:#0b1220f0;color:var(--paper);font:.55rem monospace;letter-spacing:.07em}
.example-media figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 4px 3px;font-size:.62rem;color:var(--muted)}
.crop-toggle{padding:8px 10px;border:1px solid #456187;border-radius:3px;background:var(--bg);color:var(--paper);font-size:.65rem;min-height:35px}
.crop-toggle:hover,.crop-toggle[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
.crop-toggle span{margin-left:9px}
.motion-enabled .planet-arrival{animation:arrival 2s cubic-bezier(.16,1,.3,1) both}
.motion-enabled .hero-content{animation:content-arrival 1s .2s both}
@keyframes arrival{from{transform:scale(.22) rotate(-14deg);opacity:.25}to{transform:scale(1) rotate(0deg);opacity:1}}
@keyframes content-arrival{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
html.motion-off{scroll-behavior:auto}
.motion-off *,.motion-off *::before,.motion-off *::after{animation:none!important;transition:none!important}
@media(min-width:1600px){.hero{padding-top:245px}.planet-position{right:1%}.section-wrap{padding-inline:max(8%,calc((100% - 1380px)/2))}}
@media(max-width:1000px){nav{gap:20px}.hero{min-height:800px;padding-top:190px}.planet-position{width:80vw;right:-24%;top:17%}.platform-strip ul{gap:24px}.format-label{display:none}.section-wrap{padding:85px 6%}.offer,.process,.audience{gap:6%}.site-footer>p{display:none}}
@media(max-width:700px){
html{scroll-padding-top:25px}
.site-header{padding:21px 6%;flex-wrap:wrap;gap:16px}
.wordmark{font-size:1.45rem}
.menu-toggle:not([hidden]){display:inline-flex;gap:18px}
nav{width:100%;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.76rem}
.js nav{display:none}
.js nav.is-open{display:flex;padding:15px;background:#132137;border:1px solid var(--line);border-radius:4px}
.nav-contact{border:0;padding:0}
.nav-contact span{margin-left:5px}
.hero{min-height:920px;padding:400px 6% 165px}
.js .hero{min-height:850px;padding-top:345px}
.hero-content{max-width:540px}
.planet-position{width:390px;right:calc(50% - 195px);top:90px}
.space-scene::after{background:linear-gradient(0deg,var(--bg) 0%,#0b1220f5 35%,#0b122080 58%,transparent 80%)}
.hero .eyebrow{font-size:.55rem;letter-spacing:.12em;margin-bottom:20px}
h1{font-size:clamp(2.8rem,9.2vw,4.5rem)}
.hero-description{font-size:.92rem;margin-top:22px;max-width:380px}
.hero-actions{gap:17px;margin-top:24px}
.button{font-size:.76rem;padding:14px 17px;gap:18px}
.text-link{font-size:.76rem}
.hero-note{max-width:320px;font-size:.64rem}
.hero-bottom{bottom:96px;left:6%;right:6%}
.scroll-cue,.motion-toggle{font-size:.6rem}
.platform-strip{flex-direction:column;gap:13px;padding:23px 6%}
.platform-strip ul{gap:25px;font-size:.72rem}
.section-wrap{padding:68px 6%}
.offer,.process,.audience{grid-template-columns:1fr;gap:43px}
h2{font-size:clamp(2.5rem,9vw,3.8rem)}
.eyebrow{font-size:.6rem;margin-bottom:20px}
.edit-visual{width:97%;justify-self:center}
.section-intro>p:not(.eyebrow),.audience-copy>p{font-size:.9rem}
.steps li{gap:12px;grid-template-columns:30px 1fr 20px;padding-block:23px}
.steps h3{font-size:1.2rem}
.audience-copy{padding-top:0}
.audience{gap:24px}
.contact{min-height:520px}
.contact h2{font-size:clamp(3.2rem,12vw,5rem)}
.contact-orbit{width:450px;height:450px;right:-280px;top:40px}
.site-footer{display:grid;grid-template-columns:1fr 1fr;gap:22px 15px;padding:30px 6% 120px}
.site-footer>span{grid-column:1;grid-row:2}
.site-footer>a:last-child{text-align:right}
.story-example{grid-template-columns:1fr;gap:30px;padding-block:85px;background:linear-gradient(#0b1220a0,#0b1220d9)}
.example-reverse .example-copy,.example-reverse .example-media{grid-column:auto;grid-row:auto}
.example-copy h2{font-size:clamp(2.3rem,9vw,3.8rem)}
.example-media figcaption{font-size:.55rem}
.journey-controls{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));justify-content:space-between;padding:8px 10px;gap:8px}
.journey-stage{min-width:auto;font-size:.55rem}
.journey-progress{width:22px}
.journey-controls .motion-toggle{font-size:.55rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
