/* floor.css: the phone and accessibility floor, loaded last on every page.
   Each page keeps its own design; this only stops it falling below the line.
   Paired with js/floor.js (the film play button). */

/* ── frames take the picture's own shape on a phone.
   The galleries hold every picture in one ratio so a row lines up; in one column there is no row, and a
   fixed 4:3 or 9:17 frame was cutting half of a phone screenshot away or leaving half a deck page empty. */
@media (max-width:600px){
  .fr:has(> img:only-child){aspect-ratio:auto!important;height:auto!important}
  .fr > img:only-child{height:auto!important;aspect-ratio:auto!important}
}

/* ── films with controls: an edge, so a white poster does not dissolve into a white page,
   and one clear play button over the poster instead of the browser's control bar (floor.js adds it). */
video[controls],.pv video{box-shadow:0 0 0 1px rgba(128,128,128,.28)}
.pv{position:relative;display:block}
.pv > video{display:block}
.pv__play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;width:100%;margin:0;padding:0;
  border:0;background:linear-gradient(rgba(0,0,0,0) 55%,rgba(0,0,0,.35));color:#fff;cursor:pointer;font:inherit;border-radius:inherit}
.pv__play span{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px 0 16px;border-radius:999px;
  background:rgba(12,12,12,.78);font:500 13px/1 ui-monospace,"IBM Plex Mono",monospace;letter-spacing:.06em;text-transform:uppercase}
.pv__play span::before{content:"";width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent currentColor}
.pv__play:hover span,.pv__play:focus-visible span{background:#000}
.pv__play:focus-visible{outline:3px solid #fff;outline-offset:-6px}
.pv.is-playing .pv__play{display:none}

/* ── tap targets: footer and caption links were 14px tall; give them a 24px hit area without moving the type */
footer a,.foot a,.v2-foot a{display:inline-block;padding-block:5px}
/* text links whose underline sits tight to the type: an invisible 44px-tall hit area, so nothing visible moves */
.v2-go,a.ev,.ask__call,a.lk,a.back,.banner a,.cap a{position:relative} /* .chain__skip is already absolute */
.chain__skip::before,.v2-go::before,a.ev::before,.ask__call::before,a.lk::before,a.back::before,.banner a::before,.cap a::before{
  content:"";position:absolute;left:-4px;right:-4px;top:50%;height:44px;transform:translateY(-50%)}

/* ── motion: nothing here moves, but honour the preference for the play button's hover */
@media (prefers-reduced-motion:reduce){.pv__play,.pv__play span{transition:none}}