:root{
  --teal-950:#0b211f;
  --teal-900:#0f2e2b;
  --teal-800:#153f3a;
  --teal-700:#1f6b62;
  --gold-600:#a86a1f;
  --gold-500:#c98a2c;
  --gold-400:#e0a94a;
  --gold-200:#f3d9a3;
  --sand-100:#fbf7ee;
  --sand-200:#f3e7d2;
  --ink:#122421;
  --ink-soft:#3a524d;
  --white:#ffffff;
  --line:#e3d6b8;
  --ok:#2f8f57;
  --warn:#b4552f;
  --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--sand-100);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;line-height:1.55}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.skip-link{position:absolute;left:-999px;top:0;background:var(--teal-900);color:#fff;padding:10px 16px;z-index:200}
.skip-link:focus{left:12px;top:12px}

/* header */
.site-header{position:sticky;top:0;z-index:80;background:var(--teal-900);border-bottom:3px solid var(--gold-500)}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 20px;height:64px;max-width:1080px;margin:0 auto}
.wordmark{display:flex;align-items:center;gap:8px;text-decoration:none}
.wordmark .glyph{width:34px;height:34px;border-radius:9px;background:var(--gold-500);color:var(--teal-950);font-weight:900;display:flex;align-items:center;justify-content:center;font-size:17px}
.wordmark .name{color:#fbf7ee;font-weight:800;font-size:19px}
.wordmark .tag{display:block;color:var(--gold-400);font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:700}
.desktop-nav{display:none;gap:20px;font-size:14px;font-weight:600}
.desktop-nav a{color:#dfe9e5;text-decoration:none}
.desktop-nav a:hover,.desktop-nav a[aria-current]{color:var(--gold-400)}
.header-actions{display:flex;align-items:center;gap:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:999px;padding:9px 16px;font-weight:700;font-size:13.5px;text-decoration:none;cursor:pointer;border:1px solid transparent;white-space:nowrap}
.btn-solid{background:var(--gold-500);color:var(--teal-950);border-color:var(--gold-500)}
.btn-solid:hover{filter:brightness(1.06)}
.btn-ghost{background:transparent;color:#fbf7ee;border-color:#3a5450}
.btn-block{width:100%}
.burger{display:flex;flex-direction:column;justify-content:center;gap:4px;width:38px;height:36px;background:transparent;border:1px solid #3a5450;border-radius:8px;cursor:pointer}
.burger span,.burger::before,.burger::after{content:"";display:block;height:2px;background:#fbf7ee;border-radius:2px;margin:0 8px}
@media (min-width:900px){.desktop-nav{display:flex}.burger{display:none}}

/* mobile nav */
.mobile-nav{position:fixed;inset:0;z-index:150;visibility:hidden}
.mobile-nav .backdrop{position:absolute;inset:0;background:rgba(11,33,31,.6);opacity:0}
.mobile-nav .panel{position:absolute;top:0;right:0;height:100%;width:82%;max-width:320px;background:var(--teal-900);transform:translateX(100%);transition:transform .25s ease;padding:16px;display:flex;flex-direction:column;gap:4px}
.mobile-nav.is-open{visibility:visible}
.mobile-nav.is-open .backdrop{opacity:1;transition:opacity .2s}
.mobile-nav.is-open .panel{transform:translateX(0)}
.panel-top{display:flex;justify-content:flex-end;margin-bottom:10px}
.close-btn{background:transparent;border:1px solid #3a5450;color:#fbf7ee;border-radius:8px;width:34px;height:34px;cursor:pointer}
.mnav-link{color:#fbf7ee;text-decoration:none;padding:12px 8px;border-bottom:1px solid #1b433d;font-weight:600}
.mnav-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}

/* hero: gold banner with step-0 badge, no dark gradient like main */
.hero{background:linear-gradient(135deg,var(--gold-200),var(--sand-100) 60%);border-bottom:1px solid var(--line)}
.hero-inner{max-width:1080px;margin:0 auto;padding:44px 20px 34px;display:grid;gap:22px}
.hero-kicker{display:inline-flex;align-items:center;gap:8px;background:var(--teal-900);color:var(--gold-300,#f3d9a3);font-weight:700;font-size:12.5px;padding:6px 12px;border-radius:999px;width:max-content}
.hero h1{font-size:clamp(26px,4.4vw,40px);margin:14px 0 10px;color:var(--teal-950);line-height:1.15}
.hero-lede{font-size:16px;color:var(--ink-soft);max-width:680px;margin:0 0 18px}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px}
.hero-strip{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:20px;font-size:13.5px;color:var(--teal-800);font-weight:600}
.hero-strip .dot{width:7px;height:7px;border-radius:50%;background:var(--gold-500);display:inline-block;margin-right:6px}

/* two-column guide layout: sticky steps rail + article */
.guide-layout{display:grid;gap:26px;padding:36px 0 10px;max-width:1080px;margin:0 auto;padding-left:20px;padding-right:20px}
@media (min-width:860px){.guide-layout{grid-template-columns:250px 1fr}}
.rail{align-self:start}
@media (min-width:860px){.rail{position:sticky;top:80px}}
.rail-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:16px}
.rail-title{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);font-weight:800;margin:0 0 10px}
.rail-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.rail-list a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-size:13.5px;font-weight:600;padding:8px 6px;border-radius:8px}
.rail-list a:hover{background:var(--sand-200)}
.rail-num{width:22px;height:22px;border-radius:50%;background:var(--teal-900);color:#fbf7ee;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none}

.guide-article h2{font-size:clamp(20px,2.6vw,26px);margin:34px 0 12px;color:var(--teal-950)}
.guide-article h2:first-child{margin-top:0}
.guide-article h3{font-size:17px;margin:18px 0 6px;color:var(--teal-900)}
.guide-article p{margin:0 0 14px;color:var(--ink)}
.guide-article a{color:var(--gold-600);font-weight:700;text-decoration:underline}
.guide-article table{width:100%;border-collapse:collapse;margin:14px 0 18px;font-size:14px}
.guide-article th,.guide-article td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line)}
.guide-article th{background:var(--sand-200);font-size:12.5px;text-transform:uppercase;letter-spacing:.04em}
.table-scroll{overflow-x:auto}

/* step timeline visual */
.steps{list-style:none;margin:16px 0 24px;padding:0;counter-reset:step}
.step-item{display:grid;grid-template-columns:38px 1fr;gap:14px;padding:0 0 18px;position:relative}
.step-item::before{counter-increment:step;content:counter(step);width:38px;height:38px;border-radius:50%;background:var(--teal-900);color:var(--gold-400);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px}
.step-item::after{content:"";position:absolute;left:19px;top:38px;bottom:0;width:2px;background:var(--line)}
.step-item:last-child::after{display:none}
.step-body p{margin:2px 0 0}
.step-body .step-h{font-weight:800;font-size:15.5px;margin:6px 0 4px;color:var(--teal-950)}

.callout{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--gold-500);border-radius:10px;padding:14px 16px;margin:16px 0;font-size:14.5px}
.callout.warn{border-left-color:var(--warn)}

.quickfacts{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:16px 0 22px}
@media (min-width:520px){.quickfacts{grid-template-columns:repeat(4,1fr)}}
.qf-card{background:var(--white);border:1px solid var(--line);border-radius:12px;padding:14px 12px;text-align:center}
.qf-num{font-weight:800;font-size:19px;color:var(--teal-900)}
.qf-cap{font-size:11.5px;color:var(--ink-soft);margin-top:3px}

/* FAQ accordion */
.faq-list{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.faq-item{background:var(--white);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.faq-q{width:100%;text-align:left;background:transparent;border:0;padding:14px 16px;font-weight:700;font-size:14.5px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--ink)}
.fa-ico{color:var(--gold-600);font-weight:900}
.faq-a{max-height:0;overflow:hidden;transition:max-height .2s ease;padding:0 16px}
.faq-a p{margin:0 0 14px;font-size:14px;color:var(--ink-soft)}

/* cta banner */
.cta-banner{background:var(--teal-900);border-radius:16px;padding:26px 22px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin:28px 0}
.cta-banner p{margin:0;color:#fbf7ee}
.cta-title{font-weight:800;font-size:19px}
.cta-sub{color:#c8d8d4;font-size:14px;margin-top:4px}

/* footer */
.site-footer{background:var(--teal-950);color:#cfe0dc;margin-top:40px}
.footer-grid{display:grid;gap:26px;padding:36px 0 18px}
@media (min-width:720px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr}}
.fb-name{color:#fff;font-weight:800;font-size:17px;margin:0 0 8px}
.fb-desc{font-size:13.5px;color:#a9c2bc;max-width:420px}
.fc-title{color:#fff;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em;margin:0 0 10px}
.footer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.footer-links a{color:#a9c2bc;text-decoration:none;font-size:14px}
.footer-links a:hover{color:var(--gold-400)}
.footer-rg{display:flex;align-items:flex-start;gap:12px;padding:16px 0;border-top:1px solid #163a35;font-size:12.5px;color:#a9c2bc}
.age-badge{flex:none;width:34px;height:34px;border-radius:8px;background:var(--gold-500);color:var(--teal-950);font-weight:900;display:flex;align-items:center;justify-content:center;font-size:12px}
.copyright{font-size:12px;color:#7d9994;padding-bottom:24px;margin:0}

/* mobile-overflow fix */
html{overflow-x:clip}
@media (max-width:400px){.header-actions{gap:6px}.header-actions .btn{padding:8px 10px;font-size:12.5px}}