/* ============================================================
   editorial campaign break (full bleed)
   ============================================================ */
.edi{position:relative;background:var(--dark);color:var(--on-dark);overflow:hidden;
  /* no margin of its own, either side: this is a full-bleed band, not a section
     with a rhythm to pay for. Above, the section's own bottom padding is the
     gap; below, the tinted block runs straight on from it, and a margin there
     would open a white strip between two coloured blocks. */
  margin-block:0}
.edi__media{position:absolute;inset:0}
.edi__media img{width:100%;height:100%;object-fit:cover;object-position:62% center;opacity:.95}
.edi__media::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(74% 80% at 15% 54%, rgba(16,13,10,.60) 0%, rgba(16,13,10,.30) 46%, rgba(16,13,10,0) 76%),
    linear-gradient(90deg, rgba(16,13,10,.56) 0%, rgba(16,13,10,.24) 22%, rgba(16,13,10,0) 44%);
}
.edi__in{
  position:relative;z-index:2;
  min-height:clamp(520px,82vh,860px);
  display:grid;grid-template-columns:repeat(12,1fr);align-content:center;gap:0 clamp(14px,1.6vw,28px);
  padding-block:clamp(60px,7.4vw,100px) clamp(84px,10.6vw,148px);
}
.edi__text{grid-column:1/6;display:grid;gap:0;justify-items:start}
.edi__head{
  font-family:var(--display);font-weight:300;line-height:.9;letter-spacing:-.026em;
  font-size:clamp(2.6rem,6.3vw,5.4rem);margin-bottom:clamp(22px,2.1vw,30px);
}
.edi__head em{font-style:italic;font-size:1.07em;letter-spacing:-.03em}
.edi__body{position:relative;padding-left:clamp(22px,2.3vw,36px);margin-left:clamp(8px,1.2vw,20px)}
/* the one graphic detail: a single hairline holding the copy to the headline */
.edi__mark{
  position:absolute;left:0;top:5px;width:1px;height:clamp(86px,9vw,116px);
  background:rgba(242,237,230,.28);
}
.edi__p{color:rgba(242,237,230,.76);max-width:30ch;font-size:var(--t-lead);margin-bottom:clamp(14px,1.3vw,19px)}
.edi__cta::after{transform:scaleX(0);transform-origin:left}
.edi__cta:hover::after{transform:scaleX(1);transform-origin:left}
.edi__cta:hover svg{transform:translateX(4px)}
.edi .link{color:var(--on-dark)}
@media (max-width:1024px){
  .edi__text{grid-column:1/13}
  .edi__body{padding-left:clamp(18px,3vw,26px);margin-left:0}
  .edi__media img{object-position:74% center}
  .edi__media::after{background:linear-gradient(0deg,rgba(16,13,10,.80),rgba(16,13,10,.40) 46%,rgba(16,13,10,.16))}
}