body.has-project-film { --project-paper: 16, 24, 32; --text-secondary: rgba(255,255,255,.78); background: rgb(var(--project-paper)); }
:root[data-theme="light"] body.has-project-film { --project-paper: 244, 247, 248; --text-secondary: rgba(18,34,56,.78); }
.has-project-film::before { content: ""; position: fixed; inset: 0 0 auto; height: 88px; background: linear-gradient(rgb(var(--project-paper)) 78%, rgba(var(--project-paper), 0)); z-index: 3; pointer-events: none; }
.has-project-film #sky-container, .has-project-film .gradient-overlay, .has-project-film .horizon-glow { display: none; }
.has-project-film .container { margin: 0 auto 0 max(0px, calc((100vw - 1280px) / 2)); }
.has-project-film .proj-name { letter-spacing: 0; background: none; color: var(--text-primary); -webkit-text-fill-color: currentColor; }
.has-project-film #pContext { font-size: 16px; font-weight: 400; color: var(--text-primary); }
.has-project-film #pContextWrap { scroll-margin-top: 96px; }
.project-film[hidden], .proj-film-note[hidden] { display: none; }
.project-film { position: fixed; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.project-film-media, .project-film-media img, .project-film-media video { position: absolute; inset: 0; width: 100%; height: 100%; }
.project-film-media img, .project-film-media video { object-fit: cover; object-position: center; }
.project-film-media video { opacity: 0; }
.project-film-media.is-ready video { opacity: 1; }
.project-film-media.is-ready img { visibility: hidden; }
.project-film::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(var(--project-paper), .96), rgba(var(--project-paper), .9) 40%, rgba(var(--project-paper), .84) 60%, rgba(var(--project-paper), .32) 85%, rgba(var(--project-paper), .12)), linear-gradient(0deg, rgba(var(--project-paper), .45), transparent 40%, rgba(var(--project-paper), .18)); }
.has-project-film .proj-intro { margin-bottom: 16px; font-weight: 400; }
.proj-film-note { font-size: 12px; line-height: 1.65; color: var(--text-secondary); margin: 0 0 44px; }
@media (max-width: 1100px) {
    .has-project-film .container { margin: 0 auto; }
    .project-film::after { background: linear-gradient(rgba(var(--project-paper), .9), rgba(var(--project-paper), .8) 45%, rgba(var(--project-paper), .92)); }
    :root[data-theme="light"] .project-film::after { background: rgba(var(--project-paper), .87); }
}
@media (max-width: 760px) {
    .has-project-film::before { height: 76px; }
    .project-film-media { inset: auto; top: 50%; left: -25%; width: 150%; height: auto; aspect-ratio: 16 / 9; transform: translateY(-50%); -webkit-mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent); mask-image: linear-gradient(transparent, #000 18%, #000 82%, transparent); }
    :root[data-theme="light"] .project-film::after { background: rgba(var(--project-paper), .8); }
}
