:root { --paper:#f3f2ee; --ink:#191816; --quiet:#77736d; --line:rgba(25,24,22,.2); }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'Lato', Arial, Helvetica, sans-serif; }
a { color:inherit; }
.shell { width:min(1420px, calc(100% - 120px)); margin:auto; }
header { height:76px; display:flex; align-items:center; justify-content:space-between; font-size:.76rem; letter-spacing:.14em; text-transform:uppercase; }
header a { text-decoration:none; }
header nav { display:flex; gap:28px; }
.intro { padding:54px 0 36px; display:grid; grid-template-columns:1fr 1.15fr; gap:8vw; align-items:end; }
.kicker { margin:0 0 18px; color:var(--quiet); font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:0; font-family:Georgia, 'Times New Roman', serif; font-size:clamp(4.8rem, 11vw, 12rem); font-weight:400; letter-spacing:-.055em; line-height:.76; }
.long-title { font-size:clamp(3.8rem, 8vw, 8.5rem); line-height:.82; }
.lede { margin:0; max-width:700px; font-family:Georgia, 'Times New Roman', serif; font-size:clamp(1.7rem, 3.2vw, 3.8rem); line-height:1.05; letter-spacing:-.025em; }
.video-wrap { position:relative; width:100%; aspect-ratio:16/9; background:#111; overflow:hidden; }
.video-wrap iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.main-film { width:min(780px,100%); margin:0 auto; }
.details { padding:90px 0 115px; display:grid; grid-template-columns:1fr 2fr; gap:8vw; }
.meta { color:var(--quiet); font-size:.72rem; letter-spacing:.12em; line-height:1.9; text-transform:uppercase; }
.description { margin:0; max-width:850px; font-family:Georgia, 'Times New Roman', serif; font-size:clamp(1.55rem, 2.65vw, 3rem); line-height:1.12; letter-spacing:-.02em; }
footer { padding:42px 0 50px; border-top:1px solid var(--line); }
.footer-main { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; }
.footer-main > a:first-child { text-decoration:none; font-family:Georgia, serif; font-size:clamp(2rem, 4vw, 4.8rem); }
.footer-contact { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; }
@media (max-width:760px) {
  .shell { width:calc(100% - 30px); }
  header { height:62px; }
  header nav { gap:14px; }
  .intro { padding:70px 0 44px; display:block; }
  h1 { margin-bottom:42px; }
  .long-title { font-size:clamp(3.3rem, 15vw, 5.5rem); }
  .details { padding:64px 0 78px; grid-template-columns:1fr; gap:30px; }
  .footer-main { display:block; }
  .footer-contact { display:inline-block; margin-top:30px; }
}
