/* =========================================================
   TEST – ESTILOS ESPECÍFICOS
   Este archivo solo contiene estilos propios del módulo.
   Todo lo global (header, footer, botones, tipografía)
   viene desde ../styles.css
========================================================= */

/* CONTENEDOR GENERAL */
.test-main{
  padding:60px 5%;
  max-width:900px;
  margin:0 auto;
}

/* INTRO */
.test-intro{
  margin-bottom:40px;
}

.test-note{
  font-size:16px;
  margin-bottom:12px;
  color:#475569;
}

.test-warning{
  background:#fee2e2;
  color:#b91c1c;
  padding:14px 18px;
  border-radius:14px;
  font-weight:600;
  margin-top:10px;
}

/* TARJETAS */
.test-card{
  background:#fff;
  padding:36px 32px;
  border-radius:24px;
  box-shadow:0 15px 40px rgba(0,0,0,.06);
  margin-bottom:40px;
  display:flex;
  flex-direction:column;
  gap:26px; /* más aire */
}

/* INSTRUCCIONES */
.test-instructions{
  font-size:17px;
  font-weight:600;
  color:#1E293B;
}

/* PREGUNTAS */
.test-questions{
  list-style:decimal;
  padding-left:20px;
}

.test-questions li{
  margin-bottom:22px;
  color:#1E293B;
}

.test-options{
  display:flex;
  gap:20px;
  margin-top:8px;
  font-size:16px;
}

.test-options label{
  cursor:pointer;
}

/* BOTÓN SUBMIT */
.test-submit{
  margin-top:10px;
  width:100%;
  font-size:18px;
}

/* RESULTADO */
.test-result.hidden{
  display:none;
}

.test-score-text{
  font-size:20px;
  font-weight:600;
  margin:0;
}

.test-level{
  font-size:22px;
  font-weight:700;
  margin:0;
}

.test-recommendation{
  font-size:17px;
  color:#334155;
  margin:0;
  line-height:1.5;
}

/* BLOQUE DE BOTONES DEL RESULTADO */
.test-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:22px;
  width:100%;
  padding-top:10px;
}

.test-actions a{
  flex:1 1 260px;
  text-align:center;
  padding:16px 22px;
  border-radius:14px;
  font-size:17px;
  font-weight:600;
  min-height:56px; /* evita aplastamiento */
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1.3;
}

/* DISCLAIMER */
.test-disclaimer{
  font-size:14px;
  color:#64748B;
  line-height:1.6;
  margin-top:10px;
}

/* HERO DEL TEST */
.test-hero{
  height:60vh;
  background:url('../img/test-hero.jpg') center/cover;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 5%;
}

.test-hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom, rgba(20,30,60,.75), rgba(20,30,60,.45));
}

.test-hero-content{
  position:relative;
  z-index:2;
  max-width:700px;
  text-align:center;
  color:#fff;
}

.test-hero h1{
  font-size:48px;
  margin-bottom:12px;
}

.test-hero-subtitle{
  font-size:20px;
  margin-bottom:18px;
  opacity:.9;
}

.test-hero-note{
  font-size:15px;
  margin-bottom:28px;
  opacity:.85;
}

.test-hero-btn{
  padding:14px 28px;
  border-radius:50px;
  font-weight:700;
}

/* RESPONSIVE */
@media(max-width:768px){

  .test-hero{
    height:50vh;
  }

  .test-hero h1{
    font-size:36px;
  }

  .test-card{
    padding:26px 22px;
    gap:22px;
  }

  .test-options{
    flex-direction:column;
    gap:10px;
  }

  .test-actions a{
    min-width:100%;
  }
}
