/* ============================================================
   African American Genealogy Hub — Shared Component Styles (v29)
   Loaded by every state, county, and hub page. Any page that
   links this file inherits the v29 design automatically.
   ============================================================ */
:root{
  --aag-indigo:#22304C; --aag-indigo-deep:#1A2438; --aag-paper:#FBFAF6;
  --aag-linen:#F2F0E9; --aag-haint:#8FB0AC; --aag-haint-soft:#E3ECEA;
  --aag-ochre:#C9971C; --aag-ink:#26261F; --aag-muted:#6B6A61;
  --aag-green:#173f36; --aag-clay:#a8583c;
}

/* ---------- Research Access Legend ---------- */
.aag-legend{background:var(--aag-paper);border:1px solid #DAD6C9;border-left:5px solid var(--aag-ochre);border-radius:4px;padding:18px 20px;margin:22px 0;font-family:'Archivo','DM Sans',Arial,sans-serif}
.aag-legend h3{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--aag-indigo);margin:0 0 10px;font-weight:600}
.aag-legend-items{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0;padding:0;list-style:none}
.aag-legend-items li{font-size:.84rem;color:var(--aag-ink);white-space:nowrap}
.aag-legend-items li small{color:var(--aag-muted);white-space:normal}
.aag-legend .aag-legend-stars{margin-top:10px;padding-top:10px;border-top:1px dashed #DAD6C9;font-size:.84rem;color:var(--aag-muted)}
.aag-stars{color:var(--aag-ochre);letter-spacing:.08em;font-size:.85rem}

/* ---------- Access + value badges on resource cards ---------- */
.aag-badge{display:inline-block;font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.68rem;letter-spacing:.08em;padding:3px 9px;border-radius:999px;border:1px solid #DAD6C9;background:var(--aag-paper);color:var(--aag-ink);margin:0 6px 6px 0;vertical-align:middle}
.aag-badge.acc-free{background:#E9F2E7;border-color:#BCD8B5}
.aag-badge.acc-account{background:#E7EEF6;border-color:#B9CBE2}
.aag-badge.acc-sub{background:#FBF0DA;border-color:#E4C888}
.aag-badge.acc-library{background:#F0EAF6;border-color:#CDBBE2}
.aag-badge.acc-visit{background:#F4F1EA;border-color:#D8D2C2}
.aag-badge.flag-best{background:var(--aag-ochre);border-color:var(--aag-ochre);color:#fff;font-weight:700}
.aag-badge.flag-wall{background:var(--aag-indigo);border-color:var(--aag-indigo);color:#fff;font-weight:700}
.aag-value{display:block;margin:6px 0 2px;font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.72rem;color:var(--aag-muted)}

/* ---------- "Why this record matters" teaching note ---------- */
.aag-why{margin-top:10px;padding:10px 12px;background:var(--aag-haint-soft);border-left:3px solid var(--aag-haint);border-radius:3px;font-size:.86rem;line-height:1.55;color:var(--aag-ink)}
.aag-why strong{font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--aag-indigo);display:block;margin-bottom:3px}

/* ---------- Genealogist's Tip callout ---------- */
.aag-tip{background:#FFF9EC;border:1px solid #E4C888;border-radius:6px;padding:16px 18px;margin:18px 0;line-height:1.6}
.aag-tip .aag-tip-label{font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#8a6510;font-weight:700;display:block;margin-bottom:6px}
.aag-tip p{margin:0;font-size:.95rem;color:var(--aag-ink)}

/* ---------- Standardized Start Here workflow ---------- */
.aag-workflow{background:var(--aag-indigo-deep);color:var(--aag-paper);border-radius:6px;padding:26px 26px 22px;margin:26px 0}
.aag-workflow h3{font-family:'Fraunces',Georgia,serif;font-size:1.35rem;margin:0 0 4px;color:#fff}
.aag-workflow>p{color:#AEB4C2;font-size:.92rem;margin:0 0 16px}
.aag-workflow ol{margin:0;padding:0;list-style:none;counter-reset:aagstep;display:grid;gap:12px}
.aag-workflow ol li{counter-increment:aagstep;position:relative;padding-left:44px;font-size:.93rem;line-height:1.55;color:#D9DCE4}
.aag-workflow ol li::before{content:counter(aagstep);position:absolute;left:0;top:1px;width:28px;height:28px;border-radius:50%;background:var(--aag-ochre);color:#fff;font-family:'Archivo','DM Sans',Arial,sans-serif;font-weight:700;font-size:.85rem;display:grid;place-items:center}
.aag-workflow ol li strong{color:#fff}
@media(min-width:760px){.aag-workflow ol{grid-template-columns:1fr 1fr}}

/* ---------- If You're Still Stuck ---------- */
.aag-stuck{background:var(--aag-indigo);color:var(--aag-paper);padding:56px 0 60px}
.aag-stuck .aag-wrap{max-width:1060px;margin:0 auto;padding:0 24px}
.aag-stuck .aag-eyebrow{font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--aag-haint);font-weight:600}
.aag-stuck h2{font-family:'Fraunces',Georgia,serif;font-size:1.9rem;margin:8px 0 10px;color:#fff}
.aag-stuck>.aag-wrap>p{max-width:64ch;color:#D9DCE4;line-height:1.65}
.aag-stuck-grid{display:grid;gap:14px;margin:24px 0 26px}
@media(min-width:760px){.aag-stuck-grid{grid-template-columns:1fr 1fr}}
.aag-stuck-step{background:var(--aag-indigo-deep);border:1px solid #33405e;border-radius:6px;padding:16px 18px}
.aag-stuck-step h3{font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--aag-ochre);margin:0 0 6px}
.aag-stuck-step p{margin:0;font-size:.9rem;line-height:1.55;color:#D9DCE4}
.aag-stuck-cta{display:inline-block;background:var(--aag-ochre);color:#1A2438;text-decoration:none;font-family:'Archivo','DM Sans',Arial,sans-serif;font-weight:700;font-size:.95rem;padding:14px 22px;border-radius:999px}
.aag-stuck-cta:hover{background:#dfae35;color:#1A2438}
.aag-stuck small{display:block;margin-top:12px;color:#AEB4C2}

/* ---------- Build Your Research Toolkit (homepage) ---------- */
.aag-toolkit-grid{display:grid;gap:16px;margin-top:26px}
@media(min-width:820px){.aag-toolkit-grid{grid-template-columns:repeat(3,1fr)}}
.aag-toolkit-card{background:var(--aag-paper);border:1px solid #DAD6C9;border-top:5px solid var(--aag-ochre);border-radius:6px;padding:20px}
.aag-toolkit-card h3{font-family:'Fraunces',Georgia,serif;font-size:1.15rem;color:var(--aag-indigo);margin:8px 0 8px}
.aag-toolkit-card p{font-size:.92rem;line-height:1.6;color:var(--aag-ink);margin:0 0 10px}
.aag-toolkit-card ul{margin:0;padding:0 0 0 2px;list-style:none;font-size:.9rem;line-height:1.7}
.aag-toolkit-card ul a{color:var(--aag-indigo)}
.aag-toolkit-step{display:inline-block;font-family:'Archivo','DM Sans',Arial,sans-serif;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:#fff;background:var(--aag-indigo);border-radius:999px;padding:4px 12px}
