/* AL EDITAR ESTE ARCHIVO: corre  python3 tools/css-version.py --apply  antes de publicar.
   /css/* se cachea y los <link> llevan ?v=<hash>; sin ese paso el cambio tarda hasta un día en verse. */
/* ==========================================================================
   CTAs de Aurora Tikun: brillo, barrido y botón secundario
   Se carga en el home (ES/EN) y en las páginas de lectura y guías.
   Sin JavaScript: solo CSS, y se apaga con prefers-reduced-motion.
   ========================================================================== */

/* Botón primario con brillo */
.cta-glow {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 0 0 rgba(212, 175, 55, 0);
  transition: box-shadow .35s ease, transform .25s ease, background-color .25s ease;
}
.cta-glow::after {
  content: "";
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -55%;
  width: 40%;
  background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, .5) 50%, transparent 100%);
  transform: skewX(-18deg);
  opacity: 0;
  pointer-events: none;
}
.cta-glow:hover::after,
.cta-glow:focus-visible::after { animation: cta-sheen .9s ease-out forwards; }
.cta-glow:hover,
.cta-glow:focus-visible {
  box-shadow: 0 0 24px rgba(212, 175, 55, .5), 0 8px 20px rgba(0, 0, 0, .28);
  transform: translateY(-2px);
}
.cta-glow:active { transform: translateY(0); box-shadow: 0 0 14px rgba(212, 175, 55, .45); }

@keyframes cta-sheen {
  0%   { opacity: .85; left: -55%; }
  100% { opacity: 0;   left: 125%; }
}

/* Latido suave del brillo, solo para el CTA más importante de cada pantalla.
   Se anima la opacidad de un resplandor interior: va en el compositor y no repinta. */
.cta-pulse { position: relative; }
.cta-pulse::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at 50% 45%, rgba(255, 255, 255, .38), transparent 72%);
  opacity: 0;
  animation: cta-late 3.8s ease-in-out infinite;
  pointer-events: none;
}
@keyframes cta-late {
  0%, 100% { opacity: 0; }
  50%      { opacity: .7; }
}

/* Botón secundario: contorno dorado, mismo tamaño táctil */
.cta-alt {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 44px;
  width: 100%;
  padding: .9rem 1.1rem;
  border: 1px solid rgba(212, 175, 55, .6);
  border-radius: 999px;
  background: transparent;
  color: #e8cca1;
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  transition: background-color .25s ease, border-color .25s ease, color .25s ease, box-shadow .25s ease;
}
.cta-alt:hover,
.cta-alt:focus-visible {
  background: rgba(212, 175, 55, .14);
  border-color: #d4af37;
  color: #f3e3c4;
  box-shadow: 0 0 18px rgba(212, 175, 55, .28);
}

/* Las tarjetas del home: dos botones apilados, el de WhatsApp arriba */
.card-ctas {
  display: flex;
  flex-direction: column;
  gap: .45rem;
  margin-top: .7rem;
}
.card-ctas .buy { margin-top: 0; width: 100%; }
.card-ctas .buy.alt {
  background: transparent;
  border: 1px solid rgba(212, 175, 55, .55);
  color: #e8cca1;
  font-size: .72rem;
  white-space: normal;
  padding: .6rem .8rem;
}
.card-ctas .buy.alt:hover {
  background: rgba(212, 175, 55, .14);
  border-color: #d4af37;
  color: #f3e3c4;
}

/* Invitación a dejar testimonio: panel propio con botón grande */
.tst-invita {
  margin: 1.8rem auto 0;
  max-width: 620px;
  padding: 1.6rem 1.4rem 1.5rem;
  text-align: center;
  border: 1px solid rgba(212, 175, 55, .38);
  border-radius: 18px;
  background: rgba(212, 175, 55, .07);
}
.tst-invita-t {
  margin: 0 0 1rem;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 1.5rem;
  line-height: 1.2;
  color: #f3e3c4;
}
.tst-invita .tst-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: .95rem 2.2rem;
  background: #d4af37;
  color: #121330;
  border-radius: 999px;
  font-weight: 700;
  font-size: 1.05rem;
  text-decoration: none;
}
.tst-invita .tst-btn:hover { background: #e8cca1; color: #121330; }
.tst-invita-sub {
  margin: 1rem 0 0;
  font-size: .82rem;
  line-height: 1.55;
  color: #b7aec4;
}

/* Variante para fondos claros (formulario de las páginas de guías) */
.cta-alt.light { border-color: rgba(160, 128, 32, .55); color: #6b5313; }
.cta-alt.light:hover,
.cta-alt.light:focus-visible {
  background: rgba(212, 175, 55, .14);
  border-color: #a08020;
  color: #40320c;
  box-shadow: 0 0 16px rgba(212, 175, 55, .22);
}

@media (prefers-reduced-motion: reduce) {
  .cta-glow, .cta-glow::after, .cta-pulse, .cta-alt { animation: none !important; transition: none !important; }
  .cta-glow:hover, .cta-glow:focus-visible { transform: none; }
}
