/* ============================================================
   Sara & Dánae · Landing de campaña — estilos propios
   Depende de brand.css (variables de marca)
   ============================================================ */

/* Ancho de sección un poco más generoso en el hero ------------- */
.py-18 { padding-top: 4.5rem; padding-bottom: 4.5rem; }
.\!py-4\.5 { padding-top: 1.05rem !important; padding-bottom: 1.05rem !important; }

/* Galería: las fotos llenan su marco ---------------------------- */
.thumb img { width: 100%; height: 100%; object-fit: cover; }

/* ------------------------------------------------------------------
   CTA fijo en móvil
   ------------------------------------------------------------------ */
.sd-sticky-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
  padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(8px);
  border-top: 1px solid var(--sd-line);
  transform: translateY(110%);
  /* Fuera de pantalla NO basta: el tabulador seguía llegando a un botón que
     nadie ve. Con visibility oculta deja de recibir foco y clics. */
  visibility: hidden;
  transition: transform .28s ease;
}
.sd-sticky-cta.is-visible { transform: translateY(0); visibility: visible; }

/* ------------------------------------------------------------------
   Notificación de inscripción — discreta a propósito:
   chica, en crema, sin rojo, sin sonido, sin rebotes.
   ------------------------------------------------------------------ */
.sd-notif {
  position: fixed; left: 1rem; bottom: 1rem; z-index: 50;
  display: flex; align-items: center; gap: .75rem;
  max-width: 20.5rem; padding: .7rem .85rem .7rem .8rem;
  background: #fff; border: 1px solid var(--sd-line); border-radius: 16px;
  box-shadow: 0 14px 34px -18px rgba(24,24,24,.4);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .4s ease, transform .4s ease, visibility .4s;
}
.sd-notif.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }

.sd-notif-dot {
  width: 8px; height: 8px; border-radius: 50%; flex: none;
  background: var(--sd-teal); box-shadow: 0 0 0 4px var(--sd-teal-tint);
}
.sd-notif-body { min-width: 0; }
.sd-notif-text { font-size: .8rem; line-height: 1.35; color: var(--sd-ink); }
.sd-notif-text strong { font-weight: 700; }
.sd-notif-time { font-size: .68rem; color: var(--sd-muted); margin-top: .1rem; }
.sd-notif-close {
  flex: none; color: var(--sd-muted); background: none; cursor: pointer;
  padding: .15rem; border-radius: 8px; line-height: 0;
}
.sd-notif-close:hover { color: var(--sd-ink); background: var(--sd-cream); }

/* En móvil se sube para no chocar con el CTA fijo */
@media (max-width: 1023px) {
  .sd-notif { bottom: 5.25rem; left: .75rem; right: .75rem; max-width: none; }
}

/* Respeta a quien pidió menos movimiento en su sistema */
@media (prefers-reduced-motion: reduce) {
  .sd-notif, .sd-sticky-cta { transition: none; }
}

/* Áreas táctiles de la landing. Por PUNTERO, no por ancho (lección de Dielec). */
@media (pointer: coarse) {
  .sd-notif-close { min-width: 44px; min-height: 44px; }
  /* El enlace de la barra de anuncio medía 73×15 */
  .sd-barra-aviso a { min-height: 44px; display: inline-flex; align-items: center; }
}