@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(199, 157, 81, 0.2);
  --cta-glint: rgba(199, 157, 81, 0.25);
  --cta-rest-shadow: 0 10px 24px rgba(9, 22, 37, 0.2), 0 0 0 1px rgba(234, 240, 243, 0.16), inset 0 0 0 1px rgba(199, 157, 81, 0.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(234, 240, 243, 0.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: #f2f5f7;
  transform: scale(1.025);
  box-shadow: 0 14px 32px rgba(9, 22, 37, 0.26), 0 0 20px rgba(234, 240, 243, 0.22), inset 0 0 0 1px rgba(25, 53, 87, 0.12);
  animation-play-state: paused;
}

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

.announcement a.nav-cta[data-quiet='true'] {
  color: var(--ivory);
  border-color: #9baebb;
  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: #f4f3ec;
  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(234, 240, 243, 0);
  --cta-attention-color: #8297a8;
  --cta-sheen: rgba(234, 240, 243, 0.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 #c79d51c2, 0 0 28px -14px #dabf8e9e, inset 0 0 0 1px #eaf0f32e;
  --cta-attention-color: #c79d5138;
  min-height: 46px;
  color: var(--ivory);
  background: linear-gradient(105deg, #193456 0%, var(--carmine) 52%, #183151 100%);
  letter-spacing: .07em;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  border: 1px solid #eaf0f33d;
  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, #162e4b 0%, var(--carmine-dark) 52%, #132942 100%);
  box-shadow: 0 20px 44px -14px #193557d6, 0 0 32px -14px #193557b8, inset 0 0 0 1px #eaf0f338;
}

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

/* Subtítulo del hero: un punto más de cuerpo y medida algo más corta para
   mejorar la lectura bajo el titular display. Solo en escritorio: en ≤767px
   y ≤380px mandan las reglas móviles de la hoja fuente, que no se tocan. */
@media (width >= 768px) {
  body.landing-production .hero-copy {
    max-width: 580px;
    font-size: clamp(1.02rem, 1.15vw, 1.14rem);
  }
}

.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;
  }
}

/* Logo de marca en la barra de navegación (sustituye al wordmark tipográfico).
   El PNG de origen venía con fondo blanco y texto negro: se procesó a alpha
   real con el texto en marfil y el rojo de «LAB» conservado, así que NO
   necesita mix-blend-mode. Altura calcada del wordmark que sustituye (29px /
   25px en móvil) para no alterar la altura óptica de la nav. */
body.landing-production .wordmark--imagen img {
  display: block;
  height: 29px;
  width: auto;
}
@media (width <= 767px) {
  body.landing-production .wordmark--imagen img { height: 25px; }
}