/* modules/lite.css — Landings ligeras: accesos / tienda / pagos.
   A diferencia de los otros 9 módulos (cada uno con su CSS propio portado de
   su site), estas 3 reutilizan las clases de landing.css. El wrapper
   .mod-<slug> fija --brand-accent = color del módulo; aquí redirigimos los
   acentos coral de la home a ese color, para que la página "sea" de su flor. */

.mod {
    --coral:       var(--brand-accent);
    --coral-light: color-mix(in srgb, var(--brand-accent) 68%, white);
}

/* El badge del hero y el punto llevan coral hardcodeado (rgba) — retintar. */
.mod .hero-badge {
    background:   color-mix(in srgb, var(--brand-accent) 14%, transparent);
    border-color: color-mix(in srgb, var(--brand-accent) 32%, transparent);
    color:        color-mix(in srgb, var(--brand-accent) 78%, white);
}
.mod .hero-badge-dot {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 30%, transparent);
    animation: none;   /* el keyframe pulse-dot reinyecta el coral; lo paramos */
}

/* Sombras del botón primario (también coral hardcodeado). */
.mod .btn-primary {
    box-shadow: 0 6px 24px color-mix(in srgb, var(--brand-accent) 34%, transparent);
}
.mod .btn-primary:hover {
    box-shadow: 0 10px 36px color-mix(in srgb, var(--brand-accent) 44%, transparent);
}
