/* ============================================================
   Home — hero, chapter scene, programme, about, band, gallery
   ============================================================ */

/* ---------- hero ---------- */
.hero{
  min-height:100dvh;
  display:flex;
  align-items:center;
  padding-block-start:calc(var(--nav-h) + 1rem);
  padding-block-end:3rem;
}
.hero-grid{
  max-width:1320px;
  margin-inline:auto;
  padding-inline:clamp(1.25rem,5vw,4rem);
  display:grid;
  grid-template-columns:44fr 56fr;
  gap:clamp(2rem,5vw,4rem);
  align-items:center;
  inline-size:100%;
}
.hero-text{display:flex;flex-direction:column;align-items:flex-start;}
.hero-headline{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(2.5rem,6vw,4.75rem);
  line-height:.98;
  letter-spacing:-.01em;
  margin:0 0 clamp(1.25rem,3vw,1.75rem);
}
.hero-headline .line{display:block;}
.hero-headline .line.accent{color:var(--accent);}
.hero-sub{
  max-width:42ch;
  color:var(--ink-soft);
  font-size:clamp(1rem,1.2vw,1.12rem);
  line-height:1.65;
  margin:0 0 clamp(1.75rem,4vw,2.25rem);
}
.hero-media{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  margin-inline-end:clamp(-2rem,-4vw,-3rem);
}

/* ---------- chapter scene (pinned magazine-cover moment) ---------- */
/* Pinned via ScrollTrigger (sticky breaks inside ScrollSmoother's transform).
   Without JS / with reduced motion it is a static full-viewport editorial plate. */
.chapter{
  position:relative;
  border-block-start:1px solid var(--line);
  background:var(--paper-deep);
}
.chapter-stage{
  position:relative;
  block-size:100vh;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.chapter-num{
  position:absolute;
  inset-block-start:50%;
  inset-inline-start:50%;
  transform:translate(50%,-50%);
  font-family:var(--serif);
  font-weight:700;
  font-size:clamp(16rem,42vw,38rem);
  line-height:1;
  color:transparent;
  -webkit-text-stroke:1px var(--line-strong);
  user-select:none;
  pointer-events:none;
  will-change:transform,opacity;
}
.chapter-photo{
  position:absolute;
  inline-size:clamp(150px,17vw,250px);
  aspect-ratio:3/4;
  overflow:hidden;
  box-shadow:0 24px 50px rgba(23,19,15,.28);
  will-change:transform;
}
.chapter-photo img{inline-size:100%;block-size:100%;object-fit:cover;}
.chapter-photo.p1{inset-block-start:12%;inset-inline-start:12%;}
.chapter-photo.p2{inset-block-end:14%;inset-inline-start:30%;inline-size:clamp(120px,13vw,190px);}
.chapter-photo.p3{inset-block-start:22%;inset-inline-end:14%;inline-size:clamp(130px,15vw,220px);}
.chapter-line{
  position:relative;
  z-index:2;
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.7rem,3.6vw,3rem);
  line-height:1.25;
  color:var(--ink);
  text-align:center;
  max-inline-size:18ch;
  margin:0;
}
.chapter-line .accent{color:var(--accent);}
.chapter-rule{
  position:absolute;
  inset-block-end:18%;
  inset-inline-start:50%;
  transform:translateX(50%);
  inline-size:min(320px,40vw);
  block-size:1px;
  background:var(--line-strong);
  transform-origin:center;
}

