/* Retints the engine-built legal/quote pages to the artifact identity
   (paper #F6F4F0 · ink #17181B · livery gold #C6A44E / deep gold #8A6B22),
   Zilla Slab headings + Archivo body, so they match the redesigned index.
   Loaded AFTER global.css/index.css; overrides chrome and palette only —
   the legal copy itself is untouched. 2026-09-01.

   NO !important on any color rule: the render-check contrast gate hides
   glyphs with an inline color:transparent, and a color!important here
   out-ranks that inline style — every measurement then reads the glyph's
   own pixels and reports 1.00:1. Specificity + load order win instead. */

:root {
  --c-bg: #F6F4F0;
  --c-surface: #FFFFFF;
  --c-text: #17181B;
  --c-primary: #17181B;
  --c-secondary: #8A6B22;
  --c-accent: #C6A44E;
  --c-dark-bg: #17181B;
  --c-dark-text: #D9D5CE;
  --c-bronze-light: #A9A49B;
  --c-line: #DDD8D0;
  --c-line-dark: rgba(217, 213, 206, 0.22);
  --f-display: 'Zilla Slab', Georgia, serif;
  --f-body: 'Archivo', 'Segoe UI', Helvetica, Arial, sans-serif;
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { background: #F6F4F0; color: #17181B; }

body h1, body h2, body h4 {
  font-family: 'Zilla Slab', Georgia, serif;
  color: #17181B;
  letter-spacing: -0.02em;
  text-transform: none;
  font-weight: 700;
}
body h1 { font-size: clamp(2.1rem, 1.5rem + 2.6vw, 3.4rem); line-height: 1.06; }
body h2 { font-size: clamp(1.7rem, 1.4rem + 1.3vw, 2.4rem); line-height: 1.1; }

main a, main .section a { color: #8A6B22; }
main a:hover, main .section a:hover { color: #17181B; }

body .site-header {
  background: rgba(246, 244, 240, 0.94);
  border-bottom: 1px solid #DDD8D0;
  box-shadow: none;
}
body .site-header a, body .nav-desktop a { color: #17181B; }

body .btn, body .btn--primary {
  background: linear-gradient(135deg,#D6B463,#A8842F);
  border-color: #A8842F;
  color: #17181B;
  border-radius: 2px;
}
body .btn:hover, body .btn--primary:hover {
  background: #17181B;
  border-color: #17181B;
  color: #F6F4F0;
}
body .btn--ghost {
  background: #17181B;
  border-color: #17181B;
  color: #F6F4F0;
}
body .btn--ghost:hover { background: #C6A44E; border-color: #C6A44E; color: #17181B; }

body .site-footer { background: #17181B; color: #D9D5CE; }
body .site-footer a { color: #D9D5CE; text-decoration-color: rgba(217, 213, 206, 0.5); }
body .site-footer a:hover { color: #E5C878; }
body .footer__title { color: #A9A49B; }
body .wordmark--invert, body .wordmark--invert .wordmark__sub { color: #F6F4F0; }
body .footer__tagline, body .footer__area, body .footer__copy { color: #A9A49B; }

/* Text wordmark — replaces the cropped brand-sheet logo image. Livery-style
   heavy italic SML in deep gold with two gradient slash bars. */
.wm-sml { font-family: 'Archivo', system-ui, sans-serif; font-weight: 800; font-style: italic;
  font-size: 29px; line-height: 1; letter-spacing: -0.03em; color: #8A6B22; }
.wm-slashes { display: inline-flex; gap: 5px; margin-left: 9px; padding-bottom: 2px; }
.wm-slashes i { width: 7px; height: 21px; transform: skewX(-20deg);
  background: linear-gradient(180deg, #E9CE84, #A8842F); border-radius: 1px; }
body .header__identity { display: inline-flex; align-items: center; text-decoration: none; }
/* Footer wordmark: gold SML only — not the mark and the words together. */
body .site-footer .wordmark { font-family: 'Archivo', system-ui, sans-serif; font-weight: 800;
  font-style: italic; font-size: 26px; letter-spacing: -0.03em; color: #D6B463; }
body .site-footer .wordmark .wordmark__sub { display: none; }

body .skip-link { background: #17181B; color: #F6F4F0; }

/* The index header/footer, transplanted verbatim into these pages
   (2026-09-01, "make terms etc match the design"). These rules mirror the
   index <style> block for the classes that markup relies on. */
body .site-nav a { color: #17181B; text-decoration: none; }
body .site-nav a:hover { color: #8A6B22; }
body header a, body footer a { text-decoration: none; }
body header .nav-tel { color: #17181B; }
body .hx2:hover { background: #17181B !important; color: #fff !important; }
body .hx7:hover { color: #E5C878 !important; }
body .nav-toggle { position: absolute; opacity: 0; pointer-events: none; width: auto; height: auto; }
body .nav-burger { display: none; }
body .mobile-panel { display: none; background: #F6F4F0; color: #17181B; position: static; visibility: visible; opacity: 1; transform: none; }
@media (max-width: 820px) {
  body .nav-link { display: none !important; }
  body .nav-burger { display: flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 44px; height: 44px; padding: 11px; margin: 0; cursor: pointer;
    border: 1px solid #DDD8D0; border-radius: 2px; background: #fff; box-sizing: border-box; }
  body .nav-burger span { display: block; height: 2px; background: #17181B; border-radius: 1px;
    width: auto; transform: none; position: static; }
  body .nav-toggle:checked ~ .mobile-panel { display: block; position: absolute; top: 100%; left: 0; right: 0;
    background: #F6F4F0; border-bottom: 1px solid #DDD8D0; padding: 10px 28px 22px;
    box-shadow: 0 14px 30px rgba(23, 24, 27, 0.12); }
  body .mobile-panel a { display: block; padding: 13px 0; font-size: 16px; font-weight: 600;
    color: #17181B; text-decoration: none; border-bottom: 1px solid #DDD8D0; }
  body .mobile-panel a:last-child { border-bottom: 0; }
}
@media (max-width: 440px) { body .nav-tel { display: none !important; } }
@media (max-width: 960px) { body .foot-grid { grid-template-columns: 1fr !important; gap: 28px !important; } }

/* The header CTA is also a .site-header a — restate its label colour with
   the more specific selector or the ink header-link rule wins. */
body .site-header .btn, body .site-header .btn--primary { color: #17181B; }
body .site-header .btn:hover, body .site-header .btn--primary:hover { color: #F6F4F0; }
/* global.css's .nav-desktop .btn.btn--primary (0-3-0) out-ranks the pair
   above — restate the ink label at higher specificity for the header CTA. */
body .nav-desktop .btn.btn--primary { color: #17181B; }
body .nav-desktop .btn.btn--primary:hover { color: #F6F4F0; }
