/* Reference: built like Baseball-Reference. White page, boxed sections with brick-red header bars,
   dense tables, tight photo grids, blue underlined links. Everything important on the first screen. */
:root {
  --bg: #ffffff; --fg: #1d1f21; --muted: #555b61; --surface: #f4f4f1; --line: #d9d9d4;
  --accent: #8a1c1c; --accent-ink: #fff; --link: #1458b4; --focus: #1458b4;
  --head-font: "IBM Plex Sans Condensed", "Arial Narrow", sans-serif; --body-font: "IBM Plex Sans", system-ui, sans-serif;
  --eyebrow-font: "IBM Plex Sans", system-ui, sans-serif;
  --head-weight: 600; --head-track: -.005em; --head-lh: 1.08;
  --brand-font: "IBM Plex Sans Condensed", sans-serif; --brand-size: 1.85rem; --brand-weight: 600; --brand-case: uppercase; --brand-track: .01em;
  --eyebrow: #8a1c1c; --facts-font: var(--body-font); --facts-weight: 600;
  --list-font: "IBM Plex Sans Condensed", sans-serif;
  --footer-bg: #1d1f21; --footer-fg: #dfe2e6;
  --gallery-gap: 3px; --thumb-gap: 3px; --card-gap: 0;
  --section: clamp(1.5rem, 3vw, 2.25rem);
  --form-bg: #fff; --form-radius: 0; --form-border: 1px solid #b9b9b3; --form-shadow: none; --form-band: #fff;
  --box-head-size: 1.2rem;
}
body { font-size: 1rem; }
.site-header { border-bottom: 1px solid #c9c9c4; }
.brand-name { color: var(--accent); }
.site-nav a, .site-nav summary { color: #1d1f21; }

/* Headings as red header bars, like the stat boxes */
.box-head, .section-head, .form-title {
  background: var(--accent); color: #fff; border: 0;
  font-size: 1.2rem; padding: .45rem .75rem; margin: 0 0 .75rem;
}
.box-head a, .section-head a { color: #fff; }
.section-head h2, .section-head-row h2 { font-size: 1.2rem; }
.section-head .eyebrow { display: none; }

/* Hero: no full-bleed photo. Copy and a framed photo on the left, form box on the right. */
.hero { width: min(76rem, 100% - 2 * var(--gap)); margin: 0 auto; background: none; color: var(--fg); grid-template-columns: 1fr; padding-top: 1.25rem; }
.hero-grid { display: contents; }
.hero-copy { grid-area: 1 / 1; width: auto; max-width: none; margin: 0; padding: 0 0 1rem; }
.hero-media { grid-area: 2 / 1; aspect-ratio: 16 / 9; border: 1px solid #c9c9c4; }
.hero-media::after { display: none; }
.hero-form { grid-area: 3 / 1; margin-top: 1.25rem; padding: 0 1rem 1rem; }
.hero-form .inquiry { max-width: none; }
.form-title { margin: 0 -1rem .25rem; }
.form-sub { margin: 0; }
@media (min-width: 60em) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(22rem, 26rem); grid-template-rows: auto 1fr; column-gap: 2rem; padding-block: 1.5rem 0; }
  .hero-form { grid-area: 1 / 2 / 3 / 3; margin: 0; align-self: start; }
  .hero-media { aspect-ratio: auto; min-height: 14rem; }
}
.hero h1 { font-size: clamp(2rem, 3.6vw, 3rem); margin-bottom: .6rem; }
.hero .eyebrow { color: var(--accent); margin-bottom: .5rem; }
.hero .eyebrow a { color: inherit; }
.hero .lede { color: var(--muted); font-size: 1.1rem; }
.hero-points { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; margin-top: 1rem; }
.hero-points li { font-weight: 600; }
.hero-points li::before { border-color: var(--accent); }

/* Tables and lists */
.facts { border-top: 2px solid var(--fg); border-bottom: 1px solid var(--fg); }
.facts dd { font-size: 1.1rem; }
.service-list { border-top: 2px solid var(--fg); }
.service-list div { padding: .6rem 0; }
.service-list dt { font-size: 1.05rem; }
.know { background: #fff; border: 1px solid #c9c9c4; padding: 0 1rem 1rem; }
.know h2 { background: var(--accent); color: #fff; font-size: 1.2rem; padding: .45rem .75rem; margin: 0 -1rem .75rem; }
.know li { padding-block: .4rem; }
.principles div { border-top: 2px solid var(--fg); }
.steps li { border-top: 2px solid var(--fg); }
.steps li::before { font-size: 1.1rem; }

/* Service directory: compact rows, photo left */
.service-cards { border-top: 1px solid var(--line); }
@media (min-width: 40em) { .service-cards { grid-template-columns: 1fr; } }
@media (min-width: 64em) { .service-cards { grid-template-columns: repeat(2, 1fr); column-gap: 2rem; } }
.service-card { flex-direction: row; align-items: center; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--line); border-radius: 0; }
.service-card .card-img { width: clamp(5.5rem, 18vw, 8rem); flex: none; aspect-ratio: 1; }
.service-card:hover .card-img { transform: none; }
.service-card:hover .card-title { text-decoration: underline; }
.card-body { padding: 0; }
.card-title { font-size: 1.3rem; color: var(--link); }
.card-list { font-size: .92rem; color: var(--fg); }

/* Photos: tight grids, small caps captions */
.gallery figcaption { font-size: .78rem; margin-top: .25rem; padding-bottom: .4rem; }
.photo-note { background: #1d1f21; border-radius: 0; }
.page-head { padding-top: 1.5rem; }
.notice { border-left-color: var(--accent); }
.site-footer .brand-name { color: #fff; }
/* Original layout sections */
:root {
  --cta-bg: #8a1c1c; --cta-fg: #fff; --cta-btn-bg: #fff; --cta-btn-fg: #8a1c1c;
}
.statement p { font-size: clamp(1.5rem, 2.6vw, 2.1rem); }
.about-band .eyebrow { color: var(--accent); }