/* v180 — guardrail fit patch
   Fixes newsletter display line breaks and gives display type runtime-safe sizing. */

/* Hero text: nudge left to align more naturally with the editorial card below. */
.home-beauty-hero-copy{
  left:clamp(30px,3.45vw,56px) !important;
  width:min(640px,48%) !important;
}
.home-beauty-hero-copy h1{
  max-width:9ch !important;
}

/* Newsletter: keep the approved two-line headline, not an accidental 4-line stack. */
.newsletter{
  grid-template-columns:minmax(0,1.48fr) minmax(360px,.52fr) !important;
  gap:38px !important;
}
.newsletter h2[data-home-slot="newsletter.headline"]{
  max-width:none !important;
  width:100% !important;
  font-size:clamp(44px,3.15vw,58px) !important;
  line-height:.98 !important;
  letter-spacing:-.048em !important;
  text-wrap:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
}
.newsletter h2[data-home-slot="newsletter.headline"][data-home-mode="spans"] > span{
  display:block !important;
  white-space:nowrap !important;
}
.newsletter > div:first-child{
  max-width:none !important;
  min-width:0 !important;
}
.newsletter .form,
.newsletter-consent{
  max-width:430px !important;
  margin-left:auto !important;
}

/* Runtime fit guard writes a CSS variable when a display line still overflows. */
.bg-fit-guarded{
  font-size:var(--bg-fit-size, inherit) !important;
}

@media (max-width:1180px){
  .home-beauty-hero-copy{
    left:32px !important;
    width:min(570px,52%) !important;
  }
  .newsletter{
    grid-template-columns:1fr !important;
    gap:28px !important;
  }
  .newsletter h2[data-home-slot="newsletter.headline"]{
    font-size:clamp(42px,5.8vw,60px) !important;
  }
  .newsletter .form,
  .newsletter-consent{
    max-width:720px !important;
    margin-left:0 !important;
  }
}

@media (max-width:760px){
  .home-beauty-hero-copy{
    left:22px !important;
    right:22px !important;
    width:auto !important;
  }
  .newsletter h2[data-home-slot="newsletter.headline"][data-home-mode="spans"] > span{
    white-space:normal !important;
  }
  .newsletter h2[data-home-slot="newsletter.headline"]{
    font-size:clamp(34px,9vw,48px) !important;
    line-height:1.04 !important;
  }
}
