/* Cybereum · thesis-film.css — the About thesis hero film ("The line that lies").
   Layout for the two-column thesis section and the film frame. The frame is an
   always-dark instrument (like a video) in both themes; its palette is handed to the
   canvas through the --film-* tokens below, all derived from the brand constants in
   site-core.css so the canvas can never drift from the identity. */
.thesis-layout{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(2rem,4.5vw,4.5rem);align-items:center}
.thesis-copy .quote{margin-top:22px}
.thesis-copy .section-intro{margin-top:18px}
@media (max-width:980px){
  .thesis-layout{grid-template-columns:minmax(0,1fr);gap:2.25rem}
}

.thesis-film{
  --film-signal:var(--cyb-cyan);
  --film-focus:var(--cyb-amber);
  --film-tail:color-mix(in srgb,var(--cyb-signal) 70%,#fff);
  --film-settled:var(--cyb-green);
  --film-hull:var(--cyb-ink);
  --film-slate:color-mix(in srgb,var(--cyb-mist) 42%,var(--cyb-navy-2));
  --film-ink:var(--cyb-glow);
  --film-mist:var(--cyb-mist);
  --film-dim:color-mix(in srgb,var(--cyb-mist) 62%,var(--cyb-navy-2));
  --film-ice:color-mix(in srgb,var(--cyb-cyan) 58%,#fff);
  --film-bg-0:var(--cyb-navy);
  --film-bg-1:var(--cyb-navy-2);
  --film-bg-2:var(--cyb-ink);
  position:relative;margin:0;display:grid;grid-template-rows:auto auto auto;min-width:0;
  border:1px solid color-mix(in srgb,var(--cyb-cyan) 22%,transparent);border-radius:var(--cyb-radius-md);
  background:var(--film-bg-0);color:var(--film-ink);overflow:hidden;
  box-shadow:0 28px 80px -48px rgb(0 0 0/.82),0 0 0 1px color-mix(in srgb,var(--cyb-cyan) 5%,transparent) inset;
}
/* Explicit height, not an aspect ratio: on a wide laptop a 4:3 stage grew past the copy
   beside it and the brand close floated in the top half of an empty frame. */
.thesis-film__stage{position:relative;height:clamp(380px,34vw,560px);overflow:hidden;background:var(--film-bg-0)}
@media (max-width:980px){.thesis-film__stage{height:clamp(340px,62vw,520px)}}
@media (max-width:520px){.thesis-film__stage{height:min(100vw,420px)}}
.thesis-film__canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
/* soft edge falloff, as in the source cut */
.thesis-film__stage::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(72% 64% at 48% 44%,transparent 46%,rgb(2 5 13/.16) 70%,rgb(2 5 13/.5) 100%)}

/* brand resolution: lives inside the stage, never over the page */
.thesis-film__brand{position:absolute;inset:0;pointer-events:none;visibility:hidden}
.thesis-film__brand.is-on{visibility:visible}
.thesis-film__veil{position:absolute;inset:0;opacity:0;background:radial-gradient(52% 42% at 50% 40%,color-mix(in srgb,var(--cyb-cyan) 9%,transparent),transparent 60%),var(--film-bg-0)}
.thesis-film__transit{position:absolute;left:0;top:0;width:200px;height:200px;transform-origin:0 0;opacity:0;overflow:visible;filter:drop-shadow(0 0 var(--glow,18px) color-mix(in srgb,var(--cyb-cyan) calc(var(--glow-a,.35) * 100%),transparent))}
.thesis-film__brand.is-on .thesis-film__transit{will-change:transform,opacity}
.thesis-film__lockup{position:absolute;left:50%;top:60%;width:min(400px,62%);transform:translateX(-50%);display:grid;justify-items:center;gap:10px}
.thesis-film__wordmark{width:100%;height:auto;fill:var(--cyb-cyan);opacity:0}
.thesis-film__rule{display:block;width:min(240px,64%);height:1px;opacity:0;transform-origin:center;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--cyb-cyan) 46%,transparent),transparent)}
.thesis-film__tagline{margin:0;opacity:0;white-space:nowrap;text-align:center;color:var(--film-mist);font:500 clamp(.7rem,.62rem + .35vw,.86rem)/1.2 var(--cyb-body);letter-spacing:.1em}

