:root{--bg:#0b0a10;--s1:#13111b;--s2:#1a1724;--bd:#262235;--tx:#ece9f7;--mu:#9a96b5;--ac:#8b5cf6;--ac2:#c084fc;--r:1rem}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--tx);font-family:Cairo,system-ui,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit}img{max-width:100%;height:auto;display:block}
.wrap{width:min(1180px,100% - 2.5rem);margin-inline:auto}.narrow{width:min(780px,100% - 2.5rem)}
.center{text-align:center}.muted{color:var(--mu)}.small{font-size:.86rem}
.skip{position:absolute;inset-inline-start:-999px}.skip:focus{inset-inline-start:1rem;top:1rem;background:var(--ac);padding:.5rem 1rem;border-radius:.5rem;z-index:99}
h1,h2,h3{line-height:1.3;margin:0 0 .6rem}h1{font-size:clamp(2rem,5vw,3.4rem);font-weight:800}h2{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800}h3{font-size:1.15rem}
.lead{font-size:1.15rem;color:var(--mu);max-width:46rem;margin:0 auto 1.5rem}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem 1.15rem;border-radius:.7rem;font-weight:700;text-decoration:none;border:1px solid transparent;transition:.15s}
.btn-primary{background:var(--ac);color:#fff}.btn-primary:hover{background:#7c3aed}
.btn-outline{border-color:var(--bd);background:var(--s1)}.btn-outline:hover{border-color:var(--ac)}
.btn-ghost{color:var(--mu)}.btn-ghost:hover{color:var(--tx)}.btn-lg{padding:.85rem 1.6rem;font-size:1.05rem}.btn-block{width:100%}
.nav{position:sticky;top:0;z-index:50;background:rgba(11,10,16,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--bd)}
.nav-in{display:flex;align-items:center;gap:1.5rem;height:4.2rem}.brand{display:flex;align-items:center;gap:.55rem;font-weight:800;font-size:1.3rem;text-decoration:none}
.nav-links{display:flex;gap:1.3rem;margin-inline-start:auto}.nav-links a{text-decoration:none;color:var(--mu)}.nav-links a:hover{color:var(--tx)}
.nav-cta{display:flex;gap:.5rem}
@media(max-width:760px){.nav-links{display:none}.nav-cta{margin-inline-start:auto}.nav-cta .btn-ghost{display:none}}
.hero{padding:5rem 0 3rem;background:radial-gradient(60rem 30rem at 50% -10%,rgba(139,92,246,.28),transparent 70%);text-align:center}
.pill{display:inline-block;border:1px solid var(--bd);background:var(--s1);color:var(--mu);border-radius:999px;padding:.25rem .9rem;font-size:.85rem;margin-bottom:1.2rem}
.grad{background:linear-gradient(90deg,var(--ac2),var(--ac));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-cta{display:flex;gap:.75rem;justify-content:center;flex-wrap:wrap;margin-bottom:.6rem}
.shot{margin:3rem auto 0;border:1px solid var(--bd);border-radius:1.2rem;overflow:hidden;box-shadow:0 40px 120px -40px rgba(139,92,246,.6)}
.section{padding:4.5rem 0}.section.alt{background:var(--s1);border-block:1px solid var(--bd)}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem;margin-top:2rem}
.card{background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:1.4rem}.card p{color:var(--mu);margin:0}
.section.alt .card{background:var(--s2)}
.soon-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:center;margin-top:2rem;color:var(--mu)}
.tag{border:1px dashed var(--bd);border-radius:999px;padding:.15rem .7rem;font-size:.85rem}
.steps{list-style:none;padding:0;margin:2rem 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;counter-reset:s}
.steps li{counter-increment:s;background:var(--s2);border:1px solid var(--bd);border-radius:var(--r);padding:1.4rem;display:grid;gap:.3rem}
.steps li::before{content:counter(s);width:2.2rem;height:2.2rem;border-radius:.6rem;background:var(--ac);display:grid;place-items:center;font-weight:800;margin-bottom:.4rem}
.steps span{color:var(--mu)}
.billing-switch{display:flex;justify-content:center;gap:.4rem;margin:1.5rem 0}
.billing-switch button{font:inherit;color:var(--tx);background:var(--s1);border:1px solid var(--bd);border-radius:.7rem;padding:.45rem 1.1rem;cursor:pointer}
.billing-switch button.is-active{background:var(--ac);border-color:var(--ac)}.save{font-size:.72rem;background:rgba(255,255,255,.18);border-radius:999px;padding:0 .45rem;margin-inline-start:.3rem}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1rem;margin-bottom:1rem}
.plan{position:relative;background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);padding:1.5rem;display:flex;flex-direction:column}
.plan.is-featured{border-color:var(--ac);box-shadow:0 0 0 1px var(--ac),0 30px 60px -30px var(--ac)}
.plan-badge{position:absolute;top:-.75rem;inset-inline-start:1.2rem;background:var(--ac);font-size:.75rem;font-weight:700;border-radius:999px;padding:.1rem .7rem}
.plan h3{font-size:1.25rem;margin:0}.plan>p{margin:.2rem 0 .8rem;font-size:.9rem}
.plan-price{font-size:1.7rem;font-weight:800}.plan-billed{margin:.1rem 0 1rem;min-height:1.4rem}
.plan ul{list-style:none;padding:0;margin:0 0 1.2rem;display:grid;gap:.45rem;flex:1;align-content:start;font-size:.92rem}
.plan li::before{content:"✓";color:var(--ac);font-weight:800;margin-inline-end:.45rem}.plan li.soon{color:var(--mu)}.plan li.soon::before{content:"○"}
.plan em{font-style:normal;font-size:.7rem;border:1px solid var(--bd);border-radius:999px;padding:0 .4rem}
[hidden]{display:none!important}
.faq{margin-top:2rem;display:grid;gap:.6rem}.faq details{background:var(--s1);border:1px solid var(--bd);border-radius:.8rem;padding:1rem 1.2rem}
.section.alt .faq details{background:var(--s2)}.faq summary{cursor:pointer;font-weight:700}.faq p{color:var(--mu);margin:.6rem 0 0}
.cta{padding:5rem 0;background:radial-gradient(40rem 20rem at 50% 120%,rgba(139,92,246,.35),transparent 70%)}
.post-card{background:var(--s1);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;transition:.15s}.post-card:hover{border-color:var(--ac)}
.section.alt .post-card{background:var(--s2)}.post-card-link{text-decoration:none;display:block}
.post-card img,.post-card-ph{aspect-ratio:1200/630;object-fit:cover;width:100%}
.post-card-ph{display:grid;place-items:center;font-size:3rem;font-weight:800;background:linear-gradient(135deg,#2e1065,#4c1d95 60%,#7c3aed);color:rgba(255,255,255,.85)}
.post-card-body{padding:1.1rem 1.2rem 1.3rem}.post-card-body h3{margin:.3rem 0}.post-card-body p{margin:0;font-size:.92rem}
.pager{display:flex;justify-content:center;gap:.6rem;margin-top:2rem}
.crumbs a{text-decoration:none}.post-title{font-size:clamp(1.8rem,4vw,2.6rem);margin-top:.8rem}
.post-cover{border-radius:var(--r);margin:1.5rem 0;border:1px solid var(--bd)}
.prose{font-size:1.08rem}.prose h2{font-size:1.5rem;margin:2rem 0 .6rem}.prose h3{margin:1.5rem 0 .5rem}
.prose p,.prose li{color:#d6d2ea}.prose a{color:var(--ac2)}.prose ul,.prose ol{padding-inline-start:1.3rem}
.prose blockquote{margin:1.2rem 0;padding:.6rem 1rem;border-inline-start:3px solid var(--ac);background:var(--s1);border-radius:.5rem}
.post-cta{margin-top:3rem;background:var(--s1);border:1px solid var(--ac);border-radius:var(--r);padding:1.6rem;text-align:center}
.post-cta p{color:var(--mu)}
.footer{border-top:1px solid var(--bd);padding:2.5rem 0 1.5rem}.footer-in{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1.5rem;margin-bottom:1.2rem}
.footer nav{display:flex;flex-wrap:wrap;gap:1.2rem}.footer nav a{text-decoration:none;color:var(--mu)}.footer nav a:hover{color:var(--tx)}
