html:has(body.seo-page) { height:auto; overflow-x:clip; }
body.seo-page { height:auto; min-height:100vh; overflow-x:clip; }
.seo-shell { position:relative; z-index:1; width:min(100% - 28px, 920px); margin:0 auto; padding:22px 0 48px; }
.seo-header { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:56px; }
.seo-brand { display:inline-flex; align-items:center; gap:9px; color:var(--text); font:800 20px/1 var(--font-display); letter-spacing:1px; text-decoration:none; }
.seo-brand img { width:28px; height:28px; }
.seo-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px 18px; }
.seo-nav a { min-height:44px; display:inline-flex; align-items:center; color:var(--muted); font-size:13px; text-decoration:none; }
.seo-nav a[aria-current="page"], .seo-nav a:hover { color:var(--green); }
.seo-nav a:focus-visible, .seo-cta:focus-visible, .seo-related a:focus-visible { outline:2px solid var(--green); outline-offset:3px; border-radius:6px; }
.seo-main { display:grid; gap:20px; padding-top:clamp(32px,7vw,72px); }
.seo-hero { display:grid; gap:18px; padding:clamp(24px,6vw,54px); border:1px solid color-mix(in srgb,var(--green) 22%,var(--border)); border-radius:22px; background:linear-gradient(145deg,color-mix(in srgb,var(--green) 8%,var(--bg2)),var(--bg2)); box-shadow:0 24px 60px rgba(0,0,0,.16); }
.seo-eyebrow { color:var(--green); font:700 11px/1 var(--font-body); letter-spacing:1.5px; }
.seo-hero h1 { max-width:720px; font:800 clamp(38px,7vw,68px)/.98 var(--font-display); letter-spacing:.1px; }
.seo-lead { max-width:700px; color:var(--muted); font-size:clamp(16px,2vw,19px); line-height:1.65; }
.seo-cta { width:max-content; min-height:48px; display:inline-flex; align-items:center; justify-content:center; padding:0 20px; border-radius:12px; background:linear-gradient(100deg,var(--green),var(--cyan)); color:var(--accent-foreground); font-weight:750; text-decoration:none; }
.seo-content { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.seo-card { padding:24px; border:1px solid var(--border); border-radius:16px; background:var(--glass); }
.seo-card h2 { margin-bottom:10px; font:800 25px/1.1 var(--font-display); }
.seo-card h3 { margin:18px 0 7px; font-size:16px; }
.seo-card p, .seo-card li { color:var(--muted); font-size:15px; line-height:1.65; }
.seo-card ul, .seo-card ol { display:grid; gap:9px; padding-left:20px; }
.seo-card--wide { grid-column:1 / -1; }
.seo-related { display:flex; flex-wrap:wrap; gap:10px 20px; padding:18px 2px; }
.seo-related strong { width:100%; font-size:13px; }
.seo-related a { color:var(--muted); font-size:13px; }
.seo-footer { padding-top:24px; border-top:1px solid var(--border); color:var(--dimmed); font-size:12px; text-align:center; }
@media (max-width:700px) { .seo-header { align-items:flex-start; flex-direction:column; } .seo-nav { justify-content:flex-start; } .seo-main { padding-top:28px; } .seo-content { grid-template-columns:1fr; } .seo-card--wide { grid-column:auto; } }