:root{
/* Primary palette — from brand guide v3 */
--cf-navy:#0B1A4A;--cf-blue:#2D5BFF;--cf-violet:#6A3BFF;--cf-magenta:#D12BBF;--cf-orange:#FF7A2E;--cf-peach:#FFB26B;
/* Navy depths (dark cinematic system) */
--cf-ink:#060E28;--cf-night:#081130;--cf-navy-800:#0E1A45;--cf-navy-700:#16245A;--cf-navy-600:#24336E;--cf-navy-400:#5A6799;--cf-navy-300:#8F98BF;--cf-navy-200:#C3C8DE;
/* Warm whites (light system) */
--cf-warm-white:#FFF8F4;--cf-paper:#FBF2EC;--cf-sand:#F1E6DE;--cf-line-warm:#E6D9D0;--cf-white:#FFFFFF;
/* Tonal / monochrome logo set */
--cf-graphite:#3A3D46;--cf-silver:#8A8E98;
/* Semantic status (derived from palette) */
--cf-success:#1FA97A;--cf-warning:#FF7A2E;--cf-danger:#E5374F;--cf-info:#2D5BFF;
/* Signature gradient — follows the symbol's ribbon: blue → violet → magenta → orange → peach */
--cf-gradient-flow:linear-gradient(100deg,#2D5BFF 0%,#6A3BFF 30%,#D12BBF 60%,#FF7A2E 85%,#FFB26B 100%);/* @kind color */
--cf-gradient-ember:radial-gradient(60% 60% at 75% 80%,rgba(229,55,79,.55) 0%,rgba(209,43,191,.18) 45%,rgba(11,26,74,0) 75%);/* @kind color */
--cf-gradient-scrim:linear-gradient(180deg,rgba(6,14,40,0) 0%,rgba(6,14,40,.55) 55%,rgba(6,14,40,.92) 100%);/* @kind color */

/* Semantic aliases — dark (default, cinematic) */
--surface-page:var(--cf-night);--surface-sunken:var(--cf-ink);--surface-card:var(--cf-navy-800);--surface-raised:var(--cf-navy-700);
--surface-light:var(--cf-warm-white);--surface-light-card:var(--cf-white);
--text-primary:#FFFFFF;--text-secondary:var(--cf-navy-200);--text-muted:var(--cf-navy-300);
--text-on-light:var(--cf-navy);--text-on-light-muted:#4A5478;
--border-subtle:rgba(195,200,222,.14);--border-strong:rgba(195,200,222,.32);--border-light:var(--cf-line-warm);
--accent:var(--cf-blue);--accent-hover:#4A72FF;--accent-press:#1F47E0;
--focus-ring:0 0 0 2px var(--cf-night),0 0 0 4px var(--cf-blue);
}

:root{
--font-display:'Inter','Inter Display',system-ui,sans-serif;
--font-body:'Inter',system-ui,sans-serif;
--font-mono:'JetBrains Mono',ui-monospace,monospace;
--opsz-display:32;/* @kind font */--opsz-text:14;/* @kind font */
--weight-light:300;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;
/* Wordmark tracking from guide: CONTENTFLOW 0.11–0.13em, STUDIOS 0.48–0.55em */
--tracking-wordmark:.12em;--tracking-studios:.5em;--tracking-eyebrow:.22em;--tracking-caps:.08em;--tracking-tight:-.02em;--tracking-body:0;
/* Scale */
--fs-hero:96px;--fs-display:64px;--fs-h1:48px;--fs-h2:36px;--fs-h3:26px;--fs-h4:20px;--fs-lg:18px;--fs-body:16px;--fs-sm:14px;--fs-xs:12px;--fs-micro:11px;
--lh-tight:1.05;/* @kind font */--lh-snug:1.2;/* @kind font */--lh-body:1.55;/* @kind font */
/* Semantic */
--type-hero:300 var(--fs-hero)/var(--lh-tight) var(--font-display);/* @kind font */
--type-display:300 var(--fs-display)/var(--lh-tight) var(--font-display);/* @kind font */
--type-title:700 var(--fs-h2)/var(--lh-snug) var(--font-display);/* @kind font */
--type-body:400 var(--fs-body)/var(--lh-body) var(--font-body);/* @kind font */
}

:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;
--gutter:44px;--container:1440px;--section-y:120px;
/* Logo rules */
--logo-clearspace:25%;/* @kind other */--logo-min-symbol:32px;--logo-min-lockup:180px;
}

