/* Podstrony w wyglądzie The Cut: /work i /work/<film>. Kolory, kroje i nagłówek
   pochodzą ze style.css; tu jest tylko to, czego strona główna nie ma. */
.page{padding-top:56px;padding-bottom:110px}
.page h1{font-size:clamp(44px,6vw,88px);letter-spacing:-2px;text-transform:uppercase;max-width:none}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;font-family:var(--label);font-weight:500;font-size:13px;letter-spacing:2.1px;text-transform:uppercase;color:var(--meta);margin-bottom:44px}
.crumbs b{color:var(--red);margin:0 10px;font-weight:500}
.crumbs a{display:inline-flex;align-items:center;min-height:44px}
.crumbs a:hover{color:var(--red)}
.crumbs span{color:var(--ink)}
.crumbs.light{color:var(--meta-dark);margin-bottom:22px}
.crumbs.light span{color:var(--paper)}
.crumbs.light a:hover{color:var(--red-soft)}
.page-facts{margin-top:22px;font-family:var(--label);font-weight:500;font-variant-numeric:tabular-nums;font-size:14px;letter-spacing:2.1px;text-transform:uppercase;color:var(--meta)}
.page-facts b{color:var(--red);margin:0 10px;font-weight:500}

.shelf{margin-top:84px}
.shelf-title{display:flex;justify-content:space-between;align-items:baseline;gap:20px;flex-wrap:wrap;padding-bottom:14px;margin-bottom:34px;border-bottom:1px solid var(--line);font-size:30px;line-height:1.2;letter-spacing:0;text-transform:uppercase}
.shelf-title span,.shelf-title a{font-family:var(--label);font-weight:500;font-variant-numeric:tabular-nums;font-size:14px;letter-spacing:2.1px;color:var(--meta)}
.shelf-title a{color:var(--ink);border-bottom:1px solid var(--red);padding-bottom:4px}
.shelf-title a:hover{color:var(--red)}
.tiles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 26px}
.tile{display:block}
.tile .poster{display:block}
.tile .poster img{object-fit:cover;transition:transform .24s}
.tile:hover .poster img{transform:scale(1.035)}
.tile h3{margin-top:16px;font-size:24px;line-height:1.25;text-transform:uppercase}
.tile:hover h3{color:var(--red)}
.tile-summary{margin-top:8px;font-size:15px;line-height:1.55;color:var(--meta)}
.tile-meta{margin-top:8px;font-family:var(--label);font-weight:500;font-variant-numeric:tabular-nums;font-size:13px;letter-spacing:1.6px;text-transform:uppercase;color:var(--meta)}
a.button.more{margin-top:56px}

.film-stage{background:var(--ink);color:var(--paper);padding:26px 0 64px}
.film-frame{aspect-ratio:16/9;max-width:1180px;margin:0 auto;background:#000}
.film-frame iframe{display:block;width:100%;height:100%;border:0}
.film-page{padding-top:64px}
.film-body{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:70px}
.film-lead{margin-top:34px;font-size:24px;line-height:1.45}
.film-text{margin-top:18px;max-width:700px;font-size:17px;line-height:1.6;color:var(--meta)}
.film-note{margin-top:16px;font-size:14px;line-height:1.5;color:var(--meta)}
.film-case{margin:44px 0 0;padding-top:30px;border-top:1px solid var(--line);display:grid;gap:22px}
.film-case dt,.fact-label{font-family:var(--label);font-weight:500;font-size:13px;letter-spacing:2.1px;text-transform:uppercase;color:var(--meta)}
.film-case dd{margin:8px 0 0;font-size:17px;line-height:1.6}
.film-facts{display:grid;gap:24px;align-content:start;padding-left:40px;border-left:1px solid var(--line)}
.fact-value{margin-top:6px;font-size:17px;line-height:1.5;font-variant-numeric:tabular-nums}
.film-facts .plain-link{justify-self:start;border-bottom:1px solid var(--red)}

@media(max-width:1000px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .film-body{grid-template-columns:1fr;gap:44px}
  .film-facts{padding:30px 0 0;border-left:0;border-top:1px solid var(--line);grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .page{padding-top:34px;padding-bottom:70px}
  .crumbs{margin-bottom:26px;font-size:12px;letter-spacing:1.6px}
  .shelf{margin-top:56px}
  .shelf-title{font-size:24px}
  .tiles{grid-template-columns:1fr;gap:34px}
  .film-stage{padding:12px 0 30px}
  .film-stage .wrap{padding-left:0;padding-right:0}
  .film-stage .crumbs{padding:0 22px}
  .film-page{padding-top:40px}
  .film-lead{font-size:20px}
  .film-facts{grid-template-columns:1fr}
}
.film-body .eyebrow{text-transform:uppercase}