/* FEL 2026 · capa premium. Se carga después de lindy-uikit y no toca la máquina. */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --gg-navy: #031c36;
  --gg-blue: #004679;
  --gg-accent: #0a8fe8;
  --gg-accent-2: #22c3ff;
  --gg-gold: #ffc53d;
  --gg-gold-2: #ff9f1c;
  --gg-ink: #0f1b2d;
  --gg-muted: #5b6b82;
  --gg-line: #dde6f0;
  --gg-radius: 20px;
  --gg-shadow: 0 24px 60px -20px rgba(3, 28, 54, .45);
  --gg-font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

.signup-style-1, .survey-content, .login-section, .hero-section-wrapper-2, .modal-content {
  font-family: var(--gg-font) !important;
  -webkit-font-smoothing: antialiased;
}

/* Precarga */
.preloader { background: radial-gradient(circle at 30% 20%, #0b3f6e 0%, var(--gg-navy) 70%) !important; }

/* Botones */
.signup-style-1 .button, .survey-content .button, .login-section .button, .hero-section-wrapper-2 .button {
  height: 58px !important;
  margin-right: 0 !important;
  border: 0 !important;
  border-radius: 16px !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  letter-spacing: .3px;
  color: #fff !important;
  background: linear-gradient(135deg, var(--gg-accent) 0%, var(--gg-blue) 100%) !important;
  box-shadow: 0 14px 30px -12px rgba(10, 143, 232, .75) !important;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease !important;
}
.signup-style-1 .button:hover, .survey-content button.button:hover, .hero-section-wrapper-2 .button:hover {
  transform: translateY(-2px);
  filter: brightness(1.06);
  box-shadow: 0 20px 36px -12px rgba(10, 143, 232, .85) !important;
}
.signup-style-1 .button:focus-visible, .survey-content .button:focus-visible, .hero-section-wrapper-2 .button:focus-visible {
  outline: 3px solid var(--gg-accent-2) !important;
  outline-offset: 3px;
}

/* ===================== Ingreso ===================== */
.signup-style-1 {
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: 60px 0 !important;
  background:
    radial-gradient(900px 500px at 10% 10%, rgba(34, 195, 255, .22), transparent 60%),
    radial-gradient(800px 600px at 90% 90%, rgba(255, 197, 61, .14), transparent 60%),
    linear-gradient(160deg, var(--gg-navy) 0%, var(--gg-blue) 100%) !important;
}
.signup-style-1::before { display: none !important; }
.signup-style-1 .signup-content-wrapper .section-title h3 {
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: -.4px;
  line-height: 1.2;
}
.signup-style-1 .signup-content-wrapper .section-title h3:last-child {
  display: inline-block;
  margin-top: 12px;
  font-size: 22px !important;
  background: linear-gradient(90deg, var(--gg-gold), var(--gg-gold-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}
.signup-style-1 .signup-content-wrapper .section-title p {
  color: rgba(255, 255, 255, .82) !important;
  font-size: 16px;
  line-height: 1.7;
}
.signup-style-1 .signup-content-wrapper .image img {
  border-radius: var(--gg-radius);
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .35));
}
.signup-style-1 .signup-form-wrapper {
  background: rgba(255, 255, 255, .97) !important;
  border-radius: 28px !important;
  padding: 44px 40px !important;
  box-shadow: var(--gg-shadow) !important;
  border: 1px solid rgba(255, 255, 255, .6);
  animation: gg-sube .6s ease both;
}
.signup-style-1 .single-input label {
  display: block;
  color: var(--gg-ink) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  margin-bottom: 8px;
}
.signup-style-1 .single-input input {
  width: 100%;
  height: 58px !important;
  border-radius: 14px !important;
  border: 1.5px solid var(--gg-line) !important;
  background: #f7fafd !important;
  padding: 0 18px !important;
  font-size: 18px !important;
  font-weight: 600;
  color: var(--gg-ink) !important;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.signup-style-1 .single-input input:focus {
  outline: none;
  background: #fff !important;
  border-color: var(--gg-accent) !important;
  box-shadow: 0 0 0 4px rgba(10, 143, 232, .18) !important;
}
.signup-style-1 .signup-form a {
  display: inline-block;
  margin: 18px 0 10px;
  color: var(--gg-accent) !important;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.signup-style-1 .form-check-input { width: 20px; height: 20px; accent-color: var(--gg-accent); cursor: pointer; }
.signup-style-1 .form-check-label { color: var(--gg-muted) !important; font-weight: 500; padding-left: 6px; cursor: pointer; }
.signup-style-1 .alert, .survey-content .alert {
  border: 0 !important;
  border-radius: 14px !important;
  font-weight: 600;
  color: #7a1020 !important;
  background: #ffe8ec !important;
}
.signup-style-1 .alert-info { color: #064b7a !important; background: #e4f3ff !important; }

/* ===================== Encuesta ===================== */
body.antialiased .survey-content {
  background:
    radial-gradient(700px 400px at 0% 0%, rgba(34, 195, 255, .16), transparent 60%),
    linear-gradient(180deg, #f3f8fd 0%, #e7f0f9 100%) !important;
}
body.antialiased .survey-content .container > .row { min-height: 100%; align-items: center; }
body.antialiased .survey-content img.w-100 { border-radius: 24px; filter: drop-shadow(0 24px 30px rgba(3, 28, 54, .18)); }
body.antialiased .container-questions .about-content-wrapper {
  background: #fff !important;
  border-radius: 28px !important;
  padding: 36px 34px 44px !important;
  box-shadow: 0 30px 70px -30px rgba(3, 28, 54, .35) !important;
  border: 1px solid #e8eef5;
  animation: gg-sube .5s ease both;
}
body.antialiased .survey-content .section-title h3,
body.antialiased .survey-content .about-content-wrapper h4 {
  color: var(--gg-navy) !important;
  font-weight: 800 !important;
  letter-spacing: -.3px;
}
body.antialiased .survey-content .section-title p { color: var(--gg-muted) !important; font-size: 16px; }
body.antialiased .survey-content .row-question {
  border-bottom: 1px solid #edf2f7 !important;
  padding: 20px 4px !important;
  margin-bottom: 4px !important;
}
body.antialiased .survey-content .question {
  color: var(--gg-ink) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.45;
  margin-bottom: 14px !important;
}
body.antialiased .survey-content .option label {
  position: relative;
  padding: 14px 18px 14px 50px !important;
  border-radius: 14px !important;
  border: 1.5px solid var(--gg-line) !important;
  background: #fff !important;
  color: var(--gg-ink) !important;
  font-weight: 500;
  transition: border-color .18s, background .18s, transform .18s, box-shadow .18s !important;
}
body.antialiased .survey-content .option label::before {
  content: '';
  position: absolute;
  left: 18px;
  top: 50%;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  border-radius: 6px;
  border: 2px solid #b9c7d8;
  background: #fff;
  transition: all .18s;
}
body.antialiased .survey-content .option input[type="radio"] + label::before { border-radius: 50%; }
body.antialiased .survey-content .option label:hover {
  border-color: var(--gg-accent) !important;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px -16px rgba(10, 143, 232, .8);
}
body.antialiased .survey-content .option input[type="radio"]:checked + label,
body.antialiased .survey-content .option input[type="checkbox"]:checked + label {
  border-color: var(--gg-accent) !important;
  background: linear-gradient(135deg, #eef8ff, #e3f2ff) !important;
  color: var(--gg-navy) !important;
  font-weight: 700 !important;
}
body.antialiased .survey-content .option input:checked + label::before {
  border-color: var(--gg-accent);
  background: var(--gg-accent);
  box-shadow: inset 0 0 0 4px #fff;
}
body.antialiased .survey-content .form-control {
  min-height: 54px;
  border-radius: 14px !important;
  border: 1.5px solid var(--gg-line) !important;
  background: #f7fafd !important;
  padding: 12px 16px !important;
  font-size: 16px !important;
  color: var(--gg-ink) !important;
}
body.antialiased .survey-content .form-control:focus {
  background: #fff !important;
  border-color: var(--gg-accent) !important;
  box-shadow: 0 0 0 4px rgba(10, 143, 232, .18) !important;
}
body.antialiased .survey-content div.button {
  background: #eef2f7 !important;
  color: var(--gg-muted) !important;
  box-shadow: none !important;
  cursor: default;
}
body.antialiased .survey-content .about-content-wrapper::-webkit-scrollbar { width: 8px; }
body.antialiased .survey-content .about-content-wrapper::-webkit-scrollbar-thumb { background: #c9d6e4; border-radius: 8px; }

/* ===================== Ya participaste / bloqueado ===================== */
.login-section.login-style-1 {
  min-height: 100vh;
  margin-bottom: 0 !important;
  display: flex;
  align-items: center;
  background:
    radial-gradient(800px 500px at 15% 15%, rgba(34, 195, 255, .2), transparent 60%),
    linear-gradient(160deg, var(--gg-navy), var(--gg-blue)) !important;
}
.login-section .login-wrapper { background: transparent !important; box-shadow: none !important; }
.login-section .login-wrapper .row > [class*="col-"] { margin-left: auto !important; margin-right: auto !important; }
.login-section .login-content-wrapper {
  background: #fff !important;
  border-radius: 28px !important;
  padding: 48px 40px !important;
  text-align: center;
  box-shadow: var(--gg-shadow) !important;
  animation: gg-sube .6s ease both;
}
.login-section .section-title h3 { color: var(--gg-navy) !important; font-weight: 800 !important; }
.login-section .section-title p { color: var(--gg-muted) !important; font-size: 16px; line-height: 1.7; }

/* ===================== Ganador ===================== */
.hero-section-wrapper-2 .hero-section {
  min-height: 100vh;
  display: flex;
  align-items: center;
  background: linear-gradient(180deg, rgba(3, 28, 54, .55), rgba(3, 28, 54, .85)) !important;
}
.hero-section-wrapper-2 h1 {
  font-weight: 800 !important;
  font-size: clamp(40px, 7vw, 72px) !important;
  letter-spacing: -1px;
  background: linear-gradient(90deg, #fff6d6, var(--gg-gold), var(--gg-gold-2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  text-shadow: none;
}
.hero-section-wrapper-2 h3 { letter-spacing: 4px; font-weight: 700 !important; }
.hero-section-wrapper-2 .prize-image { border-radius: 24px !important; filter: drop-shadow(0 30px 40px rgba(0, 0, 0, .45)) !important; }
.hero-section-wrapper-2 .button {
  color: var(--gg-navy) !important;
  background: linear-gradient(135deg, var(--gg-gold), var(--gg-gold-2)) !important;
  box-shadow: 0 16px 34px -12px rgba(255, 159, 28, .8) !important;
  padding: 0 44px !important;
}

/* ===================== Modales del juego ===================== */
.modal-content {
  border: 0 !important;
  border-radius: 28px !important;
  overflow: hidden;
  box-shadow: 0 40px 80px -20px rgba(0, 0, 0, .55) !important;
}

@keyframes gg-sube {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 767px) {
  .signup-style-1 .signup-form-wrapper, .login-section .login-content-wrapper { padding: 32px 22px !important; border-radius: 22px !important; }
  body.antialiased .container-questions .about-content-wrapper { padding: 26px 18px 36px !important; border-radius: 22px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}