/* Self-hosted web fonts (latin subset, from Google Fonts, SIL Open Font License; rebuilt from site.json
   fonts_css_google). Same origin: no extra connections before text paints. */
@font-face { font-family: "Atkinson Hyperlegible"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/atkinson-hyperlegible-d4c6b24c.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Atkinson Hyperlegible"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/atkinson-hyperlegible-16709f93.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/barlow-semi-condensed-52ffd072.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Barlow Semi Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/barlow-semi-condensed-e8b317e8.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/jetbrains-mono-b87346fd.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/jetbrains-mono-b87346fd.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* end self-hosted fonts */
/* Metric-matched local fallbacks (measured against the web fonts in Chrome, 2026-10-26) so text does not
   reflow when the web font swaps in: keeps CLS near zero on slow connections. */
@font-face { font-family: "Atkinson Fallback"; src: local("Arial"), local("ArialMT"), local("Arimo"), local("Liberation Sans"); font-weight: 100 500; size-adjust: 99.42%; ascent-override: 95.56%; descent-override: 29.17%; line-gap-override: 0%; }
@font-face { font-family: "Atkinson Fallback"; src: local("Arial"), local("ArialMT"), local("Arimo"), local("Liberation Sans"); font-weight: 501 650; size-adjust: 99.42%; ascent-override: 95.56%; descent-override: 29.17%; line-gap-override: 0%; }
@font-face { font-family: "Atkinson Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Arimo Bold"), local("Liberation Sans Bold"); font-weight: 651 1000; size-adjust: 99.42%; ascent-override: 95.56%; descent-override: 29.17%; line-gap-override: 0%; }
@font-face { font-family: "Barlow SC Fallback"; src: local("Arial"), local("ArialMT"), local("Arimo"), local("Liberation Sans"); font-weight: 100 500; size-adjust: 88.72%; ascent-override: 112.71%; descent-override: 22.54%; line-gap-override: 0%; }
@font-face { font-family: "Barlow SC Fallback"; src: local("Arial"), local("ArialMT"), local("Arimo"), local("Liberation Sans"); font-weight: 501 650; size-adjust: 88.72%; ascent-override: 112.71%; descent-override: 22.54%; line-gap-override: 0%; }
@font-face { font-family: "Barlow SC Fallback"; src: local("Arial Bold"), local("Arial-BoldMT"), local("Arimo Bold"), local("Liberation Sans Bold"); font-weight: 651 1000; size-adjust: 81.98%; ascent-override: 121.98%; descent-override: 24.40%; line-gap-override: 0%; }

/* BDACheck design system: practical facilities tool.
   White work surface, graphite ink, safety-amber equipment tags, deep teal actions.
   Barlow Semi Condensed for labels and headings (signage feel), Atkinson Hyperlegible for
   reading, JetBrains Mono for dates and numbers. Square corners, 2px borders. Light only. */
:root {
  --bg: #ffffff;
  --panel: #f3f4f1;
  --card: #ffffff;
  --ink: #14212b;
  --ink-2: #4b5862;
  --line: #d6dad3;
  --line-strong: #8d968c;
  --link: #0a5c55;
  --focus: #0a5c55;
  --accent: #0a5c55;
  --accent-on: #ffffff;
  --accent-hover: #084842;
  --accent-ink: #0a5c55;
  --tag: #f0a500;
  --tag-ink: #14212b;
  --ok: #1e6b35;
  --warn: #b06a00;
  --warn-ink: #7d4b00;
  --bad: #b3261e;
  --font-body: "Atkinson Hyperlegible", "Atkinson Fallback", Verdana, sans-serif;
  --font-head: "Barlow Semi Condensed", "Barlow SC Fallback", "Arial Narrow", Arial, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --fw-head: 700;
  --ls-head: 0;
  --radius: 2px;
  --radius-sm: 2px;
  --radius-btn: 2px;
  --maxw: 1240px;
  --fs-h1: clamp(2.2rem, 5.5vw, 3.6rem);
}
h1, h2, h3 { text-transform: none; }
.site-header { border-bottom: 2px solid var(--ink); }
.logo { display: inline-flex; align-items: stretch; text-decoration: none; color: var(--ink); font: 700 1.35rem/1 var(--font-head); margin: 0; }
.logo__tag { background: var(--tag); color: var(--tag-ink); padding: .3rem .45rem; border: 2px solid var(--ink); letter-spacing: .04em; }
.logo__word { padding: .3rem .5rem; border: 2px solid var(--ink); border-left: 0; }
.logo--footer { margin-bottom: .75rem; font-size: 1.15rem; }
.btn--sm { min-height: 40px; padding: .45rem .9rem; font-size: .95rem; }
.site-nav .btn { color: var(--accent-on); padding: .45rem .9rem; }
.site-nav a { font-family: var(--font-head); font-weight: 600; font-size: 1.05rem; }
.btn { font-family: var(--font-head); font-size: 1.08rem; letter-spacing: .01em; }
.btn--ghost { border-color: var(--ink); }

