/* Leadership v2 · six seats, one line. Brief: PROMPT-leadership-v2.md. Rules: DESIGN-LANGUAGE.md.
   Page rules carry the ld- prefix and never redefine a shared rule.
   Grounds: navy over the building (S1), cream (S2, the walk), the sky room (S2b, the biography), night (S3, the closing).
   Curves: --ease-out for settles, --ease-in-out for the morph, --ease-surface for wipes, the sheet and the hem, --ease-in for leaving.
   The flat layout (six seats in flow) is the base; the pinned walk is an enhancement for wide screens with script and without reduced motion. */
:root { --sky-room: color-mix(in srgb, var(--sky) 22%, #fff); }
main { background: var(--navy); }

/* ── S1 · The cover: the building at night, the six seats at its foot ── */
.ld-cover { position: relative; z-index: 1; height: calc(100svh - 114px); max-height: 648px; min-height: 520px; background: var(--navy); color: #fff; overflow: clip; isolation: isolate;
  transform: translateY(calc(var(--p, 0) * 42%)) scale(calc(1 - .04 * var(--p, 0))); transform-origin: 50% 50%; will-change: transform; }
.ld-cover::after { content: ""; position: absolute; inset: 0; z-index: 3; background: var(--night); opacity: calc(var(--p, 0) * .6); pointer-events: none; }
.ld-cover-ph { position: absolute; inset: 0; margin: 0; z-index: 0; }
.ld-cover-ph img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 38%; scale: 1.08; transition: scale 1800ms var(--ease-out); }
.ld-cover.ready .ld-cover-ph img { scale: 1; }
.ld-cover-scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(to bottom, rgba(11,36,67,.62) 0, rgba(11,36,67,0) 180px), linear-gradient(to top, rgba(11,36,67,.97) 0%, rgba(11,36,67,.88) 34%, rgba(11,36,67,.34) 56%, rgba(11,36,67,0) 100%); }
.ld-cover-in { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; padding-block: 26px clamp(30px, 4.5vh, 44px); }
.ld-crumbs { display: flex; align-items: center; gap: 8px; font-size: 13px; color: rgba(255,255,255,.72); }
.ld-crumbs a:hover { color: #fff; }
.ld-crumbs .sep { width: 12px; height: 12px; opacity: .6; flex: none; }
[dir="rtl"] .ld-crumbs .sep { transform: scaleX(-1); }
.ld-cover-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 48px; margin-top: auto; }
.ld-h1 { font-size: clamp(56px, 8.4vw, 120px); line-height: 1; font-weight: 700; letter-spacing: -.04em; margin: 0; max-width: 14ch; color: #fff; }
[dir="rtl"] .ld-h1 { letter-spacing: 0; line-height: 1.15; }
.ld-sub { margin: 0 0 12px; max-width: 40ch; font-size: clamp(17px, 1.55vw, 22px); font-weight: 500; line-height: 1.4; color: rgba(255,255,255,.9); }
[dir="rtl"] .ld-sub { line-height: 1.6; }

/* The six seats on one line: the organisation diagram, drawn three times (cover, index, closing) at three sizes */
.ld-six { --six-w: 172px; --six-gap: 48px; --six-r: 14px; --six-line: rgba(255,255,255,.3); position: relative; display: flex; gap: var(--six-gap); align-items: flex-start; margin: 0; padding: 0; list-style: none; }
.ld-six::before { content: ""; position: absolute; inset-inline: 0; top: calc(var(--six-w) * 1.25); height: 1px; background: var(--six-line); pointer-events: none; }
.ld-tile { position: relative; display: block; width: var(--six-w); flex: none; color: inherit; text-decoration: none; border: 0; background: none; padding: 0; margin: 0; font: inherit; text-align: start; cursor: pointer; border-radius: var(--six-r); }
.ld-tile-ph { display: block; width: 100%; aspect-ratio: 4 / 5; border-radius: var(--six-r); overflow: hidden; background: #e9e9e9; transition: translate 400ms var(--ease-out); }
.ld-tile:hover .ld-tile-ph { translate: 0 -4px; }
.ld-tile-ph img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; clip-path: inset(0 0 0 0); scale: 1;
  transition: clip-path 900ms var(--ease-surface) calc(var(--k, 0) * 70ms), scale 1200ms var(--ease-out) calc(var(--k, 0) * 70ms); }
.ld-tile-cap { display: block; margin-top: 12px; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.78); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ld-tile-cap b { color: var(--sky); margin-inline-end: 8px; font-variant-numeric: tabular-nums; }
[dir="rtl"] .ld-tile-cap { letter-spacing: 0; font-size: 14px; }
.ld-six-cover { margin-top: clamp(28px, 4.5vh, 44px); --six-gap: clamp(8px, 3.3vw, 48px); --six-w: min(172px, calc((100% - 5 * var(--six-gap)) / 6)); }
/* the six open on the rule as the cover settles (the page's own picture arriving; the words rising is the floor) */
.js .ld-cover:not(.ready) .ld-six-cover .ld-tile-ph img { clip-path: inset(100% 0 0 0); scale: 1.06; }

/* ── S2 · The walk: six seats in one line (base: in flow) ── */
.ld-walk { position: relative; z-index: 3; background: var(--cream); color: var(--navy); }
.ld-stage-in { padding-block: clamp(72px, 9vw, 112px) clamp(64px, 8vw, 96px); }
.ld-stage-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; }
.ld-cap { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.ld-eb { font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); margin: 0; }
[dir="rtl"] .ld-eb { letter-spacing: 0; font-size: 14px; }
.ld-h2 { font-size: clamp(17px, 1.5vw, 22px); font-weight: 500; color: var(--ink-2); margin: 0; line-height: 1.25; letter-spacing: 0; }
.ld-six-index { --six-w: 32px; --six-gap: 10px; --six-r: 6px; --six-line: var(--line); align-items: flex-end; height: 50px; }
.ld-six-index::before { top: auto; bottom: 0; }
.ld-six-index .ld-tile { opacity: .5; transform-origin: 50% 100%; transition: transform 500ms var(--ease-out), opacity 500ms var(--ease-out); }
.ld-six-index .ld-tile.cur { opacity: 1; transform: scale(1.25); }
.ld-six-index .ld-tile:hover .ld-tile-ph { translate: 0 -2px; }
.ld-six-index .ld-tile-cap { display: none; }
.ld-track { list-style: none; margin: 40px 0 0; padding: 0; display: block; }
.ld-seat { display: block; }
.ld-seat + .ld-seat { margin-top: 56px; }
.ld-seat-ph { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; background: #e9e9e9; isolation: isolate; }
.ld-seat-ph img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; clip-path: inset(0 0 0 0); scale: 1; transition: clip-path 900ms var(--ease-surface), scale 1200ms var(--ease-out); }
/* a portrait waits closed only once script has placed it outside the viewport; it opens as its seat enters */
.js .ld-seat-ph.wait img { clip-path: inset(100% 0 0 0); scale: 1.06; }
.ld-seat-tx { margin-top: 22px; min-width: 0; }
.ld-role { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); display: flex; gap: 12px; align-items: baseline; }
.ld-role .ld-n { color: var(--muted); font-variant-numeric: tabular-nums; }
[dir="rtl"] .ld-role { letter-spacing: 0; font-size: 14px; }
.ld-name { margin: 12px 0 0; font-size: clamp(28px, 8.2vw, 34px); line-height: 1.08; font-weight: 700; letter-spacing: -.02em; max-width: 16ch; color: var(--navy); }
[dir="rtl"] .ld-name { letter-spacing: 0; line-height: 1.25; }
.ld-sum { margin: 14px 0 0; font-size: 16px; line-height: 1.55; color: var(--ink-2); max-width: 44ch; }
[dir="rtl"] .ld-sum { line-height: 1.75; font-weight: 500; }
.ld-read { margin-top: 24px; }
.ld-count { display: none; }

