:root{--bg:#0a0a0f;--bg2:rgba(255,255,255,0.06);--fg:#e7e7ef;--muted:#9aa0ad;--brand:#7c3aed;--accent:#38bdf8;--danger:#ef4444;--warn:#f59e0b;--card:#101018;--border:rgba(255,255,255,0.12);--logo-size:28px;--logo-scale:3.8}
:root[data-theme="light"]{--bg:#ffffff;--bg2:#f7f7f9;--fg:#0b0b10;--muted:#6b7280;--brand:#7c3aed;--accent:#3b82f6;--danger:#ef4444;--warn:#f59e0b;--card:#ffffff;--border:rgba(0,0,0,0.08);--logo-size:28px;--logo-scale:3.8}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;background:radial-gradient(1200px 600px at 10% 10%, rgba(124,58,237,.15), transparent 60%), radial-gradient(1000px 500px at 90% 20%, rgba(56,189,248,.12), transparent 60%), var(--bg);color:var(--fg)}
:root[data-theme="light"] body{background:var(--bg)}
a{color:var(--accent);text-decoration:none}
:root[data-theme="light"] header,:root[data-theme="light"] footer{background:var(--bg2);backdrop-filter:none;border-bottom:1px solid var(--border)}
header,footer{background:rgba(16,16,24,.6);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
header .container{padding:10px 24px}
.site-footer{padding:24px}
.site-footer .footer-columns{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:20px}
.site-footer h4{margin:0 0 10px;font-size:14px;color:var(--muted)}
.site-footer .brand-wrap{transform:scale(3.5);transform-origin:left center}
.footer-nav{list-style:none;padding:0;margin:0}
.footer-nav li{margin:6px 0}
.footer-nav a{color:var(--fg);opacity:.8}
.footer-nav a:hover{opacity:1;color:var(--accent)}
.footer-bottom{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:16px;padding-top:0;border-top:0;font-size:12px;color:var(--muted)}
.footer-bottom .copyright{border-top:1px solid var(--border);padding-top:12px;text-align:center}
.footer-bottom .row{justify-content:center}
@media (max-width:900px){.site-footer .footer-columns{grid-template-columns:1fr}}
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:600px){
  .container{padding:16px}
  header .container{padding:8px 16px}
  .hero{padding:36px 0}
  .hero h1{font-size:28px;line-height:1.15}
  .hero p{font-size:15px}
  .grid{gap:12px}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .pricing-card{padding:18px}
  .pricing-card .feature-list li{padding:6px 0}
  .footer-bottom .row .btn{padding:8px 12px}
}
.container{max-width:1080px;margin:0 auto;padding:24px}
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:1fr 1fr}
.grid-3{grid-template-columns:repeat(3,1fr)}
.btn{display:inline-block;padding:10px 14px;border-radius:12px;background:var(--brand);color:#fff;transition:transform .2s ease, box-shadow .2s ease, filter .2s ease}
.btn.outline{background:transparent;border:1px solid var(--border);color:#e7e7ef}
:root[data-theme="light"] .btn.outline{color:var(--brand)}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(124,58,237,.28);filter:brightness(1.07)}
.btn[data-variant="cta"]{background:var(--brand);color:#fff}
.btn[data-variant="cta"]:hover{transform:translateY(-1px) scale(1.01);box-shadow:0 14px 28px rgba(124,58,237,.32)}
.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.btn[data-variant="ghost"]{background:transparent;border:0;color:var(--accent)}
.btn[data-variant="ghost"]:hover{transform:none;box-shadow:none;text-decoration:underline}
.btn.outline[data-variant="nav"]:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(0,0,0,.18)}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:20px;transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease}
.card:hover{transform:translateY(-1px);border-color:rgba(124,58,237,.28);box-shadow:0 14px 28px rgba(0,0,0,.3)}
.card[data-anim="float"]:hover{transform:translateY(-3px);box-shadow:0 22px 44px rgba(0,0,0,.36)}
.card[data-anim="tilt"]{transform-style:preserve-3d}
.card[data-anim="tilt"]:hover{transform:rotate3d(1,-1,0,2deg)}
.input{width:100%;padding:10px 12px;border-radius:8px;background:var(--bg2);border:1px solid var(--border);color:var(--fg)}
:root[data-theme="light"] .input{background:#ffffff;border:1px solid rgba(0,0,0,0.1);color:#0b0b10}
.input::placeholder{color:var(--muted)}
.input:focus{outline:2px solid var(--brand);outline-offset:2px}
.label{display:block;margin-bottom:6px;color:var(--muted);font-size:14px}
.input-wrap{position:relative}
.input-wrap .input{padding-right:40px}
.input-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:0;background:transparent;color:var(--muted);cursor:pointer;border-radius:6px}
.input-toggle:hover{color:var(--brand)}
.input-toggle.active{color:var(--brand)}
.row{display:flex;gap:12px;align-items:center}
.nav{display:flex;justify-content:space-between;align-items:center}
.hero{padding:64px 0}
.hero h1{font-size:44px;line-height:1.1;margin:0 0 12px}
.hero p{color:var(--muted);margin:0 0 24px}
.price{font-size:28px;background:linear-gradient(90deg, var(--brand), #6ee7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.pricing-cards .pricing-card .icon{color:var(--accent)}
.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(124,58,237,.14);color:var(--brand);font-size:12px}
.pricing-card .feature-list{list-style:none;padding:0;margin:12px 0}
.pricing-card .feature-list li{padding:6px 0;border-bottom:1px solid var(--border)}
.pricing-card .feature-list li:last-child{border-bottom:0}
.pricing-card .price-tag{font-size:18px;color:var(--fg);opacity:.9;margin:10px 0}
.compare-table .ico{display:inline-flex;align-items:center;justify-content:center}
.plan-card{padding:24px}
.plan-card h3{margin:0 0 12px}
.plan-card .price{margin:6px 0 6px}
.plan-card .row{margin:0 0 10px}
.plan-card p{margin-top:8px;line-height:1.6}
.plan-card .btn{margin-top:12px}
/* merged into advanced pricing styles below */
/* pricing advanced styles */
.pricing-cards{gap:24px}
.pricing-card{position:relative;padding:24px;border-radius:20px;background:var(--card);border:1px solid var(--border);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.pricing-card::before{content:"";position:absolute;inset:0;padding:1px;border-radius:inherit;background:linear-gradient(135deg, rgba(124,58,237,.8), rgba(56,189,248,.8));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .25s ease}
.pricing-card:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(0,0,0,.35);border-color:rgba(124,58,237,.32)}
.pricing-card:hover::before{opacity:.7}
.pricing-card h3{margin:0 0 12px;font-weight:700}
.pricing-card .muted{margin-top:8px;line-height:1.6;color:var(--muted)}
.pricing-card.featured{border-color:rgba(124,58,237,.38);box-shadow:0 24px 56px rgba(124,58,237,.18)}
.pricing-card.featured::before{opacity:.9}
.pricing-card .price-tag{font-size:20px;background:linear-gradient(90deg, var(--brand), #6ee7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.pricing-card .feature-list{list-style:none;padding:0;margin:14px 0}
.pricing-card .feature-list li{padding:8px 0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px}
.pricing-card .feature-list li:last-child{border-bottom:0}
.pricing-card .feature-list li::before{content:"";width:6px;height:6px;border-radius:999px;background:var(--accent);opacity:.6}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid rgba(255,255,255,0.08);text-align:left}
.compare-table thead th{font-weight:600;color:var(--muted)}
.compare-table tbody tr:nth-child(odd){background:rgba(255,255,255,0.03)}
:root[data-theme="light"] .compare-table tbody tr:nth-child(odd){background:rgba(0,0,0,0.02)}
.compare-table .ico.ok{color:#34d399}
.compare-table .ico.dash{color:#9aa0ad}
.compare-table .ico.opc{color:var(--brand)}
.status{padding:6px 10px;border-radius:999px;font-size:12px}
.status.active{background:rgba(34,197,94,.12);color:#34d399}
.status.pending{background:rgba(245,158,11,.1);color:var(--warn)}
.status.suspended{background:rgba(124,58,237,.1);color:var(--brand)}
.status.canceled{background:rgba(239,68,68,.1);color:var(--danger)}
.brand-logo{height:var(--logo-size);display:block}
.brand-wrap{position:relative;display:inline-block}
.brand-logo.light{display:none}
html[data-theme="light"] .brand-logo.light{display:block}
html[data-theme="light"] .brand-logo.dark{display:none}
.brand-logo.big{transform:scale(var(--logo-scale));transform-origin:left center}
.brand-link{line-height:0}
@media (max-width:900px){.grid-3{grid-template-columns:1fr}.grid-2{grid-template-columns:1fr}.nav{flex-direction:column;gap:12px}.hero h1{font-size:32px}.brand-logo.big{transform:scale(1.5)}}
.theme-toggle{width:36px;height:36px;border-radius:999px;border:0;background:transparent;display:inline-flex;align-items:center;justify-content:center;padding:0;margin-left:8px;cursor:pointer;transition:transform .2s ease}
.theme-toggle:hover{transform:translateY(-1px)}
.theme-toggle:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.theme-toggle svg{width:24px;height:24px;color:var(--fg);transform:scale(1.30)}
.theme-toggle .sun{opacity:0;transform:translateX(8px) scale(.92);transition:opacity .5s ease, transform .5s ease}
.theme-toggle .glow{opacity:0;transition:opacity .5s ease}
.theme-toggle .moon{opacity:1;transform:translateX(0);transition:opacity .5s ease, transform .5s ease}
html[data-theme="light"] .theme-toggle .sun{opacity:1;transform:translateX(0) scale(1)}
html[data-theme="light"] .theme-toggle .glow{opacity:.24}
html[data-theme="light"] .theme-toggle .moon{opacity:0;transform:translateX(-8px) scale(.92)}
.theme-toggle .rays{opacity:0;transition:opacity .5s ease}
html[data-theme="light"] .theme-toggle .rays{opacity:1}