/* seo.css: extra styles for the SEO pages. Loaded after style.css. */

/* ---- hero ---- */
.seo-hero{background:var(--cream-alt,#f3ede3);border-bottom:1px solid var(--gold-light,#e6d3a3);padding:clamp(36px,6vw,72px) 0 clamp(36px,6vw,64px)}
.seo-hero h1{font-family:"Poppins",sans-serif;font-weight:800;font-size:clamp(2rem,5vw,3.25rem);line-height:1.12;color:var(--ink,#1f1c1a);margin:18px 0 16px;max-width:22ch}
.seo-hero-sub{font-size:clamp(1rem,2vw,1.15rem);line-height:1.65;max-width:62ch;margin:0}
.seo-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* ---- breadcrumbs ---- */
.seo-crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-size:.9rem}
.seo-crumbs li+li::before{content:"/";margin-right:6px;opacity:.5}
.seo-crumbs a{color:inherit;text-decoration:underline;text-decoration-color:var(--gold,#b8892b);text-underline-offset:3px}

/* ---- sections ---- */
.seo-section{padding:clamp(40px,6vw,72px) 0}
.seo-section--alt{background:var(--cream-alt,#f3ede3)}
.seo-section h2{font-family:"Poppins",sans-serif;font-weight:700;font-size:clamp(1.5rem,3.2vw,2.1rem);line-height:1.2;color:var(--ink,#1f1c1a);margin:0 0 18px}
.seo-lead{max-width:62ch;margin:-4px 0 22px;line-height:1.65}
.seo-prose{max-width:72ch}
.seo-prose p{margin:0 0 16px;line-height:1.75}
.seo-prose a,.seo-faq a,.seo-inline-links a{color:inherit;text-decoration:underline;text-decoration-color:var(--gold,#b8892b);text-underline-offset:3px}

/* ---- cards ---- */
.seo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.seo-card{background:#fff;border:1px solid var(--gold-light,#e6d3a3);border-radius:10px;padding:22px}
.seo-card h3{font-family:"Poppins",sans-serif;font-weight:700;font-size:1.05rem;color:var(--ink,#1f1c1a);margin:0 0 8px}
.seo-card p{margin:0;line-height:1.65}

/* ---- ordered steps (real sequences only) ---- */
.seo-steps{list-style:none;margin:0;padding:0;counter-reset:seo-step;max-width:780px}
.seo-steps li{counter-increment:seo-step;position:relative;padding:0 0 22px 56px;display:flex;flex-direction:column;gap:4px}
.seo-steps li::before{content:counter(seo-step);position:absolute;left:0;top:0;width:36px;height:36px;border-radius:50%;background:var(--gold,#b8892b);color:#fff;font-family:"Poppins",sans-serif;font-weight:700;display:flex;align-items:center;justify-content:center}
.seo-steps li::after{content:"";position:absolute;left:17px;top:40px;bottom:6px;width:2px;background:var(--gold-light,#e6d3a3)}
.seo-steps li:last-child::after{display:none}
.seo-steps strong{font-family:"Poppins",sans-serif;font-weight:700;color:var(--ink,#1f1c1a);line-height:1.35;padding-top:6px}
.seo-steps span{line-height:1.65}

/* ---- checklist ---- */
.seo-checklist{list-style:none;margin:0;padding:0;max-width:780px}
.seo-checklist li{position:relative;padding:0 0 12px 34px;line-height:1.6}
.seo-checklist li::before{content:"";position:absolute;left:4px;top:.35em;width:11px;height:6px;border-left:2.5px solid var(--gold,#b8892b);border-bottom:2.5px solid var(--gold,#b8892b);transform:rotate(-45deg)}

/* ---- FAQ ---- */
.seo-faq{max-width:780px}
.seo-faq details{border-bottom:1px solid var(--gold-light,#e6d3a3);padding:4px 0}
.seo-faq summary{cursor:pointer;font-family:"Poppins",sans-serif;font-weight:500;color:var(--ink,#1f1c1a);padding:14px 0;line-height:1.4}
.seo-faq p{margin:0 0 16px;line-height:1.7;max-width:68ch}

/* ---- related links ---- */
.seo-related{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.seo-related li{border-left:3px solid var(--gold,#b8892b);padding:2px 0 2px 16px;display:flex;flex-direction:column;gap:4px}
.seo-related a{font-family:"Poppins",sans-serif;font-weight:700;color:var(--ink,#1f1c1a);text-decoration:none}
.seo-related a:hover{text-decoration:underline}
.seo-related span{line-height:1.5;font-size:.95rem}

/* ---- closing call to action ---- */
.seo-cta{background:var(--ink,#1f1c1a);color:var(--cream,#fbf8f2);padding:clamp(36px,6vw,64px) 0}
.seo-cta-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.seo-cta h2{font-family:"Poppins",sans-serif;font-weight:700;font-size:clamp(1.4rem,3vw,2rem);margin:0 0 8px;color:var(--cream,#fbf8f2)}
.seo-cta p{margin:0;max-width:52ch;line-height:1.6}
.seo-cta .seo-actions{margin-top:0}
.seo-cta .btn-ghost{color:var(--cream,#fbf8f2);border-color:var(--cream,#fbf8f2)}

/* ---- footer links ---- */
.seo-footer-nav{width:100%;flex-basis:100%;border-top:1px solid rgba(255,255,255,.16);padding:18px 0 24px}
.seo-footer-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px}
.seo-footer-nav a{color:var(--gold-light,#e6d3a3);text-decoration:none;font-size:.92rem}
.seo-footer-nav a:hover{text-decoration:underline}

/* ---- links added to the home page ---- */
.seo-more{display:inline-block;margin-top:12px;font-weight:600;color:var(--ink,#1f1c1a);text-decoration:underline;text-decoration-color:var(--gold,#b8892b);text-underline-offset:4px}
.seo-inline-links{margin-top:18px;line-height:1.8}

/* ---- keyboard focus ---- */
.seo-page a:focus-visible,.seo-page summary:focus-visible,.seo-page button:focus-visible,.seo-more:focus-visible{outline:3px solid var(--gold,#b8892b);outline-offset:3px}

/* ---- mobile menu on SEO pages ---- */
body.seo-page .header-inner{position:relative}
@media (max-width:900px){
  body.seo-page .main-nav.nav-open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;z-index:60;gap:2px;padding:10px 20px 18px;background:var(--cream,#fbf8f2);border-bottom:1px solid var(--gold-light,#e6d3a3);box-shadow:0 14px 24px rgba(0,0,0,.08)}
  body.seo-page .main-nav.nav-open a{padding:12px 0}
}