:root { --ink:#0b0b0b; --muted:#6f706c; --line:#dedfdb; --paper:#fff; --soft:#f4f4f1; --display:"Satoshi","Geist",sans-serif; }
* { box-sizing:border-box; }
html { color:var(--ink); background:var(--paper); font-family:"Geist",ui-sans-serif,system-ui,-apple-system,sans-serif; scroll-behavior:smooth; }
body { margin:0; background:#fff; }
a { color:inherit; text-decoration:none; }
.seo-nav { width:min(1240px,calc(100% - 48px)); min-height:84px; margin:0 auto; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:32px; border-bottom:1px solid var(--line); }
.seo-logo img { width:154px; height:auto; display:block; }
.seo-nav > div { display:flex; gap:28px; font-size:.78rem; font-weight:650; }
.seo-nav > div a:hover { opacity:.55; }
.seo-nav-cta { justify-self:end; padding:13px 20px; border-radius:999px; color:#fff; background:#111; font-size:.75rem; font-weight:700; }
.seo-hero { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:96px 0 74px; }
.seo-hero > p,.seo-kicker { margin:0 0 20px; color:#858680; font-size:.66rem; font-weight:750; letter-spacing:.16em; text-transform:uppercase; }
.seo-hero h1 { max-width:1040px; margin:0; font-family:var(--display); font-size:clamp(3.2rem,7vw,6.7rem); line-height:.94; letter-spacing:-.055em; }
.seo-hero.guide h1 { max-width:1150px; font-size:clamp(3rem,6.3vw,6rem); }
.seo-lead { max-width:1040px; margin-top:46px; display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:60px; }
.seo-lead p { max-width:720px; margin:0; color:var(--muted); font-size:1.08rem; line-height:1.7; }
.seo-button { min-height:50px; padding:0 23px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; color:#fff; background:#111; font-size:.76rem; font-weight:720; white-space:nowrap; }
.seo-button.light { color:#111; background:#fff; }
.seo-price-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #111; border-bottom:1px solid #111; background:var(--soft); }
.seo-price-grid > div { min-height:180px; padding:32px; display:flex; flex-direction:column; justify-content:flex-end; border-left:1px solid var(--line); }
.seo-price-grid > div:first-child { border-left:0; }
.seo-price-grid span,.seo-price-grid small { color:#7c7d77; font-size:.67rem; }
.seo-price-grid strong { margin:12px 0 8px; font-family:var(--display); font-size:2.2rem; }
.seo-price-grid .seo-discount { color:#fff; background:#111; }
.seo-price-grid .seo-discount span,.seo-price-grid .seo-discount small { color:#999; }
.seo-content { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:120px 0; display:grid; grid-template-columns:1.5fr .7fr; gap:12%; }
.seo-content h2,.seo-guide-sections h2,.seo-code h2,.seo-faq h2,.seo-related h2,.seo-directory h2,.seo-cta h2 { margin:0; font-family:var(--display); font-size:clamp(2rem,4vw,4.2rem); line-height:1.02; letter-spacing:-.04em; }
.seo-content article > p:not(.seo-kicker),.seo-code > div > p:not(.seo-kicker) { max-width:760px; color:var(--muted); font-size:1rem; line-height:1.75; }
.seo-content aside { padding:30px; border:1px solid var(--line); background:var(--soft); }
.seo-content ul { margin:0; padding:0; list-style:none; }
.seo-content li { padding:16px 0; border-top:1px solid var(--line); font-size:.84rem; }
.seo-code { padding:90px max(24px,calc((100% - 1240px)/2)); display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:9%; color:#fff; background:#0b0b0b; }
.seo-code.compact { padding-top:80px; padding-bottom:80px; }
.seo-code > div > p:not(.seo-kicker) { color:#979794; }
.seo-code pre { min-width:0; margin:0; padding:34px; overflow:auto; border:1px solid #343431; background:#151514; box-shadow:14px 14px 0 #242422; }
.seo-code code { font:500 .76rem/1.85 "SFMono-Regular",Consolas,monospace; }
.seo-guide-sections { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:30px 0 120px; border-top:1px solid #111; }
.seo-guide-sections article { padding:54px 0; display:grid; grid-template-columns:70px minmax(0,1fr); border-bottom:1px solid var(--line); }
.seo-guide-sections article > span { color:#aaa; font-size:.68rem; }
.seo-guide-sections article > div { display:grid; grid-template-columns:.9fr 1.1fr; gap:9%; align-items:start; }
.seo-guide-sections h2 { font-size:clamp(1.8rem,3.4vw,3.2rem); }
.seo-guide-sections p { margin:0; color:var(--muted); font-size:.92rem; line-height:1.75; }
.seo-faq { width:min(900px,calc(100% - 48px)); margin:0 auto; padding:120px 0; }
.seo-faq h2 { margin-bottom:54px; }
.seo-faq details { border-top:1px solid var(--line); }
.seo-faq details:last-child { border-bottom:1px solid var(--line); }
.seo-faq summary { padding:25px 4px; cursor:pointer; font-weight:680; }
.seo-faq details p { max-width:760px; margin:0; padding:0 4px 25px; color:var(--muted); font-size:.9rem; line-height:1.7; }
.seo-related,.seo-directory { width:min(1240px,calc(100% - 48px)); margin:0 auto; padding:95px 0; border-top:1px solid #111; }
.seo-related > div,.seo-directory-grid { margin-top:42px; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); }
.seo-related a,.seo-directory-grid a { min-height:120px; padding:24px; display:flex; flex-direction:column; justify-content:space-between; border-left:1px solid var(--line); border-top:1px solid var(--line); }
.seo-related a:nth-child(4n+1),.seo-directory-grid a:nth-child(4n+1) { border-left:0; }
.seo-related a:nth-child(-n+4),.seo-directory-grid a:nth-child(-n+4) { border-top:0; }
.seo-related a:hover,.seo-directory-grid a:hover { color:#fff; background:#111; }
.seo-related span,.seo-directory-grid span { font-weight:700; }
.seo-related small,.seo-directory-grid small { margin-top:18px; color:#858680; font-size:.64rem; }
.seo-directory { display:grid; grid-template-columns:.55fr 1.45fr; gap:8%; }
.seo-directory-grid { margin-top:0; grid-template-columns:repeat(2,1fr); }
.seo-directory-grid a:nth-child(odd) { border-left:0; }
.seo-directory-grid a:nth-child(-n+4) { border-top:1px solid var(--line); }
.seo-directory-grid a:nth-child(-n+2) { border-top:0; }
.seo-cta { padding:100px max(24px,calc((100% - 1240px)/2)); color:#fff; background:#0b0b0b; }
.seo-cta > p { color:#898985; }
.seo-cta h2 { max-width:850px; margin-bottom:38px; }
.seo-footer { padding:70px max(24px,calc((100% - 1240px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:50px; color:#cfcfcb; background:#111; border-top:1px solid #333; }
.seo-footer > div:first-child > a { color:#fff; font-family:var(--display); font-size:1.35rem; font-weight:700; }
.seo-footer > div:first-child p { max-width:480px; color:#777; font-size:.75rem; line-height:1.6; }
.seo-footer > div:nth-child(2) { display:grid; grid-template-columns:1fr 1fr; gap:14px 30px; font-size:.72rem; }
.seo-disclaimer { grid-column:1/-1; margin:20px 0 0; padding-top:24px; border-top:1px solid #30302e; color:#686864; font-size:.61rem; line-height:1.6; }
@media (max-width:900px) { .seo-nav { grid-template-columns:1fr auto; }.seo-nav > div { display:none; }.seo-lead,.seo-content,.seo-code,.seo-directory { grid-template-columns:1fr; }.seo-price-grid { grid-template-columns:1fr 1fr; }.seo-price-grid > div:nth-child(3) { border-left:0; border-top:1px solid var(--line); }.seo-price-grid > div:nth-child(4) { border-top:1px solid #333; }.seo-content,.seo-code { gap:46px; }.seo-guide-sections article > div { grid-template-columns:1fr; gap:24px; }.seo-related > div,.seo-directory-grid { grid-template-columns:1fr 1fr; }.seo-related a:nth-child(odd),.seo-directory-grid a:nth-child(odd) { border-left:0; }.seo-related a:nth-child(-n+4),.seo-directory-grid a:nth-child(-n+4) { border-top:1px solid var(--line); }.seo-related a:nth-child(-n+2),.seo-directory-grid a:nth-child(-n+2) { border-top:0; } }
@media (max-width:560px) { .seo-nav { width:calc(100% - 30px); min-height:72px; }.seo-logo img { width:132px; }.seo-nav-cta { padding:11px 14px; }.seo-hero { width:calc(100% - 36px); padding:70px 0 54px; }.seo-hero h1 { font-size:3rem; }.seo-lead { margin-top:30px; gap:28px; }.seo-lead .seo-button { width:100%; }.seo-price-grid { grid-template-columns:1fr; }.seo-price-grid > div { min-height:140px; border-left:0; border-top:1px solid var(--line); }.seo-price-grid > div:first-child { border-top:0; }.seo-content,.seo-guide-sections,.seo-related,.seo-directory { width:calc(100% - 36px); padding-top:74px; padding-bottom:74px; }.seo-guide-sections article { grid-template-columns:35px 1fr; padding:38px 0; }.seo-code { padding:70px 18px; }.seo-code pre { padding:22px; }.seo-faq { width:calc(100% - 36px); padding:80px 0; }.seo-related > div,.seo-directory-grid { grid-template-columns:1fr; }.seo-related a,.seo-directory-grid a { border-left:0; border-top:1px solid var(--line)!important; }.seo-related a:first-child,.seo-directory-grid a:first-child { border-top:0!important; }.seo-footer { grid-template-columns:1fr; }.seo-footer > div:nth-child(2) { grid-template-columns:1fr; } }
