/* POPCO! V18 — sistema visual compartido. Ajustes no destructivos. */
:root{--popco-title-xl:clamp(42px,5vw,76px);--popco-title-lg:clamp(34px,3.5vw,56px);--popco-lead:clamp(19px,1.65vw,24px);--popco-copy:clamp(16px,1.1vw,18px)}
body.popballs-page{--popco-accent:#e8007d}
body.babypops-page{--popco-accent:#28a9e0}
body.popkit-page{--popco-accent:#9850c9}
body.popco-home,body.popco-contact{--popco-accent:#e8007d}
/* Paneles de navegación: mismos cuerpos, pesos, separación y color por línea. */
body.popballs-page #dropmenu a,body.popballs-page #dropmenu .disabled,
body.babypops-page #dropmenu a,body.babypops-page #dropmenu .disabled,
body.popkit-page #dropmenu a,body.popkit-page #dropmenu .disabled{font-family:Outfit,sans-serif;font-size:21px;line-height:1.35;padding-top:14px;padding-bottom:14px;letter-spacing:0}
body.popballs-page #dropmenu .series a,body.babypops-page #dropmenu .series a,body.popkit-page #dropmenu .series a{font-size:18px;padding:9px 0}
body.popballs-page #dropmenu .top-link,body.babypops-page #dropmenu .top-link,body.popkit-page #dropmenu .top-link{font-size:26px;font-weight:700;color:#e8007d}
body.popballs-page #dropmenu .contact-link,body.babypops-page #dropmenu .contact-link,body.popkit-page #dropmenu .contact-link{font-size:24px;font-weight:700;color:#e8007d}
body.popballs-page #dropmenu .menu-close,body.babypops-page #dropmenu .menu-close,body.popkit-page #dropmenu .menu-close{color:#e8007d}
body.popballs-page #dropmenu a:hover,body.babypops-page #dropmenu a:hover,body.popkit-page #dropmenu a:hover{color:#e8007d}
/* Popkit: escala editorial compatible con la composición aprobada. */
body.popkit-page .intro h1{font-size:var(--popco-title-xl);font-weight:700}
body.popkit-page .section-head h2{font-size:var(--popco-title-lg);font-weight:700}
body.popkit-page .intro p{font-size:var(--popco-lead)}
body.popkit-page .contents p{font-size:var(--popco-copy)}
body.popkit-page .eyebrow{color:var(--popco-accent)}
body.popkit-page .item-list li:before{background:var(--popco-accent)}
/* Contacto: titular con la misma escala que las landings. */
body.popco-contact .contact-hero h1{font-size:var(--popco-title-xl)}
@media(max-width:700px){body.popballs-page #dropmenu a,body.babypops-page #dropmenu a,body.popkit-page #dropmenu a{font-size:19px}body.popballs-page #dropmenu .top-link,body.babypops-page #dropmenu .top-link,body.popkit-page #dropmenu .top-link{font-size:23px}}

/* V19: navegación institucional magenta en TODAS las líneas. */
:root{--popco-menu-accent:#e8007d}
body.popballs-page #dropmenu .top-link,body.babypops-page #dropmenu .top-link,body.popkit-page #dropmenu .top-link,
body.popballs-page #dropmenu .contact-link,body.babypops-page #dropmenu .contact-link,body.popkit-page #dropmenu .contact-link,
body.popballs-page #dropmenu .menu-close,body.babypops-page #dropmenu .menu-close,body.popkit-page #dropmenu .menu-close,
body.popballs-page #dropmenu a:hover,body.babypops-page #dropmenu a:hover,body.popkit-page #dropmenu a:hover{color:var(--popco-menu-accent)}
/* Jerarquía uniforme de líneas principales, sin alterar las subseries. */
body.popballs-page #dropmenu > a:not(.contact-link),body.babypops-page #dropmenu > a:not(.contact-link),body.popkit-page #dropmenu > a:not(.contact-link){font-weight:600;font-size:22px}
body.popballs-page #dropmenu > a.top-link,body.babypops-page #dropmenu > a.top-link,body.popkit-page #dropmenu > a.top-link{font-weight:600;font-size:22px}
body.popco-contact .menu-nav > a:not(.contact-link){font-family:Outfit,Arial,sans-serif;font-size:22px;font-weight:600}
body.popco-contact .menu-nav .top-link,body.popco-contact .menu-nav .contact-link,body.popco-contact .menu-nav > a:hover{color:var(--popco-menu-accent)}
@media(max-width:700px){body.popballs-page #dropmenu > a:not(.contact-link),body.babypops-page #dropmenu > a:not(.contact-link),body.popkit-page #dropmenu > a:not(.contact-link),body.popco-contact .menu-nav > a:not(.contact-link){font-size:20px}}

/* V20: escala tipográfica editorial unificada. */
:root{
 --popco-heading-hero:clamp(42px,5.1vw,78px);
 --popco-heading-section:clamp(34px,3.7vw,56px);
 --popco-heading-feature:clamp(30px,3.15vw,48px);
 --popco-heading-small:clamp(26px,2.7vw,38px);
 --popco-text-lead:clamp(19px,1.7vw,24px);
 --popco-text-body:clamp(16px,1.18vw,19px);
}
/* Popball: títulos y bajadas sin alterar layout de series o galerías. */
body.popballs-page .intro h1{font-size:var(--popco-heading-hero);font-weight:800;line-height:1.04}
body.popballs-page .intro-r p{font-size:var(--popco-text-lead);line-height:1.55;font-weight:400}
body.popballs-page .series-section h2,body.popballs-page .collection h2{font-size:var(--popco-heading-section)}
body.popballs-page .contact h2{font-size:var(--popco-heading-feature)}
body.popballs-page .contact .sub{font-size:var(--popco-text-body)}
/* BabyPops: azul de marca para destacados del contenido, no del menú. */
body.babypops-page .bp-title{font-size:var(--popco-heading-hero);font-weight:800;line-height:1.04;letter-spacing:-.04em}
body.babypops-page .bp-collection-heading h2{font-size:var(--popco-heading-section);font-weight:800;letter-spacing:-.04em}
body.babypops-page .bp-product-copy h3{font-size:var(--popco-heading-feature);font-weight:800}
body.babypops-page .bp-gallery-title h3{font-size:var(--popco-heading-small);font-weight:800}
body.babypops-page .bp-desc,body.babypops-page .bp-collection-heading>p:last-child{font-size:var(--popco-text-lead);font-weight:400;line-height:1.55}
body.babypops-page .bp-product-copy>p:last-child{font-size:var(--popco-text-body);font-weight:400}
body.babypops-page .bp-eyebrow,body.babypops-page .bp-kicker,body.babypops-page .bp-title .pink,body.babypops-page .bp-collection-heading h2 span,body.babypops-page .bp-product-copy h3 span,body.babypops-page .contact h2 span{color:var(--popco-accent)}
body.babypops-page .bp-rule{background:var(--popco-accent)}
body.babypops-page .contact h2{font-size:var(--popco-heading-feature)}
body.babypops-page .contact .sub{font-size:var(--popco-text-body)}
/* Popkit: títulos y copetes consistentes con las demás landings. */
body.popkit-page .intro h1{font-size:var(--popco-heading-hero);font-weight:800;line-height:1.04}
body.popkit-page .section-head h2{font-size:var(--popco-heading-section);font-weight:800}
body.popkit-page .closing h2{font-size:var(--popco-heading-feature);font-weight:800}
body.popkit-page .intro p{font-size:var(--popco-text-lead);font-weight:400;line-height:1.55}
body.popkit-page .contents p,body.popkit-page .closing p{font-size:var(--popco-text-body)}
/* Menú institucional: PopBall no debe quedar permanentemente rosado. */
body.popballs-page #dropmenu > a.top-link,body.babypops-page #dropmenu > a.top-link,body.popkit-page #dropmenu > a.top-link,
body.popco-home .menu-nav > a.top-link,body.popco-contact .menu-nav > a.top-link{color:#222;font-weight:600}
body.popballs-page #dropmenu > a.top-link:hover,body.babypops-page #dropmenu > a.top-link:hover,body.popkit-page #dropmenu > a.top-link:hover,
body.popco-home .menu-nav > a.top-link:hover,body.popco-contact .menu-nav > a.top-link:hover{color:var(--popco-menu-accent)}
/* El menú no hereda colores específicos de cada landing. */

/* V21: BabyPops adopta el ritmo editorial de Popball. Sin alterar galerías ni imágenes. */
body.babypops-page .bp-intro{padding-top:clamp(55px,6vw,85px);padding-bottom:clamp(65px,7vw,95px)}
body.babypops-page .bp-eyebrow{margin-bottom:14px;letter-spacing:.12em}
body.babypops-page .bp-title{line-height:1.015;letter-spacing:-.045em}
body.babypops-page .bp-rule{margin:25px 0 22px}
body.babypops-page .bp-desc{line-height:1.45}
body.babypops-page .bp-cta{margin-top:24px}
body.babypops-page .bp-collection{padding-top:clamp(65px,6.5vw,90px);padding-bottom:clamp(75px,7.5vw,105px)}
body.babypops-page .bp-collection-heading{margin-bottom:38px}
body.babypops-page .bp-collection-heading .bp-eyebrow{margin-bottom:10px}
body.babypops-page .bp-collection-heading h2{line-height:1.06}
body.babypops-page .bp-collection-heading>p:last-child{margin-top:13px;line-height:1.45}
body.babypops-page .bp-product-copy .bp-kicker{margin-bottom:11px}
body.babypops-page .bp-product-copy h3{line-height:1.07}
body.babypops-page .bp-product-copy>p:last-child{margin-top:15px;line-height:1.48}
body.babypops-page .bp-product-feature{margin-bottom:clamp(55px,6vw,85px)}
body.babypops-page .bp-gallery-title{margin-bottom:23px}
@media(max-width:700px){body.babypops-page .bp-intro{padding:55px 24px 65px}body.babypops-page .bp-collection{padding:58px 18px 72px}body.babypops-page .bp-collection-heading{margin-bottom:26px}body.babypops-page .bp-product-feature{margin-bottom:48px}}

/* V22: Popkit adopta el ritmo tipográfico aprobado en Popball/BabyPops.
   Sólo afecta espacios y jerarquía editorial de Popkit. */
body.popkit-page .intro{padding-top:clamp(55px,6vw,85px);padding-bottom:clamp(65px,7vw,95px)}
body.popkit-page .intro .eyebrow{letter-spacing:.12em;font-weight:700}
body.popkit-page .intro h1{margin:14px auto 17px;line-height:1.015;letter-spacing:-.045em}
body.popkit-page .intro p{line-height:1.45;margin:0 auto;max-width:850px}
body.popkit-page .intro .cta{margin-top:24px}
body.popkit-page .section{padding-top:clamp(65px,6.5vw,90px);padding-bottom:clamp(75px,7.5vw,105px)}
body.popkit-page .section-head{margin-bottom:28px}
body.popkit-page .section-head h2{line-height:1.06;letter-spacing:-.04em}
body.popkit-page .contents{padding-top:clamp(65px,7vw,92px)}
body.popkit-page .contents .eyebrow{letter-spacing:.12em;font-weight:700}
body.popkit-page .contents p{line-height:1.48}
body.popkit-page .closing h2{line-height:1.07;letter-spacing:-.04em}
body.popkit-page .closing p{line-height:1.48}
@media(max-width:700px){
 body.popkit-page .intro{padding:55px 20px 65px}
 body.popkit-page .section{padding:58px 18px 72px}
 body.popkit-page .section-head{margin-bottom:22px}
 body.popkit-page .contents{padding-top:65px}
}
