:root {
  --bg: #050811;
  --bg-soft: #080c16;
  --surface: rgba(255,255,255,.055);
  --surface-strong: rgba(255,255,255,.085);
  --line: rgba(255,255,255,.10);
  --text: #f2f5fa;
  --muted: #98a2b3;
  --accent: #89cff0;
  --accent-strong: #c7eeff;
  --accent-deep: #4c93bb;
  --shadow: 0 28px 80px rgba(0,0,0,.35);
  --radius: 28px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--bg); color:var(--text); font-family:"DM Sans",system-ui,sans-serif; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button,input,textarea { font:inherit; }
button { color:inherit; }
.ambient { position:fixed; width:50vw; height:50vw; max-width:780px; max-height:780px; border-radius:50%; filter:blur(90px); opacity:.22; pointer-events:none; z-index:-3; }
.ambient-a { background:#89cff0; top:-18vw; right:-13vw; }
.ambient-b { background:#5778ff; bottom:-24vw; left:14vw; opacity:.10; }
.noise { position:fixed; inset:0; pointer-events:none; z-index:-2; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%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)' opacity='.35'/%3E%3C/svg%3E"); }
.site-shell { min-height:100vh; display:grid; grid-template-columns:minmax(340px,40vw) 1fr; }
.sticky-panel { position:sticky; top:0; height:100vh; border-right:1px solid var(--line); background:linear-gradient(180deg, rgba(5,8,17,.72), rgba(5,8,17,.52)); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); }
.panel-inner { height:100%; padding:34px 42px 30px; display:flex; flex-direction:column; }
.brand-row,.panel-footer,.card-head,.price-top,.price-foot,.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.logo { font-size:32px; font-weight:700; letter-spacing:-.08em; }
.logo span { font-weight:500; color:var(--accent); }
.status-pill,.card-tag,.price-note { font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:#b9c2d0; border:1px solid var(--line); padding:8px 10px; border-radius:999px; background:rgba(255,255,255,.035); }
.status-dot { width:6px; height:6px; display:inline-block; background:#8ee6b4; border-radius:50%; margin-right:6px; box-shadow:0 0 14px #8ee6b4; }
.hero-copy { margin-top:auto; margin-bottom:30px; max-width:600px; }
.eyebrow,.mini-label,.step-label { font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:#7f899a; font-weight:600; }
h1,h2,h3,p { margin:0; }
h1 { font-size:clamp(48px,5vw,78px); line-height:.96; letter-spacing:-.055em; font-weight:600; max-width:700px; margin:14px 0 20px; }
h1 em,h2 em { font-family:"Playfair Display",serif; font-weight:500; color:var(--accent-strong); }
.hero-lead { color:#b8c0cc; font-size:17px; line-height:1.55; max-width:520px; }
.cta-stack { display:grid; gap:10px; margin-bottom:30px; }
.primary-btn,.ghost-btn { min-height:54px; border-radius:16px; display:flex; align-items:center; justify-content:center; gap:12px; padding:0 18px; transition:.25s ease; }
.primary-btn { border:1px solid rgba(255,255,255,.16); background:linear-gradient(180deg,#bfeaff,#89cff0); color:#07101a; font-weight:700; box-shadow:0 14px 30px rgba(137,207,240,.18); }
.primary-btn:hover { transform:translateY(-2px); box-shadow:0 20px 38px rgba(137,207,240,.25); }
.primary-btn svg { width:18px; fill:none; stroke:currentColor; stroke-width:1.7; }
.ghost-btn { border:1px solid var(--line); color:#bac3d0; background:rgba(255,255,255,.02); }
.ghost-btn:hover { border-color:rgba(137,207,240,.35); color:#e6f7ff; background:rgba(137,207,240,.04); }
.savings-card { padding:18px; margin-bottom:26px; }
.glass-card { background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.025)); border:1px solid var(--line); box-shadow:var(--shadow); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); }
.card-head strong { display:block; margin-top:6px; font-size:14px; }
.spark { width:30px; height:30px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--accent); }
.range-row { display:grid; grid-template-columns:1fr auto; gap:6px 14px; margin-top:17px; color:#8e98a8; font-size:12px; }
.range-row output { color:#dce4ef; font-weight:600; }
.range-row input { grid-column:1 / -1; width:100%; accent-color:var(--accent); }
.calc-result { display:grid; gap:8px; margin-top:15px; }
.calc-result div { display:flex; justify-content:space-between; gap:12px; font-size:12px; color:#8f98a7; }
.calc-result strong { color:#e9eff6; }
.calc-save { padding-top:10px; margin-top:3px; border-top:1px solid var(--line); color:#acb7c7 !important; }
.calc-save strong { color:var(--accent-strong); font-size:15px; }
.calc-note { font-size:10px; line-height:1.5; color:#697385; margin-top:12px; }
.panel-footer { align-items:flex-end; }
.panel-footer div { display:grid; gap:4px; }
.panel-footer a { font-size:12px; color:#cbd3de; }
.scroll-cue { font-size:10px; color:#697385; text-transform:uppercase; letter-spacing:.18em; }
.scroll-cue span { color:var(--accent); }
.content { min-width:0; }
.intro-orbit { min-height:55vh; padding:80px clamp(28px,6vw,100px) 34px; display:grid; align-content:end; }
.orbit-card { max-width:900px; padding:28px; border-radius:32px;}
.orbit-label { font-size:10px; letter-spacing:.18em; color:#687487; }
.orbit-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:40px 0 20px; font-size:10px; letter-spacing:.15em; color:#9aa5b5; }
.orbit-grid span { padding-top:11px; border-top:1px solid var(--line); }
.orbit-card p { max-width:700px; font-size:clamp(20px,2.4vw,32px); line-height:1.22; letter-spacing:-.03em; color:#dce4ed; }
.section { padding:110px clamp(28px,6vw,100px); }
.section-head { display:grid; grid-template-columns:70px 1fr; gap:20px; align-items:start; margin-bottom:58px; }
.section-index { font-size:12px; letter-spacing:.12em; color:var(--accent); padding-top:4px; }
h2 { font-size:clamp(42px,5.4vw,72px); line-height:.98; letter-spacing:-.05em; font-weight:600; }
.stacked-cards { display:grid; gap:18px; max-width:980px; }
.feature-card { min-height:260px; padding:26px; border-radius:28px; display:grid; grid-template-columns:90px 1fr auto; gap:22px; align-items:start; position:relative; overflow:hidden; transition:transform .35s ease, border-color .35s ease; }
.feature-card:hover { transform:translateX(6px); border-color:rgba(137,207,240,.24); }
.feature-card::after { content:""; position:absolute; width:240px; height:240px; right:-80px; top:-90px; border-radius:50%; background:rgba(137,207,240,.08); filter:blur(26px); }
.feature-2 { margin-left:8%; margin-top:-46px; }
.feature-3 { margin-left:16%; margin-top:-46px; }
.big-number { font-size:72px; letter-spacing:-.07em; color:rgba(137,207,240,.36); line-height:.8; }
.feature-card h3 { font-size:28px; letter-spacing:-.03em; margin:8px 0 10px; }
.feature-card p { max-width:570px; line-height:1.6; color:#949ead; }
.timeline { max-width:980px; position:relative; padding-left:28px; }
.timeline-line { position:absolute; left:7px; top:12px; bottom:70px; width:2px; background:rgba(255,255,255,.09); overflow:hidden; }
.timeline-line span { display:block; width:100%; height:0%; background:linear-gradient(180deg,var(--accent),rgba(137,207,240,.12)); transition:height .25s ease; }
.timeline-item { display:grid; grid-template-columns:34px 1fr auto; gap:22px; padding:10px 0 88px; position:relative; opacity:.45; transition:opacity .3s ease, transform .3s ease; }
.timeline-item.is-active { opacity:1; transform:translateX(5px); }
.timeline-dot { width:18px; height:18px; border-radius:50%; border:1px solid #536074; background:#090d17; display:grid; place-items:center; position:relative; z-index:2; margin-top:4px; box-shadow:0 0 0 8px var(--bg); }
.timeline-item.is-active .timeline-dot { border-color:var(--accent); box-shadow:0 0 0 8px var(--bg),0 0 22px rgba(137,207,240,.28); }
.timeline-dot span { font-size:8px; color:#8e99a9; }
.timeline-item.is-active .timeline-dot span { color:var(--accent-strong); }
.timeline-copy h3 { font-size:30px; letter-spacing:-.035em; margin:7px 0 10px; }
.timeline-copy p { color:#8f99aa; line-height:1.62; max-width:650px; }
.timeline-eta { font-size:10px; letter-spacing:.16em; color:#697486; padding-top:6px; }
.pricing { padding-top:45px; }
.price-hero { border-radius:34px; padding:36px; max-width:1000px; }
.price-main { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; padding:36px 0 26px; border-bottom:1px solid var(--line); }
.price-main > div { display:flex; align-items:flex-end; gap:3px; }
.currency { font-size:11px; letter-spacing:.15em; color:#6d7787; padding-bottom:13px; margin-right:7px; }
.price { font-size:clamp(96px,12vw,170px); line-height:.72; letter-spacing:-.08em; }
.per { font-size:16px; color:#8490a1; padding-bottom:10px; }
.price-main p { max-width:220px; color:#8994a5; line-height:1.4; }
.benefit-grid { display:grid; grid-template-columns:1fr 1fr; margin-top:8px; }
.benefit { display:grid; grid-template-columns:38px 1fr auto; gap:12px; padding:18px 0; border-bottom:1px solid var(--line); color:#5f6a7b; font-size:11px; }
.benefit:nth-child(odd) { padding-right:24px; border-right:1px solid var(--line); }
.benefit:nth-child(even) { padding-left:24px; }
.benefit span { color:#ccd4de; font-size:13px; }
.benefit b { color:var(--accent); font-weight:500; }
.price-foot { padding-top:24px; color:#7f8999; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.price-foot a { color:#dce5ef; font-size:12px; }
.faq .section-head { margin-bottom:38px; }
.accordion { max-width:980px; }
.faq-item { width:100%; text-align:left; background:transparent; border:0; border-top:1px solid var(--line); padding:26px 0; cursor:pointer; display:grid; grid-template-columns:1fr 30px; gap:20px; font-size:20px; color:#dbe3ed; }
.faq-item:last-child { border-bottom:1px solid var(--line); }
.faq-item i { font-style:normal; color:var(--accent); font-size:22px; }
.answer { grid-column:1 / -1; max-height:0; overflow:hidden; color:#8792a3; font-size:14px; line-height:1.7; transition:max-height .35s ease, padding-top .35s ease; padding-top:0; }
.faq-item.is-open .answer { max-height:180px; padding-top:6px; }
.site-footer { padding-bottom:36px; }
.site-footer { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,460px); gap:60px 80px; align-items:start; }
.footer-copy h2 { margin:13px 0 18px; }
.footer-copy p { color:#8792a2; }
.contact-form { padding:26px; border-radius:26px; display:grid; gap:14px; }
.contact-form label { display:grid; gap:8px; color:#8c96a6; font-size:11px; text-transform:uppercase; letter-spacing:.13em; }
.contact-form input,.contact-form textarea { width:100%; border:1px solid var(--line); background:rgba(0,0,0,.16); color:#edf3f9; border-radius:14px; padding:13px 14px; outline:none; resize:vertical; }
.contact-form input:focus,.contact-form textarea:focus { border-color:rgba(137,207,240,.5); box-shadow:0 0 0 4px rgba(137,207,240,.06); }
.form-status { min-height:18px; font-size:11px; color:#8f98a9; }
.footer-bottom { grid-column:1 / -1; border-top:1px solid var(--line); padding-top:18px; color:#596477; font-size:10px; letter-spacing:.1em; text-transform:uppercase; }
.footer-bottom a { color:#9ba6b5; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .75s ease, transform .75s ease; }
.reveal.in { opacity:1; transform:none; }
@media (max-width: 980px) {
  .site-shell { grid-template-columns:1fr; }
  .sticky-panel { position:relative; height:auto; min-height:auto; border-right:0; border-bottom:1px solid var(--line); }
  .panel-inner { padding:22px 22px 20px; }
  .hero-copy { margin-top:70px; margin-bottom:24px; }
  .hero-copy h1 { font-size:clamp(48px,12vw,74px); }
  .savings-card { margin-bottom:22px; }
  .panel-footer { align-items:flex-end; }
  .scroll-cue { display:none; }
  .intro-orbit { min-height:42vh; }
}
@media (max-width: 720px) {
  .ambient { width:85vw; height:85vw; filter:blur(70px); }
  .section,.intro-orbit { padding-left:20px; padding-right:20px; }
  .section { padding-top:78px; padding-bottom:78px; }
  .section-head { grid-template-columns:48px 1fr; gap:14px; margin-bottom:40px; }
  .orbit-grid { grid-template-columns:1fr 1fr; }
  .orbit-card { padding:22px; border-radius:24px; }
  .feature-card,.feature-2,.feature-3 { margin-left:0; margin-top:0; grid-template-columns:55px 1fr; padding:22px; }
  .feature-card { min-height:220px; }
  .big-number { font-size:50px; }
  .card-tag { grid-column:2; justify-self:start; }
  .timeline { padding-left:18px; }
  .timeline-item { grid-template-columns:26px 1fr; gap:15px; padding-bottom:64px; }
  .timeline-eta { grid-column:2; padding-top:0; }
  .price-hero { padding:22px; border-radius:26px; }
  .price-main { display:block; }
  .price-main p { margin-top:18px; max-width:none; }
  .benefit-grid { grid-template-columns:1fr; }
  .benefit:nth-child(odd),.benefit:nth-child(even) { padding-left:0; padding-right:0; border-right:0; }
  .price-foot { align-items:flex-start; flex-direction:column; }
  .site-footer { grid-template-columns:1fr; gap:36px; }
  .footer-bottom { flex-wrap:wrap; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
}
