:root {
  --paper: #f5f3ee;
  --ink: #161616;
  --muted: #6e6b64;
  --line: rgba(22,22,22,.14);
  --white: #fff;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Arial, Helvetica, sans-serif;
  --shell: min(1440px, calc(100vw - 64px));
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img, video { display:block; max-width:100%; }
.shell { width:var(--shell); margin-inline:auto; }
.shell-wide { width:min(1680px, calc(100vw - 32px)); margin-inline:auto; }
.shell-narrow { max-width:920px; }
.screen-reader-text { position:absolute!important; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

.site-header { position:sticky; top:0; z-index:50; background:rgba(245,243,238,.94); backdrop-filter:blur(14px); border-bottom:1px solid transparent; transition:border-color .25s ease; }
.site-header.is-scrolled { border-color:var(--line); }
.header-inner { min-height:112px; display:flex; align-items:center; justify-content:space-between; gap:40px; }
.brand { display:inline-flex; flex-direction:column; line-height:1; letter-spacing:.04em; }
.brand-logo img { max-height:58px; width:auto; }
.brand-name { font-family:var(--serif); font-size:25px; letter-spacing:.08em; }
.brand-sub { margin-top:7px; font-size:9px; letter-spacing:.28em; color:var(--muted); }
.primary-nav ul { display:flex; gap:32px; margin:0; padding:0; list-style:none; }
.primary-nav a, .footer-links a { font-size:11px; text-transform:uppercase; letter-spacing:.17em; }
.primary-nav a:hover, .footer-links a:hover, .category-nav a:hover { opacity:.55; }
.menu-toggle { display:none; border:0; background:transparent; text-transform:uppercase; letter-spacing:.15em; font-size:10px; }

.hero, .archive-head { padding:110px 0 78px; }
.hero { min-height:54vh; display:flex; flex-direction:column; justify-content:center; }
.eyebrow { margin:0 0 17px; font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); }
h1, h2, h3, p { overflow-wrap:anywhere; }
h1 { margin:0; font-family:var(--serif); font-weight:400; font-size:clamp(58px, 9vw, 142px); line-height:.9; letter-spacing:-.045em; }
.hero-copy { max-width:650px; margin:36px 0 0; font-family:var(--serif); font-size:clamp(20px, 2vw, 30px); line-height:1.35; color:#33312e; }

.category-nav { display:flex; flex-wrap:wrap; gap:12px 28px; padding:22px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-bottom:56px; }
.category-nav a { font-size:10px; text-transform:uppercase; letter-spacing:.17em; color:var(--muted); }
.category-nav a.is-active { color:var(--ink); }

.film-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:76px 32px; padding-bottom:120px; }
.film-card-media { position:relative; display:block; overflow:hidden; background:#ddd9d0; aspect-ratio:16/10; }
.film-card-media img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1), filter .4s ease; }
.film-card-media:hover img { transform:scale(1.025); filter:brightness(.88); }
.film-card-placeholder { width:100%; height:100%; background:linear-gradient(145deg,#dedad1,#cfc9be); }
.film-card-play { position:absolute; right:22px; bottom:20px; display:grid; place-items:center; width:54px; height:54px; border-radius:50%; background:rgba(245,243,238,.93); font-size:9px; text-transform:uppercase; letter-spacing:.12em; transform:translateY(4px); opacity:0; transition:.3s ease; }
.film-card-media:hover .film-card-play { transform:none; opacity:1; }
.film-card-meta { padding:22px 0 0; max-width:720px; }
.film-card-meta h2 { margin:0; font-family:var(--serif); font-size:clamp(28px, 3.1vw, 48px); font-weight:400; line-height:1.05; letter-spacing:-.025em; }
.film-card-excerpt { color:var(--muted); max-width:620px; margin:15px 0 0; }

.archive-head h1 { font-size:clamp(64px, 10vw, 156px); }
.single-film-head { text-align:center; padding:100px 0 58px; }
.single-film-head h1 { font-size:clamp(52px, 7vw, 108px); }
.video-stage { background:#0d0d0d; }
.film-player { width:100%; max-height:88vh; margin:auto; background:#000; object-fit:contain; }
.video-missing { padding:120px 30px; color:#fff; text-align:center; }
.film-story { padding:90px 0 130px; }
.film-story-copy { font-family:var(--serif); font-size:clamp(19px, 1.8vw, 27px); line-height:1.55; }
.film-story-copy > *:first-child { margin-top:0; }
.film-story-copy a { text-decoration:underline; text-underline-offset:4px; }
.related { padding-top:20px; }
.film-grid-related { grid-template-columns:repeat(3, minmax(0,1fr)); padding-bottom:120px; gap:48px 20px; }
.film-grid-related .film-card-meta h2 { font-size:clamp(24px, 2vw, 34px); }

.access-panel { padding:15px 0 140px; }
.access-card { border:1px solid var(--line); padding:clamp(30px,5vw,68px); text-align:center; }
.access-card h2 { margin:0; font-family:var(--serif); font-size:clamp(36px,5vw,68px); font-weight:400; line-height:1; }
.access-card > p:not(.eyebrow):not(.access-error) { color:var(--muted); }
.access-form { display:flex; max-width:540px; margin:34px auto 0; }
.access-form input { flex:1; min-width:0; padding:16px 17px; border:1px solid var(--ink); border-right:0; background:transparent; font:inherit; }
.access-form button { padding:16px 22px; border:1px solid var(--ink); background:var(--ink); color:var(--white); text-transform:uppercase; letter-spacing:.12em; font-size:10px; cursor:pointer; }
.access-error { color:#8b1a1a; }

.pagination-wrap { padding:0 0 100px; }
.nav-links { display:flex; gap:10px; align-items:center; }
.page-numbers { padding:8px 12px; border:1px solid var(--line); }
.page-numbers.current { background:var(--ink); color:var(--white); }
.empty-state { grid-column:1/-1; padding:70px 0; color:var(--muted); }

.site-footer { border-top:1px solid var(--line); padding:65px 0 38px; }
.footer-grid { display:grid; grid-template-columns:1.3fr 1fr auto; gap:40px; align-items:end; }
.footer-mark { margin:0; font-family:var(--serif); font-size:26px; letter-spacing:.03em; }
.footer-small, .footer-copy { margin:8px 0 0; color:var(--muted); font-size:11px; }
.footer-links { display:flex; flex-wrap:wrap; gap:20px; }
.footer-copy { text-align:right; }
.text-link { display:inline-block; margin-top:28px; text-transform:uppercase; letter-spacing:.14em; font-size:10px; }

@media (max-width: 900px) {
  :root { --shell:min(100% - 34px, 1440px); }
  .header-inner { min-height:86px; }
  .menu-toggle { display:block; }
  .primary-nav { display:none; position:absolute; left:0; right:0; top:86px; background:var(--paper); border-bottom:1px solid var(--line); padding:24px 17px 30px; }
  .primary-nav.is-open { display:block; }
  .primary-nav ul { flex-direction:column; gap:18px; }
  .hero { min-height:48vh; padding:70px 0 60px; }
  .film-grid { grid-template-columns:1fr; gap:58px; padding-bottom:80px; }
  .film-grid-related { grid-template-columns:1fr; }
  .film-card-play { opacity:1; transform:none; width:48px; height:48px; }
  .footer-grid { grid-template-columns:1fr; align-items:start; }
  .footer-copy { text-align:left; }
  .single-film-head { padding:72px 0 45px; }
}

@media (max-width: 560px) {
  .brand-name { font-size:20px; }
  .brand-sub { font-size:8px; }
  .category-nav { gap:10px 18px; margin-bottom:36px; }
  .film-grid { gap:50px; }
  .film-card-meta { padding-top:17px; }
  .access-form { flex-direction:column; }
  .access-form input { border-right:1px solid var(--ink); border-bottom:0; }
  .shell-wide { width:100%; }
}
