:root {
  --seo-bg: #08080d;
  --seo-card: rgba(255,255,255,.055);
  --seo-line: rgba(255,255,255,.12);
  --seo-pink: #ff3aa7;
  --seo-violet: #9a6cff;
  --seo-text: #f7f4fb;
  --seo-muted: #bbb4c5;
}

.seo-page { color: var(--seo-text); }
.seo-section { padding: 74px 0; }
.seo-section.compact { padding: 52px 0; }
.seo-section.alt { background: linear-gradient(180deg, rgba(154,108,255,.05), rgba(255,58,167,.035)); border-block: 1px solid var(--seo-line); }
.seo-kicker { display:inline-flex; padding:7px 12px; border:1px solid rgba(255,58,167,.35); border-radius:999px; color:#ffd1ea; background:rgba(255,58,167,.08); font-size:.82rem; font-weight:700; }
.seo-hero { padding: 78px 0 62px; overflow:hidden; position:relative; }
.seo-hero::after { content:""; position:absolute; width:460px; height:460px; right:-180px; top:-120px; border-radius:50%; background:radial-gradient(circle, rgba(255,58,167,.2), transparent 68%); pointer-events:none; }
.seo-hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); gap:48px; align-items:center; }
.seo-hero h1 { font-size:clamp(2rem,5vw,4.25rem); line-height:1.04; margin:18px 0; max-width:980px; }
.seo-lead { color:var(--seo-muted); font-size:clamp(1rem,1.8vw,1.2rem); line-height:1.7; max-width:820px; }
.seo-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.seo-proof { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:28px; }
.seo-proof div { padding:15px; border:1px solid var(--seo-line); border-radius:16px; background:var(--seo-card); }
.seo-proof b { display:block; font-size:1.15rem; margin-bottom:4px; }
.seo-proof span { color:var(--seo-muted); font-size:.84rem; }
.seo-demo { border:1px solid rgba(255,58,167,.3); border-radius:28px; background:linear-gradient(145deg, rgba(255,58,167,.11), rgba(154,108,255,.08)); padding:24px; box-shadow:0 24px 90px rgba(0,0,0,.32); }
.seo-demo-title { font-weight:800; margin-bottom:14px; }
.seo-demo-step { display:flex; gap:12px; align-items:flex-start; padding:13px; border-radius:14px; background:rgba(0,0,0,.22); margin-top:9px; }
.seo-demo-step span:first-child { display:grid; place-items:center; min-width:28px; height:28px; border-radius:50%; background:linear-gradient(135deg,var(--seo-pink),var(--seo-violet)); font-weight:800; }
.seo-demo-step small { display:block; color:var(--seo-muted); margin-top:3px; }
.seo-title { font-size:clamp(1.65rem,3.4vw,2.85rem); line-height:1.15; margin:0 0 15px; }
.seo-subtitle { color:var(--seo-muted); line-height:1.7; max-width:850px; margin:0 0 28px; }
.seo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.seo-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.seo-card { padding:24px; border:1px solid var(--seo-line); border-radius:20px; background:var(--seo-card); }
.seo-card h2, .seo-card h3 { margin:0 0 9px; font-size:1.13rem; }
.seo-card p { margin:0; color:var(--seo-muted); line-height:1.65; }
.seo-card .icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:linear-gradient(135deg,rgba(255,58,167,.2),rgba(154,108,255,.18)); margin-bottom:15px; }
.seo-table-wrap { overflow-x:auto; border:1px solid var(--seo-line); border-radius:20px; }
.seo-table { width:100%; border-collapse:collapse; min-width:700px; }
.seo-table th, .seo-table td { padding:16px; text-align:left; border-bottom:1px solid var(--seo-line); vertical-align:top; }
.seo-table th { background:rgba(255,255,255,.06); font-size:.88rem; }
.seo-table td { color:var(--seo-muted); }
.seo-table tr:last-child td { border-bottom:0; }
.seo-good { color:#8ff0be !important; font-weight:700; }
.seo-checklist { display:grid; gap:12px; margin-top:22px; }
.seo-check { display:flex; gap:12px; padding:17px 18px; border:1px solid var(--seo-line); border-radius:16px; background:var(--seo-card); }
.seo-check b { color:#8ff0be; }
.seo-faq { display:grid; gap:10px; }
.seo-faq details { border:1px solid var(--seo-line); background:var(--seo-card); border-radius:16px; padding:18px 20px; }
.seo-faq summary { cursor:pointer; font-weight:800; }
.seo-faq p { color:var(--seo-muted); line-height:1.65; margin:12px 0 0; }
.seo-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.seo-link { display:block; padding:18px; border:1px solid var(--seo-line); border-radius:16px; color:var(--seo-text); text-decoration:none; background:var(--seo-card); }
.seo-link:hover { border-color:rgba(255,58,167,.55); transform:translateY(-2px); }
.seo-link small { color:var(--seo-muted); display:block; margin-top:5px; }
.seo-cta { padding:34px; border:1px solid rgba(255,58,167,.38); border-radius:26px; background:linear-gradient(135deg,rgba(255,58,167,.12),rgba(154,108,255,.11)); text-align:center; }
.seo-cta h2 { margin:0 0 10px; }
.seo-cta p { color:var(--seo-muted); max-width:720px; margin:0 auto 20px; line-height:1.65; }
.seo-note { padding:16px 18px; border-left:3px solid var(--seo-pink); background:rgba(255,58,167,.07); border-radius:0 14px 14px 0; color:var(--seo-muted); line-height:1.65; }
.seo-article { max-width:860px; margin:auto; }
.seo-article h2 { margin:42px 0 14px; font-size:1.55rem; }
.seo-article h3 { margin:28px 0 10px; }
.seo-article p, .seo-article li { color:var(--seo-muted); line-height:1.8; }
.seo-article a { color:#ff9ad0; }
.seo-article ul, .seo-article ol { padding-left:22px; }
.seo-source { font-size:.87rem; color:var(--seo-muted); }

@media (max-width:900px) {
  .seo-hero-grid { grid-template-columns:1fr; }
  .seo-grid, .seo-links { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px) {
  .seo-section { padding:52px 0; }
  .seo-hero { padding-top:46px; }
  .seo-grid, .seo-grid.two, .seo-links, .seo-proof { grid-template-columns:1fr; }
  .seo-demo { padding:18px; }
  .seo-cta { padding:25px 18px; }
}
