*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:var(--fm);font-size:13px;line-height:1.6;min-height:100vh;}
body::after{content:'';position:fixed;inset:0;background-image:linear-gradient(rgba(0,212,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(0,212,255,.02) 1px,transparent 1px);background-size:48px 48px;pointer-events:none;z-index:0;}
.page{position:relative;z-index:1;}

/* NAV */
nav{display:flex;align-items:center;justify-content:space-between;padding:16px 40px;border-bottom:1px solid var(--border);background:var(--nav-bg);backdrop-filter:blur(12px);position:sticky;top:0;z-index:100;}
.nav-logo{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;color:var(--accent);text-decoration:none;}
.nav-logo img{width:32px;height:32px;border-radius:6px;}
.nav-logo span{color:var(--muted);font-weight:400;}
.nav-back{color:var(--muted);text-decoration:none;font-size:12px;}
.nav-back:hover{color:var(--accent);}

/* HERO */
.hero{text-align:center;padding:64px 24px 48px;max-width:640px;margin:0 auto;}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:10px;color:var(--accent);background:rgba(0,212,255,.06);border:1px solid rgba(0,212,255,.15);border-radius:20px;padding:4px 14px;margin-bottom:24px;letter-spacing:.12em;text-transform:uppercase;}
.hero h1{font-size:clamp(24px,4vw,44px);font-weight:700;color:var(--text);line-height:1.1;margin-bottom:16px;}
.hero-sub{font-size:14px;color:var(--muted);line-height:1.7;}

/* TOGGLE */
.billing-toggle{display:flex;align-items:center;justify-content:center;gap:12px;margin:32px 0 48px;}
.toggle-btn{background:transparent;border:1px solid var(--border2);border-radius:var(--r);padding:7px 18px;font-family:var(--fm);font-size:12px;color:var(--muted);cursor:pointer;transition:all .2s;}
.toggle-btn.active{background:rgba(0,212,255,.08);border-color:rgba(var(--accent-rgb),.3);color:var(--accent);}
.save-badge{background:rgba(46,204,113,.1);border:1px solid rgba(46,204,113,.2);color:var(--green);border-radius:3px;padding:2px 7px;font-size:10px;letter-spacing:.06em;}

/* PLANS GRID */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:860px;margin:0 auto;padding:0 24px 80px;}
.plan-card{background:var(--surf);border:1px solid var(--border);border-radius:14px;padding:28px 24px;position:relative;display:flex;flex-direction:column;gap:0;transition:border-color .2s,box-shadow .2s;}
.plan-card:hover{border-color:var(--border2);}
.plan-card.popular{border-color:rgba(var(--accent-rgb),.3);box-shadow:0 0 40px rgba(0,212,255,.05);}
.popular-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--accent);color:#000;font-size:9px;font-weight:700;padding:3px 12px;border-radius:10px;letter-spacing:.1em;white-space:nowrap;}
.plan-name{font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;}
.plan-price{font-size:36px;font-weight:700;color:var(--text);line-height:1;margin-bottom:4px;}
.plan-price sup{font-size:16px;vertical-align:top;margin-top:6px;}
.plan-price sub{font-size:12px;color:var(--muted);font-weight:400;}
.plan-yearly{font-size:10px;color:var(--muted);margin-bottom:20px;min-height:16px;}
.plan-yearly .save{color:var(--green);}
.plan-divider{height:1px;background:var(--border);margin:16px 0;}
.plan-features{list-style:none;display:flex;flex-direction:column;gap:8px;flex:1;margin-bottom:24px;}
.plan-features li{font-size:12px;color:var(--muted);display:flex;align-items:flex-start;gap:8px;}
.feat-check{color:var(--green);flex-shrink:0;}
.feat-x{color:var(--dim);flex-shrink:0;}
.feat-text{color:var(--text);}
.feat-text.dim{color:var(--muted);}
.plan-cta{display:block;text-align:center;padding:12px;border-radius:var(--r);font-family:var(--fm);font-size:12px;font-weight:600;cursor:pointer;border:none;transition:all .2s;text-decoration:none;letter-spacing:.06em;}
.cta-free{background:transparent;border:1px solid var(--border2);color:var(--muted);}
.cta-free:hover{border-color:rgba(var(--accent-rgb),.3);color:var(--accent);}
.cta-paid{background:var(--accent);color:#000;}
.cta-paid:hover{opacity:.88;}
.cta-current{background:var(--dim);color:var(--muted);cursor:default;}
.cta-enterprise{background:rgba(144,96,240,.15);border:1px solid rgba(144,96,240,.3);color:var(--purple);}
.cta-enterprise:hover{background:rgba(144,96,240,.25);}

/* Alert */
.alert{max-width:600px;margin:0 auto 32px;padding:14px 20px;border-radius:var(--r);font-size:12px;display:flex;align-items:center;gap:10px;}
.alert-success{background:rgba(46,204,113,.06);border:1px solid rgba(46,204,113,.2);color:var(--green);}
.alert-warn{background:rgba(240,165,0,.06);border:1px solid rgba(240,165,0,.2);color:var(--yellow);}

/* FAQ */
.faq{max-width:640px;margin:0 auto 80px;padding:0 24px;}
.faq-title{font-size:18px;font-weight:700;color:var(--text);margin-bottom:24px;text-align:center;}
.faq-item{border-bottom:1px solid var(--border);padding:16px 0;}
.faq-q{font-size:13px;color:var(--text);cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.faq-q:hover{color:var(--accent);}
.faq-a{font-size:12px;color:var(--muted);line-height:1.7;padding-top:10px;display:none;}
.faq-a.open{display:block;}

/* Mobile */
@media(max-width:900px){
  .plans{grid-template-columns:1fr 1fr;}
  nav{padding:12px 20px;}
}
@media(max-width:540px){
  .plans{grid-template-columns:1fr;}
}