:root {
  --navy: #071b4d; --text: #12304f; --muted: #5d7190; --blue: #1266f1; --blue-dark: #0755d8; --teal: #13a8a4;
  --green: #28c084; --indigo: #4f5bd5; --purple: #8166d8; --red: #f25565; --orange: #ff9458; --pink: #d95eb5;
  --line: #d9e6f3; --footer: #092441; --radius: 22px; --shadow: 0 18px 45px rgba(7, 27, 77, 0.08); --max: 1240px;
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:#fff} a{color:inherit}
.site-header{height:74px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;gap:28px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96);position:sticky;top:0;z-index:50;backdrop-filter:blur(16px)}
.brand,.footer-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none}.brand-mark{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:white;font-weight:900;background:linear-gradient(135deg,var(--blue),var(--teal));box-shadow:0 12px 24px rgba(18,102,241,.22)}
.brand strong,.footer-brand strong{display:block;color:var(--navy);font-size:1.2rem;letter-spacing:-.03em}.brand small,.footer-brand small{display:block;color:var(--muted);font-size:.8rem;margin-top:-2px}
.main-nav{display:flex;align-items:center;gap:clamp(16px,2.4vw,30px);font-weight:800;color:var(--navy)}.main-nav a,.nav-search{text-decoration:none}.main-nav a:hover{color:var(--blue)}
.nav-search{background:var(--blue);color:white;font-weight:800;padding:12px 22px;border-radius:999px;box-shadow:0 12px 28px rgba(18,102,241,.25)}
.section,.split-section,.bottom-grid,.content-section{max-width:var(--max);margin:0 auto;padding:16px clamp(20px,4vw,32px)}.split-section{display:grid;grid-template-columns:1fr 1fr;gap:36px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.section-heading h2{margin:0;color:var(--navy);font-size:1.3rem;letter-spacing:-.03em}.section-heading a{color:var(--blue);text-decoration:none;font-weight:900;font-size:.9rem}
.compact-card-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.compact-card,.category-card,.benefit-card,.example-card,.listing-card,.category-list-card,.subcategory-card,.content-panel,.fact-panel{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 28px rgba(7,27,77,.055)}
.compact-card{min-height:118px;padding:12px 10px;text-align:center;text-decoration:none;display:grid;justify-items:center;gap:5px}.compact-card strong{color:var(--navy);font-size:.85rem}.compact-card small{color:var(--text);font-size:.68rem;line-height:1.35}.icon,.category-icon{display:grid;place-items:center;border-radius:50%;font-weight:900}.icon{width:46px;height:46px;font-size:1.3rem}.category-icon{width:44px;height:44px;font-size:1.35rem}
.green{background:#dcf8ed;color:var(--green)}.blue{background:#e3efff;color:var(--blue)}.purple{background:#eee9ff;color:var(--purple)}.indigo{background:#eaedff;color:var(--indigo)}.red{background:#ffe5e8;color:var(--red)}.orange{background:#fff0e6;color:var(--orange)}.teal{background:#dff8f7;color:var(--teal)}.pink{background:#ffe8f7;color:var(--pink)}
.category-row{display:grid;grid-template-columns:repeat(10,1fr);gap:12px}.category-card{min-height:82px;padding:12px 10px;text-decoration:none;display:grid;justify-items:center;align-items:center;text-align:center}.category-card strong{color:var(--navy);font-size:.82rem}
.page-hero{background:linear-gradient(180deg,#f5f9ff,#fff);border-bottom:1px solid var(--line);padding:clamp(56px,7vw,92px) clamp(20px,5vw,72px)}.page-hero>*{max-width:var(--max);margin-left:auto;margin-right:auto}.eyebrow{margin-top:0;margin-bottom:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.14em;font-weight:900;font-size:.8rem}.page-hero h1{margin-top:0;margin-bottom:14px;color:var(--navy);font-size:clamp(2.6rem,5.2vw,4.4rem);line-height:.96;letter-spacing:-.06em}.page-hero p{max-width:720px;color:var(--muted);font-size:1.12rem;line-height:1.65}
.listing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:20px;padding-bottom:30px}.listing-card{min-height:188px;padding:22px;text-decoration:none;display:grid;align-content:start;gap:10px}.listing-card-top{display:flex;align-items:start;justify-content:space-between;gap:12px}.listing-card-top strong{color:var(--navy);font-size:1.2rem}.listing-card-top span{border-radius:999px;padding:5px 9px;background:#e8f2ff;color:var(--blue);font-size:.72rem;font-weight:900}.listing-card p{margin:0;color:var(--muted);line-height:1.5}.listing-card .listing-main{color:var(--navy);font-weight:900}.tag-row-small{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.tag-row-small em{font-style:normal;border-radius:999px;padding:4px 8px;background:#f3f7fc;color:var(--muted);font-size:.72rem;font-weight:800}
.category-list-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;padding-top:20px;padding-bottom:30px}.category-list-card{display:grid;grid-template-columns:60px 1fr;gap:16px;align-items:start;padding:22px;text-decoration:none}.category-list-card strong{display:block;color:var(--navy);font-size:1.15rem}.category-list-card p{margin:6px 0;color:var(--muted)}.category-list-card small{color:var(--blue);font-weight:900}
.subcategory-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;padding-bottom:12px}.subcategory-card{padding:18px;text-decoration:none}.subcategory-card strong{color:var(--navy);display:block;margin-bottom:8px}.subcategory-card p{margin:0;color:var(--muted);font-size:.88rem;line-height:1.45}
.entry-hero{max-width:var(--max);margin:0 auto;padding:clamp(46px,7vw,76px) clamp(20px,4vw,32px) 28px;display:flex;align-items:end;justify-content:space-between;gap:28px;border-bottom:1px solid var(--line)}.entry-hero h1{margin:0;color:var(--navy);font-size:clamp(3rem,7vw,5.4rem);line-height:.92;letter-spacing:-.07em}.entry-hero p{color:var(--muted);font-size:1.15rem}.entry-tags{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.entry-tags a,.entry-tags span{text-decoration:none;border-radius:999px;color:var(--blue);background:#e8f2ff;padding:8px 12px;font-weight:900;font-size:.85rem}.entry-tags span{color:var(--muted);background:#eef2f7}
.entry-layout{max-width:var(--max);margin:0 auto;padding:clamp(30px,5vw,56px) clamp(20px,4vw,32px);display:grid;grid-template-columns:1fr 340px;gap:28px}.content-panel{padding:clamp(24px,4vw,42px)}.content-panel.standalone{max-width:var(--max);margin:clamp(30px,5vw,56px) auto}.prose{color:#2f4155;font-size:1.06rem;line-height:1.75}.prose h2,.prose h3{color:var(--navy);letter-spacing:-.03em}.prose .lead{color:var(--navy);font-size:1.25rem;font-weight:800}.expansion-box{background:#effaf9;border:1px solid #c7eeeb;border-radius:16px;padding:18px;margin-bottom:24px}.expansion-box strong{color:var(--teal);text-transform:uppercase;letter-spacing:.08em;font-size:.78rem}.expansion-box p{margin-bottom:0;color:var(--navy);font-weight:900}.fact-panel{padding:22px;align-self:start}.fact-panel div{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:16px;display:grid;gap:6px}.fact-panel div:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0}.fact-panel strong{color:var(--navy)}.fact-panel span{color:var(--muted)}.fact-panel .safety{background:#f2fbf8;border:1px solid #c7efe5;border-radius:15px;padding:14px}.empty-state{padding:42px;text-align:center;background:#f8fbff;border:1px dashed #adc9ec;border-radius:var(--radius)}
.site-footer{margin-top:18px;background:radial-gradient(circle at 82% 45%,rgba(19,168,164,.22),transparent 22%),var(--footer);color:#d7e5f3;padding:32px clamp(20px,5vw,72px) 18px}.footer-inner{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1.35fr .8fr .8fr 1fr;gap:42px}.footer-brand strong{color:white}.footer-brand small,.site-footer p,.site-footer a{color:#bed0e3}.site-footer p{max-width:340px;line-height:1.65}.site-footer h3{margin:0 0 12px;color:white}.site-footer a{display:block;text-decoration:none;margin:7px 0}.social-row{display:flex;gap:12px;margin-top:12px}.social-row span{color:white;font-weight:900}.footer-map{min-height:120px;border-radius:20px;opacity:.9;display:grid;place-items:center;background:radial-gradient(circle,rgba(255,255,255,.2) 1px,transparent 1px);background-size:12px 12px}.footer-map span{width:72px;height:72px;display:grid;place-items:center;color:var(--teal);border:2px solid rgba(19,168,164,.5);border-radius:50%;font-size:2rem}.footer-bottom{max-width:var(--max);margin:24px auto 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.14);display:flex;justify-content:space-between;gap:16px;color:#bed0e3;font-size:.86rem}
@media(max-width:1100px){.main-nav{display:none}.hero{grid-template-columns:1fr}.hero-art{min-height:360px}.split-section,.bottom-grid,.entry-layout{grid-template-columns:1fr}.category-row{grid-template-columns:repeat(5,1fr)}.listing-grid{grid-template-columns:repeat(2,1fr)}.subcategory-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.site-header{height:auto;align-items:flex-start;padding-top:16px;padding-bottom:16px}.brand small{max-width:160px}.nav-search{padding:10px 14px}.hero-copy h1{font-size:2.65rem}.feature-strip{grid-template-columns:1fr 1fr;border-radius:22px}.feature-strip a{border-bottom:1px solid var(--line)}.compact-card-grid,.category-row,.benefit-grid,.example-columns,.footer-inner,.category-list-grid{grid-template-columns:1fr 1fr}.hero-demo-card{right:18px;width:230px}.globe{left:42%;width:260px;height:260px}.footer-map{display:none}.entry-hero{display:block}.entry-tags{justify-content:flex-start;margin-top:16px}}
@media(max-width:560px) {
  .hero-search {
    grid-template-columns: auto 1fr;
    height: auto;
    padding: 10px 12px;
  }

  .hero-search button {
    grid-column: 1 / -1;
    width: 100%;
  }
}
@media(max-width:520px){.compact-card-grid,.category-row,.benefit-grid,.example-columns,.footer-inner,.footer-bottom,.listing-grid,.category-list-grid,.subcategory-grid{grid-template-columns:1fr}.footer-bottom{display:grid}.hero-art{display:none}.btn{width:100%}}
.search-panel {
  max-width: 900px;
  margin: 0 auto 48px;
  padding: clamp(22px, 4vw, 36px);
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

pagefind-searchbox {
  display: block;
  margin-bottom: 24px;
}

pagefind-results {
  display: block;
}

pagefind-searchbox input {
  width: 100%;
  min-height: 56px;
  border: 1px solid #cddced;
  border-radius: 14px;
  padding: 0 18px;
  font: inherit;
  color: var(--text);
  box-shadow: 0 12px 30px rgba(7, 27, 77, 0.06);
}

pagefind-searchbox input:focus {
  outline: 3px solid rgba(18, 102, 241, 0.16);
  border-color: var(--blue);
}
.hero-search {
  max-width: 580px;
  min-height: 56px;
  height: auto;
  margin: 24px 0 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 8px 10px 8px 18px;
  background: #ffffff;
  border: 1px solid #cddced;
  border-radius: 12px;
  box-shadow: 0 15px 36px rgba(7, 27, 77, 0.08);
}

.hero-search span {
  color: var(--muted);
  font-size: 1.25rem;
  line-height: 1;
}

.hero-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 1rem;
  color: var(--text);
}

.hero-search input::placeholder {
  color: #7a8ca5;
}

.hero-search button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 18px;
  border: 0;
  border-radius: 10px;
  background: var(--blue);
  color: #ffffff;
  font: inherit;
  font-weight: 900;
  cursor: pointer;
  white-space: nowrap;
}

.hero-search button:hover {
  background: var(--blue-dark);
}

.hero-search button:focus-visible,
.hero-search input:focus-visible {
  outline: 3px solid rgba(18, 102, 241, 0.18);
  outline-offset: 2px;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 20px;
}
/* Browse and A-Z filters */

.filter-panel {
  display: grid;
  grid-template-columns: 180px 220px 1fr;
  gap: 14px;
  align-items: end;
  margin: 10px 0 24px;
  padding: 18px;
  background: #f8fbff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 10px 26px rgba(7, 27, 77, 0.045);
}

.filter-group {
  display: grid;
  gap: 7px;
}

.filter-group label {
  color: var(--navy);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.filter-group select,
.filter-group input {
  width: 100%;
  min-height: 44px;
  border: 1px solid #cddced;
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  font: inherit;
  padding: 0 12px;
}

.filter-group select:focus,
.filter-group input:focus {
  outline: 3px solid rgba(18, 102, 241, 0.15);
  border-color: var(--blue);
}

.filter-empty {
  margin: 24px 0 48px;
  padding: 24px;
  text-align: center;
  color: var(--muted);
  background: #f8fbff;
  border: 1px dashed #adc9ec;
  border-radius: var(--radius);
}

/* A-Z list layout */

.az-list {
  max-height: 720px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
}

.az-row {
  min-height: 74px;
  padding: 14px 18px;
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 20px;
  align-items: center;
  text-decoration: none;
  border-bottom: 1px solid var(--line);
}

.az-row:last-child {
  border-bottom: 0;
}

.az-row:hover {
  background: #f8fbff;
}

.az-main {
  display: grid;
  gap: 4px;
}

.az-main strong {
  color: var(--navy);
  font-size: 1.05rem;
}

.az-main span {
  color: var(--muted);
  line-height: 1.45;
}

.az-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  color: var(--muted);
  font-size: 0.84rem;
  text-align: right;
}

.az-type {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 5px 9px;
  background: #e8f2ff;
  color: var(--blue);
  font-weight: 900;
}

.filter-item[hidden] {
  display: none !important;
}

@media (max-width: 900px) {
  .filter-panel {
    grid-template-columns: 1fr;
  }

  .az-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .az-meta {
    justify-content: flex-start;
    text-align: left;
    flex-wrap: wrap;
  }
}

/* ---------------------------------------------------------------
   Homepage: the chart layout
   Replaces the old hero + feature strip + benefit grid.
   --------------------------------------------------------------- */

:root { --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.home-head {
  max-width: var(--max);
  margin: 0 auto;
  padding: clamp(34px, 5vw, 60px) clamp(20px, 4vw, 32px) clamp(18px, 2.5vw, 26px);
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 3vw, 30px);
}
.home-intro h1 {
  margin: 0 0 12px;
  color: var(--navy);
  font-size: clamp(2rem, 4.2vw, 3.05rem);
  line-height: 1.04;
  letter-spacing: -.045em;
  max-width: 22ch;
  text-wrap: balance;
}
.home-intro > p {
  margin: 0;
  max-width: 56ch;
  color: var(--muted);
  font-size: 1.04rem;
  line-height: 1.6;
}
.home-search {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 540px;
  margin: 22px 0 10px;
  padding: 4px 4px 4px 16px;
  background: #fff;
  border: 1px solid #c6d3e2;
  border-radius: 8px;
}
.home-search span { color: var(--muted); font-size: 1.15rem; line-height: 1; }
.home-search input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
  padding: 11px 0; font: inherit; font-size: .95rem; color: var(--text);
}
.home-search button {
  border: 0; cursor: pointer; font: inherit; font-weight: 800; font-size: .88rem;
  padding: 11px 20px; border-radius: 6px; background: var(--blue); color: #fff;
}
.home-search button:hover { background: var(--blue-dark); }
.home-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(18,102,241,.14); }
.home-hint { margin: 0; color: var(--muted); font-size: .86rem; }
.home-hint a { color: var(--blue); font-weight: 700; text-decoration: none; }
.home-hint a:hover { text-decoration: underline; }

.home-tally {
  margin: 0; display: flex; flex: none; justify-self: end;
  border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff;
}
.home-tally > div { padding: 12px 22px; border-right: 1px solid var(--line); text-align: right; }
.home-tally > div:last-child { border-right: 0; }
.home-tally dt {
  order: 2; margin-top: 3px; color: var(--muted);
  font-size: .66rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
}
.home-tally dd {
  order: 1; margin: 0; color: var(--navy);
  font-family: var(--mono); font-variant-numeric: tabular-nums;
  font-size: 1.4rem; font-weight: 600; letter-spacing: -.02em;
}
.home-tally > div { display: flex; flex-direction: column; }

.home-chart {
  max-width: var(--max);
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 32px);
  overflow-x: auto;
}
.chart-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.chart-table th {
  text-align: left; padding: 0 12px 9px; border-bottom: 1px solid var(--navy);
  color: var(--muted); font-size: .66rem; font-weight: 800;
  letter-spacing: .13em; text-transform: uppercase; white-space: nowrap;
}
.chart-table td { padding: 11px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.chart-table tbody tr { position: relative; }
.chart-table tbody tr:hover { background: #f6f9fd; }
.chart-table th.c, .chart-table td.c { width: 4px; padding-left: 0; padding-right: 0; }
.chart-table .bar { display: block; width: 4px; height: 22px; border-radius: 2px; background: currentColor; }
.chart-table td.t { white-space: nowrap; }
.chart-table td.t a {
  color: var(--navy); font-weight: 800; text-decoration: none;
}
.chart-table td.t a::after { content: ""; position: absolute; inset: 0; }
.chart-table tbody tr:hover td.t a { color: var(--blue); }
.chart-table td.t a:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.chart-table td.cov { color: var(--muted); }
.chart-table td.hl { color: var(--muted); font-family: var(--mono); font-size: .8rem; }
.chart-table th.n, .chart-table td.n {
  text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums;
  color: var(--navy); font-weight: 600; white-space: nowrap;
}
.chart-foot { margin: 14px 0 0; color: var(--muted); font-size: .86rem; }
.chart-foot a { color: var(--blue); font-weight: 800; text-decoration: none; }
.chart-foot a:hover { text-decoration: underline; }

.home-about .about-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px 28px; }
.home-about .about-grid h3 {
  margin: 0 0 7px; color: var(--navy); font-size: .95rem; letter-spacing: -.02em;
  padding-top: 12px; border-top: 2px solid var(--navy);
}
.home-about .about-grid p { margin: 0; color: var(--muted); font-size: .88rem; line-height: 1.55; }

@media (max-width: 1100px) {
  .home-tally { justify-self: stretch; }
  .chart-table td.hl { display: none; }
  .chart-table th.hl { display: none; }
  .home-about .about-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .chart-table td.cov, .chart-table th.cov { display: none; }
  .home-tally { width: 100%; }
  .home-tally > div { flex: 1; padding: 11px 12px; }
}
@media (max-width: 520px) {
  .home-about .about-grid { grid-template-columns: 1fr; }
  .home-search { flex-wrap: wrap; padding: 10px 12px; }
  .home-search button { width: 100%; }
}
