:root{
  --bg:#0C0D10;
  --bg-raised:#121318;
  --glass:rgba(255,255,255,0.05);
  --glass-strong:rgba(255,255,255,0.08);
  --hairline:rgba(255,255,255,0.10);
  --hairline-strong:rgba(255,255,255,0.18);
  --ink:#F2F3F5;
  --muted:#A6ABB4;
  --muted-deep:#6E7378;
  --amber:#F2A93C;
  --amber-deep:#D98F22;
  --green:#5FBF6F;
  --sheen:linear-gradient(110deg,#F2A93C 0%,#E96AA8 34%,#8B7CF0 68%,#4FC3F7 100%);
  --radius:18px;
  --radius-sm:11px;
  /* legacy variable aliases so nothing breaks */
  --graphite-dark:#F2F3F5;
  --graphite-darker:#FFFFFF;
  --aluminum:#191B21;
  --aluminum-card:rgba(255,255,255,0.04);
  --aluminum-card-2:rgba(255,255,255,0.05);
  --muted-dark:#A6ABB4;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
section, .plan-card[id]{scroll-margin-top:84px;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* ambient anodized glow */
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(52% 38% at 82% -6%, rgba(242,169,60,0.13), transparent 62%),
    radial-gradient(46% 34% at 6% 16%, rgba(139,124,240,0.10), transparent 60%),
    radial-gradient(60% 44% at 50% 108%, rgba(79,195,247,0.07), transparent 62%);
}
h1,h2,h3{font-family:'Space Grotesk',sans-serif; margin:0; letter-spacing:-0.03em;}
p{margin:0;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}

/* ---------- Traffic light chrome ---------- */
.dots{display:inline-flex; gap:7px; align-items:center;}
.dots span{width:11px; height:11px; border-radius:50%; display:inline-block;}
.dots .r{background:#EC6A5E;}
.dots .y{background:#F5BF4F;}
.dots .g{background:#61C454;}

/* ---------- Nav ---------- */
.navbar{
  position:sticky; top:0; z-index:50;
  background:rgba(12,13,16,0.6);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--hairline);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; height:60px;}
.brand{display:flex; align-items:center; gap:12px; font-weight:600; font-size:15px;}
.brand .word{font-family:'Space Grotesk',sans-serif; font-size:17px; letter-spacing:-0.02em;}
.nav-links{display:flex; gap:28px; font-size:13.5px; color:var(--muted);}
.nav-links a{transition:color .15s ease;}
.nav-links a:hover{color:var(--ink);}
.nav-cta{
  background:var(--ink); color:#0C0D10; font-size:13px; font-weight:600;
  padding:9px 18px; border-radius:100px;
  transition:transform .15s ease, box-shadow .15s ease;
}
.nav-cta:hover{transform:translateY(-1px); box-shadow:0 8px 24px -8px rgba(242,243,245,0.35);}
@media (max-width:760px){ .nav-links{display:none;} }

/* ---------- Hero ---------- */
.hero{padding:96px 0 72px;}
.hero-grid{display:grid; grid-template-columns:1.05fr 0.95fr; gap:60px; align-items:center;}
@media (max-width:900px){ .hero-grid{grid-template-columns:1fr;} }
.eyebrow{
  font-family:'JetBrains Mono',monospace;
  font-size:11.5px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--amber); font-weight:500; margin-bottom:20px; display:block;
}
.hero h1{font-size:clamp(38px,5.4vw,64px); line-height:1.02; font-weight:700;}
.hero h1 .sheen-word{
  background:var(--sheen);
  background-size:220% 100%;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
  animation:sheen-drift 9s ease-in-out infinite alternate;
}
@keyframes sheen-drift{
  0%{background-position:0% 50%;}
  100%{background-position:100% 50%;}
}
@media (prefers-reduced-motion:reduce){ .hero h1 .sheen-word{animation:none;} }
.hero p.sub{margin-top:24px; font-size:17px; line-height:1.65; color:var(--muted); max-width:47ch;}
.hero-ctas{display:flex; gap:14px; margin-top:36px; flex-wrap:wrap;}
.btn{
  display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:600;
  padding:14px 24px; border-radius:100px; border:1px solid transparent; cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.btn:active{transform:scale(0.97);}
.btn-primary{background:var(--amber); color:#2B2205;}
.btn-primary:hover{background:#FFBE55; transform:translateY(-1px); box-shadow:0 10px 30px -8px rgba(242,169,60,0.5);}
.btn-ghost{background:var(--glass); border-color:var(--hairline); color:var(--ink); backdrop-filter:blur(8px);}
.btn-ghost:hover{border-color:var(--hairline-strong); background:var(--glass-strong);}

/* ---------- Glass window panel ---------- */
.panel{
  background:var(--glass);
  border:1px solid var(--hairline);
  border-radius:var(--radius);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  box-shadow:0 1px 0 rgba(255,255,255,0.06) inset, 0 30px 70px -30px rgba(0,0,0,0.7);
  overflow:hidden;
}
.panel-title{
  display:flex; align-items:center; gap:10px; padding:13px 16px;
  border-bottom:1px solid var(--hairline); background:rgba(255,255,255,0.03);
}
.panel-title .label{font-size:12.5px; color:var(--muted); margin-left:6px; font-weight:500;}
.panel-body{padding:28px 26px 24px;}
.device-icon{
  width:56px; height:56px; border-radius:14px;
  background:linear-gradient(160deg,#2A2D34,#14161B);
  border:1px solid var(--hairline);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}
.panel-heading{font-size:19px; font-weight:600; margin-bottom:2px;}
.panel-sub{font-size:13px; color:var(--muted); margin-bottom:20px;}
.spec-row{
  display:flex; justify-content:space-between; padding:11px 0;
  border-top:1px solid var(--hairline); font-size:13.5px;
}
.spec-row:first-of-type{border-top:none;}
.spec-key{color:var(--muted);}
.spec-val{font-weight:500; display:flex; align-items:center; gap:7px;}
.status-dot{
  width:8px; height:8px; border-radius:50%; background:var(--green);
  animation:pulse 2.2s infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(95,191,111,0.45);}
  70%{box-shadow:0 0 0 8px rgba(95,191,111,0);}
  100%{box-shadow:0 0 0 0 rgba(95,191,111,0);}
}
@media (prefers-reduced-motion:reduce){ .status-dot{animation:none;} }
.panel-footer{
  padding:14px 26px; border-top:1px solid var(--hairline);
  display:flex; justify-content:flex-end; background:rgba(255,255,255,0.03);
}
.link-btn{font-size:13px; font-weight:600; color:var(--ink);}
.link-btn:hover{text-decoration:underline;}

/* ---------- Section shell ---------- */
section{padding:84px 0;}
.section-head{max-width:660px; margin-bottom:48px;}
.section-head .eyebrow{margin-bottom:14px;}
.section-head h2{font-size:clamp(28px,3.6vw,40px); font-weight:700; line-height:1.08;}
.section-head p{margin-top:16px; color:var(--muted); font-size:15.5px; line-height:1.65;}

/* ---------- Services bento grid ---------- */
.services-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
@media (max-width:900px){ .services-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .services-grid{grid-template-columns:1fr;} }
.service-card{
  background:var(--glass); border:1px solid var(--hairline); border-radius:var(--radius);
  padding:24px 22px;
  backdrop-filter:blur(10px);
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
  position:relative; overflow:hidden;
}
.service-card:hover{transform:translateY(-4px); border-color:var(--hairline-strong); background:var(--glass-strong);}
/* bento: hero cells */
.services-grid .service-card:nth-child(1),
.services-grid .service-card:nth-child(2){grid-column:span 2;}
@media (max-width:560px){
  .services-grid .service-card:nth-child(1),
  .services-grid .service-card:nth-child(2){grid-column:span 1;}
}
.service-icon{
  width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,0.06);
  border:1px solid var(--hairline);
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
}
.service-icon svg path, .service-icon svg rect, .service-icon svg circle{stroke:#F2F3F5;}
.service-icon svg circle[fill]{fill:#F2F3F5;}
.service-card h3{font-size:16px; font-weight:600; margin-bottom:8px;}
.service-card p{font-size:13.5px; color:var(--muted); line-height:1.6;}

/* ---------- Audience split ---------- */
.audience-wrap{border-top:1px solid var(--hairline); margin-top:16px; padding-top:32px;}
.audience-eyebrow{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:16px; display:block;}
.audience-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media (max-width:700px){ .audience-grid{grid-template-columns:1fr;} }
.audience-card{
  background:var(--glass); border:1px solid var(--hairline); border-radius:var(--radius);
  padding:22px 24px; backdrop-filter:blur(10px);
  transition:transform .18s ease, border-color .18s ease;
}
.audience-card:hover{transform:translateY(-3px); border-color:var(--hairline-strong);}
.audience-card.accent{border-color:rgba(242,169,60,0.5);}
.audience-icon{width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,0.06); border:1px solid var(--hairline); display:flex; align-items:center; justify-content:center; margin-bottom:14px;}
.audience-icon svg path, .audience-icon svg rect{stroke:#F2F3F5;}
.audience-title{font-size:16px; font-weight:700; margin-bottom:12px; font-family:'Space Grotesk',sans-serif;}
.audience-tags{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:18px;}
.audience-tag{font-size:11px; background:rgba(255,255,255,0.06); color:var(--muted); padding:5px 11px; border-radius:100px; border:1px solid var(--hairline);}
.audience-cta{font-size:13px; font-weight:600; color:var(--amber);}
.audience-cta:hover{text-decoration:underline;}

/* ---------- About ---------- */
.about-card{
  display:grid; grid-template-columns:auto 1fr; gap:28px;
  background:var(--glass); border:1px solid var(--hairline); border-radius:var(--radius);
  padding:36px 34px; backdrop-filter:blur(12px);
}
@media (max-width:700px){ .about-card{grid-template-columns:1fr; text-align:center;} }
.avatar{
  width:80px; height:80px; border-radius:50%;
  background:linear-gradient(160deg,#2A2D34,#14161B);
  border:1px solid var(--hairline-strong);
  color:var(--ink); font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:25px;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
@media (max-width:700px){ .avatar{margin:0 auto;} }
.about-name{font-size:20px; font-weight:700; margin-bottom:2px; font-family:'Space Grotesk',sans-serif;}
.about-title{font-size:13.5px; color:var(--muted); margin-bottom:16px;}
.about-bio{font-size:14.5px; line-height:1.7; color:var(--muted); max-width:66ch;}
.chip-row{display:flex; flex-wrap:wrap; gap:9px; margin-top:22px;}
@media (max-width:700px){ .chip-row{justify-content:center;} }
.chip{
  font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--muted);
  border:1px solid var(--hairline); border-radius:100px; padding:7px 14px; background:rgba(255,255,255,0.04);
}

/* ---------- Process timeline ---------- */
.timeline{display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative;}
@media (max-width:800px){ .timeline{grid-template-columns:1fr; gap:30px;} }
.timeline::before{
  content:""; position:absolute; top:19px; left:0; right:0; height:1px;
  background:linear-gradient(90deg, var(--hairline), rgba(242,169,60,0.4));
}
@media (max-width:800px){ .timeline::before{display:none;} }
.tl-step{position:relative; padding-right:20px;}
.tl-node{
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,0.06); border:1px solid var(--hairline-strong); color:var(--ink);
  display:flex; align-items:center; justify-content:center; font-size:12.5px; font-weight:600;
  position:relative; z-index:1; margin-bottom:18px; font-family:'JetBrains Mono',monospace;
  backdrop-filter:blur(6px);
}
.tl-step.is-last .tl-node{background:var(--amber); border-color:var(--amber); color:#2B2205;}
.tl-step .tl-label{font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.12em; color:var(--muted-deep); margin-bottom:8px; display:block;}
.tl-step h3{font-size:16.5px; font-weight:600; margin-bottom:8px;}
.tl-step p{font-size:13.5px; color:var(--muted); line-height:1.6;}

/* ---------- Plans / Membership tiers ---------- */
.plans-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:16px;}
@media (max-width:900px){ .plans-grid{grid-template-columns:1fr;} }
.plan-card{
  background:var(--glass); border:1px solid var(--hairline); border-radius:var(--radius);
  padding:28px 24px; display:flex; flex-direction:column;
  backdrop-filter:blur(10px);
  transition:transform .18s ease, border-color .18s ease;
  position:relative;
}
.plan-card:hover{transform:translateY(-4px); border-color:var(--hairline-strong);}
/* anodized sheen border for the featured plan */
.plan-card.featured{border-color:transparent; background:
  linear-gradient(var(--bg-raised),var(--bg-raised)) padding-box,
  var(--sheen) border-box;
  border:1.5px solid transparent;
}
.plan-tag{font-family:'JetBrains Mono',monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.12em; color:var(--muted); font-weight:600;}
.plan-card.featured .plan-tag{color:var(--amber);}
.plan-card h3{font-size:20px; font-weight:700; margin:10px 0 4px;}
.plan-price{font-family:'Space Grotesk',sans-serif; font-size:28px; font-weight:700; margin:2px 0 10px;}
.plan-price span{font-family:'Inter',sans-serif; font-size:13px; font-weight:500; color:var(--muted);}
.plan-card .plan-desc{font-size:13.5px; color:var(--muted); margin-bottom:20px; line-height:1.6;}
.plan-note{font-size:12.5px; color:var(--muted-deep); margin-top:-8px; margin-bottom:20px; line-height:1.55;}
.plan-features{list-style:none; margin:0 0 24px; padding:0; display:flex; flex-direction:column; gap:12px;}
.plan-features li{font-size:13.5px; display:flex; gap:9px; align-items:flex-start; line-height:1.5;}
.plan-features li svg{flex-shrink:0; margin-top:2px;}
.plan-card .btn{margin-top:auto; justify-content:center; width:100%;}
.view-details{font-size:12.5px; font-weight:600; color:var(--amber); margin:-10px 0 18px; display:inline-block;}
.view-details:hover{text-decoration:underline;}

/* ---------- Plan detail subpage ---------- */
.plan-detail-header{padding:28px 0 8px;}
.back-link{font-size:13.5px; color:var(--muted); font-weight:500; display:inline-flex; align-items:center; gap:6px; transition:color .15s ease;}
.back-link:hover{color:var(--ink);}
.detail-card{
  background:var(--glass); border:1px solid var(--hairline); border-radius:var(--radius);
  padding:42px 38px; margin-top:24px; backdrop-filter:blur(12px);
}
.detail-card.featured{border-color:transparent; background:
  linear-gradient(var(--bg-raised),var(--bg-raised)) padding-box,
  var(--sheen) border-box;
  border:1.5px solid transparent;
}
.detail-top{display:flex; justify-content:space-between; align-items:flex-start; gap:24px; flex-wrap:wrap; margin-bottom:8px;}
.detail-price{font-family:'Space Grotesk',sans-serif; font-size:36px; font-weight:700;}
.detail-price span{font-family:'Inter',sans-serif; font-size:14px; font-weight:500; color:var(--muted);}
.detail-desc{font-size:15.5px; line-height:1.7; color:var(--muted); max-width:64ch; margin:18px 0 28px;}
.detail-includes{list-style:none; margin:0 0 28px; padding:0; display:flex; flex-direction:column; gap:14px;}
.detail-includes li{font-size:14.5px; display:flex; gap:10px; align-items:flex-start; line-height:1.55;}
.detail-includes li svg{flex-shrink:0; margin-top:3px;}
.detail-note{font-size:13px; color:var(--muted-deep); margin-bottom:24px; line-height:1.6;}
.detail-ctas{display:flex; gap:14px; flex-wrap:wrap;}

/* ---------- CTA band ---------- */
.cta-band{
  background:
    radial-gradient(80% 140% at 85% 0%, rgba(242,169,60,0.16), transparent 55%),
    radial-gradient(70% 120% at 10% 100%, rgba(139,124,240,0.12), transparent 55%),
    var(--bg-raised);
  border:1px solid var(--hairline);
  border-radius:24px; padding:56px 46px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
}
@media (max-width:760px){ .cta-band{flex-direction:column; text-align:center; padding:44px 28px;} }
.cta-band h2{font-size:clamp(24px,3.2vw,34px); margin-bottom:10px;}
.cta-band p{color:var(--muted); font-size:14.5px; max-width:44ch;}
.cta-band .btn-primary{white-space:nowrap;}

/* ---------- Footer ---------- */
footer{padding:44px 0 54px; border-top:1px solid var(--hairline);}
.foot-inner{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
.foot-inner .mono{font-size:12.5px; color:var(--muted-deep);}
.foot-links{display:flex; gap:22px; font-size:13px; color:var(--muted);}
.foot-links a:hover{color:var(--ink);}

/* ---------- Scroll reveal ---------- */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s ease;}
.reveal.in{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){ .reveal{opacity:1; transform:none; transition:none;} }

/* ---------- Load error ---------- */
#load-error{display:none; padding:60px 28px; text-align:center; color:var(--muted); font-size:14px;}

/* ---------- Contact form ---------- */
.contact-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:44px; align-items:start;
  background:
    radial-gradient(80% 140% at 85% 0%, rgba(242,169,60,0.14), transparent 55%),
    radial-gradient(70% 120% at 10% 100%, rgba(139,124,240,0.10), transparent 55%),
    var(--bg-raised);
  border:1px solid var(--hairline); border-radius:24px; padding:52px 46px;}
@media (max-width:820px){ .contact-grid{grid-template-columns:1fr; padding:40px 28px;} }
.contact-grid h2{font-size:clamp(24px,3.2vw,34px); margin-bottom:12px;}
.contact-grid .contact-sub{color:var(--muted); font-size:14.5px; line-height:1.65; max-width:44ch;}
.contact-direct{margin-top:26px; display:flex; flex-direction:column; gap:10px;}
.contact-direct a{font-size:14px; font-weight:600; color:var(--amber);}
.contact-direct a:hover{text-decoration:underline;}
.contact-direct .label{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted-deep);}
.form{display:flex; flex-direction:column; gap:16px;}
.form label{font-size:12.5px; font-weight:600; color:var(--muted); display:block; margin-bottom:7px;}
.form input, .form select, .form textarea{
  width:100%; background:rgba(255,255,255,0.05); border:1px solid var(--hairline);
  border-radius:var(--radius-sm); padding:13px 14px; color:var(--ink);
  font-family:'Inter',sans-serif; font-size:14px; outline:none;
  transition:border-color .15s ease, background .15s ease;
}
.form input:focus, .form select:focus, .form textarea:focus{border-color:var(--amber); background:rgba(255,255,255,0.07);}
.form select{appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23A6ABB4' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center;}
.form select option{background:#16181D; color:#F2F3F5;}
.form textarea{min-height:120px; resize:vertical;}
.form .btn{align-self:flex-start;}
.form-status{font-size:13.5px; line-height:1.5; display:none;}
.form-status.ok{display:block; color:var(--green);}
.form-status.err{display:block; color:#EC6A5E;}
.form-status a{color:var(--amber); font-weight:600;}

/* ---------- FAQ accordion ---------- */
.faq-list{max-width:760px; display:flex; flex-direction:column; gap:10px;}
.faq-item{
  background:var(--glass); border:1px solid var(--hairline); border-radius:var(--radius-sm);
  overflow:hidden; backdrop-filter:blur(8px);
}
.faq-item summary{
  list-style:none; cursor:pointer; padding:18px 20px;
  font-family:'Space Grotesk',sans-serif; font-size:15.5px; font-weight:600;
  display:flex; justify-content:space-between; align-items:center; gap:16px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+"; font-family:'JetBrains Mono',monospace; font-size:16px; color:var(--muted); transition:transform .2s ease;}
.faq-item[open] summary::after{transform:rotate(45deg); color:var(--amber);}
.faq-item .faq-a{padding:0 20px 18px; font-size:14px; line-height:1.65; color:var(--muted); max-width:66ch;}

/* ---------- Legal pages ---------- */
.legal{max-width:760px; margin:0 auto; padding:56px 28px 80px;}
.legal h1{font-size:clamp(28px,4vw,38px); margin-bottom:8px;}
.legal .legal-updated{font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--muted-deep); margin-bottom:36px; display:block;}
.legal h2{font-size:19px; margin:36px 0 12px;}
.legal p, .legal li{font-size:14.5px; line-height:1.75; color:var(--muted);}
.legal ul{padding-left:22px; margin:10px 0;}
.legal a{color:var(--amber);}
.legal a:hover{text-decoration:underline;}
.legal strong{color:var(--ink);}