/* captions: the editorial clock, authored in the HTML */
.thesis-film__caps{position:relative;margin:0;padding:0;list-style:none;min-height:7.6rem;border-top:1px solid color-mix(in srgb,var(--cyb-cyan) 14%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--cyb-navy-2) 72%,var(--cyb-navy)),var(--cyb-navy))}
.thesis-film__cap{position:absolute;inset:0;padding:1rem 1.25rem .9rem;opacity:0;transform:translateY(8px);transition:opacity .28s ease,transform .28s ease;pointer-events:none}
.thesis-film__cap.is-on{opacity:1;transform:none;transition:opacity .36s ease .05s,transform .36s ease .05s}
.thesis-film__cap b{display:block;font:400 clamp(.98rem,.9rem + .35vw,1.18rem)/1.25 var(--cyb-display);letter-spacing:.02em;color:var(--film-ink);text-wrap:balance}
.thesis-film__cap p{margin:.5rem 0 0;max-width:60ch;font-size:.86rem;line-height:1.55;color:var(--film-mist)}
.thesis-film__cap small{display:block;margin-top:.55rem;font:500 .68rem/1.4 var(--cyb-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--film-dim)}
@media (max-width:520px){.thesis-film__caps{min-height:9.6rem}.thesis-film__cap p{font-size:.8rem}}

/* transport */
.thesis-film__bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.8rem;padding:.6rem .9rem .65rem;border-top:1px solid color-mix(in srgb,var(--cyb-cyan) 14%,transparent);background:var(--cyb-navy);font:500 .72rem/1 var(--cyb-mono);color:var(--film-dim)}
.thesis-film__play{display:grid;place-items:center;width:32px;height:32px;border:1px solid color-mix(in srgb,var(--cyb-cyan) 34%,transparent);border-radius:7px;color:var(--cyb-cyan);background:color-mix(in srgb,var(--cyb-cyan) 4%,transparent);transition:background var(--cyb-fast),border-color var(--cyb-fast)}
.thesis-film__play:hover{background:color-mix(in srgb,var(--cyb-cyan) 12%,transparent)}
.thesis-film__play:focus-visible{outline:2px solid var(--cyb-cyan);outline-offset:3px}
.thesis-film__play svg{width:11px;height:12px;display:block;fill:currentColor}
.thesis-film__play .i-pause,.thesis-film__play .i-replay{display:none}
.thesis-film.is-playing .thesis-film__play .i-play{display:none}
.thesis-film.is-playing .thesis-film__play .i-pause{display:block}
.thesis-film.is-ended .thesis-film__play .i-play{display:none}
.thesis-film.is-ended .thesis-film__play .i-replay{display:block}
.thesis-film__track{position:relative;height:28px;min-width:0;cursor:pointer;touch-action:none}
.thesis-film__track:focus-visible{outline:2px solid var(--cyb-cyan);outline-offset:3px;border-radius:4px}
.thesis-film__track::before{content:"";position:absolute;left:0;right:0;top:50%;height:3px;translate:0 -50%;border-radius:2px;background:color-mix(in srgb,var(--cyb-mist) 22%,transparent)}
.thesis-film__fill{position:absolute;left:0;top:50%;height:3px;width:100%;translate:0 -50%;transform-origin:0 50%;transform:scaleX(var(--p,0));border-radius:2px;background:var(--cyb-cyan);box-shadow:0 0 12px color-mix(in srgb,var(--cyb-cyan) 25%,transparent)}
.thesis-film__mark{position:absolute;left:var(--at,0%);top:50%;width:1px;height:9px;translate:0 -50%;background:color-mix(in srgb,var(--cyb-mist) 46%,transparent)}
.thesis-film__chapters{display:flex;gap:.2rem;margin:0;padding:0;list-style:none}
.thesis-film__chapters button{padding:.45rem .5rem;font:500 .7rem/1 var(--cyb-mono);letter-spacing:.06em;color:color-mix(in srgb,var(--cyb-mist) 62%,transparent);border-bottom:1px solid color-mix(in srgb,var(--cyb-mist) 20%,transparent);transition:color var(--cyb-fast),border-color var(--cyb-fast)}
.thesis-film__chapters button:hover{color:var(--film-ink)}
.thesis-film__chapters button[aria-current="true"]{color:var(--cyb-amber);border-bottom-color:var(--cyb-amber)}
.thesis-film__chapters button:focus-visible{outline:2px solid var(--cyb-cyan);outline-offset:2px;border-radius:3px}
.thesis-film__clock{min-width:7.2ch;text-align:right;font-variant-numeric:tabular-nums;color:var(--film-mist)}
/* On phones the chapters keep their own row: scrubbing a 96-second slider is not navigation. */
@media (max-width:640px){
  .thesis-film__bar{grid-template-columns:auto minmax(0,1fr) auto;row-gap:.35rem}
  .thesis-film__chapters{grid-column:1/-1;justify-content:space-between}
  .thesis-film__chapters button{padding:.4rem .6rem}
}

@media (prefers-reduced-motion:reduce){
  .thesis-film__cap,.thesis-film__play,.thesis-film__chapters button{transition:none}
}
@media print{
  .thesis-film{display:none}
}