/* SUCOOPE — adaptación de NexusAI: colores de la marca */
:root {
  --bg: #0a0d24; --bg2: #0e1230; --bg3: #131840; --sf: #171d4d;
  --bd: rgba(255,255,255,0.08); --bd2: rgba(255,255,255,0.15);
  --tx: #f2f3ff; --tx2: #b0b5da; --tx3: #7a80ab;
  --pur: #2a339b; --blu: #191F6C;
  --grad: linear-gradient(135deg, #191F6C, #4a5bd4);
}
.lm {
  --bg: #fafbff; --bg2: #f1f3fc; --bg3: #e9ecfa; --sf: #ffffff;
  --bd: rgba(25,31,108,0.10); --bd2: rgba(25,31,108,0.22);
  --tx: #12174f; --tx2: #3c4270; --tx3: #767ca6;
}
.logo-nav { height: 42px; display: block; }
.lm .logo-dark { display: none !important; }
html:not(.lm) .logo-light { display: none !important; }
#hero { padding: 120px 0 70px; position: relative; overflow: hidden; }
.stat-pill { background: var(--sf); border: 1px solid var(--bd); border-radius: 16px; padding: 18px 22px; text-align: center; min-width: 150px; }
.stat-pill .num { font-size: 1.6rem; font-weight: 700; }
.calc-card { background: var(--sf); border: 1px solid var(--bd); border-radius: 20px; padding: 28px 26px; }
.calc-card label { display: flex; justify-content: space-between; font-weight: 600; font-size: .9rem; margin: 16px 0 6px; }
.calc-card input[type=range] { width: 100%; accent-color: #FA4238; cursor: pointer; }
.opciones { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 4px; }
.opciones button { flex: 1 1 auto; cursor: pointer; background: transparent; border: 1px solid var(--bd2); color: var(--tx2); padding: 8px 12px; border-radius: 10px; font-size: .78rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 600; }
.opciones button:hover { border-color: #191F6C; color: var(--tx); }
.opciones button.on { background: var(--grad); border-color: transparent; color: #fff; }
.calc-res { border-top: 1px solid var(--bd); margin-top: 18px; padding-top: 14px; }
.calc-res .cifra { font-size: 2.1rem; font-weight: 700; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nota { font-size: .76rem; color: var(--tx3); margin-top: 10px; }
.wa-float { position: fixed; right: 18px; bottom: 18px; z-index: 900; background: #22C15E; color: #fff !important; border-radius: 100px; padding: 12px 20px; text-decoration: none; font-weight: 700; font-size: .9rem; box-shadow: 0 10px 26px rgba(0,0,0,.3); }
.wa-float:hover { background: #1CAB52; }
.form-c { background: var(--sf); border: 1px solid var(--bd2); border-radius: 12px; color: var(--tx); padding: 12px 14px; width: 100%; font-size: .9rem; }
.form-c:focus { outline: 2px solid var(--pur); border-color: transparent; }
footer.site { background: var(--bg2); border-top: 1px solid var(--bd); padding: 44px 0 24px; color: var(--tx3); font-size: .86rem; }
footer.site a { color: var(--tx2); text-decoration: none; }
footer.site a:hover { color: var(--pur); }

/* Ajustes de contraste en modo claro para los tonos coral heredados */
.lm .hbadge { color: #191F6C; background: rgba(25,31,108,0.06); border-color: rgba(25,31,108,0.25); }
.lm .slbl { color: #2a339b; }
.lm .ftag { color: #2a339b; }
.lm .aur { opacity: .5; }
.bdot { background: #FA4238 !important; }

/* Página activa en el menú */
.nav-link.activo { color: #FA4238 !important; font-weight: 600; position: relative; }
.nav-link.activo::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px; background: #FA4238; border-radius: 2px; }
#mbmenu .nav-link.activo::after { display: none; }

/* Marca de agua del logo en los heros */
#hero::before { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: url("../img/logo-blanco.png") no-repeat right -6% center / min(48vw, 640px);
  opacity: .05; }
.lm #hero::before { background-image: url("../img/logo-azul.png"); opacity: .06; }
@media (max-width: 767px) { #hero::before { background-position: center 20%; background-size: 80vw; } }