/* Creative film collection */
.creative { text-align:center; }
.creative .section-head, .creative .section-lead { margin-left:auto; margin-right:auto; }
.creative-gallery { max-width:68rem; margin-inline:auto; }
.creative-work { display:grid; grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr); align-items:start; overflow:hidden; border:1px solid var(--line-strong); border-radius:24px; background:var(--glass); text-align:left; }
.creative-player { width:100%; aspect-ratio:7/8; background:#000; align-self:stretch; height:100%; }
.creative-player iframe { display:block; width:100%; height:100%; border:0; }
.creative-work-copy { padding:clamp(1.5rem,4vw,3rem); }
.creative-kicker { display:block; font:.75rem var(--font-mono); letter-spacing:.12em; color:var(--cyan); }
.creative-work h3 { font-size:clamp(1.6rem,4vw,2.3rem); margin:1rem 0 1.5rem; }
.creative-work p { color:var(--muted); margin:0 0 1rem; line-height:1.9; }
.creative-tags { display:flex; flex-wrap:wrap; gap:.5rem 1rem; padding:0; margin:1.8rem 0; list-style:none; color:var(--faint); font-size:.8rem; }
.creative-watch { display:inline-flex; min-height:44px; align-items:center; padding:.6rem 1.2rem; border:1px solid var(--line-strong); border-radius:999px; color:var(--ink); text-decoration:none; }
.creative-watch:hover { border-color:var(--violet); background:var(--glass-2); }
.creative-watch:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }

.creative-cover { position:relative; display:block; width:100%; height:100%; padding:0; border:0; cursor:pointer; color:white; background:#000; overflow:hidden; }
.creative-cover img { display:block; width:100%; height:100%; object-fit:cover; object-position:50% 50%; }
.creative-play { position:absolute; right:1.25rem; bottom:1.25rem; display:flex; align-items:center; gap:.5rem; padding:.7rem 1rem; border:1px solid rgba(255,255,255,.5); border-radius:999px; background:rgba(5,6,10,.78); font:600 .9rem var(--font-body); }
.creative-play svg { width:24px; height:24px; }
.creative-cover:hover .creative-play { background:#604bd0; }
.creative-cover:focus-visible { outline:3px solid var(--cyan); outline-offset:-4px; }

@media(max-width:700px) { .creative-work { grid-template-columns:1fr; } .creative-player { max-width:420px; margin-inline:auto; height:auto; aspect-ratio:941/1672; } }

/* Large, dismissible video player */
.film-dialog { position:fixed; inset:0; margin:auto; padding:0; width:min(1120px,94vw); max-width:94vw; max-height:94dvh; border:1px solid rgba(255,255,255,.18); border-radius:20px; background:#0b1020; color:#eef1f8; box-shadow:0 24px 100px #0009; overflow:auto; }
.film-dialog::backdrop { background:rgba(0,0,0,.82); backdrop-filter:blur(8px); }
.film-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:12px 20px; }
.film-dialog-header h2 { margin:0; font:600 1.1rem var(--font-body); }
.film-dialog-close { display:grid; place-items:center; width:44px; height:44px; border:1px solid #ffffff30; border-radius:50%; background:#ffffff12; color:#fff; font:30px/1 sans-serif; cursor:pointer; }
.film-dialog-close:hover { background:#ffffff28; }
.film-dialog-close:focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
.film-dialog-player { width:100%; height:min(63vw,calc(94dvh - 70px),630px); background:#000; }
.film-dialog-player iframe { display:block; width:100%; height:100%; border:0; }
@media(max-width:700px) and (orientation:portrait) { .film-dialog-player { height:70dvh; } }