/* Hero type refresh — ES only. IBM Plex is bundled locally under SIL OFL 1.1.
   Queries de comparación local: ?headline=plex | grotesk | serif. */
@font-face{font-family:"PG Hero Plex";src:url("media/fonts/ibm-plex-sans-regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"PG Hero Plex";src:url("media/fonts/ibm-plex-sans-semibold.woff2") format("woff2");font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:"PG Hero Plex";src:url("media/fonts/ibm-plex-sans-bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:"PG Hero Plex Serif";src:url("media/fonts/ibm-plex-serif-regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}

.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__headline{top:20.5%;width:min(76vw,1060px);display:grid;gap:clamp(13px,1.45vw,24px);font-size:clamp(52px,6.35vw,102px);line-height:.93;letter-spacing:-.027em;text-align:left;text-wrap:balance}
.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__headline span{display:block;white-space:normal}

/* A · Sans editorial: recomendada. Ritmo recto, peso controlado y tres grupos completos. */
.hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline{width:min(72vw,980px);font-family:"PG Hero Plex","Helvetica Neue",sans-serif;font-size:clamp(50px,5.7vw,92px);font-weight:600;line-height:.96;letter-spacing:.004em}
.hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(1){justify-self:start;margin-left:clamp(0px,2.1vw,34px)}
.hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(2){justify-self:end;margin-right:clamp(0px,2.1vw,34px)}
.hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(3){justify-self:start;margin:clamp(3px,.45vw,8px) 0 0 clamp(10px,7.3vw,108px);font-size:.54em;font-weight:700;letter-spacing:-.018em;color:var(--accent)}

/* B · Grotesca contemporánea: más compacta y frontal, sin tracking forzado. */
.hero-story[data-hero-variant="editorial"][data-headline-variant="grotesk"] .hero-story__headline{width:min(72vw,1000px);font-family:PG,"Helvetica Neue",sans-serif;font-size:clamp(50px,6vw,96px);font-weight:700;line-height:.94;letter-spacing:-.042em;text-align:center}
.hero-story[data-hero-variant="editorial"][data-headline-variant="grotesk"] .hero-story__headline span{margin:0!important}
.hero-story[data-hero-variant="editorial"][data-headline-variant="grotesk"] .hero-story__headline span:nth-child(3){color:var(--accent);font-size:.56em;letter-spacing:-.025em}

/* C · Serif estructurada: contraste sobrio, sin cursivas ni gesto caligráfico. */
.hero-story[data-hero-variant="editorial"][data-headline-variant="serif"] .hero-story__headline{width:min(74vw,1040px);font-family:"PG Hero Plex Serif",Georgia,serif;font-size:clamp(54px,6.55vw,105px);font-weight:400;line-height:.9;letter-spacing:-.021em;text-align:center}
.hero-story[data-hero-variant="editorial"][data-headline-variant="serif"] .hero-story__headline span{margin:0!important}
.hero-story[data-hero-variant="editorial"][data-headline-variant="serif"] .hero-story__headline span:nth-child(3){font-family:"PG Hero Plex","Helvetica Neue",sans-serif;font-size:.5em;font-weight:700;letter-spacing:-.012em;color:var(--accent)}

/* La promesa aprobada conserva su composición, independiente del titular. */
.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise{top:40%;width:min(39vw,585px);font-size:clamp(40px,3.8vw,61px);line-height:.98;letter-spacing:-.008em;word-spacing:.11em}
.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise span:first-child{letter-spacing:-.004em;word-spacing:.12em}
.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise span:nth-child(2){margin-top:.17em;letter-spacing:-.012em;word-spacing:.1em}
.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise::after{top:62%}
.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise::before{top:calc(62% - 3px)}

@media(max-width:900px){
  .hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__headline{top:24.5%;left:var(--pad);width:calc(100% - var(--pad)*2);gap:clamp(10px,3vw,14px);font-size:clamp(38px,9.55vw,52px);line-height:.96;letter-spacing:-.022em;text-align:left;transform:translate3d(0,calc(var(--story-progress)*36vh),0) scale(calc(1 + var(--story-progress)*.025));transform-origin:left center}
  .hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline{font-size:clamp(34px,8.9vw,48px);line-height:1;letter-spacing:.006em}
  .hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(1),.hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(2){justify-self:start;margin:0}
  .hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(2){margin-left:.19em}
  .hero-story[data-hero-variant="editorial"][data-headline-variant="plex"] .hero-story__headline span:nth-child(3){margin:.1em 0 0 .58em;font-size:.56em}
  .hero-story[data-hero-variant="editorial"][data-headline-variant="grotesk"] .hero-story__headline,.hero-story[data-hero-variant="editorial"][data-headline-variant="serif"] .hero-story__headline{width:calc(100% - var(--pad)*2);font-size:clamp(37px,9.4vw,51px);line-height:.96;text-align:left}
  .hero-story[data-hero-variant="editorial"][data-headline-variant="grotesk"] .hero-story__headline span:nth-child(3),.hero-story[data-hero-variant="editorial"][data-headline-variant="serif"] .hero-story__headline span:nth-child(3){font-size:.55em}
  .hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise{top:14.5%;width:calc(100% - var(--pad)*2);font-size:clamp(29px,8.25vw,41px);line-height:.98;letter-spacing:-.012em;word-spacing:.06em}
  .hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__promise span:nth-child(2){margin-top:.17em;letter-spacing:-.018em}
}
@media(prefers-reduced-motion:reduce){.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-story__headline{transform:none}}
@media(max-width:900px) and (prefers-reduced-motion:reduce){.hero-story[data-hero-variant="editorial"][data-headline-variant] .hero-cut,.hero-story[data-hero-variant="editorial"][data-headline-variant][data-cut-locked] .hero-cut{top:66%}}