/* ---------- programme ---------- */
.programme{padding-block:clamp(4rem,9vw,7rem);border-block-start:1px solid var(--line);}
.programme-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1.5rem;
  flex-wrap:wrap;
}
.prog-row{
  position:relative;
  display:grid;
  grid-template-columns:110px 1fr auto;
  align-items:center;
  gap:clamp(1rem,3vw,2rem);
  padding-block:clamp(1.4rem,3vw,2rem);
  border-block-end:1px solid var(--line);
}
.prog-row:first-child{border-block-start:1px solid var(--line);}
.prog-date{font-family:var(--serif);}
.prog-day{
  display:block;
  font-size:clamp(2.1rem,4vw,3.1rem);
  line-height:.85;
  color:var(--ink);
}
.prog-month{
  display:block;
  font-family:var(--sans);
  font-size:.78rem;
  letter-spacing:.06em;
  color:var(--ink-faint);
  margin-block-start:.4rem;
}
.prog-name{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.25rem,2.1vw,1.85rem);
  margin:0;
  line-height:1.2;
}
.prog-meta{
  font-family:var(--sans);
  color:var(--ink-soft);
  margin:.45rem 0 0;
  font-size:.92rem;
}
.prog-cta{white-space:nowrap;}
.prog-poster{
  position:absolute;
  inset-inline-start:50%;
  inset-block-end:100%;
  inline-size:150px;
  aspect-ratio:3/4;
  margin-block-end:12px;
  transform:translateX(-50%) translateY(14px) rotate(5deg) scale(.88);
  opacity:0;
  pointer-events:none;
  box-shadow:0 22px 44px rgba(23,19,15,.28);
  z-index:6;
  transition:opacity .5s var(--ease-std), transform .6s var(--ease-cine);
}
.prog-poster img{inline-size:100%;block-size:100%;object-fit:cover;}
.prog-row:hover .prog-poster,
.prog-row:focus-within .prog-poster{
  opacity:1;
  transform:translateX(-50%) translateY(0) rotate(-2deg) scale(1);
}

/* ---------- about ---------- */
.about{padding-block:clamp(4rem,9vw,7rem);border-block-start:1px solid var(--line);}
.about-grid{
  display:grid;
  grid-template-columns:38fr 62fr;
  gap:clamp(2rem,5vw,4.5rem);
  align-items:center;
}
.about-text .section-title{margin-inline-end:clamp(-1rem,-3vw,-2.75rem);}
.about-text p{
  color:var(--ink-soft);
  font-size:clamp(1rem,1.2vw,1.1rem);
  line-height:1.75;
  max-width:44ch;
  margin:0 0 1.75rem;
}
.about-media{position:relative;}
.about-media-main{aspect-ratio:5/6;overflow:hidden;}
.about-media-inset{
  position:absolute;
  inset-block-end:-8%;
  inset-inline-start:-10%;
  inline-size:46%;
  aspect-ratio:4/5;
  overflow:hidden;
  border:6px solid var(--paper);
  box-shadow:0 24px 50px rgba(23,19,15,.3);
}
.about-media-inset img{inline-size:100%;block-size:100%;object-fit:cover;}

/* ---------- gallery ---------- */
.gallery{padding-block:clamp(4rem,9vw,7rem);border-block-start:1px solid var(--line);background:var(--paper-deep);}
.gallery-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:1.5rem;
  flex-wrap:wrap;
}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:130px;
  grid-auto-flow:dense;
  gap:.75rem;
}
.g-item{position:relative;grid-column:span 2;grid-row:span 2;overflow:hidden;margin:0;}
.g-tall{grid-row:span 3;}
.g-wide{grid-column:span 3;}
.g-item img{
  inline-size:100%;block-size:100%;object-fit:cover;
  transform:scale(1.001);
  transition:filter .8s var(--ease-std), transform .9s var(--ease-std);
}
@media (hover:hover) and (pointer:fine){
  .g-item:hover img{transform:scale(1.05);}
}

/* ---------- responsive ---------- */
@media (max-width:1023px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-media{margin-inline-end:0;aspect-ratio:16/10;order:-1;}
  .hero-text{align-items:stretch;}
  .about-grid{grid-template-columns:1fr;}
  .about-text .section-title{margin-inline-end:0;}
  .about-media{order:-1;margin-block-end:1rem;}
  .about-media-inset{inset-inline-start:6%;inset-block-end:-6%;inline-size:44%;}
}

@media (max-width:759px){
  .chapter-photo.p1{inset-inline-start:6%;}
  .chapter-photo.p3{inset-inline-end:6%;}
  .prog-row{grid-template-columns:64px 1fr;column-gap:1rem;row-gap:.6rem;}
  .prog-cta{grid-column:2/3;justify-self:start;}
  .prog-poster{display:none;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;}
  .g-tall{grid-row:span 2;}
  .g-wide{grid-column:span 2;}
  .about-media-inset{position:static;inline-size:60%;margin-block-start:.75rem;border-width:4px;}
  .about-media-main{aspect-ratio:4/3;}
}