:root {
  --ink: #1b2233;
  --muted: #6b7488;
  --line: #e7eaf2;
  --brand: #5b6cf6;
  --brand2: #8b5cf6;
  --bg: #f7f9ff;
  --card: #ffffff;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font: 16px/1.65 -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
}
.wrap { max-width: 980px; margin: 0 auto; padding: 0 20px; }
header.hero {
  background: linear-gradient(135deg, var(--brand), var(--brand2));
  color: #fff;
  padding: 64px 0 72px;
}
.brand { display: flex; align-items: center; gap: 12px; font-weight: 700; font-size: 26px; }
.spark { width: 30px; height: 30px; flex: none; }
h1 { font-size: 40px; line-height: 1.2; margin: 26px 0 14px; }
.lead { font-size: 19px; opacity: .95; max-width: 620px; margin: 0 0 30px; }
.btn {
  display: inline-block; background: #fff; color: #3f4ad8; font-weight: 600;
  padding: 15px 30px; border-radius: 12px; text-decoration: none;
}
.btn:hover { background: #f0f2ff; }
.btn.ghost { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.6); }
section { padding: 52px 0; }
h2 { font-size: 28px; margin: 0 0 22px; }
h3 { font-size: 20px; margin: 26px 0 10px; }
.grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 18px; padding: 24px; }
.card.hi { border-color: var(--brand2); box-shadow: 0 8px 30px rgba(139,92,246,.16); }
.price { font-size: 30px; font-weight: 700; margin: 6px 0 2px; }
.per { color: var(--muted); font-size: 14px; }
.badge {
  display: inline-block; background: var(--brand2); color: #fff; font-size: 12px;
  font-weight: 600; padding: 4px 11px; border-radius: 20px; margin-left: 8px; vertical-align: 3px;
}
ul.checks { list-style: none; padding: 0; margin: 16px 0 0; }
ul.checks li { padding-left: 26px; position: relative; margin: 9px 0; }
ul.checks li::before {
  content: "✓"; position: absolute; left: 0; color: var(--brand); font-weight: 700;
}
.muted { color: var(--muted); }
.note { background: #fff8e6; border: 1px solid #f2dfae; border-radius: 12px; padding: 16px 18px; }
footer { border-top: 1px solid var(--line); padding: 34px 0 60px; color: var(--muted); font-size: 14px; }
footer a { color: var(--muted); margin-right: 18px; }
a { color: #4450d8; }
table { border-collapse: collapse; width: 100%; margin: 14px 0; }
th, td { border: 1px solid var(--line); padding: 10px 12px; text-align: left; font-size: 15px; }
th { background: #f2f4fb; }
.doc { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 30px 34px; margin: 30px 0 60px; }
.doc h1 { color: var(--ink); font-size: 30px; margin-top: 0; }
.topbar { padding: 18px 0; }
.topbar a { color: var(--brand); text-decoration: none; font-weight: 600; }
@media (max-width: 640px) { h1 { font-size: 30px; } .doc { padding: 22px; } }

/* Iskra: warm paper, lavender accents, clear educational typography. */
:root{--ink:#27253e;--muted:#747187;--brand:#6b57de;--brand2:#8c72e8;--bg:#faf9f6;--line:#e9e5ef}
html{scroll-behavior:smooth;scroll-padding-top:30px}body{font-family:Inter,"Segoe UI",Arial,sans-serif}
.wrap{max-width:1200px;padding:0 28px}.navigation{height:100px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.wordmark{font-size:30px;font-weight:750;text-decoration:none;color:var(--ink);letter-spacing:-1px}.wordmark span{display:block;font-size:10px;letter-spacing:1px;font-weight:500;margin-left:30px;color:var(--muted)}
.navlinks{display:flex;gap:30px}.navlinks a{text-decoration:none;color:var(--muted);font-size:14px}.nav-cta{border:1px solid var(--line);border-radius:30px;padding:10px 20px;text-decoration:none;font-size:14px;color:var(--ink)}
header.hero{background:radial-gradient(ellipse at 85% 45%,#e7e0fc 0,transparent 53%);color:var(--ink);padding:64px 0 90px}.hero-layout{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:65px}.hero .brand{display:none}
.eyebrow{color:var(--brand);font-size:10px;letter-spacing:1.9px;font-weight:750;margin-bottom:18px}h1{font-size:clamp(38px,4.6vw,62px);letter-spacing:-2.8px;line-height:1.1;margin:20px 0 26px}h1 em{font-style:normal;color:var(--brand)}
.lead{font-size:17px;line-height:1.8;color:var(--muted)}.btn{background:var(--brand);color:white;border-radius:30px;font-size:14px;padding:15px 24px;box-shadow:0 8px 22px #6b57de20}.btn:hover{background:#5946c6;color:white}.btn.ghost{color:var(--ink);border:1px solid var(--line);background:transparent;box-shadow:none}.hero-caption{font-size:11px;color:var(--muted);margin-top:22px}
.demo{border:1px solid #ffffff;border-radius:24px;background:#fff;box-shadow:0 25px 65px #6c598d18;transform:rotate(2deg);overflow:hidden}.demo-top{display:flex;justify-content:space-between;padding:22px 24px;background:#f1edfc;font-weight:700;color:var(--brand)}.demo-label{font-size:9px;letter-spacing:1px;align-self:center}.demo-question{margin:22px 24px 16px;background:#f7f6fa;border-radius:16px;padding:18px 20px;font-size:13px}.demo-question strong{font-size:25px;display:block;margin-top:8px;letter-spacing:1px}.demo-answer{padding:12px 24px 22px}.demo-step{display:flex;gap:13px;margin:19px 0;font-size:12px}.demo-step b{width:25px;height:25px;background:#eee9fc;border-radius:50%;text-align:center;color:var(--brand);line-height:25px}.demo-step span{display:block;font-size:21px;margin-top:6px}.demo-result{background:#edf6ee;padding:15px;border-radius:13px;display:flex;flex-wrap:wrap;align-items:center;gap:15px;color:#40734c;font-size:12px}.demo-result strong{font-size:24px}.demo-result span:last-child{width:100%;font-size:11px}.demo-footer{border-top:1px solid var(--line);padding:15px 24px;font-size:10px;color:var(--muted)}
section{padding:70px 0}h2{font-size:36px;letter-spacing:-1.3px;line-height:1.2}.section-intro{color:var(--muted);max-width:540px;margin-bottom:35px}.grid{gap:18px;grid-template-columns:repeat(3,minmax(0,1fr))}.card{border-radius:20px;padding:28px;background:#fff;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 12px 30px #30264708}.card h3{margin:0 0 14px;font-size:18px}.card p{font-size:14px;line-height:1.8}.price{font-size:44px;letter-spacing:-2px;margin-top:24px}.checks{font-size:14px}.checks li{margin:14px 0!important}.badge{font-size:9px;letter-spacing:.7px;padding:5px 9px}.card.hi{background:#f0ebfc;border-color:#b7a4ed;box-shadow:none}.plan-link{display:block;margin-top:auto;padding:13px;border:1px solid var(--line);border-radius:25px;text-decoration:none;text-align:center;font-size:13px;font-weight:650}.hi .plan-link{background:var(--brand);color:#fff;border-color:var(--brand)}#tariffs{background:#f2f0f6}#tariffs .card{display:flex;flex-direction:column}#tariffs .checks{margin-bottom:30px}.note{background:#f0eef5;border-color:var(--line);font-size:13px;color:var(--muted)}
.faq .wrap{max-width:900px}.faq details{border-bottom:1px solid var(--line);padding:22px 0}.faq summary{cursor:pointer;font-weight:600;font-size:17px}.faq p{color:var(--muted);font-size:15px;max-width:680px}.closing{text-align:center;background:#eee8fa}.closing h2{font-size:44px}.closing .btn{margin-top:14px}footer{padding:35px 0;font-size:12px}footer a{display:inline-block;margin-bottom:10px}
a:focus-visible,summary:focus-visible{outline:3px solid #b9a9f4;outline-offset:5px}a{transition:background .15s,color .15s}
@media(max-width:900px){.hero-layout{gap:28px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}#tariffs .grid{grid-template-columns:1fr}.navlinks{gap:16px}h1{letter-spacing:-1.5px}}
@media(max-width:640px){.navigation{height:80px}.navlinks{display:none}.wrap{padding:0 20px}.wordmark{font-size:25px}.nav-cta{font-size:12px;padding:9px 12px}.hero-layout{grid-template-columns:1fr;gap:36px}header.hero{padding:28px 0 45px}.hero-copy .eyebrow{font-size:9px;letter-spacing:1.2px}h1{font-size:42px}.lead{font-size:15px}.demo{transform:none}.grid{grid-template-columns:1fr}section{padding:45px 0}h2{font-size:29px}.closing h2{font-size:34px}.hero .btn{padding:12px 17px}.hero-caption{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.card:hover{transform:none}}
