@font-face {
  font-family: 'Bodoni Moda Landing';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/assets/fuentes/landing-production/bodoni-moda-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Manrope Landing';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('/assets/fuentes/landing-production/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --font-editorial: 'Bodoni Moda Landing';
  --font-interface: 'Manrope Landing';
  --sans: 'Manrope Landing', Arial, sans-serif;
  --display: 'Bodoni Moda Landing', Georgia, serif;
  --noir: var(--ink);
  --noir-2: var(--ink-soft);
  --marfil: var(--ivory);
  --marfil-60: var(--text-on-dark-muted);
  --marfil-30: rgba(245, 241, 232, .3);
  --marfil-10: var(--line-dark-soft);
  --papel: var(--ivory);
  --tinta: var(--ink);
  --tinta-60: rgba(11, 11, 12, .66);
  --hilo: var(--carmine);
  --hilo-fuerte: var(--carmine-dark);
  --pad: clamp(18px, 4vw, 48px);
}

/* El selector visual del formulario fuente también se llama `.consent`.
   Estos tres valores evitan que afecte al banner funcional del destino. */
#consent.consent {
  --sans: 'Manrope Landing', Arial, sans-serif;
  --display: 'Bodoni Moda Landing', Georgia, serif;
  width: auto;
  max-width: none;
  margin: 0;
}

/* Adaptación semántica estricta: los CTA visuales pasan de <button> a enlaces
   reales para que el único listener de tracking del destino los reconozca.
   Las reglas originales que nombraban explícitamente `button` se replican
   aquí sin alterar dimensiones ni estados. */
.announcement a.nav-cta {
  --cta-attention-color: rgba(208, 29, 63, .2);
  --cta-glint: rgba(208, 29, 63, .25);
  --cta-rest-shadow: 0 10px 24px rgba(51, 0, 10, .2), 0 0 0 1px rgba(245, 241, 232, .16), inset 0 0 0 1px rgba(208, 29, 63, .08);
  display: inline-flex;
  min-height: 38px;
  grid-column: 3;
  align-items: center;
  justify-content: center;
  justify-self: end;
  padding: 0 18px;
  border: 1px solid rgba(245, 241, 232, .72);
  border-radius: 6px;
  color: var(--carmine-dark);
  background: var(--ivory);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: var(--cta-rest-shadow);
  transition: translate 150ms ease-out, scale 150ms ease-out, color 180ms ease, background 180ms ease, transform 180ms ease;
}

.announcement a.nav-cta:hover {
  color: var(--carmine-dark);
  background: #fffdf8;
  transform: scale(1.025);
  box-shadow: 0 14px 32px rgba(51, 0, 10, .26), 0 0 20px rgba(245, 241, 232, .22), inset 0 0 0 1px rgba(208, 29, 63, .12);
  animation-play-state: paused;
}

.announcement a.nav-cta:active {
  scale: .985;
}

.announcement a.nav-cta[data-quiet='true'] {
  color: var(--ivory);
  border-color: rgba(245, 241, 232, .42);
  background: transparent;
  box-shadow: none;
}

.announcement a.nav-cta[data-quiet='true']:hover,
.announcement a.nav-cta[data-quiet='true']:focus-visible {
  color: var(--carmine-dark);
  border-color: rgba(245, 241, 232, .85);
  background: var(--ivory);
}

/* Atención compartida con el CTA del hero: mismos keyframes de la hoja
   fuente (cta-double-pulse + cta-idle-glint), con halo y destello en marfil
   porque este CTA descansa sobre la barra carmín. El reparto de atención de
   wow-cta solo concede el pulse a un CTA visible a la vez y este es fijo en
   pantalla con prioridad baja, así que recibe el ciclo por CSS sin tocar su
   prioridad ni el reparto del resto. */
.announcement a.nav-cta[data-quiet='true'] {
  --cta-rest-shadow: 0 0 0 0 rgba(245, 241, 232, 0);
  --cta-attention-color: rgba(245, 241, 232, .32);
  --cta-sheen: rgba(245, 241, 232, .18);
  --cta-glint: rgba(255, 255, 255, .34);
}

.announcement a.nav-cta[data-cta-attention='true']:not([data-cta-interacting='true']):not(:hover):not(:focus-visible):not(:active) {
  animation: cta-double-pulse 2.3s ease-in-out infinite;
}

.announcement a.nav-cta[data-cta-attention='true']:not([data-cta-interacting='true']):not(:hover):not(:focus-visible):not(:active)::before {
  animation: cta-idle-glint 2.3s var(--ease-out) infinite;
}

.sticky-cta a.nav-cta {
  --cta-rest-shadow: 0 16px 36px -14px #d01d3fc2, 0 0 28px -14px #ff32579e, inset 0 0 0 1px #f5f1e82e;
  --cta-attention-color: #d01d3f38;
  min-height: 46px;
  color: var(--ivory);
  background: linear-gradient(105deg, #b81233 0%, var(--carmine) 52%, #ae102f 100%);
  letter-spacing: .07em;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  border: 1px solid #f5f1e83d;
  border-radius: 6px;
  justify-content: center;
  align-items: center;
  padding: 0 22px;
  font-size: .72rem;
  font-weight: 800;
  transition: translate .15s ease-out, scale .15s ease-out, background .18s, box-shadow .22s;
  display: inline-flex;
}

.sticky-cta a.nav-cta:hover,
.sticky-cta a.nav-cta:focus-visible {
  background: linear-gradient(105deg, #a20e2b 0%, var(--carmine-dark) 52%, #910b25 100%);
  box-shadow: 0 20px 44px -14px #d01d3fd6, 0 0 32px -14px #ff3257b8, inset 0 0 0 1px #f5f1e838;
}

.sticky-cta a.nav-cta:active {
  scale: .985;
}

.registro-fallback {
  padding: clamp(56px, 8vw, 96px) var(--pad);
  background: var(--ink-wine);
}

.registro-fallback > * {
  width: min(100%, 620px);
  margin-inline: auto;
}

@media (width <= 767px) {
  /* El control fijo de preferencias pertenece al contrato de consentimiento
     del destino. Esta reserva inferior evita que tape el primer enlace legal
     cuando el footer alcanza el final desplazable de la página. */
  body.landing-production .footer-bottom {
    padding-bottom: 56px;
  }

  .announcement a.nav-cta {
    letter-spacing: .03em;
    grid-column: 2;
    min-height: 36px;
    padding: 0 10px;
    font-size: .6rem;
  }

  .sticky-cta a.nav-cta {
    width: 100%;
    min-height: 50px;
  }



}

@media (width <= 380px) {
  .announcement a.nav-cta {
    letter-spacing: .02em;
    padding-inline: 8px;
    font-size: .58rem;
  }

}

@media (width >= 768px) and (width <= 900px) {
  .announcement a.nav-cta {
    padding-inline: 14px;
    font-size: .62rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .announcement a.nav-cta {
    animation: none !important;
  }
}