/* ============================================================
   CAVMIR LOCATION PAGES: formatting fix  ·  2026-11-07
   Dan: "serious formatting issues on market pages... large open
   spaces... and hard to read font". Loads LAST on every
   /locations/*.html page (one <link> added by
   cavmir v3/_locfmt20261106/patch_pages.py), so it overrides the
   older layers (main.css, locations-v3.css, v4.css, loc-v4.css).

   1. Dark photo bands (history, future outlook, law): loc-v4's dark
      ink rule (.dd p) beat the light text wherever the paragraphs sat
      inside the .v4-split body, so the copy was near-black on a dark
      photo. Light text again, and an even overlay so the photo can
      never fight the words.
   2. Dead space: the Finance Essentials box (often 3,000-4,000px tall)
      sat in the narrow right column next to ~1,600px of text, leaving
      thousands of pixels of empty colour. It now runs full width under
      the text, each topic in two balanced newspaper columns. Short side
      cards (peak windows, the curious fact) follow the reader as they
      scroll instead of leaving a blank column; the intro photo does too.
   3. Small copper labels darkened to pass WCAG 4.5:1.
   ============================================================ */

/* ---------- 1. dark photo bands: readable text ---------- */
body.locations-v3 .dd.dd--bleed-dark .dd__bleed-overlay {
  background: linear-gradient(180deg, rgba(14, 9, 13, 0.82) 0%, rgba(14, 9, 13, 0.74) 45%, rgba(14, 9, 13, 0.9) 100%);
}
body.locations-v3 .dd.dd--bleed-dark.dd--burgundy .dd__bleed-overlay {
  background: linear-gradient(180deg, rgba(52, 13, 34, 0.86) 0%, rgba(52, 13, 34, 0.78) 45%, rgba(30, 8, 20, 0.92) 100%);
}
body.locations-v3 .dd.dd--bleed-dark p,
body.locations-v3 .dd.dd--bleed-dark li,
body.locations-v3 .dd.dd--bleed-dark .fh-lead { color: rgba(255, 255, 255, 0.92); }
body.locations-v3 .dd.dd--bleed-dark h2,
body.locations-v3 .dd.dd--bleed-dark h3,
body.locations-v3 .dd.dd--bleed-dark .dd__subhead { color: #fff; }
body.locations-v3 .dd.dd--bleed-dark h2 em { color: #E7A981 !important; }
body.locations-v3 .dd.dd--bleed-dark p strong,
body.locations-v3 .dd.dd--bleed-dark li strong { color: #F1C7A9; }
body.locations-v3 .dd.dd--bleed-dark a:not([class]) { color: #F1C7A9; }

/* ---------- 2. dead space ---------- */
@media (min-width: 901px) {
  /* the Finance box now sits after its grid (moved by patch_pages.py) and runs
     full width, each topic in two balanced newspaper columns */
  .dd .dd__grid + .dd-finance { margin-top: clamp(40px, 4vw, 64px) !important; }
  .dd .dd__grid + .dd-finance .dd-finance__row { padding: 28px clamp(24px, 2.6vw, 40px); gap: 20px; }
  .dd .dd__grid + .dd-finance .dd-finance__content { flex: 1 1 auto; min-width: 0; }
  .dd .dd__grid + .dd-finance .dd-finance__content h4 { font-size: 1.2rem; margin-bottom: 12px; }
  .dd .dd__grid + .dd-finance .dd-finance__content p {
    column-count: 2;
    column-gap: clamp(32px, 3.6vw, 64px);
    font-size: 0.98rem;
    line-height: 1.7;
  }

  /* short side cards follow the reader instead of leaving a blank column */
  .dd .dd__grid { align-items: start; }
  .dd .dd__grid > aside,
  .dd .dd__grid > .dd-callout,
  .dd .dd__grid > .reveal-delay-1 {
    position: sticky;
    top: calc(var(--nav-h, 122px) + 24px);
    align-self: start;
  }

  /* intro photo: stays beside the text the whole way down */
  .location-intro .location-image-wrap { align-self: stretch; }
  .location-intro .location-image-wrap img,
  .location-intro .location-image-wrap picture {
    position: sticky;
    top: calc(var(--nav-h, 122px) + 24px);
  }
}
/* short laptop screens: a tall card would hide its own bottom under a top
   pin, so pin it to the bottom of the window instead */
@media (min-width: 901px) and (max-height: 860px) {
  .dd .dd__grid > aside,
  .dd .dd__grid > .dd-callout,
  .dd .dd__grid > .reveal-delay-1 {
    top: auto;
    bottom: 20px;
    align-self: end;
  }
}

/* the history hero on pages without locations-v3.css: soft copper on the dark photo */
.dd.dd--bleed-dark.fh-hero h2 em { color: #E7A981 !important; }

/* ---------- 3. small labels and credits: 4.5:1 ---------- */
body .lc-case .lc-case__tag { color: rgba(0, 0, 0, 0.7); }
body .lc-case .lc-case__row--result .lc-case__tag,
body.v4-loc .lc-case .lc-case__tag,
body.v4-loc .lc-pick__eyebrow { color: #8E3E21; }
body .loc-photo-credit,
body .loc-photo-credit a { color: rgba(0, 0, 0, 0.68) !important; }
/* photo credits printed on the photo itself: legible, not 40% white */
.nbhd-strip .nbhd-card .nbhd-card__attr {
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.62rem;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.85);
}

/* Berlin's permits card is white on its photo band; its list inherited the
   band's white text and the card read as blank */
.berlin-bleed .dd-callout .dd-callout__body :is(p, li) { color: rgba(0, 0, 0, 0.8); }
.berlin-bleed .dd-callout .dd-callout__body strong { color: #6B214B; }
