/* v184 — polished visual guardrails
   Fixes the rendered layout issues caught by Rob after v183:
   - social follow headline uses controlled editorial two-line breaks
   - Vivienne quote is a designed two-line pull quote on desktop
   - Editor's Note grows to fit live text instead of clipping
   - newsletter headline aligns cleanly with the form column
   - vertical gaps between homepage blocks are standardised */

:root{
  --bg-section-gap:clamp(34px,4.2vw,58px);
  --bg-section-gap-tight:clamp(26px,3vw,42px);
}

/* Let the three-panel row grow when copy needs it. Never clip live text just to hold a fixed height. */
.hero-grid{
  align-items:stretch !important;
  margin-bottom:0 !important;
}
.hero-grid > .lead,
.hero-grid > .column,
.hero-grid > .bg164-editor-note{
  height:auto !important;
  min-height:660px !important;
}
.hero-grid > .column{
  align-self:stretch !important;
}
.hero-grid > .column .story.panel{
  min-height:0 !important;
}
.hero-grid > .bg164-editor-note{
  overflow:hidden !important;
  padding:clamp(32px,2.6vw,42px) clamp(30px,2.6vw,40px) clamp(34px,2.8vw,44px) !important;
}
.bg164-editor-title h2{
  max-width:12.8ch !important;
  font-size:clamp(34px,2.45vw,44px) !important;
  line-height:.98 !important;
  margin-bottom:clamp(16px,1.6vw,22px) !important;
}
.bg164-editor-title strong{
  margin-bottom:clamp(18px,1.7vw,24px) !important;
  font-size:clamp(12px,.86vw,15px) !important;
}
.bg164-editor-list{
  gap:clamp(12px,.95vw,15px) !important;
}
.bg164-editor-list li{
  padding-left:28px !important;
}
.bg164-editor-list a{
  font-size:clamp(13px,.92vw,16px) !important;
  line-height:1.25 !important;
  font-weight:800 !important;
}

/* Standardise section rhythm around the homepage blocks. */
.hero-grid + .vivienne-says,
.vivienne-says + .bg164-facevalue,
.bg164-facevalue + #latest,
.feature-band + .follow-strip,
.follow-strip + .newsletter{
  margin-top:var(--bg-section-gap) !important;
}
.vivienne-says{
  margin-bottom:0 !important;
}
.bg164-facevalue{
  margin-bottom:0 !important;
}
#latest{
  margin-bottom:var(--bg-section-gap-tight) !important;
}
.feature-band{
  margin-top:var(--bg-section-gap) !important;
  margin-bottom:0 !important;
}

/* Vivienne banner: designed two-line quote rather than three stubby lines. */
.vivienne-says{
  min-height:auto !important;
  padding:clamp(28px,2.8vw,38px) clamp(34px,3.8vw,56px) !important;
}
.vivienne-says p[data-home-slot="vivienne.quote"]{
  max-width:42ch !important;
  font-size:clamp(38px,3.05vw,52px) !important;
  line-height:1.02 !important;
  letter-spacing:-.052em !important;
  margin:10px 0 16px !important;
  text-wrap:normal !important;
}
.vivienne-says p[data-home-slot="vivienne.quote"] > span{
  display:block !important;
  white-space:nowrap !important;
}

/* Social follow strip: controlled lines, no orphan/hangover. */
.follow-strip{
  width:min(var(--bg-home-max), calc(100vw - var(--bg-page-gutter))) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:clamp(28px,3.5vw,56px) !important;
  align-items:center !important;
  padding:clamp(26px,2.8vw,36px) clamp(30px,3.4vw,48px) !important;
  overflow:hidden !important;
}
.follow-strip > div:first-child{
  min-width:0 !important;
}
.follow-strip h2[data-home-slot="follow.headline"]{
  max-width:980px !important;
  margin:0 !important;
  font-size:clamp(42px,3.35vw,60px) !important;
  line-height:.95 !important;
  letter-spacing:-.055em !important;
  text-wrap:normal !important;
}
.follow-strip h2[data-home-slot="follow.headline"] > span{
  display:block !important;
  white-space:nowrap !important;
}
.follow-actions{
  align-self:center !important;
  display:grid !important;
  gap:14px !important;
}
.follow-actions .social-link{
  min-width:170px !important;
  justify-content:center !important;
}

/* Newsletter: keep the display headline elegant and away from the form column. */
.newsletter{
  grid-template-columns:minmax(0,1fr) minmax(340px,390px) !important;
  gap:clamp(42px,4.2vw,62px) !important;
  padding:clamp(38px,4.1vw,58px) clamp(36px,4vw,58px) !important;
  align-items:center !important;
  overflow:hidden !important;
}
.newsletter > div:first-child{
  max-width:790px !important;
  min-width:0 !important;
}
.newsletter h2[data-home-slot="newsletter.headline"]{
  max-width:790px !important;
  font-size:clamp(42px,2.95vw,54px) !important;
  line-height:.98 !important;
  margin:0 0 22px !important;
  letter-spacing:-.052em !important;
}
.newsletter h2[data-home-slot="newsletter.headline"] > span{
  display:block !important;
  white-space:nowrap !important;
}
.newsletter p[data-home-slot="newsletter.copy"],
.newsletter .newsletter-points{
  max-width:66ch !important;
}
.newsletter .form,
.newsletter .form-note,
.newsletter-consent{
  max-width:390px !important;
  margin-left:auto !important;
}
.newsletter .form input,
.newsletter .form button{
  min-height:58px !important;
}

/* Tablet and small laptop: collapse before the editorial row or newsletter starts clipping. */
@media (max-width:1280px){
  .hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,.92fr) !important;
  }
  .hero-grid > .lead{
    grid-column:auto !important;
    min-height:620px !important;
  }
  .hero-grid > .column{
    min-height:620px !important;
  }
  .hero-grid > .bg164-editor-note{
    grid-column:1 / -1 !important;
    min-height:0 !important;
  }
  .bg164-editor-note .bg164-editor-title h2{
    max-width:20ch !important;
    font-size:clamp(38px,4vw,52px) !important;
  }
  .bg164-editor-list{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    column-gap:34px !important;
    row-gap:16px !important;
  }
}

@media (max-width:1180px){
  .newsletter{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }
  .newsletter > div:first-child,
  .newsletter h2[data-home-slot="newsletter.headline"]{
    max-width:100% !important;
  }
  .newsletter .form,
  .newsletter .form-note,
  .newsletter-consent{
    max-width:720px !important;
    margin-left:0 !important;
  }
  .follow-strip{
    grid-template-columns:1fr !important;
  }
  .follow-actions{
    display:flex !important;
    flex-wrap:wrap !important;
  }
}

@media (max-width:900px){
  .hero-grid > .lead,
  .hero-grid > .column,
  .hero-grid > .bg164-editor-note{
    min-height:0 !important;
  }
  .vivienne-says p[data-home-slot="vivienne.quote"] > span,
  .follow-strip h2[data-home-slot="follow.headline"] > span,
  .newsletter h2[data-home-slot="newsletter.headline"] > span{
    white-space:normal !important;
  }
  .vivienne-says p[data-home-slot="vivienne.quote"]{
    font-size:clamp(30px,8.5vw,46px) !important;
  }
  .follow-strip h2[data-home-slot="follow.headline"]{
    font-size:clamp(34px,9vw,50px) !important;
  }
  .newsletter h2[data-home-slot="newsletter.headline"]{
    font-size:clamp(34px,9vw,48px) !important;
  }
  .bg164-editor-list{
    grid-template-columns:1fr !important;
  }
}