:root{
  --purple-900:#2e1065;
  --purple-800:#3b0764;
  --purple-700:#5b21b6;
  --purple-600:#6d28d9;
  --purple-500:#7c3aed;
  --purple-400:#a855f7;
  --purple-300:#c084fc;
  --purple-200:#ddd6fe;
  --purple-100:#f3e8ff;
  --lavender:#faf5ff;
  --card:#ffffff;
  --text:#251c35;
  --muted:#51445f;
  --line:#e9d5ff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:hidden;-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:linear-gradient(180deg,#fbf7ff 0%,#f8f2ff 46%,#ffffff 100%);
  color:var(--text);
  line-height:1.7;
  overflow-x:hidden;
}
a{color:var(--purple-700);text-decoration-thickness:2px;text-underline-offset:4px}
.wrap{max-width:1120px;margin:auto;padding:0 20px;width:100%}
.hero{
  padding:84px 0;
  color:#fff;
  background:
    radial-gradient(circle at 78% 18%,rgba(255,255,255,.28),transparent 28%),
    radial-gradient(circle at 18% 82%,rgba(192,132,252,.25),transparent 30%),
    linear-gradient(135deg,#2e1065 0%,#5b21b6 45%,#8b5cf6 100%);
  border-bottom:1px solid rgba(233,213,255,.65);
  position:relative;
  overflow:hidden;
}
.hero:after{
  content:"";
  position:absolute;
  right:-160px;
  bottom:-180px;
  width:460px;
  height:460px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 0 0 38px rgba(255,255,255,.08),0 0 0 82px rgba(255,255,255,.05);
  pointer-events:none;
}
.hero .wrap{position:relative;z-index:1}
.kicker{color:#ede9fe;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px}
h1{font-size:clamp(38px,7vw,72px);line-height:1.04;margin:10px 0 22px;color:#fff;letter-spacing:-.02em}
h2{font-size:clamp(28px,4vw,42px);line-height:1.18;color:var(--purple-700);margin:46px 0 16px;letter-spacing:-.01em}
h3{font-size:22px;margin:28px 0 10px;color:var(--purple-800)}
p,li{font-size:17px;color:var(--muted)}
strong{color:#21122f}
.hero p,.hero .lead{color:#fff}
.lead{font-size:21px;color:#3d3150}
.btn{
  display:inline-block;
  background:linear-gradient(135deg,var(--purple-600),var(--purple-500));
  color:#fff;
  padding:13px 20px;
  border-radius:999px;
  font-weight:800;
  text-decoration:none;
  margin:8px 10px 8px 0;
  box-shadow:0 10px 22px rgba(109,40,217,.22);
  border:1px solid transparent;
}
.btn:hover{transform:translateY(-1px)}
.btn.secondary{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.62);box-shadow:none}
.metrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:#fff;
}
.metric{padding:22px;background:#fff;border-right:1px solid var(--line)}
.metric:last-child{border-right:0}
.metric strong{display:block;color:var(--purple-600);font-size:28px;line-height:1.1}
.metric span{font-size:14px;color:#6b5b7b}
main{padding:50px 0 80px;background:linear-gradient(180deg,#fff 0%,#fbf7ff 100%)}
.box,.card{
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#fdf9ff);
  padding:22px;
  margin:24px 0;
  box-shadow:0 10px 28px rgba(109,40,217,.07);
}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:24px 0}
.tile{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:22px;
  box-shadow:0 10px 26px rgba(109,40,217,.06);
}
.tile h3{color:var(--purple-700);margin-top:0}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.badge{border:1px solid #d8b4fe;border-radius:999px;padding:6px 11px;color:var(--purple-700);font-size:13px;background:#faf5ff;font-weight:700}
table{width:100%;border-collapse:collapse;margin:24px 0;border:1px solid var(--line);background:#fff;border-radius:16px;overflow:hidden;display:table}
th,td{border-bottom:1px solid var(--line);padding:14px;text-align:left;vertical-align:top;color:var(--muted)}
th{width:28%;color:var(--purple-700);background:#f3e8ff;font-weight:800}
tr:last-child th,tr:last-child td{border-bottom:0}
.cta{
  background:linear-gradient(135deg,#f3e8ff 0%,#fff 58%,#f5f3ff 100%);
  border:1px solid #d8b4fe;
  border-radius:22px;
  padding:28px;
  margin:42px 0;
  box-shadow:0 14px 36px rgba(109,40,217,.10);
}
.cta h2{margin-top:0}
.faq{border-top:1px solid var(--line);padding:22px 0}
.faq h3{color:var(--purple-700)}
.note{border-left:4px solid var(--purple-500);background:#faf5ff;padding:18px;margin:28px 0;border-radius:0 14px 14px 0}
footer{border-top:1px solid var(--line);padding:28px 0;color:#6b5b7b;background:#fff}
footer a{font-weight:700}
@media(max-width:800px){
  .metrics,.grid{grid-template-columns:1fr}
  .metric{border-right:0;border-bottom:1px solid var(--line)}
  .metric:last-child{border-bottom:0}
  .hero{padding:64px 0}
  p,li{font-size:16px}
  .lead{font-size:18px}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  th,td{min-width:180px}
}
@media(max-width:520px){
  .wrap{padding:0 15px}
  h1{font-size:clamp(34px,12vw,48px)}
  h2{font-size:clamp(26px,9vw,36px)}
  .btn{width:100%;text-align:center;margin-right:0}
  .cta{padding:22px}
}