/* La Vita Nova · lift.css
   More photography inside the existing galerie system. Nothing here adds a
   colour, a typeface, a radius or a size that is not already in style.css:
   square frames, 3px gutters like the portfolio triptych, mono captions,
   hairline rules and the same type ladder. */

/* a caption set on the photograph itself, like the gallery plate */
.lf-cap{position:absolute;left:14px;bottom:12px;z-index:3;font-family:var(--mono);font-weight:400;font-size:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--paper);text-shadow:0 1px 10px rgba(0,0,0,.55)}
.lf-ph{position:relative;overflow:hidden;display:block;background:var(--hair)}
.lf-ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .85s cubic-bezier(.2,.7,.2,1)}
a.lf-ph:hover img{transform:scale(1.03)}
.lf-ph::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(to top,rgba(20,19,15,.45),rgba(20,19,15,0));pointer-events:none}

/* photo strip · a row of pictures butted together at the triptych's 3px */
.lf-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;margin-top:34px}
.lf-strip .lf-ph{aspect-ratio:4/5}
.lf-strip--3{grid-template-columns:repeat(3,1fr)}

/* mosaic · one tall picture and two stacked beside it */
.lf-mosaic{display:grid;grid-template-columns:1.45fr 1fr;grid-template-rows:1fr 1fr;gap:3px;height:clamp(380px,46vw,620px);margin-top:34px}
.lf-mosaic .lf-ph:first-child{grid-row:span 2}

/* facts strip on a dark band */
.band--ink .facts{border-top-color:#3b372e}
.band--ink .facts .f{border-left-color:#3b372e}
.band--ink .facts .n{color:var(--paper)}
.band--ink .facts .l{color:#c9c3b4}
.band--ink .prose p.big,.band--ink p.big{color:var(--paper)}
.band--ink .note{color:#c9c3b4}

/* a running order, the same shape as the Sundays timetable */
.lf-run{margin-top:26px;border-top:1px solid var(--line)}
.lf-run > div{display:grid;grid-template-columns:200px 1fr 1.25fr;gap:22px 30px;padding:26px 0;border-bottom:1px solid var(--line);align-items:baseline}
.lf-run .w{font-family:var(--mono);font-size:var(--t-label);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--muted);line-height:1.6}
.lf-run h3{font-family:var(--disp);font-weight:600;font-size:var(--t-title-lg);line-height:1.15}
.lf-run h3 a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.lf-run p{font-size:var(--t-small);color:var(--ink2);line-height:1.6;margin:0;max-width:58ch}

/* the Sunday timetable, with a picture for each class */
.sd-row.has-thumb{grid-template-columns:150px 132px 1fr 230px}
.sd-thumb{aspect-ratio:1/1;overflow:hidden;background:var(--deep);display:block}
.sd-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.sd-thumb--illus{background:#EDE7DA}
.sd-thumb--illus img{object-fit:contain;padding:10px}

/* doors with a picture on top */
.v2 .door .dimg{display:block;aspect-ratio:3/2;overflow:hidden;margin:-28px -26px 22px;background:var(--hair)}
.v2 .door .dimg img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .85s cubic-bezier(.2,.7,.2,1)}
.v2 .door:hover .dimg img{transform:scale(1.03)}

@media (max-width:1024px){
  .lf-run > div{grid-template-columns:160px 1fr;gap:10px 24px}
  .lf-run p{grid-column:2}
  .sd-row.has-thumb{grid-template-columns:150px 110px 1fr}
  .sd-row.has-thumb .sd-buy{grid-column:3}
}
@media (max-width:760px){
  .lf-strip{grid-template-columns:1fr 1fr}
  .lf-strip--3{grid-template-columns:1fr 1fr}
  .lf-strip--3 .lf-ph:first-child{grid-column:1 / -1;aspect-ratio:4/3}
  .lf-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:auto auto;height:auto}
  .lf-mosaic .lf-ph:first-child{grid-column:1 / -1;grid-row:auto;aspect-ratio:4/3}
  .lf-mosaic .lf-ph{aspect-ratio:1/1}
  .lf-run > div{grid-template-columns:1fr;gap:6px;padding:22px 0}
  .lf-run p{grid-column:auto}
  .sd-row.has-thumb{grid-template-columns:1fr}
  .sd-row.has-thumb .sd-buy{grid-column:auto}
  .sd-thumb{aspect-ratio:16/9;order:-1}
}
@media (prefers-reduced-motion:reduce){.lf-ph img,.v2 .door .dimg img{transition:none}}