/* ── PLANES DE NACIMIENTO ──
   Solo estilos propios de la página principal (Planes de Nacimiento). El resto viene de styles.css.
   Mobile-first: la base es móvil y @media(min-width:769px) es escritorio
   (styles.css cambia a móvil en max-width:768px). */

main section{scroll-margin-top:4.5rem}

/* ── HERO ── */
.hero--planes{grid-template-columns:1fr;align-items:start;min-height:0;padding:5.6rem 5vw 3.5rem;gap:2.75rem;overflow:visible;overflow:clip}
.hero--planes .hero-left{opacity:1;transform:none;animation:none;padding-right:0}
.hero--planes .hero-bg-line{display:none}
.hero--planes .hero-eyebrow{font-size:0.64rem;letter-spacing:0.16em;margin-bottom:0.85rem}
.hero--planes .hero-title{font-size:clamp(1.9rem,8.4vw,2.6rem);line-height:1.1;margin-bottom:0.8rem}
.hero--planes .hero-sub{font-size:0.84rem;line-height:1.6;max-width:46ch;margin-bottom:1rem}
.hero--planes .hero-right{opacity:1;transform:none;animation:none;height:clamp(300px,95vw,440px);min-height:0}
.hero--planes .hero-img-tag{right:-0.5rem;bottom:1.25rem}

/* Precio ancla (mismo estilo que .hero-price-badge de styles.css) */
.ph-ancla{background:var(--rose-lt);border-left:3px solid var(--rose);padding:0.7rem 1rem 0.75rem;margin-bottom:1rem}
.ph-ancla__antes{font-size:0.74rem;color:var(--mid);letter-spacing:0.02em}
.ph-ancla__precio{font-family:var(--serif);font-size:1.2rem;color:var(--charcoal);line-height:1.05;margin:0.1rem 0 0.3rem}
.ph-ancla__precio strong{font-size:2.3rem;font-weight:500;color:var(--rose)}
.ph-ancla__nota{font-size:0.7rem;color:var(--mid);line-height:1.45}

/* Botones: apilados en móvil, en fila en escritorio */
.ph-acciones{flex-direction:column;align-items:stretch;gap:0.6rem}
.ph-acciones .btn-primary,.ph-acciones .btn-ghost,.ph-acciones .wa-button{text-align:center;justify-content:center;margin-top:0}
.ph-link-planes{display:inline-block;margin-top:0.9rem;font-size:0.78rem;color:var(--aqua-dk);text-decoration:none;letter-spacing:0.04em;border-bottom:1px solid currentColor;padding-bottom:0.1rem}
.ph-link-planes:hover{color:var(--charcoal)}

/* Viñetas con check */
.ph-checks{list-style:none;margin:1.6rem 0 1.1rem;display:flex;flex-direction:column;gap:0.6rem}
.ph-checks li{position:relative;padding-left:1.6rem;font-size:0.86rem;line-height:1.5;color:var(--charcoal)}
.ph-checks li::before{content:'';position:absolute;left:0.25rem;top:0.2em;width:0.42rem;height:0.78rem;border:solid var(--rose);border-width:0 2px 2px 0;transform:rotate(45deg)}

/* Línea de urgencia con reloj */
.ph-reloj{display:flex;align-items:flex-start;gap:0.6rem;font-size:0.8rem;line-height:1.5;color:var(--charcoal);margin-bottom:1.25rem}
.ph-reloj svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:var(--rose);stroke-width:1.6;stroke-linecap:round;margin-top:0.05rem}