/* wide screens in flow (reduced motion, or no script): the portrait at the start, the words at the end */
@media (min-width: 901px) {
  .ld-seat { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 4vw, 64px); align-items: center; }
  .ld-seat + .ld-seat { margin-top: clamp(64px, 8vh, 96px); }
  .ld-seat-ph { max-width: 448px; }
  .ld-seat-tx { margin-top: 0; }
  .ld-name { font-size: clamp(32px, 3.9vw, 56px); line-height: 1.05; }
  .ld-sum { font-size: clamp(16px, 1.4vw, 20px); margin-top: 18px; }
  .ld-read { margin-top: 28px; }
}

/* the pinned walk: one 100svh frame in a 475svh wrapper; the line of six travels sideways with the scroll */
@media (min-width: 901px) {
  html.js:not(.ld-rm) .ld-walk { height: 475svh; }
  html.js:not(.ld-rm) .ld-stage { position: sticky; top: 0; height: 100svh; overflow: clip; isolation: isolate; }
  html.js:not(.ld-rm) .ld-stage-in { height: 100%; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; padding-block: clamp(84px, 11vh, 104px) clamp(28px, 5vh, 48px); }
  html.js:not(.ld-rm) .ld-stage-top { flex-wrap: nowrap; }
  html.js:not(.ld-rm) .ld-track { display: flex; gap: var(--seat-gap, 120px); align-self: center; width: max-content; margin: 0; will-change: transform; }
  html.js:not(.ld-rm) .ld-seat { --ph: min(560px, calc(100svh - 300px)); display: flex; gap: 40px; align-items: center; flex: none; width: calc(var(--ph) * .8 + 380px); margin: 0; }
  html.js:not(.ld-rm) .ld-seat-ph { flex: none; width: calc(var(--ph) * .8); height: var(--ph); aspect-ratio: auto; max-width: none; cursor: pointer;
    transform: perspective(1200px) rotateX(calc(var(--ry, 0) * -6deg)) rotateY(calc(var(--rx, 0) * 6deg)) translate(calc(var(--rx, 0) * 8px), calc(var(--ry, 0) * 8px)); transition: transform 600ms var(--ease-out); }
  html.js:not(.ld-rm) .ld-seat-ph::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; mix-blend-mode: soft-light;
    background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgba(255,255,255,.95) 0, rgba(255,255,255,.45) 22%, transparent 60%); transition: opacity 400ms var(--ease-out); }
  html.js:not(.ld-rm) .ld-seat-ph.lit::after { opacity: .25; }
  html.js:not(.ld-rm) .ld-seat-tx { flex: 1; min-width: 0; }
  html.js:not(.ld-rm) .ld-count { display: block; margin: 0; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink-2); direction: ltr; white-space: nowrap; align-self: end; justify-self: start; }
}

