/* =========================================================
   LYFT v2 - ATMOSPHERE
   Loads LAST, after type.css. Two things live here, both of them
   "the room behind the content":

     1. CARD PLATES - a barely-there photograph of the actual zone behind
        each training card, which clears out of the way on hover.
     2. AMBIENT     - the sub-threshold background motion, home page only.

   Neither may ever cost the copy its contrast. That is the constraint the
   numbers below are chosen against, not taste.
   ========================================================= */


/* ---------------------------------------------------------
   1. CARD PLATES

   The brief: a background image at rest, and on hover the card returns to
   the clean lacquer panel it is today. That is INVERTED from every other
   hover on this site, which all read as "hover = more light". It is kept
   because it was asked for explicitly, and because the lift, the brighter
   sheen and the silver wash that silver.css already applies on hover still
   carry the "more" - the plate leaving is the quieter half of that move.

   Plates are built by tools/make_plates.py from the building's own renders:
   grayscale, crushed to black, blurred past legibility, and feathered to
   nothing across the left 60% of the frame. That feather is what lets the
   heading and body copy keep their contrast ratio - there is deliberately
   no scrim and no mask here, because the plate itself carries the falloff.
   --------------------------------------------------------- */
/* The one number worth tuning. Raise it if the plates read as too faint on your
   screen, lower it if they compete with the copy - nothing else needs touching.
   Above ~.18 the plate starts fighting the heading AND the worst-case contrast
   ratio behind the "Weight Loss & Gain" body copy (four lines running the full
   card width, the tightest case on the page) drops under the 4.5:1 AA floor.
   Below ~.10 it disappears entirely on a dim laptop panel. Measured at .13 the
   worst case sits at 5.3:1. */
:root{--plate-opacity:.13}

.card[data-plate]::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-size:cover;background-position:center;background-repeat:no-repeat;
  border-radius:inherit;
  opacity:var(--plate-opacity);
  transform:scale(1.02);
  transition:opacity .5s var(--ease),transform 1.1s var(--ease);
}

/* Hover clears the plate. Slightly longer than the .55s lift so the card
   settles first and the image dissolves under it, rather than the two
   competing for the same half second. */
@media (hover:hover) and (pointer:fine){
  .card[data-plate]:hover::before{opacity:0;transform:scale(1.06)}
}

@media (prefers-reduced-motion:reduce){
  .card[data-plate]::before{transition:none;transform:none}
}

/* gym.html - the six disciplines */
.card[data-plate="cardio"]::before     {background-image:url("../assets/cards/cardio.webp")}
.card[data-plate="strength"]::before   {background-image:url("../assets/cards/strength.webp")}
.card[data-plate="weightloss"]::before {background-image:url("../assets/cards/weightloss.webp")}
.card[data-plate="combat"]::before     {background-image:url("../assets/cards/combat.webp")}
.card[data-plate="dance"]::before      {background-image:url("../assets/cards/dance.webp")}
.card[data-plate="yoga"]::before       {background-image:url("../assets/cards/yoga.webp")}

/* gym.html - the training zones */
.card[data-plate="freeweights"]::before{background-image:url("../assets/cards/freeweights.webp")}
.card[data-plate="turf"]::before       {background-image:url("../assets/cards/turf.webp")}
.card[data-plate="cardiodeck"]::before {background-image:url("../assets/cards/cardiodeck.webp")}
.card[data-plate="studios"]::before    {background-image:url("../assets/cards/studios.webp")}
.card[data-plate="coaching"]::before   {background-image:url("../assets/cards/coaching.webp")}
.card[data-plate="rooftop"]::before    {background-image:url("../assets/cards/rooftop.webp")}


/* ---------------------------------------------------------
   2. AMBIENT MOTION - home page only

   Sits at z-index -1, above the body's own ground but below all content, so
   it shows through the flat black bands between sections and is occluded by
   the hero video, the lacquer panels and the tower canvas without any of
   them needing to know it exists.

   It deliberately does NOT carry its own grain: premium.css already lays a
   feTurbulence overlay across the whole viewport at 4% (body::after), and
   that is what keeps a soft luminance ramp on near-black from posterising
   into rings. A second grain layer would just double the cost.
   --------------------------------------------------------- */
#atmos{
  position:fixed;inset:0;width:100%;height:100%;
  z-index:-1;pointer-events:none;
  /* the bars are drawn crisp and softened here in one GPU pass, which is far
     cheaper than blurring 30 fills per frame in the 2D context */
  filter:blur(1.5px);
}

@media (prefers-reduced-motion:reduce){#atmos{display:none}}