/* ===== 03 · Showreel — A «Ventana editorial» (única desde la ronda 8; vídeo nuevo, sin sonido) ===== */

/* ---------- Controles comunes (botones reales, foco visible, ≥44px) ---------- */
.reel-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.reel-ctl__b{display:inline-flex;align-items:center;gap:.55rem;min-height:44px;padding:0 1.1rem 0 .95rem;border-radius:999px;border:1.5px solid currentColor;font-family:var(--f-head);font-weight:600;font-size:.9rem;line-height:1;white-space:nowrap;transition:background .3s,color .3s,border-color .3s}
.reel-ctl__b svg{width:18px;height:18px;flex:none;fill:currentColor}
.reel-ctl__b svg .o{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.reel-ctl__b--sq{width:44px;padding:0;justify-content:center}
.reel-ctl__tc{font-variant-numeric:tabular-nums;margin-left:.4rem;opacity:.85}
.reel-ctl__tc b{font-weight:600}
[data-theme="dark"] .reel-ctl__b{color:var(--u-paper);border-color:rgba(255,255,255,.34)}
[data-theme="dark"] .reel-ctl__b:hover{background:var(--u-paper);color:var(--u-night);border-color:var(--u-paper)}
[data-theme="light"] .reel-ctl__b{color:var(--u-ink);border-color:rgba(22,22,31,.3)}
[data-theme="light"] .reel-ctl__b:hover{background:var(--u-ink);color:var(--u-paper);border-color:var(--u-ink)}
[class^="reel-"] video{display:block;width:100%;height:100%;object-fit:cover;background:#0B0B14}

/* ---------- A · Ventana editorial ---------- */
.reel-a{background:var(--u-paper);color:var(--u-ink);padding:clamp(5rem,10vw,8.5rem) 0 clamp(4rem,8vw,7rem);overflow:hidden}
.reel-a__head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);align-items:end;margin-bottom:clamp(2rem,4vw,3.2rem)}
.reel-a__kicker{grid-column:1/4;color:var(--u-blue-strong);align-self:start;padding-top:.6rem}
.reel-a__kicker span{color:var(--u-muted-dark)}
.reel-a__title{grid-column:4/13;font-weight:var(--w-display);font-size:clamp(2rem,4.3vw,4.4rem);line-height:1;letter-spacing:-.045em;max-width:19ch;margin:0}
.reel-a__stage{position:relative;aspect-ratio:16/9;max-height:84vh;margin-inline:auto}
.reel-a__frame{position:absolute;inset:0;overflow:hidden;border-radius:8px;transform-origin:50% 0;will-change:transform;box-shadow:0 30px 80px -40px rgba(16,16,29,.45)}
.reel-a__bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.2rem 2rem;margin-top:1.4rem;padding-top:1.2rem;border-top:1px solid var(--u-line-dark)}
.reel-a__note{margin:0;color:var(--u-muted-dark);font-size:.95rem;max-width:42ch}
.reel-a__full{font-family:var(--f-head);font-weight:600;font-size:.95rem;min-height:44px;padding:0 .2rem;border-bottom:2px solid var(--u-blue-strong);color:var(--u-ink)}
.reel-a__full:hover{color:var(--u-blue-strong)}
@media (max-width:767px){
  .reel-a__kicker,.reel-a__title{grid-column:1/-1}
  .reel-a__kicker{margin-bottom:.9rem}
  .reel-a__bar{grid-template-columns:1fr;gap:1rem}
  .reel-a__full{justify-self:start}
}