/* ==========================================================================
   Grids — the layout side of tools/grid.json.

   A photograph declares WHICH GRID it sits in and nothing else: no width, no
   srcset, no sizes. core/media.js turns the grid into the `sizes` attribute
   through the generated table in core/grid.js, and tools/build-images.py used
   the same table to decide which widths to encode.

   ROAM is the first landing here whose artwork is not all photography. The four
   vehicles are cut-outs on a transparent ground: they ship as WebP with a PNG
   fallback, declared per slot in assets/js/images.js, because a JPEG cannot
   carry an alpha channel and the car would arrive on a white rectangle.
   ========================================================================== */

[data-img] > picture { display: block; width: 100%; height: 100%; }
[data-img] > picture > img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* a cut-out is not cropped to its box — it is a drawing, and it keeps its own
   proportions inside whatever space the stage gives it */
.stage__art > picture > img { object-fit: contain; }

/* --------------------------------------------------------------------------
   The reservation, and why it is refused here.

   core/media.js reserves a figure's box from the slot's aspect ratio BEFORE
   fetching anything, so the document reaches its true height first. It does
   that with an inline min-height, cleared the moment the picture is built.

   On this page the road is measured from the layout — route.js fits a spline
   through where the anchors actually sit — so a box that is briefly taller than
   its final height would bend the road and then straighten it as the
   photographs arrive. Every photographic box here is already sized by its own
   stylesheet, so the reservation is refused outright.
   -------------------------------------------------------------------------- */
[data-img] { min-height: 0 !important; }

/* --------------------------------------------------------------------------
   g-bleed / g-bleed-tall      the opening frame, the sunset road, phone crops
   g-interior / -tall          the cabin, seen through the windscreen
   g-choice                    one of the three fork photographs
   g-car                       a vehicle cut-out (WebP + PNG)
   g-fleet-scene               the road behind the fleet stage
   g-airport-main / -curb      arrivals, and the car at the kerb
   g-branch / -detail          the chosen route, large and small
   g-city-wide / -tall         the frames in the city rail
   g-terrace                   the terrace at the end of the road
   g-share                     not a layout: the social card
   -------------------------------------------------------------------------- */