/* ============================================================
   מועדון האזור — music page (public-v2)
   Editorial feature rows, image bleeding to the viewport edge on
   alternating rows, broken by a duotone band and a marquee divider.
   ============================================================ */

.m-clips{
  padding-block:clamp(1rem,3vw,2rem);
}

/* ---------- feature row: image bleeds to viewport edge ---------- */
.m-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:stretch;
  min-block-size:clamp(420px,58vh,600px);
  border-block-end:1px solid var(--line);
}
.m-media{
  position:relative;
  overflow:hidden;
  order:2;
}
.m-media img{
  inline-size:100%;
  block-size:100%;
  object-fit:cover;
  display:block;
}
.m-text{
  order:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:clamp(.9rem,2vw,1.2rem);
  padding-inline:clamp(1.5rem,6vw,4.5rem);
  padding-block:clamp(2rem,5vw,3rem);
}
.m-row.m-flip .m-media{order:1;}
.m-row.m-flip .m-text{order:2;}

.m-title{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(1.5rem,2.6vw,2.1rem);
  line-height:1.2;
  margin:0;
  max-width:22ch;
}
.m-desc{
  color:var(--ink-soft);
  font-size:clamp(.98rem,1.15vw,1.08rem);
  line-height:1.75;
  max-width:48ch;
  margin:0;
}
.m-credits{
  color:var(--ink-faint);
  font-size:.85rem;
  line-height:1.9;
  max-width:44ch;
  margin:0;
}

/* ---------- closing full-bleed feature ---------- */
.m-feature{
  padding-block-start:clamp(1rem,3vw,2rem);
}
.m-feature-media{
  position:relative;
  overflow:hidden;
  block-size:clamp(360px,58vh,600px);
  margin-block-end:clamp(2.5rem,6vw,4rem);
}
.m-feature-media img{
  inline-size:100%;
  block-size:100%;
  object-fit:cover;
}
.m-feature-text{
  max-width:64ch;
  padding-block-end:clamp(3rem,7vw,5rem);
}
.m-feature-text .m-title{max-width:none;font-size:clamp(1.7rem,3vw,2.4rem);margin-block-end:.9rem;}
.m-feature-text .m-desc{max-width:60ch;}

/* ---------- responsive ---------- */
@media (max-width:859px){
  .m-row{grid-template-columns:1fr;min-block-size:auto;}
  .m-media{order:1 !important;aspect-ratio:4/3;}
  .m-text{order:2 !important;padding-inline:clamp(1.25rem,5vw,2rem);}
  .m-title,.m-desc,.m-credits{max-width:none;}
  .m-feature-media{block-size:clamp(260px,44vh,400px);}
}