.seo-page { padding: 24px 0 72px; }
.seo-shell { min-width: 0; }
.seo-crumbs { display:flex; gap:8px; align-items:center; flex-wrap:wrap; color:var(--text-mute); font-size:.82rem; margin:8px 0 34px; }
.seo-crumbs a { color:var(--text-dim); text-decoration:underline; text-underline-offset:3px; }
.seo-hero { max-width:820px; padding:clamp(26px,5vw,58px); border:1px solid var(--border); border-radius:24px; background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,var(--bg-soft)),var(--bg-soft)); }
.seo-kicker { color:var(--accent); text-transform:uppercase; letter-spacing:.13em; font-size:.72rem; font-weight:750; margin:0 0 12px; }
.seo-hero h1 { font-size:clamp(2rem,6vw,4.1rem); line-height:1.02; letter-spacing:-.045em; margin:0; max-width:16ch; }
.seo-lede { color:var(--text-dim); font-size:clamp(1rem,2vw,1.18rem); line-height:1.7; max-width:68ch; margin:20px 0 26px; }
.seo-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:30px 0 54px; }
.seo-card { display:block; min-width:0; padding:22px; border:1px solid var(--border); border-radius:17px; background:var(--bg-soft); color:inherit; }
.seo-card:hover { border-color:color-mix(in srgb,var(--accent) 55%,var(--border)); transform:translateY(-2px); }
.seo-card h2 { font-size:1.05rem; margin:0 0 8px; }
.seo-card p { color:var(--text-dim); line-height:1.58; font-size:.9rem; margin:0 0 18px; }
.seo-card span { color:var(--accent); font-weight:650; font-size:.86rem; }
.seo-reading { max-width:790px; margin-top:52px; }
.seo-reading section { padding:30px 0; border-top:1px solid var(--border); }
.seo-reading h2 { font-size:clamp(1.35rem,3vw,1.8rem); letter-spacing:-.025em; margin:0 0 15px; }
.seo-reading p { color:var(--text-dim); line-height:1.78; margin:0 0 14px; }
.seo-qa { padding:15px 0; }
.seo-qa h3 { font-size:1rem; margin:0 0 7px; }
.seo-next { margin-top:34px; padding:26px; border-radius:18px; background:color-mix(in srgb,var(--accent) 9%,var(--bg-soft)); border:1px solid color-mix(in srgb,var(--accent) 28%,var(--border)); }
.seo-next h2 { margin-top:0; }
.seo-next div { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.seo-related { display:flex; flex-wrap:wrap; gap:12px 20px; margin-top:28px; font-size:.9rem; }
.seo-related a { color:var(--text-dim); text-decoration:underline; text-underline-offset:3px; }
@media (max-width:900px) { .seo-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .seo-page{padding-top:12px}.seo-crumbs{margin-bottom:20px}.seo-hero{border-radius:18px;padding:24px 20px}.seo-card-grid{grid-template-columns:1fr;margin-top:20px}.seo-card{padding:19px}.seo-reading{margin-top:36px}.seo-next{padding:21px}.seo-next .btn{width:100%} }
@media (prefers-reduced-motion:reduce) { .seo-card { transition:none; } .seo-card:hover { transform:none; } }