@charset "UTF-8";
/* ---------------------------------------------------------------------------
   .hhc-card INSIDE A READING MEASURE
   Added 2026-08-20 with the Retreat Type page rebuild (nodes 20, 21, 22, 47).

   These pages wrap the Mystery of Ayahuasca card in `.text-section.wide` with
   everything else, which hands the component a 731px container. This stops it
   collapsing there. It is scoped to `.text-section.wide` AND attached only to
   the nodes listed below, so it cannot reach the other live uses of
   `.hhc-card` (node bodies and block bodies elsewhere) even by accident.

   ATTACHED TO FIVE NODES, not four, since 2026-08-23. The /ayahuasca-ceremony
   redesign (node 108, design-run-5) put an `.hhc-card.--reverse` inside a
   `.text-section.wide` in its "What Makes Hummingbird's Ceremonies Unique and
   Responsible" section, and case 108 in hhc.theme now attaches
   hhc/hhc-card-in-measure alongside hhc/figure and hhc/photo-band. The scoping
   claim above is unchanged and still true; only the count and the original
   note that "no live `.hhc-card` anywhere on the site sits inside a
   `.text-section` today" are out of date — node 108 is now such a page, and it
   is styled by this file deliberately rather than by accident.

   WHY, MEASURED against the current live component (`minmax(280px, 45%) 1fr`
   below 1301px, `minmax(300px, 600px) 1fr` above it), image 1462x800:

     viewport   side by side                        stacked
       1440     media 498px, text 214px, card 1507  736px, card 937, no crop
       1280     media 333px, text 383px, card  811  740px, card 888
       1100     media 336px, text 387px, card  774  747px, card 867
        950     media 338px, text 390px, card  713  752px, card 819

   `align-items: stretch` plus `.hhc-card__media img { height: 100% }` makes the
   image match whatever row height the squeezed prose creates, so the picture is
   cropped from 1.83:1 to 0.33:1 at 1440 and 0.41:1 at 1280. The image never
   grew — the text column collapsed and dragged it.

   THIS IS NOT RESTYLING A SHARED COMPONENT. The component's own author put a
   stacking breakpoint at `max-width: 900px`; our container hands it 731px. So
   stacking is what `.hhc-card` already says it wants at this width. The only
   thing wrong is that its breakpoint reads the VIEWPORT, and this theme has no
   container queries. This applies the component's existing decision using the
   trigger that is actually available.

   NO `max-height`. The prototype carried `max-height: 400px` from an older
   version of the component. Reinstating it would reinstate exactly the silent
   crop that was deliberately removed from hhc-card.scss on 2026-08-18: with
   `width: 100%` and `object-fit: cover`, a height cap trims the difference.
   Measured here it costs 0.7% of the frame at 1440 rising to 2.7% at 950, and
   dropping it changes the card height by about 3px. Not ported.

   `$space-24` is off the Harmonic set. It is replicated from the component's
   own stacked rule so the card looks identical either side of 900px rather
   than jumping — copied, not chosen.
   --------------------------------------------------------------------------- */
.text-section.wide .hhc-card {
  grid-template-columns: 1fr;
  grid-template-areas: "media" "content";
  gap: 1.5rem;
  padding-left: 0;
  padding-right: 0;
}

.text-section.wide .hhc-card__media img {
  height: auto;
}

.text-section.wide .hhc-card__content {
  text-align: left;
  padding: 1rem;
}

/*# sourceMappingURL=hhc-card-in-measure.css.map */