/* SEO/GEO tab styling — extends audit.css + dashboard.css + arch.css */

.seo-hero{
  background:linear-gradient(135deg,#1e1b4b 0%,#4c1d95 50%,#831843 100%);
  color:#fdf4ff;border-radius:20px;padding:40px;margin-bottom:26px;
  display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;
  box-shadow:0 16px 48px rgba(76,29,149,.28);
}
@media(max-width:760px){.seo-hero{grid-template-columns:1fr}}
.seo-hero h1{margin:0 0 8px;font-size:32px;font-weight:800;letter-spacing:-.02em}
.seo-hero .lede{font-size:15px;opacity:.9;line-height:1.6;margin:0 0 14px;max-width:640px}
.seo-hero .url{font-family:"SF Mono",Menlo,monospace;font-size:13px;background:rgba(255,255,255,.12);
  padding:3px 10px;border-radius:6px;display:inline-block}

/* score donut */
.score-donut{width:180px;height:180px;border-radius:50%;display:grid;place-items:center;position:relative;
  background:conic-gradient(var(--score-color) calc(var(--score)*1%), rgba(255,255,255,.15) 0);}
.score-donut::before{content:"";position:absolute;inset:14px;border-radius:50%;background:#2a1a4a}
.score-donut .inner{position:relative;text-align:center}
.score-donut .num{font-size:46px;font-weight:800;line-height:1}
.score-donut .of{font-size:13px;opacity:.7}
.score-donut .grade{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-top:4px}

/* area score row */
.area-scores{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:22px}
.area-score{background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px 18px;border-top:4px solid #7c3aed}
.area-score .a{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.area-score .s{font-size:30px;font-weight:800;line-height:1.1;margin:2px 0}
.area-score .bar{height:7px;border-radius:99px;background:#ede9fe;overflow:hidden;margin-top:6px}
.area-score .bar i{display:block;height:100%;border-radius:99px}
.area-score.crit{border-top-color:#dc2626}.area-score.crit .s{color:#dc2626}.area-score.crit .bar i{background:#dc2626}
.area-score.warn{border-top-color:#ea580c}.area-score.warn .s{color:#ea580c}.area-score.warn .bar i{background:#ea580c}
.area-score.mid{border-top-color:#ca8a04}.area-score.mid .s{color:#ca8a04}.area-score.mid .bar i{background:#ca8a04}
.area-score.ok{border-top-color:#16a34a}.area-score.ok .s{color:#16a34a}.area-score.ok .bar i{background:#16a34a}

/* severity legend reuse from audit-sec: .tag.sev-p0.. — but SEO uses named sev */
.sev{display:inline-block;padding:2px 9px;border-radius:6px;font-size:11px;font-weight:700;letter-spacing:.03em;font-family:"SF Mono",Menlo,monospace}
.sev.critical{background:#dc2626;color:#fff}
.sev.high{background:#ea580c;color:#fff}
.sev.medium{background:#ca8a04;color:#fff}
.sev.low{background:#16a34a;color:#fff}

/* finding rows */
.seo-find{border:1px solid var(--border);border-left-width:5px;border-radius:10px;padding:16px 18px;margin-bottom:14px;background:#fff}
.seo-find.critical{border-left-color:#dc2626}
.seo-find.high{border-left-color:#ea580c}
.seo-find.medium{border-left-color:#ca8a04}
.seo-find.low{border-left-color:#16a34a}
.seo-find .fh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.seo-find .fh h4{margin:0;font-size:15.5px;font-weight:700;flex:1 1 auto}
.seo-find .b{margin:8px 0;font-size:13.5px;line-height:1.55}
.seo-find .b .k{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700;display:inline-block;min-width:88px}
.seo-find .ev{background:#0f172a;color:#e2e8f0;border-radius:7px;padding:8px 12px;font-family:"SF Mono",Menlo,monospace;font-size:12px;line-height:1.5;white-space:pre-wrap;overflow-x:auto}
.seo-find .fix{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:7px;padding:8px 12px;color:#14532d}
.seo-find .meta-line{font-size:11.5px;color:var(--muted);margin-top:6px}
.seo-find .meta-line b{color:#475569}

/* deliverable (paste-ready) */
.deliverable{margin:14px 0}
.deliverable .dh{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.deliverable .dh .name{font-weight:700;font-size:14px}
.deliverable .dh .lang{font-size:10px;text-transform:uppercase;letter-spacing:.05em;background:#ede9fe;color:#5b21b6;padding:2px 8px;border-radius:5px;font-weight:700}
.deliverable pre{background:#0b1020;color:#e2e8f0;border-radius:10px;padding:16px;overflow-x:auto;font-size:12.5px;line-height:1.55;margin:0;border:1px solid #1e293b}
.deliverable pre .c{color:#64748b}

.geo-note{background:#faf5ff;border:1px solid #e9d5ff;border-radius:10px;padding:14px 18px;font-size:14px;line-height:1.6;color:#581c87;margin:12px 0}
.geo-note strong{color:#6b21a8}