.eyebrow, .tag-label { display: inline-block; font: 600 .78rem/1 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; background: var(--tag); color: var(--tag-ink); padding: .35rem .5rem; border: 1px solid var(--ink); }
.tag-label { margin: .5rem 0 0; }

.page-head { background: var(--panel); border-bottom: 2px solid var(--ink); }
.card { border: 2px solid var(--ink); }
.split { border-top: 2px dashed var(--line); }
.split__head h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.table-wrap { border: 2px solid var(--ink); }
thead th { background: var(--ink); color: #fff; font-family: var(--font-head); font-size: .95rem; letter-spacing: .02em; }
td time, td[data-sort] { font-family: var(--font-mono); font-size: .88rem; }

/* home */
.hero { padding: clamp(2.5rem, 6vw, 4.5rem) 0; border-bottom: 2px solid var(--ink); background: var(--panel); }
.hero__grid { display: grid; gap: 2rem 3.5rem; grid-template-columns: minmax(0, 1fr); align-items: center; }
@media (min-width: 960px) { .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.hero h1 { max-width: 9em; } /* em, not ch: ch follows the font, so it changed when the web font swapped in (CLS) */
.hero .lede { margin-bottom: 1.5rem; max-width: 50ch; }
.tag-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: .75rem; }
.tag-steps li + li { margin: 0; }
.tag-card { display: grid; grid-template-columns: auto 1fr; gap: .1rem 1rem; align-items: baseline; background: #fff; border: 2px solid var(--ink); padding: 1rem 1.1rem; position: relative; }
.tag-card::before { content: ""; position: absolute; left: -2px; top: -2px; bottom: -2px; width: 8px; background: var(--tag); border: 2px solid var(--ink); border-right: 0; }
.tag-card__no { grid-row: span 2; font: 600 1.4rem/1 var(--font-mono); color: var(--accent); padding-left: .5rem; }
.tag-card strong { font: 700 1.2rem/1.2 var(--font-head); }
.tag-card span:last-child { color: var(--ink-2); font-size: .95rem; }

/* reminder tool */
.form-card { border-top: 8px solid var(--tag); }
.schedule { background: var(--panel); }
@media (min-width: 960px) { .schedule { position: sticky; top: 1.5rem; align-self: start; } }
.schedule [data-reminder-preview] { font-family: var(--font-mono); font-size: .95rem; }
.late { color: var(--bad); font-weight: 700; }
.yn__opts { display: flex; flex-wrap: wrap; gap: 0 1.25rem; }
.site-footer { background: var(--panel); border-top: 2px solid var(--ink); }
.site-footer__legal { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--line); }

/* ---------- media, hero and motion (structure in shared motion.css; this is the back-of-house look) ----------
   Practical: fast and functional, no parallax. */
:root { --mo-dist: 12px; --mo-dur: 450ms; --mo-wipe-dur: 600ms; --mo-stagger: 50ms; --mag-max: 6px; --parallax-max: 0px; --progress: var(--tag); }
.hero--media h1, .page-head--split h1 { font-size: clamp(2.1rem, 4vw, 3.2rem); max-width: 8.4em; }
.hero-media__frame { border: 2px solid var(--ink); border-radius: 0; }
.hero-media--split .hero-media__frame { border-right: 0; }
.steps-band { padding: 1.5rem 0; border-bottom: 2px solid var(--ink); }
.tag-steps--row { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 768px) { .tag-steps--row { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.media img { border: 2px solid var(--ink); border-radius: 0; }
.diagram { border: 2px solid var(--ink); border-radius: 0; }
.cta-band { background: var(--bg); border: 2px solid var(--ink); border-left: 10px solid var(--tag); border-radius: 0; }
.share { border-top: 2px dashed var(--line); }
.photo-note { margin: 1.25rem 0 0; }

/* home guides: two photo feature cards and a compact list (one shape per job, not nine equal boxes) */
.gfeat { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .gfeat { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gfeat__list { grid-column: 1 / -1; } }
@media (min-width: 1100px) { .gfeat { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .8fr); } .gfeat__list { grid-column: auto; } }
.gfeat__card { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.gfeat__card img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; }
.gfeat__body { padding: 1rem 1.1rem 1.2rem; }
.gfeat__body h3 { margin: 0 0 .35rem; }
.gfeat__body p { margin: 0; }
.gfeat__list ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.gfeat__list li { margin: 0; border-bottom: 1px solid var(--line); }
.gfeat__list a { display: flex; align-items: center; min-height: 44px; padding: .55rem 0; font-weight: 600; color: var(--ink); text-decoration: none; }
.gfeat__list a::after { content: ""; margin-left: auto; width: .5rem; height: .5rem; border-top: 2px solid var(--accent-ink); border-right: 2px solid var(--accent-ink); transform: rotate(45deg); flex: none; }
.gfeat__list a:hover { color: var(--accent-ink); text-decoration: underline; }