:root{
--radius-0:0;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:10px;--radius-pill:999px;
--border-hair:1px solid var(--border-subtle);
--shadow-none:none;
--shadow-card:0 1px 0 rgba(255,255,255,.04) inset,0 20px 40px -24px rgba(0,0,0,.6);
--shadow-pop:0 24px 64px -16px rgba(3,8,26,.7);
--shadow-light:0 1px 2px rgba(11,26,74,.06),0 12px 32px -18px rgba(11,26,74,.25);
--blur-glass:saturate(140%) blur(18px);/* @kind other */
--ease-cine:cubic-bezier(.22,.61,.36,1);/* @kind other */--ease-out:cubic-bezier(.16,1,.3,1);/* @kind other */
--dur-fast:140ms;/* @kind other */--dur-base:240ms;/* @kind other */--dur-slow:600ms;/* @kind other */--dur-reveal:1200ms;/* @kind other */
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--font-body);font-variation-settings:'opsz' 14;color:var(--text-primary);background:var(--surface-page);-webkit-font-smoothing:antialiased}
a{color:var(--cf-peach);text-decoration:none;transition:color var(--dur-fast) var(--ease-cine)}
a:hover{color:#FFFFFF}
.cf-light a{color:var(--cf-blue)}.cf-light a:hover{color:var(--cf-navy)}
::selection{background:var(--cf-magenta);color:#fff}

/* ContentFlow Studios — site layer over the CF design-system tokens */
:root{--navy:var(--cf-navy);--ink:var(--cf-ink);--purple:var(--cf-violet);--violet:var(--cf-violet);--cyan:var(--cf-blue);
--serif:var(--font-body);--display:var(--font-display);--sans:var(--font-body);--mono:var(--font-mono);
--h-font:var(--font-display);--h-weight:300;--h-tracking:-0.02em;--body-font:var(--font-body)}
/* Dark / cinematic is the site theme; .band-light flips a section to the light system */
:root{--bg:var(--cf-night);--bg-alt:var(--cf-ink);--fg:#fff;--fg-soft:var(--cf-navy-200);--fg-muted:var(--cf-navy-300);--line:var(--border-subtle);--line-strong:var(--border-strong);--card:var(--cf-navy-800);--accent:var(--cf-peach);--btn-fg:#fff;--btn-bd:var(--border-strong);--btn-wash:rgba(255,255,255,.08);--mark-filter:brightness(0) invert(1)}
.band-light{--bg:var(--cf-warm-white);--bg-alt:var(--cf-paper);--fg:var(--cf-navy);--fg-soft:var(--text-on-light-muted);--fg-muted:#5B6488;--line:rgba(11,26,74,.12);--line-strong:rgba(11,26,74,.3);--card:var(--cf-white);--accent:var(--cf-magenta);--btn-fg:var(--cf-navy);--btn-bd:var(--cf-navy);--btn-wash:var(--cf-sand);--mark-filter:brightness(0) saturate(100%) invert(9%) sepia(43%) saturate(4400%) hue-rotate(222deg) brightness(92%)}
.band-light{background:var(--bg);color:var(--fg)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg);color:var(--fg);font-family:var(--font-body)}
body{font-size:16px;line-height:1.55;font-variation-settings:'opsz' 14;-webkit-font-smoothing:antialiased;min-height:100vh}
a{color:inherit;text-decoration:none;transition:color var(--dur-fast) var(--ease-cine)}
a:hover{color:var(--accent)}
a.link{font:500 12px var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--fg);padding-bottom:4px;border-bottom:1px solid var(--line-strong)}
a.link:hover{color:var(--accent);border-bottom-color:var(--accent)}
img{max-width:100%;display:block}
.wrap{max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}
.wrap-narrow{max-width:900px;margin:0 auto;padding:0 var(--gutter)}
.rule{height:1px;background:var(--line);border:0}.rule-strong{height:1px;background:var(--line-strong);border:0}
.eyebrow{font:500 12px var(--font-body);text-transform:uppercase;letter-spacing:var(--tracking-eyebrow);color:var(--accent)}
h1,h2,h3,h4{font-family:var(--font-display);font-variation-settings:'opsz' 32;font-weight:300;letter-spacing:-0.02em;line-height:1.05;color:var(--fg)}
h1{font-size:clamp(48px,7.5vw,104px);line-height:1}
h2{font-size:clamp(32px,4.2vw,56px)}
h3{font-size:clamp(22px,2vw,28px);font-weight:400;line-height:1.15}
h4{font-size:18px;font-weight:400;line-height:1.2}
p{color:var(--fg-soft)}
em{font-style:italic}
.lead{font-size:clamp(18px,1.5vw,20px);line-height:1.6;color:var(--fg-soft);font-family:var(--font-body)}
::selection{background:var(--cf-magenta);color:#fff}
:focus-visible{outline:none;box-shadow:var(--focus-ring)}
/* Header — the design system's NavBar, rendered as static markup */
.site-header{position:sticky;top:0;z-index:50}
.nav-bar{display:flex;align-items:center;justify-content:space-between;gap:32px;height:84px;padding:0 var(--gutter);background:rgba(8,17,48,.82);-webkit-backdrop-filter:var(--blur-glass);backdrop-filter:var(--blur-glass);border-bottom:1px solid var(--border-subtle)}
.nav-brand{display:flex}
.nav-links{display:flex;align-items:center;gap:clamp(14px,1.9vw,36px);scrollbar-width:none}
.nav-links::-webkit-scrollbar{display:none}
.nav-links a{font:500 12px var(--font-body);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;color:var(--text-secondary);padding-bottom:4px;border-bottom:1px solid transparent}
.nav-links a[aria-current="page"]{color:#fff;border-bottom-color:var(--cf-peach)}
.nav-links a:hover{color:var(--cf-peach)}
/* ContentFlow lockup — symbol + live-text wordmark, scaled by --logo-size */
.cf-logo{display:inline-flex;align-items:center;gap:calc(var(--logo-size) * .36)}
.cf-logo img{height:var(--logo-size);width:auto;display:block}
.cf-logo.white img{filter:brightness(0) invert(1)}
.cf-wm{display:inline-flex;flex-direction:column;align-items:center;color:#fff;font-family:var(--font-display);font-variation-settings:'opsz' 32;line-height:1}
.cf-wm span:first-child{font-weight:300;font-size:calc(var(--logo-size) * .46);letter-spacing:var(--tracking-wordmark);padding-left:var(--tracking-wordmark)}
.cf-wm span:last-child{font-weight:400;font-size:calc(var(--logo-size) * .138);letter-spacing:var(--tracking-studios);padding-left:var(--tracking-studios);margin-top:calc(var(--logo-size) * .1104)}
/* Footer — always dark (cinematic) */
.site-footer{margin-top:var(--section-y);background:var(--cf-ink);border-top:1px solid var(--border-subtle);padding:72px var(--gutter) 40px;color:#fff}
.site-footer .inner{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
.site-footer h4{font:500 12px var(--font-body);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--cf-navy-300);margin-bottom:16px}
.site-footer a,.site-footer .ft-line{display:block;padding:5px 0;color:var(--cf-navy-200);font-size:14px}
.site-footer .footer-brand{display:inline-block;margin-bottom:24px}
.site-footer a:hover{color:var(--cf-peach)}
.site-footer p{color:var(--cf-navy-200)}
.site-footer .colophon{max-width:var(--container);margin:64px auto 0;padding-top:24px;border-top:1px solid var(--border-subtle);display:flex;justify-content:space-between;gap:20px;font-size:12px;color:var(--cf-navy-300)}
@media (max-width: 800px){.site-footer .inner{grid-template-columns:1fr 1fr;gap:32px 24px}.site-footer .inner>div:first-child{grid-column:1 / -1}.site-footer .colophon{margin-top:40px}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-md)}
/* Poster */
.poster{position:relative;aspect-ratio:2/3;overflow:hidden;border-radius:var(--radius-sm);background:var(--cf-gradient-ember),linear-gradient(160deg,#24336E,#0E1A45 70%)}
.poster .poster-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;transition:transform var(--dur-slow) var(--ease-out)}
a:hover .poster .poster-img{transform:scale(1.04)}
.poster::after{content:"";position:absolute;inset:0;z-index:2;background:var(--cf-gradient-scrim);opacity:0;transition:opacity var(--dur-base) var(--ease-cine);pointer-events:none}
a:hover .poster::after{opacity:.5}
.poster .poster-fallback{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:20px;color:#fff;z-index:1}
.poster.no-img .poster-fallback{z-index:3}
.poster .poster-fallback .title{font-family:var(--font-display);font-weight:300;font-size:22px;line-height:1.1;text-wrap:pretty}
.poster .poster-fallback .year{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em}
/* Festival marks — single ink per theme */
.logo-chip{display:inline-flex;align-items:center;justify-content:center;background:var(--cf-warm-white);border-radius:var(--radius-xs);padding:8px 14px;height:44px;min-width:60px;vertical-align:middle}
.logo-chip img{height:26px;width:auto;max-width:120px;object-fit:contain;display:block}
.logo-chip.wide{min-width:120px;padding:8px 16px}.logo-chip.wide img{max-width:180px}
.logo-chip.lg{height:80px;padding:14px 22px;min-width:120px}.logo-chip.lg img{height:48px;max-width:180px}.logo-chip.lg.wide{min-width:200px}.logo-chip.lg.wide img{max-width:260px}
.logo-mark{display:block;width:auto;height:40px;max-width:160px;object-fit:contain;filter:var(--mark-filter);opacity:.9}
/* Tags & buttons */
.pill{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;font:500 11px var(--font-body);letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--line-strong);border-radius:var(--radius-pill);color:var(--fg-soft)}
.pill .dot{width:5px;height:5px;border-radius:50%;background:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 24px;font:500 14px var(--font-body);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;border:1px solid var(--btn-bd);border-radius:var(--radius-xs);color:var(--btn-fg);background:transparent;cursor:pointer;transition:background var(--dur-fast) var(--ease-cine),color var(--dur-fast),transform var(--dur-fast)}
.btn:hover{background:var(--btn-wash);color:var(--btn-fg)}
.btn:active{transform:scale(.98)}
.btn.primary{background:var(--cf-blue);border-color:transparent;color:#fff}
.btn.primary:hover{background:var(--accent-hover);color:#fff}
.btn::after{content:"";width:0}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:48px;gap:32px}
.section-head>div{display:flex;flex-direction:column;gap:16px}
.section-head .label{font:500 12px var(--font-body);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--accent)}
/* ============ FILMS GRID ============ */
#films-inner { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
#films-inner .film-card { display: flex; flex-direction: column; gap: 12px; }
#films-inner .film-card .meta {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
}
#films-inner .film-card .t { font-family: var(--h-font); font-weight:400; font-size: 20px; line-height: 1.05; color: var(--fg); }
#films-inner .film-card .y { font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em; color: var(--fg-muted); }
#films-inner .film-card .dir { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; color: var(--fg-muted); text-transform: uppercase; }

#films-inner .film-card[hidden] { display: none; }

@media (max-width: 900px) {
  #films-inner { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1240px){.nav-links{gap:14px}.nav-links a{font-size:11px;letter-spacing:.1em}}
@media (max-width: 800px){:root{--gutter:20px;--section-y:80px}}
.menu-btn,.menu-panel{display:none}
@media (max-width: 900px){
.nav-links{display:none}
.menu-btn{display:flex;flex-direction:column;justify-content:center;gap:7px;position:absolute;right:calc(var(--gutter) - 10px);top:50%;transform:translateY(-50%);width:44px;height:44px;padding:0 10px;background:none;border:0;cursor:pointer;z-index:60}
.menu-btn span{display:block;height:1px;background:#fff;transition:transform var(--dur-base) var(--ease-cine)}
body.menu-open .menu-btn span:first-child{transform:translateY(4px) rotate(45deg)}
body.menu-open .menu-btn span:last-child{transform:translateY(-4px) rotate(-45deg)}
.menu-panel{display:flex;position:fixed;inset:0;z-index:55;flex-direction:column;justify-content:center;gap:4px;padding:100px var(--gutter) 48px;background:var(--cf-gradient-ember),var(--cf-night);opacity:0;visibility:hidden;transition:opacity var(--dur-base) var(--ease-cine),visibility 0s linear var(--dur-base)}
body.menu-open .menu-panel{opacity:1;visibility:visible;transition:opacity var(--dur-base) var(--ease-cine)}
.menu-panel a{font-family:var(--font-display);font-weight:300;font-size:clamp(30px,8vw,44px);line-height:1.2;color:#fff;padding:6px 0;letter-spacing:-0.01em}
.menu-panel a[aria-current="page"],.menu-panel a:hover{color:var(--cf-peach)}
.menu-panel .menu-mail{margin-top:auto;font-family:var(--font-body);font-size:14px;letter-spacing:.06em;color:var(--cf-navy-200)}
body.menu-open{overflow:hidden}
}
/* YouTube trailer (click to load) */
.yt{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--radius-sm);overflow:hidden;background:var(--cf-navy-800);color:#fff}
.yt img{width:100%;height:100%;object-fit:cover;opacity:.8;transition:opacity var(--dur-base) var(--ease-cine),transform var(--dur-slow) var(--ease-out)}
.yt:hover img{opacity:1;transform:scale(1.02)}
.yt-play{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(6,14,40,.5);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);transition:background var(--dur-fast)}
.yt-play::before{content:"";position:absolute;left:31px;top:26px;border-left:18px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}
.yt:hover .yt-play{background:var(--cf-blue)}
.yt-label{position:absolute;left:16px;bottom:14px;font:500 11px var(--font-body);letter-spacing:.18em;text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}