/* Selector de semanas */
.ph-selector{background:white;border:1px solid oklch(0.80 0.006 285 / 0.35);padding:1.1rem 1rem 1.2rem;box-shadow:0 8px 30px oklch(0 0 0 / 0.04)}
.ph-selector__label{display:block;font-family:var(--serif);font-size:1.2rem;font-weight:500;line-height:1.25;margin-bottom:0.65rem}
.ph-selector__fila{display:flex;gap:0.5rem}
.ph-selector__fila input{flex:1;min-width:0;border:1px solid var(--light);background:var(--ivory);padding:0.75rem 0.85rem;font-family:var(--sans);font-size:1rem;color:var(--charcoal)}
.ph-selector__fila input:focus{outline:2px solid var(--rose);outline-offset:1px;border-color:var(--rose)}
.ph-selector__fila input[aria-invalid="true"]{border-color:#e53e3e}
.ph-selector__fila .btn-primary{padding:0.75rem 1.1rem;white-space:nowrap}
.ph-selector__error{font-size:0.75rem;color:#c53030;margin-top:0.45rem}
.ph-selector__resultado:not(:empty){margin-top:1rem;padding-top:1rem;border-top:1px solid oklch(0.80 0.006 285 / 0.35)}
.ph-resultado__texto{font-size:0.88rem;line-height:1.6;color:var(--charcoal)}
.ph-resultado__texto strong{font-weight:500;color:var(--aqua-dk)}
.ph-resultado__acciones{display:flex;flex-direction:column;gap:0.5rem;margin-top:0.9rem}
.ph-resultado__acciones .btn-primary,.ph-resultado__acciones .btn-ghost{text-align:center;padding:0.8rem 1rem}
.ph-resultado__nota{font-size:0.7rem;line-height:1.5;color:var(--mid);margin-top:0.75rem}

/* Segunda tarjeta flotante sobre la foto */
.ph-img-tag{position:absolute;top:1.5rem;left:-0.5rem;max-width:12.5rem;background:white;border-left:3px solid var(--rose);padding:0.75rem 1rem;font-family:var(--serif);font-size:1rem;font-weight:500;line-height:1.3;color:var(--charcoal);box-shadow:0 8px 30px oklch(0 0 0 / 0.08)}

/* ── PLANES ── */
.ph-planes{background:var(--ivory-2);padding:4.5rem 5vw}
.ph-planes__header{margin-bottom:2.75rem;max-width:55ch}
.ph-planes__grid{display:grid;grid-template-columns:1fr;gap:2rem}
.ph-plan{position:relative;display:flex;flex-direction:column;background:white;border:1px solid oklch(0.80 0.006 285 / 0.35);padding:2rem 1.25rem 1.5rem}
.ph-plan--destacado{border:2px solid var(--rose);box-shadow:0 14px 40px oklch(0.62 0.11 160 / 0.12)}
.ph-plan__badge{position:absolute;top:-0.8rem;left:1.25rem;background:var(--aqua-dk);color:white;font-size:0.64rem;letter-spacing:0.16em;text-transform:uppercase;padding:0.35rem 0.8rem}
.ph-plan__nombre{font-family:var(--serif);font-size:1.75rem;font-weight:500;line-height:1.15}
.ph-plan__ventana{font-size:0.82rem;color:var(--mid);margin:0.4rem 0 1.25rem}
.ph-plan__grupo{border-top:1px solid oklch(0.80 0.006 285 / 0.35);padding:0.95rem 0}
.ph-plan__grupo h4{font-size:0.66rem;font-weight:500;letter-spacing:0.13em;line-height:1.5;text-transform:uppercase;color:var(--aqua-dk);margin-bottom:0.6rem}
.ph-plan__lista{list-style:none;display:flex;flex-direction:column;gap:0.75rem}
.ph-plan__lista li{display:flex;justify-content:space-between;gap:1rem;font-size:0.84rem;line-height:1.55;color:var(--charcoal);font-weight:300}
.ph-plan__valor{flex-shrink:0;font-size:0.72rem;font-weight:400;color:var(--mid);white-space:nowrap;padding-top:0.15rem}
.ph-plan__resumen{margin:auto 0 1.25rem;padding:1rem 1.1rem;background:var(--ivory);display:grid;gap:0.3rem}
.ph-plan__resumen div{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-size:0.82rem;color:var(--mid)}
.ph-plan__resumen dd{margin:0}
.ph-plan__inversion dt{color:var(--charcoal)}
.ph-plan__inversion dd{font-family:var(--serif);font-size:2.1rem;font-weight:500;line-height:1.1;color:var(--charcoal)}
.ph-plan__ahorro dd{font-weight:500;color:var(--aqua-dk)}
.ph-plan__acciones{display:flex;flex-direction:column;gap:0.6rem}
.ph-plan__acciones button{width:100%;text-align:center}

/* ── CÓMO PAGAS ── */
.ph-pagos{background:var(--ivory);padding:4.5rem 5vw}
.ph-pasos{list-style:none;display:grid;gap:1rem;margin-top:2rem}
.ph-pasos li{display:flex;align-items:flex-start;gap:1rem;background:white;border:1px solid oklch(0.80 0.006 285 / 0.35);padding:1.25rem}
.ph-pasos__num{font-family:var(--serif);font-size:2.2rem;line-height:1;color:var(--rose);min-width:1.4rem}
.ph-pasos p{font-size:0.9rem;line-height:1.65;color:var(--charcoal);padding-top:0.35rem}
.ph-pasos strong{font-weight:500}

/* ── URGENCIA (franja a todo lo ancho) ── */
.ph-urgencia{background:var(--charcoal);padding:4.5rem 5vw;display:grid;gap:1.75rem;align-items:center}
.ph-urgencia .section-title{color:white}
.ph-urgencia p{font-size:0.92rem;line-height:1.7;color:oklch(0.80 0.006 285);max-width:60ch;margin-top:1rem}
.ph-urgencia .btn-promo{margin-top:0;justify-self:start}

/* ── IMPORTANTE ── */
.ph-importante{background:var(--ivory);padding:4.5rem 5vw}
.ph-importante__lista{list-style:none;display:grid;gap:0.9rem;max-width:70ch;margin-top:1.75rem}
.ph-importante__lista li{display:flex;gap:0.75rem;font-size:0.88rem;line-height:1.65;color:var(--mid)}
.ph-importante__lista li::before{content:'';flex-shrink:0;width:1.25rem;height:1px;margin-top:0.8em;background:var(--rose)}

/* ── DOCTOR (reutilizada): la foto va dentro de <picture> ── */
.doctor-img-main picture,.hero-img-frame picture{display:contents}

/* ── RESEÑAS (reutiliza .reviews de styles.css) ── */
.reviews{padding:4.5rem 5vw}
.ph-resenas{min-height:12rem}

/* ── CTA FINAL ── */
.ph-cta{background:var(--rose-lt);padding:4.5rem 5vw;text-align:center}
.ph-cta .section-title{margin-bottom:1.75rem}
.ph-cta__acciones{max-width:24rem;margin:0 auto}

/* ── WIDGET: selector de plan (3 opciones en el mini formulario) ── */
.wa-plan-selector .promo-day-btn{font-size:0.78rem;padding:0.7rem 0.35rem;line-height:1.25}

/* ── CONTRASTE ──
   Textos pequeños en verde oscuro del sitio (--aqua-dk, ≥4.5:1 sobre fondos claros)
   y grises claros sobre el pie oscuro. Los títulos grandes conservan --rose. */
.nav-brand span,.hero-eyebrow,.section-eyebrow,.contact-block-label{color:var(--aqua-dk)}
.hero-eyebrow::before,.section-eyebrow::before{background:var(--aqua-dk)}
nav .nav-cta{color:var(--aqua-dk);border-color:var(--aqua-dk)}
nav .nav-cta:hover{background:var(--aqua-dk);color:white}
.footer-brand small,.footer-note{color:var(--light)}
.ph-ancla__precio strong,.ph-cta .section-title em{color:var(--aqua-dk)}

/* ── ESCRITORIO ── */
@media(min-width:769px){
  .hero--planes{grid-template-columns:1fr 1fr;gap:0;padding:7.5rem 5vw 5rem;min-height:100vh}
  .hero--planes .hero-left{padding-right:4rem}
  .hero--planes .hero-bg-line{display:block}
  .hero--planes .hero-eyebrow{font-size:0.7rem;letter-spacing:0.2em;margin-bottom:1.25rem}
  .hero--planes .hero-title{font-size:clamp(2.6rem,4.4vw,4rem);line-height:1.12;margin-bottom:1.25rem}
  .hero--planes .hero-sub{font-size:0.9rem;line-height:1.75;margin-bottom:1.75rem}
  .hero--planes .hero-right{position:sticky;top:6rem;height:min(80vh,640px);min-height:520px}
  .hero--planes .hero-img-tag{right:-1.5rem;bottom:2rem}
  .ph-img-tag{top:2.5rem;left:-1.5rem}
  .ph-ancla{display:inline-block;padding:0.9rem 1.4rem 1rem;margin-bottom:1.75rem}
  .ph-acciones{flex-direction:row;align-items:center;gap:1rem}
  .ph-selector{padding:1.5rem 1.5rem 1.6rem;max-width:30rem}
  .ph-resultado__acciones{flex-direction:row;flex-wrap:wrap}

  .ph-planes,.ph-pagos,.ph-importante,.ph-cta,.reviews{padding:7rem 5vw}
  .ph-planes__grid{grid-template-columns:1fr 1fr;gap:2rem;align-items:stretch}
  .ph-plan{padding:2.5rem 2rem 2rem}
  .ph-pasos{grid-template-columns:1fr 1fr;gap:1.5rem}
  .ph-urgencia{grid-template-columns:1fr auto;gap:4rem;padding:5.5rem 5vw}
  .ph-cta__acciones{max-width:none;justify-content:center}
}