/* Jefferson County Attorney — design tokens
   Every colour, font, space and radius used by the theme is declared here.
   Component CSS must reference these variables, never literal values.
   Ported verbatim from the jcao-static handoff; only the @font-face block
   below was changed, to self-host fonts instead of relying on the
   third-party Google Fonts <link> that the static markup used. */

:root {
  /* Colour */
  --navy: #1f2a44;
  --navy-deep: #161f36;
  --steel: #4a7ba7;
  --steel-dark: #35597c;
  --steel-light: #7ba6cc;
  --steel-tint: #eef3f8;
  --steel-tint-hover: #dfe9f3;
  --sand: #8a5f26;
  --sand-mid: #c99a55;
  --sand-tint: #f7f0e5;
  --sand-light: #f0d9b6;
  --green: #2f7d6a;
  --green-light: #68b39e;
  --green-tint: #e9f4f0;
  --alert: #b4552f;
  --alert-dark: #95431f;
  --alert-tint: #fbeee9;

  --ground: #f6f7f9;
  --ground-alt: #eef1f6;
  --surface: #ffffff;
  --surface-sunk: #f2f5f9;
  --surface-sunk-hover: #e3eaf3;

  --ink: #1c2333;
  --ink-2: #333c4f;
  --ink-3: #4d5567;
  --ink-4: #5a6376;
  --ink-5: #6b7385;
  --ink-6: #8a93a6;
  --ink-7: #9aa3b4;

  --rule: #e4e9f0;
  --rule-soft: #edf0f5;
  --rule-strong: #dde3ec;

  /* Type */
  --font-heading: "Barlow Condensed", "Arial Narrow", sans-serif;
  --font-body: "Public Sans", system-ui, -apple-system, sans-serif;

  /* Radius */
  --r-sm: 4.5px;
  --r-md: 5.5px;
  --r-lg: 8px;
  --r-xl: 10px;

  /* Elevation */
  --e-1: 0 1px 2px rgba(28,35,51,.06);
  --e-2: 0 1px 2px rgba(28,35,51,.06), 0 8px 24px rgba(28,35,51,.07);
  --e-3: 0 1px 2px rgba(28,35,51,.06), 0 10px 30px rgba(28,35,51,.08);
  --e-hover: 0 2px 6px rgba(28,35,51,.1), 0 16px 40px rgba(28,35,51,.13);

  /* Layout */
  --max: 1280px;
  --gutter: clamp(18px, 4vw, 48px);
  --section-y: clamp(46px, 5.6vw, 84px);
  --sidebar-w: 340px;
  --tap: 44px;
}

/* Self-hosted fonts. Place the licensed .woff2 files at the paths below —
   see fonts/README.md for exact filenames/weights and where to get them.
   local() keeps a same-named system font as an instant fallback while the
   webfont loads, and system-ui/-apple-system/sans-serif in the --font-*
   variables above is the final fallback if neither is available. */
@font-face {
  font-family: "Public Sans";
  src: local("Public Sans"),
       url("../fonts/public-sans/PublicSans-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: local("Public Sans Medium"),
       url("../fonts/public-sans/PublicSans-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: local("Public Sans SemiBold"),
       url("../fonts/public-sans/PublicSans-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: local("Public Sans Bold"),
       url("../fonts/public-sans/PublicSans-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: local("Public Sans Italic"),
       url("../fonts/public-sans/PublicSans-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: local("Barlow Condensed Medium"),
       url("../fonts/barlow-condensed/BarlowCondensed-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Barlow Condensed";
  src: local("Barlow Condensed SemiBold"),
       url("../fonts/barlow-condensed/BarlowCondensed-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Reset and base */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.5;
  text-wrap: pretty;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; }
h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 600; color: var(--navy); margin: 0; }
a { color: var(--steel-dark); text-underline-offset: 3px; }
a:hover { color: var(--navy); }
:focus-visible { outline: 2px solid var(--steel); outline-offset: 3px; border-radius: 4px; }
::selection { background: rgba(74,123,167,.25); }
address { font-style: normal; }
summary { list-style: none; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; animation: none !important; }
}

/* Shared utilities */
.jcao-container { max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.jcao-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.jcao-skip { position: absolute; left: -9999px; top: 0; padding: 12px 18px; background: var(--navy); color: #fff; font-family: var(--font-heading); border-radius: 0 0 var(--r-md) 0; z-index: 100; }
.jcao-skip:focus { left: 0; color: #fff; }

.jcao-kicker { display: block; font-size: 12.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--sand); }
.jcao-kicker--on-dark { color: var(--sand-light); }
.jcao-h2 { font-size: clamp(30px, 3.6vw, 46px); line-height: 1.1; letter-spacing: -.01em; margin-top: 12px; }
.jcao-h2--sm { font-size: clamp(24px, 2.6vw, 32px); line-height: 1.15; }
.jcao-lede { font-size: 16.5px; line-height: 1.75; color: var(--ink-3); max-width: 66ch; }

/* Buttons — one class per variant. Do not add variants without a design decision. */
.jcao-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 20px; border: 0; border-radius: var(--r-md);
  font-family: var(--font-heading); font-weight: 600; font-size: 15px; letter-spacing: .02em;
  text-decoration: none; cursor: pointer; transition: background .18s ease, box-shadow .18s ease, transform .18s ease;
}
.jcao-btn--primary { background: var(--steel); color: #fff; box-shadow: 0 2px 10px rgba(74,123,167,.3); }
.jcao-btn--primary:hover { background: var(--steel-dark); color: #fff; }
.jcao-btn--quiet { background: var(--surface-sunk); color: var(--navy); }
.jcao-btn--quiet:hover { background: var(--surface-sunk-hover); color: var(--navy); }
.jcao-btn--ghost-dark { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.26); color: #fff; }
.jcao-btn--ghost-dark:hover { background: rgba(255,255,255,.24); color: #fff; }
.jcao-btn--card { background: var(--surface); color: var(--navy); border-radius: var(--r-lg); box-shadow: 0 1px 2px rgba(28,35,51,.07), 0 6px 18px rgba(28,35,51,.07); }
.jcao-btn--card:hover { color: var(--navy); box-shadow: var(--e-hover); }
.jcao-btn--alert { background: var(--alert); color: #fff; box-shadow: 0 2px 10px rgba(180,85,47,.28); }
.jcao-btn--alert:hover { background: var(--alert-dark); color: #fff; }
.jcao-btn svg { flex: none; }

.jcao-icon { display: grid; place-items: center; flex: none; }
.jcao-nav__list{    list-style: none !important;
    display: flex;}