/* =====================================================================
   HSR-Footer — Variant A, "Deep navy" (Brand Kit V3.0)
   =====================================================================
   Chosen by Mark 2026-07-31.

   🔴 SAFE TO SHIP BEFORE THE FOOTER RENDERS. Every selector is scoped to
      `.hsr-ftr`, which does not exist in the DOM until WS3 adds 'footer' to
      hsr_owned_locations(). No bare-element rules.

   White on --hsr-blue-900 is ~13:1 — the most legible pairing in the kit, and
   the reason the deepest navy is the right close for a page rather than a
   mid-tone. Link text is deliberately lightened rather than pure white so the
   headings still lead; both stay well above AA.
   ===================================================================== */

.hsr-ftr {
  background: var(--hsr-blue-900);
  color: #CBD8E5;
  padding-top: var(--hsr-s-16);
  font-size: 15px;
  line-height: 1.6;
}

/* ---- Grid ------------------------------------------------------------
   The brand column is wider than the link columns — it carries the blurb and
   the trust line, and a four-equal-column footer makes prose look like a list. */
/* Inner width - see the matching note in hsr-header.css. Same reason it is on
   a modifier class and not on `.hsr-ftr .hsr-container`: RUCSS dropped the
   descendant form and the footer went full-bleed for logged-out visitors.
   footer.php gains the `hsr-ftr__in` class on the same element. */
.hsr-ftr__in {
  width: 100%;
  max-width: var(--hsr-width);
  margin-inline: auto;
  padding-inline: var(--hsr-s-5);
}

.hsr-ftr__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: var(--hsr-s-10);
}

@media (max-width: 900px) {
  .hsr-ftr__grid { grid-template-columns: 1fr 1fr; gap: var(--hsr-s-8); }
}
@media (max-width: 560px) {
  .hsr-ftr__grid { grid-template-columns: 1fr; gap: var(--hsr-s-6); }
}

/* ---- Brand column ----------------------------------------------------- */
.hsr-ftr .hsr-logo--white,
.hsr-ftr .hsr-logo--white.hsr-logo--text { color: var(--hsr-white); }

/* Brand Kit: white SVG on navy. If a colour custom-logo is set, this keeps it
   legible on the dark ground rather than letting it disappear. */
.hsr-ftr .hsr-logo img { filter: brightness(0) invert(1); }

.hsr-ftr__blurb {
  max-width: 34ch;
  margin: var(--hsr-s-4) 0 var(--hsr-s-5);
  color: #AEC1D4;
}

.hsr-ftr__trust {
  display: flex;
  align-items: center;
  gap: var(--hsr-s-2);
  margin: 0;
  font-size: var(--hsr-fs-small);
  color: #AEC1D4;
}
/* Decorative only — the rating is stated in the text, never colour-or-icon
   alone. Brand Kit accessibility rule. */
.hsr-ftr__stars { color: var(--hsr-amber-500); letter-spacing: 1px; }

/* ---- Link columns ----------------------------------------------------- */
.hsr-ftr__h {
  margin: 0 0 var(--hsr-s-4);
  font-family: var(--hsr-font-head);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--hsr-white);
}

/* =====================================================================
   🔴 ELEMENTOR KIT SPECIFICITY GUARD.
   .hsr-ftr__h is an <h2>. `.elementor-kit-9 h2 { color:#16305C }` is (0,1,1)
   and beats the (0,1,0) rule above, so the column headings rendered NAVY ON
   NAVY — invisible against --hsr-blue-900. Reported from a live logged-out
   screenshot 2026-08-01. Present logged in too; it was simply never measured.
   ===================================================================== */
/* 🔴 EXTENDED 2026-08-03 (session 12). The 2026-08-01 guard doubled COLOUR
   ONLY, so the headings stopped being navy-on-navy but kept the kit's
   font-size and font-weight: measured on a live render of /contact/, the
   column headings computed to Poppins 34px 700 - `.elementor-kit-9 h2` -
   instead of the 14px/600 intended above. They had rendered at 34px on EVERY
   page since the native footer went live, unnoticed because a big white
   uppercase heading looks deliberate. Found by tools/hsr-kit-collision-check.py,
   not by eye. Eighth instance of project rule 2.
   🔴 DOUBLING ONE PROPERTY IS NOT DOUBLING THE RULE. Double every property the
      kit claims on this element: color, font-family, font-size, font-weight. */
.hsr-ftr__h.hsr-ftr__h {
  color: var(--hsr-white);
  font-family: var(--hsr-font-head);
  font-size: 14px;
  font-weight: 600;
}
.hsr-ftr__tagline.hsr-ftr__tagline { color: #8AA3BC; }

.hsr-ftr__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.hsr-ftr__list li { margin: 0 0 var(--hsr-s-2); }

.hsr-ftr__list a {
  display: inline-block;
  /* Generous vertical padding: these are the links a tired person taps on a
     phone at 9pm. Tight footer links are the classic mis-tap. */
  padding: 5px 0;
  color: #CBD8E5;
  text-decoration: none;
  transition: color var(--hsr-dur) var(--hsr-ease);
}
.hsr-ftr__list a:hover,
.hsr-ftr__list a:focus-visible { color: var(--hsr-white); text-decoration: underline; }

/* ---- Bottom bar -------------------------------------------------------- */
.hsr-ftr__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--hsr-s-4);
  margin-top: var(--hsr-s-12);
  padding: var(--hsr-s-5) 0;
  border-top: 1px solid rgba(255, 255, 255, .12);
  font-size: var(--hsr-fs-small);
  color: #9FB4C9;
}
.hsr-ftr__spacer { flex: 1 1 auto; }
.hsr-ftr__tagline { color: #8AA3BC; }

.hsr-ftr__bar a {
  color: #9FB4C9;
  text-decoration: none;
  /* 44px target even in the small print — the Brand Kit minimum has no
     exception for legal links. */
  display: inline-flex;
  align-items: center;
  min-height: var(--hsr-tap);
  padding: 0 var(--hsr-s-1);
}
.hsr-ftr__bar a:hover,
.hsr-ftr__bar a:focus-visible { color: var(--hsr-white); text-decoration: underline; }

@media (max-width: 560px) {
  .hsr-ftr__bar { flex-direction: column; align-items: flex-start; gap: var(--hsr-s-2); }
  .hsr-ftr__spacer { display: none; }
}

/* Focus ring has to be visible on navy — the global one uses a white inner
   ring, which is correct here and stays. */
.hsr-ftr a:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px var(--hsr-blue-900), 0 0 0 4px var(--hsr-white);
  border-radius: var(--hsr-r-sm);
}


/* HSR-FTR-1440-START (rollback: delete through HSR-FTR-1440-END) — footer content width site-wide, matches header */
.hsr-ftr__in.hsr-ftr__in{max-width:1440px}
/* HSR-FTR-1440-END */
