
:root{
  --bg:#F4F2FF;
  --card:#ffffff;
  --accent:#9F86FF;
  --accent-dark:#5B3FD6;
  --accent-soft:#EEE9FF;
  --gold:#C9A24D;
  --text:#0F172A;
  --muted:#6B7280;
  --border:#E5E7EB;
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:radial-gradient(circle at top,#E0DBFF 0,#F4F2FF 45%,#FFFFFF 100%);
  color:var(--text);
  line-height:1.75;
}

.wrapper{
  max-width:980px;
  margin:2.5rem auto 4rem;
  background:var(--card);
  border-radius:28px;
  padding:3rem 3.5rem;
  box-shadow:0 22px 60px rgba(91,63,214,.18);
}

@media(max-width:768px){
  .wrapper{padding:2rem 1.4rem;}
}

header{
  border-bottom:1px solid var(--border);
  padding-bottom:1.8rem;
  margin-bottom:2.4rem;
}

.kicker{
  font-size:.8rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);
  font-weight:600;
}

h1{
  font-size:2.2rem;
  margin:.5rem 0;
}

.meta{
  font-size:.9rem;
  color:var(--muted);
}

.meta span{
  background:var(--accent-soft);
  padding:.2rem .7rem;
  border-radius:999px;
  margin-left:.4rem;
  color:var(--accent-dark);
  font-weight:600;
}

section{margin:2.6rem 0;}

h2{
  font-size:1.55rem;
  margin-bottom:.7rem;
}

h3{
  font-size:1.15rem;
  margin-top:1.4rem;
}

p{margin:.6rem 0;}

ul{padding-left:1.2rem;}
li{margin:.35rem 0;}

.note{
  margin-top:1rem;
  background:#F5F3FF;
  border-left:4px solid var(--accent);
  padding:1rem;
  border-radius:0 14px 14px 0;
  color:var(--muted);
}

.step{
  background:linear-gradient(180deg,#FFFFFF,#FAF9FF);
  border:1px dashed #E8E4FF;
  border-radius:16px;
  padding:1.4rem;
  margin-bottom:1.4rem;
}

.step-label{
  font-size:.75rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--accent-dark);
  font-weight:700;
}

.step-title{
  font-weight:600;
  margin:.2rem 0 .4rem;
}

.two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1.6rem;
}

@media(max-width:900px){
  .two-col{grid-template-columns:1fr;}
}

.card{
  background:#FAFAFF;
  border:1px solid #E8E4FF;
  border-radius:18px;
  padding:1.3rem;
}

.cta{
  margin:3rem 0;
  padding:2.2rem;
  background:linear-gradient(135deg,#F3F0FF,#FFFFFF 55%,#FFF9EC);
  border-radius:26px;
  border:1px solid #E6E0FF;
}

.cta h2{margin-top:0;}
.cta a{
  display:inline-block;
  margin-top:.8rem;
  padding:.75rem 1.6rem;
  border-radius:999px;
  background:linear-gradient(135deg,var(--accent),var(--accent-dark));
  color:#fff;
  text-decoration:none;
  font-weight:600;
  box-shadow:0 14px 36px rgba(91,63,214,.35);
}

footer{
  border-top:1px solid var(--border);
  padding-top:1.2rem;
  font-size:.85rem;
  color:var(--muted);
}