/* ── S2b · The biography room: the sky room, the page's one light moment ── */
.ld-bio { position: fixed; inset: 0; margin: auto; width: min(1160px, calc(100% - 40px)); height: min(820px, calc(100% - 40px)); max-width: none; max-height: none; padding: 0; border: 0; border-radius: var(--r-big);
  background: var(--sky-room); color: var(--navy); overflow: hidden; display: none; flex-direction: column; box-shadow: 0 40px 90px -30px rgba(7,26,51,.45); outline: none; }
.ld-bio[open] { display: flex; }
.ld-bio::backdrop { background: rgba(7,26,51,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 1; transition: opacity 500ms var(--ease-out); }
@starting-style { .ld-bio[open]::backdrop { opacity: 0; } }
.ld-bio.leaving::backdrop { opacity: 0; transition: opacity 320ms var(--ease-in); }
/* without a portrait to grow from, the room rises out of a soft scale; with one, the morph carries it and the words follow */
.ld-bio.soft:not(.shown) { opacity: 0; transform: translateY(24px) scale(.97); }
.ld-bio.soft { transition: opacity 420ms var(--ease-out), transform 600ms var(--ease-out); }
.ld-bio.soft.leaving { opacity: 0; transform: translateY(16px) scale(.98); transition: opacity 300ms var(--ease-in), transform 300ms var(--ease-in); }
.ld-bar { position: relative; z-index: 3; flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px 14px 28px; border-bottom: 1px solid transparent; transition: border-color 300ms; }
[dir="rtl"] .ld-bar { padding: 14px 28px 14px 18px; }
.ld-bio.scrolled .ld-bar { border-bottom-color: var(--line); }
.ld-bar-count { font-size: 13px; font-weight: 700; letter-spacing: .1em; color: var(--muted); font-variant-numeric: tabular-nums; direction: ltr; }
.ld-bar-count b { color: var(--navy); }
.ld-bar-nav { display: flex; gap: 8px; }
.ld-ic { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: rgba(255,255,255,.85); color: var(--navy); display: grid; place-items: center; padding: 0; cursor: pointer;
  transition: background 250ms, color 250ms, border-color 250ms, transform 150ms var(--ease-out); }
.ld-ic svg { width: 16px; height: 16px; }
[dir="rtl"] .ld-bar-nav .ld-ic:not(.ld-x) svg { transform: scaleX(-1); }
.ld-ic:hover { background: var(--navy); color: #fff; border-color: var(--navy); }
.ld-ic:active { transform: scale(.92); }
.ld-x svg { transition: transform 400ms var(--ease-out); }
.ld-x:hover svg { transform: rotate(90deg); }
.ld-scroll { flex: 1; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; outline: none; }
.ld-scroll:focus-visible { box-shadow: inset 0 0 0 2px var(--blue); }
.ld-body { display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); padding: 4px clamp(24px, 4vw, 56px) 56px 28px; align-items: start; }
[dir="rtl"] .ld-body { padding: 4px 28px 56px clamp(24px, 4vw, 56px); }
.ld-bph { position: sticky; top: 4px; aspect-ratio: 4 / 5; border-radius: 20px; overflow: hidden; background: #e9e9e9; }
.ld-bph.waiting { visibility: hidden; }
.ld-bph img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; position: relative; }
.ld-bph .old { position: absolute; inset: 0; }
.ld-bph .old img { position: static; }
.ld-bph img.wipe { position: absolute; inset: 0; animation: ldWipe 760ms var(--ease-surface) both; }
@keyframes ldWipe { from { clip-path: inset(100% 0 0 0); transform: scale(1.06); } to { clip-path: inset(0 0 0 0); transform: none; } }
.ld-btx { padding-top: 20px; max-width: 660px; }
.ld-brole { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--blue); }
[dir="rtl"] .ld-brole { letter-spacing: 0; font-size: 14px; }
.ld-bname { margin: 12px 0 0; font-size: clamp(34px, 4vw, 56px); line-height: 1.04; font-weight: 700; letter-spacing: -.03em; color: var(--navy); }
[dir="rtl"] .ld-bname { letter-spacing: 0; line-height: 1.25; }
.ld-blead { margin: 18px 0 0; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.5; font-weight: 500; color: var(--navy); }
.ld-facts { margin: 28px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-block: 1px solid var(--line); }
.ld-facts > div { padding: 16px 16px 16px 0; min-width: 0; }
[dir="rtl"] .ld-facts > div { padding: 16px 0 16px 16px; }
.ld-facts > div + div { border-inline-start: 1px solid var(--line); padding-inline-start: 16px; }
.ld-facts dt { font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
[dir="rtl"] .ld-facts dt { letter-spacing: 0; font-size: 13px; }
.ld-facts dd { margin: 8px 0 0; font-size: 15px; line-height: 1.45; font-weight: 500; color: var(--navy); }
.ld-bbio { margin-top: 30px; }
.ld-bbio p { margin: 0 0 16px; font-size: 17px; line-height: 1.6; color: var(--ink-2); max-width: 60ch; }
[dir="rtl"] .ld-bbio p { line-height: 1.85; }
.ld-quote { margin: 26px 0 0; padding-inline-start: 22px; border-inline-start: 2px solid var(--blue); font-size: clamp(21px, 1.9vw, 26px); line-height: 1.4; font-weight: 300; color: var(--navy); }
[dir="rtl"] .ld-quote { font-weight: 400; line-height: 1.6; }
.ld-prof { margin-top: 30px; }
/* the words arrive after the surface lands, in the house rise (no blur), and leave before it folds */
.ld-btx > *, .ld-bbio > p { transition: opacity 520ms var(--ease-out), transform 620ms var(--ease-out); transition-delay: calc(80ms + var(--k, 0) * 45ms); }
.ld-bio:not(.shown) .ld-btx > *, .ld-bio:not(.shown) .ld-bbio > p { opacity: 0; transform: translateY(14px); }
.ld-bio.leaving .ld-btx > *, .ld-bio.leaving .ld-bbio > p, .ld-bio.stepping .ld-btx > *, .ld-bio.stepping .ld-bbio > p { opacity: 0; transform: translateY(-6px); transition: opacity 180ms var(--ease-in), transform 200ms var(--ease-in); transition-delay: 0ms; }
.ld-bbio { opacity: 1 !important; transform: none !important; }
/* the morph: the seat's portrait and the room's portrait share one name for the length of the open */
html.ld-vt::view-transition-group(ld-face) { animation-duration: 520ms; animation-timing-function: var(--ease-in-out); }
html.ld-vt-out::view-transition-group(ld-face) { animation-duration: 365ms; animation-timing-function: var(--ease-in); }
html.ld-vt::view-transition-old(ld-face), html.ld-vt::view-transition-new(ld-face), html.ld-vt-out::view-transition-old(ld-face), html.ld-vt-out::view-transition-new(ld-face) { height: 100%; object-fit: cover; }
html.ld-vt::view-transition-old(root), html.ld-vt::view-transition-new(root) { animation-duration: 300ms; }
html.ld-vt-out::view-transition-old(root), html.ld-vt-out::view-transition-new(root) { animation-duration: 240ms; }
.ld-fly { position: fixed; z-index: 123; pointer-events: none; overflow: hidden; background: #e9e9e9; }
.ld-fly img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }

/* ── S3 · The closing room: night, the hem above it, the six arriving on the rule ── */
.ld-close { position: relative; z-index: 4; background: var(--night); color: #fff; }
.ld-close .hem path { fill: var(--night); }
.ld-close-body { position: relative; overflow: hidden; isolation: isolate; min-height: 640px; padding-top: clamp(72px, 9vw, 120px); }
.ld-noise { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .045;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0 / 260px 260px repeat; }
.ld-close-in { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 48px; align-items: end; }
.ld-phone { display: flex; justify-content: center; align-items: flex-end; align-self: end; min-height: 0; }
.ld-phone img { width: min(380px, 92%); margin-bottom: -90px; transform: translateY(var(--rp, 140px)); transition: transform 1200ms var(--ease-out); }
.ld-close.in .ld-phone img { --rp: 0px; }
.ld-close-copy { padding-bottom: clamp(72px, 9vw, 120px); }
.ld-six-end { --six-w: 44px; --six-gap: 14px; --six-r: 8px; --six-line: rgba(255,255,255,.24); align-items: flex-end; height: 66px; margin-bottom: clamp(36px, 5vh, 52px); }
.ld-six-end::before { top: auto; bottom: 0; }
.ld-six-end .ld-tile { opacity: .55; transition: opacity 600ms var(--ease-out) calc(300ms + var(--k, 0) * 60ms); }
.ld-close.in .ld-six-end .ld-tile { opacity: 1; }
.ld-six-end .ld-tile-cap { display: none; }
.ld-close .ld-eb { color: var(--sky); margin-bottom: 14px; }
.ld-close-h { font-size: clamp(40px, 5vw, 72px); line-height: 1.02; font-weight: 300; letter-spacing: -.03em; margin: 0; max-width: 14ch; color: #fff; }
.ld-close-h b { font-weight: 700; }
[dir="rtl"] .ld-close-h { letter-spacing: 0; line-height: 1.25; }
.ld-close-lead { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: rgba(255,255,255,.8); margin: 20px 0 0; max-width: 44ch; }
.ld-actions { margin-top: 32px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ld-portal { color: #fff; margin-inline-start: 8px; }

/* ── Phones and small screens ── */
@media (max-width: 900px) {
  .ld-cover { height: 560px; min-height: 0; }
  .ld-cover-in { padding-block: 22px 26px; }
  .ld-cover-row { flex-direction: column; align-items: flex-start; gap: 14px; }
  .ld-sub { margin-bottom: 0; }
  .ld-six-cover { margin-top: 26px; --six-r: 8px; }
  .ld-six-cover .ld-tile-cap { display: none; }
  .ld-stage-top { gap: 24px; }
  .ld-close-body { min-height: 0; padding-top: 72px; }
  .ld-close-in { grid-template-columns: 1fr; gap: 24px; }
  .ld-phone { order: 2; }
  .ld-close-copy { padding-bottom: 0; }
  .ld-six-end { margin-bottom: 36px; }
  .ld-phone img { width: min(300px, 78%); margin-bottom: -70px; }
  .ld-bio { width: 100%; height: 100%; border-radius: 0; box-shadow: none; }
  .ld-body, [dir="rtl"] .ld-body { grid-template-columns: 1fr; gap: 0; padding: 0 0 48px; }
  .ld-bph { position: relative; top: 0; aspect-ratio: 1 / 1.02; border-radius: 0; }
  .ld-btx { padding: 24px 20px 0; }
  .ld-bar, [dir="rtl"] .ld-bar { padding: 10px 12px 10px 20px; }
  [dir="rtl"] .ld-bar { padding: 10px 20px 10px 12px; }
  .ld-ic { width: 42px; height: 42px; }
  .ld-bname { font-size: 34px; }
  .ld-blead { font-size: 18px; }
  .ld-facts { grid-template-columns: 1fr; }
  .ld-facts > div + div { border-inline-start: 0; padding-inline-start: 0; border-top: 1px solid var(--line); }
  .ld-bbio p { font-size: 16.5px; }
}
@media (max-width: 480px) {
  .ld-cover { height: 540px; }
  .ld-h1 { font-size: 56px; }
}
@media (min-width: 901px) and (max-width: 1080px) {
  .ld-body { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
  .ld-facts { grid-template-columns: 1fr; }
  .ld-facts > div + div { border-inline-start: 0; padding-inline-start: 0; border-top: 1px solid var(--line); }
}

/* ── Comps: the still states, no transitions (?comp=1) ── */
html.ld-comp .ld-cover, html.ld-comp .ld-cover-ph img, html.ld-comp .ld-tile-ph, html.ld-comp .ld-tile-ph img, html.ld-comp .ld-tile, html.ld-comp .ld-seat-ph, html.ld-comp .ld-seat-ph img, html.ld-comp .ld-seat-ph::after,
html.ld-comp .ld-phone img, html.ld-comp .ld-bio, html.ld-comp .ld-bio::backdrop, html.ld-comp .ld-btx > *, html.ld-comp .ld-bbio > p, html.ld-comp .ld-bph img { transition: none !important; animation: none !important; }

/* ── Reduced motion: the finished page at first paint. No pin, no sheet, no morph, no wipe; the room appears over 200ms. ── */
html.ld-rm .ld-cover { transform: none !important; }
html.ld-rm .ld-cover::after { opacity: 0; }
html.ld-rm .ld-cover-ph img { scale: 1; transition: none; }
html.ld-rm .ld-tile-ph img, html.ld-rm.js .ld-cover:not(.ready) .ld-six-cover .ld-tile-ph img { clip-path: none; scale: 1; transition: none; }
html.ld-rm .ld-seat-ph img, html.ld-rm.js .ld-seat-ph.wait img { clip-path: none; scale: 1; transition: none; }
html.ld-rm .ld-tile-ph, html.ld-rm .ld-six-index .ld-tile, html.ld-rm .ld-six-end .ld-tile { transition: none; }
html.ld-rm .ld-six-end .ld-tile { opacity: 1; }
html.ld-rm .ld-phone img { --rp: 0px; transition: none; }
html.ld-rm .ld-bio, html.ld-rm .ld-bio.soft { transition: opacity 200ms linear; transform: none; }
html.ld-rm .ld-bio.soft:not(.shown) { opacity: 0; transform: none; }
html.ld-rm .ld-btx > *, html.ld-rm .ld-bbio > p, html.ld-rm .ld-bio:not(.shown) .ld-btx > *, html.ld-rm .ld-bio:not(.shown) .ld-bbio > p { opacity: 1; transform: none; transition: none; }
html.ld-rm .ld-bph img.wipe { animation: none; }
html.ld-rm .ld-bio::backdrop { transition: opacity 200ms linear; }
