/* COOL ACADEMY / film motion study: a quiet secondary detail of the School of the Arts chapter. */
.film-v76-motion{display:grid;grid-template-columns:minmax(0,1fr) clamp(148px,18vw,185px);gap:clamp(22px,3.8vw,58px);align-items:center;margin:42px 0 38px;padding:29px 0 0;border-top:1px solid #686d65;max-width:760px}
.film-v76-motion .section-label{color:#cbb987;font:700 10px/1.6 var(--sans);letter-spacing:.14em;text-transform:uppercase;margin:0 0 12px}
.film-v76-motion h3{font:400 clamp(31px,3vw,44px)/1.04 var(--serif);letter-spacing:-.025em;color:#e9dfcb;margin:0 0 13px}
.film-v76-motion h3 em{font-weight:400;color:#cdb781}
.film-v76-motion-copy>p:last-child{font:400 12px/1.75 var(--sans);color:#c8c9bf;max-width:300px;margin:0}
.film-v76-motion-media{width:100%;max-width:185px;justify-self:end}
.film-v76-motion-media video{display:block;width:100%;height:auto;aspect-ratio:512/684;object-fit:contain;background:#080d11;border:1px solid #777064;border-radius:2px;box-shadow:none;cursor:pointer}
.film-v76-motion-media video:focus-visible{outline:3px solid #d3b768;outline-offset:4px}
@media(max-width:500px){.film-v76-motion{grid-template-columns:minmax(0,1fr) 135px;gap:16px;margin:38px 0 30px;padding-top:25px}.film-v76-motion h3{font-size:31px}.film-v76-motion .section-label{font-size:9px}.film-v76-motion-copy>p:last-child{font-size:11px}}
@media(max-width:355px){.film-v76-motion{grid-template-columns:1fr;gap:18px}.film-v76-motion-media{justify-self:start;width:160px}}
@media(prefers-reduced-motion:reduce){.film-v76-motion-media video{scroll-behavior:auto}}

/* V7.8 — small, accessible motion toggle. */
.film-motion-toggle{display:inline-flex;align-items:center;justify-content:space-between;gap:9px;min-height:32px;margin:9px 0 0;padding:4px 1px;border:0;border-bottom:1px solid rgba(205,183,129,.48);border-radius:0;background:transparent;color:#e9dfcb;font:600 10px/1.4 var(--sans);letter-spacing:.085em;text-transform:uppercase;cursor:pointer;transition:color .2s,border-color .2s}
.film-motion-toggle span{font-size:11px;letter-spacing:0}
.film-motion-toggle:hover{color:white;border-bottom-color:#e9dfcb}
.film-motion-toggle:focus-visible{outline:2px solid #d3b768;outline-offset:4px}
@media(prefers-reduced-motion:reduce){.film-motion-toggle{transition:none}}
