:root{
  --navy:#2e3a6c;
  --ink:#171a2b;
  --white:#fff;
  --blush:#f5dcd6;
  --amber:#feb737;
  --mist:#ebeee6;
  --grey:#606060;
  --line:rgba(46,58,108,.16);
  --blue:#1788ee;
  --green:#5bb87c;
  --accent:#feb737;
  --accent-soft:#f5dcd6;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--ink);font-family:"DM Sans",sans-serif;line-height:1.6}
body[data-solution="social"]{--accent:#f36f54;--accent-soft:#f5dcd6}
body[data-solution="web"]{--accent:#feb737;--accent-soft:#ebeee6}
body[data-solution="crm"]{--accent:#62c494;--accent-soft:#dcece5}
a{color:inherit}
button,a{font:inherit}
img{display:block;max-width:100%}
.wrap{width:min(1180px,calc(100% - 40px));margin:auto}
.topbar{position:absolute;z-index:20;top:0;left:0;right:0;border-bottom:1px solid rgba(255,255,255,.17)}
.topbar .wrap{height:82px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand{display:flex;align-items:center;gap:13px;color:#fff;text-decoration:none}
.brand img{width:50px;height:50px;object-fit:contain;background:#fff}
.brand strong{display:block;font-family:"Montserrat",sans-serif;font-size:.88rem}
.brand span{display:block;color:rgba(255,255,255,.62);font-size:.7rem}
.solution-nav{display:flex;align-items:center;gap:25px;color:rgba(255,255,255,.7);font-size:.76rem}
.solution-nav a{text-decoration:none}
.solution-nav a:hover,.solution-nav a[aria-current="page"]{color:#fff}
.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:1px solid var(--accent);border-radius:5px;background:var(--accent);color:#171a2b;font-family:"Montserrat",sans-serif;font-size:.73rem;font-weight:750;text-decoration:none;text-transform:uppercase;transition:transform .2s,filter .2s}
.nav-cta:hover,.button:hover{transform:translateY(-2px);filter:brightness(1.05)}
.button.outline{border-color:rgba(255,255,255,.42);background:transparent;color:#fff}
.hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;overflow:hidden;background:#11162d;color:#fff}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to right,#000 35%,transparent 95%)}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,14,34,.98) 0%,rgba(10,14,34,.9) 44%,rgba(10,14,34,.3) 74%,rgba(10,14,34,.6) 100%)}
.hero-content{position:relative;z-index:5;width:min(650px,53%);padding:140px 0 62px}
.eyebrow{display:flex;align-items:center;gap:11px;margin-bottom:18px;color:var(--accent);font-family:"Montserrat",sans-serif;font-size:.72rem;font-weight:750;text-transform:uppercase}
.eyebrow:before{content:"";width:35px;height:2px;background:currentColor}
h1,h2,h3{margin:0;font-family:"Cormorant Garamond",serif;line-height:.98;letter-spacing:0}
h1{font-size:clamp(3.6rem,5.4vw,5rem)}
h1 em{display:block;margin-top:10px;color:var(--accent-soft);font-size:.61em;font-weight:600}
.hero-copy{max-width:640px;margin:26px 0 31px;color:rgba(255,255,255,.78);font-size:1.06rem}
.hero-actions{display:flex;gap:15px;flex-wrap:wrap}
.micro-proof{display:flex;gap:22px;margin-top:31px;color:rgba(255,255,255,.57);font-size:.68rem}
.micro-proof span{display:flex;align-items:center;gap:7px}
.micro-proof i{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 15%,transparent)}
.hero-stage{position:absolute;z-index:2;inset:95px 0 0 53%;pointer-events:none}
.stage-frame{position:absolute;right:3vw;top:9%;width:min(560px,44vw);height:68%;border:1px solid rgba(255,255,255,.17);border-top:2px solid var(--accent);background:rgba(22,27,55,.88);box-shadow:0 34px 80px rgba(3,6,18,.35);backdrop-filter:blur(13px);overflow:hidden}
.stage-top{height:46px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.12);font-family:"Montserrat",sans-serif;font-size:.58rem;font-weight:700}
.stage-status{display:flex;align-items:center;gap:7px;color:#bce8ca}
.stage-status:before{content:"";width:7px;height:7px;border-radius:50%;background:#5bd18a;animation:pulse 2s infinite}
.stage-body{height:calc(100% - 46px);display:grid;grid-template-columns:150px 1fr}
.stage-rail{padding:19px 13px;border-right:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.48);font-size:.62rem}
.stage-rail b{display:block;margin-bottom:15px;color:#fff;font-size:.67rem}
.stage-rail span{display:block;padding:8px 9px;border-left:2px solid transparent}
.stage-rail span.active{border-color:var(--accent);background:rgba(255,255,255,.07);color:#fff}
.stage-main{padding:19px;overflow:hidden}
.stage-main header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}
.stage-main header strong{font-size:.77rem}
.stage-main header span{color:rgba(255,255,255,.48);font-size:.59rem}
.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:12px}
.metric{min-height:66px;padding:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04)}
.metric small{display:block;color:rgba(255,255,255,.52);font-size:.54rem}.metric b{display:block;margin-top:4px;font-size:1.02rem}.metric em{color:#8fd7ac;font-size:.51rem;font-style:normal}
.stream{display:grid;gap:7px}.stream-item{display:grid;grid-template-columns:8px 1fr auto;gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.055)}
.stream-item i{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.stream-item strong{display:block;font-size:.65rem}.stream-item small{display:block;color:rgba(255,255,255,.5);font-size:.54rem}.stream-item time{font-size:.54rem;color:rgba(255,255,255,.48)}
.signal-card{position:absolute;right:31vw;top:3%;min-width:205px;padding:12px 14px;border:1px solid rgba(255,255,255,.16);background:#1b2242;color:#fff;box-shadow:0 15px 35px rgba(3,6,18,.3);animation:float 4s ease-in-out infinite}
.signal-card.second{right:2vw;top:72%;animation-delay:-2s}
.signal-card b{display:block;font-size:.66rem}.signal-card span{color:rgba(255,255,255,.56);font-size:.57rem}
.signal-strip{position:relative;z-index:7;background:#11162d;color:#fff;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}
.signal-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.signal{position:relative;padding:21px 20px;border-right:1px solid rgba(255,255,255,.12)}
.signal:last-child{border-right:0}.signal b{display:block;color:var(--accent-soft);font-family:"Montserrat",sans-serif;font-size:.64rem;text-transform:uppercase}.signal span{color:rgba(255,255,255,.58);font-size:.71rem}.signal:before{content:"";position:absolute;left:8px;top:27px;width:4px;height:4px;border-radius:50%;background:var(--accent)}
.narrative{padding:112px 0;background:#fff}
.narrative-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:80px;align-items:start}
.sticky{position:sticky;top:32px}
.section-kicker{margin-bottom:15px;color:var(--navy);font-family:"Montserrat",sans-serif;font-size:.7rem;font-weight:750;text-transform:uppercase}
.narrative h2,.showcase h2,.modules h2,.closing h2{font-size:clamp(3rem,5.4vw,5.3rem);color:var(--navy)}
.narrative p,.section-copy{color:var(--grey)}
.flow{border-top:1px solid var(--line)}
.flow-step{display:grid;grid-template-columns:52px 1fr auto;gap:17px;align-items:center;padding:24px 0;border-bottom:1px solid var(--line)}
.flow-step>span{color:var(--accent);font-family:"Montserrat",sans-serif;font-size:.72rem;font-weight:750}.flow-step strong{display:block;color:var(--navy);font-size:1rem}.flow-step small{display:block;color:#737986}.flow-step i{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 7px color-mix(in srgb,var(--accent) 16%,transparent)}
.showcase{padding:110px 0;background:var(--mist);overflow:hidden}
.showcase-head{display:grid;grid-template-columns:1fr .82fr;gap:70px;align-items:end;margin-bottom:43px}.showcase-head p{margin:0;color:var(--grey)}
.media-stage{position:relative;padding:48px 48px 30px;border:1px solid rgba(46,58,108,.16);border-top:3px solid var(--accent);background:#fff;box-shadow:0 28px 70px rgba(34,43,76,.13)}
.media-stage:before{content:"ASTROHUE / SYSTEM VIEW";position:absolute;top:0;left:0;right:0;height:35px;display:flex;align-items:center;padding-left:16px;border-bottom:1px solid var(--line);color:var(--navy);font-family:"Montserrat",sans-serif;font-size:.57rem;font-weight:750}
.media-stage img{width:100%;aspect-ratio:16/7.2;object-fit:contain;background:#f8fbff}
.media-caption{display:flex;justify-content:space-between;gap:20px;margin-top:18px;color:#6f7684;font-size:.67rem}.media-caption b{color:var(--navy)}
.modules{padding:110px 0;background:#fff}
.modules-head{max-width:780px;margin-bottom:45px}.modules-head p{max-width:650px;color:var(--grey)}
.module-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.module{min-height:240px;padding:29px;background:#fff}.module:nth-child(2),.module:nth-child(6){background:var(--accent-soft)}
.module b{display:block;margin-bottom:34px;color:var(--accent);font-family:"Montserrat",sans-serif;font-size:.7rem}.module h3{color:var(--navy);font-size:2rem}.module p{margin:15px 0 0;color:var(--grey);font-size:.88rem}
.proof-band{padding:110px 0;background:var(--navy);color:#fff}
.proof-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:72px;align-items:center}.proof-band h2{font-size:clamp(3rem,5vw,5rem)}.proof-band p{color:rgba(255,255,255,.66)}
.proof-frame{padding:18px;border:1px solid rgba(255,255,255,.18);border-top:3px solid var(--accent);background:#fff;box-shadow:0 30px 70px rgba(4,8,24,.3)}.proof-frame img{width:100%;aspect-ratio:16/9;object-fit:contain;background:#fff}
.closing{padding:105px 0;background:var(--blush)}
.closing-grid{display:grid;grid-template-columns:1fr auto;gap:70px;align-items:center}.closing h2{max-width:820px}.closing p{max-width:700px;color:var(--grey)}.closing .button{background:var(--navy);border-color:var(--navy);color:#fff}.closing small{display:block;margin-top:10px;color:#6d6570;text-align:center}
.privacy-note{max-width:340px;margin:13px auto 0;color:#69616a;font-size:.68rem;text-align:center}.privacy-note a{font-weight:700}
.site-footer{padding:28px 0;background:#0d1020;color:rgba(255,255,255,.55);font-size:.76rem}.site-footer .wrap{display:flex;justify-content:space-between;gap:24px}.legal-links{display:flex;gap:16px;flex-wrap:wrap}.legal-links a,.legal-links button{border:0;background:none;color:inherit;text-decoration:none;padding:0;cursor:pointer}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s ease}.reveal.visible{opacity:1;transform:none}
@keyframes pulse{50%{opacity:.36}}@keyframes float{50%{transform:translateY(-7px)}}
@media(max-width:980px){.solution-nav a:not(.nav-cta){display:none}.hero-content{width:min(640px,100%)}.hero-stage{inset:100px -300px 0 66%;opacity:.16}.stage-frame{width:560px}.narrative-grid,.showcase-head,.proof-grid,.closing-grid{grid-template-columns:1fr}.sticky{position:static}.module-grid{grid-template-columns:1fr 1fr}.closing-grid{gap:30px}.closing-grid>div:last-child{justify-self:start}.signal-grid{grid-template-columns:1fr 1fr}.signal:nth-child(2){border-right:0}.signal:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.12)}}
@media(max-width:640px){.wrap{width:min(100% - 28px,1180px)}.topbar .wrap{height:70px}.brand span{display:none}.nav-cta{min-height:43px;padding:0 13px;font-size:.62rem}.hero{min-height:91vh}.hero-content{width:100%;padding:122px 0 55px}.hero h1{font-size:2.85rem}.hero-copy{font-size:.94rem}.hero-stage{display:none}.signal-card{display:none}.micro-proof{gap:12px;flex-wrap:wrap}.narrative,.showcase,.modules,.proof-band,.closing{padding:76px 0}.narrative-grid{gap:45px}.narrative h2,.showcase h2,.modules h2,.closing h2{font-size:2.7rem}.flow-step{grid-template-columns:38px 1fr}.flow-step i{display:none}.showcase-head{gap:25px}.media-stage{padding:43px 10px 14px}.media-stage img{aspect-ratio:4/3}.media-caption{display:block}.module-grid{grid-template-columns:1fr}.module{min-height:auto}.proof-grid{gap:35px}.signal{padding:16px 13px}.signal:before{display:none}.site-footer .wrap{display:block}.legal-links{margin-top:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}.reveal{opacity:1;transform:none}.stage-status:before,.signal-card{animation:none}}
