/* Jesse Stuart quote band — the hero's photographic treatment, but tinted in
   an archival sepia/umber instead of the hero's navy, so the two read as
   related without the home page repeating itself.

   Added 17 July 2026. To drop it: remove this file and its <link>, and revert
   the quote <section> in index.html to a plain <section class="section">
   containing just the .pullquote div. */

.quote-band {
  position: relative;
  overflow: hidden;
  background: #241d14;               /* deep umber, the base under the photo */
  color: var(--cream);
  padding: 92px 0 84px;              /* roomier than a plain .section */
  border-top: 1px solid rgba(212, 179, 106, .28);
  border-bottom: 1px solid rgba(212, 179, 106, .28);
}

.quote-band .qb-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 60%;
  /* heavier sepia than the hero's .25 — this is the "archival" of the pair */
  filter: sepia(.5) contrast(1.04);
  opacity: .6;
}

/* Warm counterpart to .hero-shade. Lighter through the middle so the rock cut,
   poles and track still read behind the text, darker top and bottom to seat the
   band against the cream sections above and below. Even over the brightest part
   of the sky this composites to roughly luma 100, which keeps the cream quote
   above 4.5:1 — and the quote is large text, so it has margin to spare. */
.quote-band .qb-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(36, 29, 20, .74) 0%,
              rgba(36, 29, 20, .50) 45%,
              rgba(36, 29, 20, .78) 100%);
}

.quote-band .pullquote {
  position: relative;
  z-index: 1;
}

.quote-band .pullquote blockquote {
  color: var(--cream);
  text-shadow: 0 2px 16px rgba(0, 0, 0, .55);
}

.quote-band .pullquote .attr {
  color: var(--gold-soft);
}

/* same idea as .hero .credit-tag, in the band's warm key */
.quote-band .qb-credit {
  position: absolute;
  right: 14px;
  bottom: 10px;
  z-index: 1;
  font-family: var(--sans);
  font-size: 10.5px;
  letter-spacing: .06em;
  color: rgba(242, 234, 214, .5);
}

@media (max-width: 640px) {
  .quote-band { padding: 64px 0 58px; }
  .quote-band .qb-credit {
    left: 14px;
    right: 14px;
    font-size: 9.5px;
    text-align: center;          /* matches the hero captions on small screens */
  }
}
