/* Team HYGIENE (September 2026). Loads after phase1.css on every public page. */

/* ---------------------------------------------------------------------------
   Spam honeypot.
   The "Website" input is bait for bots and must never be seen or reached by a
   person. phase1.css does not hide it and style.css only hides it on three
   named pages, so it renders as a labelled empty box on the booking pages.
   Hide it everywhere, by its own class, with no template change.
   --------------------------------------------------------------------------- */
.rhc-honeypot,
.rhc-honeypot :where(label, input) {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ---------------------------------------------------------------------------
   Policies. Plain prose, one column, reading measure. No cards: these are
   explanations, not items to compare.
   --------------------------------------------------------------------------- */
.rhc-policy-prose {
  max-width: 64ch;
}

.rhc-policy-prose > section + section {
  margin-top: var(--sp-8);
  padding-top: var(--sp-8);
  border-top: 1px solid var(--rule);
}

.rhc-policy-prose h2 {
  font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2rem);
  margin-bottom: var(--sp-4);
}

.rhc-policy-prose p + p {
  margin-top: var(--sp-4);
}

.rhc-policy-prose p a {
  color: var(--river);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--clay);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 4px;
}

.rhc-policy-prose p a:hover,
.rhc-policy-prose p a:focus-visible {
  color: var(--rust);
  text-decoration-color: currentColor;
}

.rhc-policy-more {
  margin-top: var(--sp-8);
  padding-top: var(--sp-6);
  border-top: 1px solid var(--rule);
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3) var(--sp-6);
}

.rhc-policy-more a {
  color: var(--river);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--clay);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 4px;
}

.rhc-policy-more a:hover,
.rhc-policy-more a:focus-visible {
  color: var(--rust);
  text-decoration-color: currentColor;
}

/* ---------------------------------------------------------------------------
   About & visit.
   --------------------------------------------------------------------------- */
.rhc-visit-intro p {
  max-width: 64ch;
}

.rhc-visit-intro p + p {
  margin-top: var(--sp-4);
}

.rhc-visit-find__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--sp-7) var(--sp-9);
  align-items: start;
}

.rhc-visit-find address {
  font-style: normal;
  font-size: 1.19rem;
  line-height: 1.5;
}

.rhc-visit-find a {
  color: var(--river);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--clay);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 4px;
}

.rhc-visit-find a:hover,
.rhc-visit-find a:focus-visible {
  color: var(--rust);
  text-decoration-color: currentColor;
}

.rhc-visit-find__phone {
  margin-top: var(--sp-4);
}

.rhc-visit-drive {
  list-style: none;
  margin-top: var(--sp-2);
  border-top: 1px solid var(--rule);
}

.rhc-visit-drive li {
  display: flex;
  justify-content: space-between;
  gap: var(--sp-5);
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--rule);
}

.rhc-visit-drive strong {
  font-family: var(--d);
  font-weight: 600;
}

.rhc-visit-drive span {
  color: var(--ink-5);
}

.rhc-visit-photos {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--sp-5);
}

.rhc-visit-photos img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.rhc-visit-action {
  margin-top: var(--sp-7);
}

@media (max-width: 900px) {
  .rhc-visit-find__grid,
  .rhc-visit-photos {
    grid-template-columns: minmax(0, 1fr);
  }

  .rhc-visit-find__grid {
    gap: var(--sp-6);
  }
}

/* ---------------------------------------------------------------------------
   Cancellation. phase1 leaves anchors the same color as body text, so an inline
   link inside a card reads as plain prose. Mark the ones on this page.
   --------------------------------------------------------------------------- */
.rhc-cancellation-page .card p a {
  color: var(--river);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: var(--clay);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 4px;
}

.rhc-cancellation-page .card p a:hover,
.rhc-cancellation-page .card p a:focus-visible {
  color: var(--rust);
  text-decoration-color: currentColor;
}

/* ============================================================
   OVERFLOW-WRAP ON HEADINGS AND NAV — finding T7-021, and the
   root cause behind T7-002. Fix lane fix-6b.

   style.css's phone rule (main#riverhouse-public-main h1..h6, a, strong,
   p, li { overflow-wrap: anywhere !important }) is a blanket safety net:
   every one of those elements can break mid-word rather than overflow.
   It is doing real work for prose that can carry a long, unbroken URL or
   email address (the legal pages, the field-trip and booking forms), so
   it is left alone there.

   Headings and navigation are a different case: their content is short
   authored copy or a person's name, never a URL, and the mid-word break
   is a pure loss - T7-021's "Elizabeth (Betty) Poindexter" cell and the
   original T7-002 calendar heading both trace to this rule reaching
   content it was never aimed at. This file loads after style.css, so an
   equal-specificity, equally-important rule here wins on source order
   without needing to touch style.css (out of scope for every team).

   NOT touched: p, li, a and strong keep style.css's anywhere-wrap. That
   sweep found zero overflow on 140 page/viewport combinations with the
   broader rule in place, and narrowing it for every paragraph and link
   sitewide is a much larger, unproven change than this lane's brief.
   ============================================================ */
@media (max-width: 599px) {
  main#riverhouse-public-main h1,
  main#riverhouse-public-main h2,
  main#riverhouse-public-main h3,
  main#riverhouse-public-main h4,
  main#riverhouse-public-main h5,
  main#riverhouse-public-main h6,
  main#riverhouse-public-main nav,
  main#riverhouse-public-main nav a {
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  /* Legal-page prose and anything code-like keeps (or gets) anywhere-wrap
     explicitly, so a long URL, email address or token still cannot push
     the page wide - this is the "places that need it" half of the fix. */
  main#riverhouse-public-main .rhc-policy-prose a,
  main#riverhouse-public-main .rhc-policy-prose p,
  main#riverhouse-public-main code,
  main#riverhouse-public-main pre,
  main#riverhouse-public-main kbd,
  main#riverhouse-public-main samp {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }
}
