/* bold-trade: the plumbing sample's aesthetic: navy poster, Anton caps,
 * safety red. Font URLs are relative so they resolve under any build base. */

@font-face {
  font-family: "Anton";
  src: url(../fonts/anton-400.woff2) format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url(../fonts/barlow-400.woff2) format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url(../fonts/barlow-600.woff2) format("woff2");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Barlow";
  src: url(../fonts/barlow-800.woff2) format("woff2");
  font-weight: 800;
  font-display: swap;
}

:root {
  --font-display: "Anton", "Barlow", sans-serif;
  --font-body: "Barlow", system-ui, sans-serif;
  --display-weight: 400;
  --display-tracking: 0.01em;
  --logo-weight: 400;

  --c-ink: #14233c;
  --c-muted: #51617c;
  --c-bg: #ffffff;
  --c-tint: #f1f5fa;
  --c-primary: #0b2545;
  --c-accent: #d63b2f;
  --c-accent-hover: #b92e23;
  --c-on-accent: #fff;
  --c-accent-2: #1766d1;
  --c-card-bg: #f1f5fa;
  --c-card-border: #dde6f0;

  --radius-btn: 6px;
  --radius-card: 10px;
  --radius-field: 6px;

  --hdr-bg: #0b2545;
  --hdr-fg: #ffffff;

  --hero-bg: linear-gradient(170deg, #0b2545 0%, #123466 100%);
  --hero-fg: #ffffff;
  --hero-sub: #d7e3f6;
  --hero-kicker: #9fc1f7;
  --hero-em: #6ea8f0;

  --sec-alt-bg: #0b2545;
  --sec-alt-fg: #ffffff;
  --sec-alt-muted: #c9d8ee;
  --pill-border: rgba(255, 255, 255, 0.35);

  --sec-cta-bg: #0b2545;
  --sec-cta-fg: #ffffff;
  --sec-cta-muted: #c9d8ee;
  --sec-cta-link: #9fc1f7;
  --sec-cta-label: #c9d8ee;
  --field-bg: #ffffff;

  --ftr-bg: #081a33;
  --ftr-fg: #c9d8ee;
  --ftr-link: #fff;
  --ftr-fine: #8ba1c4;
  --callbar-bg: #d63b2f;
}

/* Poster sections put city pills and cards on navy; keep pills readable. */
.sec-alt .cities li { color: #fff; }