:root { color-scheme: dark; --bg:#0c1424; --panel:#142137; --ink:#f4f7fc; --muted:#b3bfd0; --accent:#73e2d2; --line:#2a3b54; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.6; }
a { color:inherit; text-decoration:none; }
a:focus-visible, button:focus-visible { outline:3px solid var(--accent); outline-offset:5px; }
.wrap { width:min(1100px,calc(100% - 48px)); margin-inline:auto; }
.site-header { display:flex; align-items:center; justify-content:space-between; min-height:96px; gap:20px; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:9px; font-size:14px; font-weight:750; letter-spacing:.07em; }
.brand span { color:var(--accent); }
.brand-icon { font-size:30px; line-height:1; }
.text-link { font-size:15px; color:var(--muted); }
.hero { padding-top:86px; padding-bottom:62px; }
.eyebrow { margin:0 0 20px; color:var(--accent); font-size:12px; letter-spacing:.13em; text-transform:uppercase; font-weight:750; }
h1 { max-width:930px; font-size:clamp(34px,5.3vw,62px); line-height:1.12; letter-spacing:-.04em; margin:0 0 28px; font-weight:700; }
.lead { max-width:690px; font-size:20px; line-height:1.65; color:var(--muted); margin:0 0 32px; }
.cta { display:inline-flex; align-items:center; justify-content:space-between; gap:26px; padding:16px 24px; background:var(--accent); color:#081e22; border-radius:9px; font-weight:750; line-height:1.4; }
.cta:hover { background:#a0efe3; }
.hero-note { max-width:520px; color:var(--muted); font-size:13px; margin:17px 0 0; }
.features { display:flex; flex-wrap:wrap; gap:10px; padding:0; margin:48px 0 0; list-style:none; }
.features li { padding:8px 16px; border:1px solid var(--line); border-radius:30px; font-size:14px; color:#d8e5f4; }
.section { padding-top:54px; padding-bottom:60px; border-top:1px solid var(--line); }
h2 { font-size:clamp(26px,3vw,36px); line-height:1.2; letter-spacing:-.025em; margin:0 0 28px; }
h3 { font-size:19px; line-height:1.4; margin:21px 0 12px; }
p { margin:0 0 18px; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; list-style:none; padding:0; margin:0; }
.steps li { padding:28px; background:var(--panel); border:1px solid var(--line); border-radius:14px; }
.step-number { color:var(--accent); font-size:26px; font-variant-numeric:tabular-nums; }
.steps p { color:var(--muted); font-size:15px; margin-bottom:0; }
.pricing-section { display:grid; grid-template-columns:1fr 1.5fr; gap:70px; }
.price-intro p:not(.eyebrow) { color:var(--muted); }
.muted { font-size:14px; }
.prices { list-style:none; margin:0; padding:0; }
.prices li { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 0; border-bottom:1px solid var(--line); }
.prices li:first-child { padding-top:0; }
.prices li>div>span { display:block; color:var(--muted); font-size:13px; margin-top:4px; }
.prices li>b { white-space:nowrap; font-size:17px; }
.limitations p { max-width:800px; color:var(--muted); }
.limitations .cta { margin-top:18px; }
.site-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:28px; color:var(--muted); font-size:13px; border-top:1px solid var(--line); }
.share-card { max-width:560px; padding:32px; margin:60px auto; background:var(--panel); border:1px solid var(--line); border-radius:16px; }
.share-card h1 { font-size:30px; }
.share-card p { color:var(--muted); }
.share-card button { width:100%; cursor:pointer; border:0; font:inherit; font-weight:700; }
.share-card .cancel { margin-top:16px; padding:12px; background:none; color:var(--muted); border:1px solid var(--line); border-radius:9px; }
.share-card button:disabled { opacity:.55; cursor:default; }
@media(max-width:700px) {
  .wrap { width:calc(100% - 36px); }
  .site-header { min-height:78px; }
  .brand { font-size:11px; gap:6px; letter-spacing:.04em; }
  .hero { padding-top:48px; padding-bottom:40px; }
  .lead { font-size:17px; }
  .cta { padding:15px 18px; gap:16px; font-size:15px; }
  .hero .cta { width:100%; }
  .features { margin-top:32px; gap:8px; }
  .features li { padding:6px 12px; font-size:12px; }
  .section { padding-block:38px; }
  .steps { grid-template-columns:1fr; }
  .steps li { padding:22px; }
  h3 { margin-top:10px; }
  .pricing-section { grid-template-columns:1fr; gap:18px; }
  .site-footer { align-items:flex-start; flex-direction:column; gap:6px; }
  .share-card { margin:24px auto; padding:24px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }