/* === Quiz (scoped) — restored to tinder.txt look === */
/* Container */
.km-quiz{display:block; background-color: #efeee8; vertical-align: middle;}
.km-quiz .start-screen{
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  min-height:70vh; padding:40px 16px; background-color: #efeee8;
}
.km-quiz .start-screen img{max-width:220px; height:auto; display:block}

/* Title / subtitle */
.km-quiz .start-title{font-size:70px; margin:16px 0 10px; color:#333; font-weight:900; text-align:center}
.km-quiz .start-subtitle{font-size:1.2em; margin-bottom:20px; color:#555; width:75%; text-align:center}

/* Buttons like the prototype */
.km-quiz .start-button, .km-quiz .start-button2{
  padding:10px 20px; border:none; border-radius:17px; cursor:pointer; background:#F8AE25; color:#fff;
  transition:background-color .2s ease; font-weight:700; font-family:Montserrat;
}
.km-quiz .start-button{width:400px; font-size:1em}
.km-quiz .start-button2{width:200px; font-size:13px; padding-bottom: 10px}
.km-quiz .start-button:hover, .km-quiz .start-button2:hover{background:#F5BC54}




/* Vertically center quiz sections between header/footer (and cookie bar if visible) */
.km-quiz .start-screen,
.km-quiz #containerQuest,
.km-quiz #result{
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  min-height:70vh; padding:40px 16px; background-color: #efeee8;
}

.km-quiz .questionContainer{
  display:flex; flex-direction:column; justify-content:center; align-items:center;
  min-height:70vh; padding:40px 8px; background-color: #efeee8;
}



/* Question card */
.km-quiz .questionContainer{width:auto; display:flex; justify-content:center; padding:20px}
.km-quiz .question-card{
  background:#fff; width:700px; max-width:95vw; margin:0 auto; padding:40px; border-radius:15px;
  box-shadow:0 0 10px rgba(0,0,0,.07); text-align:center; min-height:380px; display:flex; flex-direction:column; gap:18px; justify-content:space-between; 
}
.km-quiz .question-number{font-size:32px; color:#333; font-weight:900}
.km-quiz .question-text{font-size:1.1em; color:#555; font-weight:500; width:90%; margin:0 auto}

/* Big round answers (JĀ/NĒ/A/B) */
.km-quiz .answer-buttons{display:flex; justify-content:center; align-items:center; gap:22px; flex-wrap:wrap}
.km-quiz .answer-yes, .km-quiz .answer-no, .km-quiz .answer-a, .km-quiz .answer-b{
  width:100px; height:100px; border:none; border-radius:50%; font-size:1.2em; cursor:pointer; color:#fff;
}
.km-quiz .answer-yes{background:#28a745}
.km-quiz .answer-no{background:#dc3545}
.km-quiz .answer-a, .km-quiz .answer-b{background:#F8AE25}
.km-quiz .answer-yes:hover{background:#2fb34f}
.km-quiz .answer-no:hover{background:#e25562}
.km-quiz .answer-a:hover, .km-quiz .answer-b:hover{background:#F5BC54}

/* Results */
.km-quiz .results-container{margin-top:30px; text-align:center; padding:0 12px; width: 70%; align-items: center;}
.km-quiz .winning-group{font-size:60px; color:#333; margin:10px 0 18px}
.km-quiz .percentage-bar{width:600px; max-width:95vw; margin:10px auto; height:30px; background:#C5C6C7; border-radius:17px; position:relative; overflow:hidden}
.km-quiz .percentage-fill{height:100%; background:#F8AE25; width:0%; transition:width .8s ease}
.km-quiz .percentage-text{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700}
.km-quiz .group-list{margin-top:20px; font-size:14px; color:#555; display:flex; flex-direction:column; gap:6px}
.km-quiz .group-item a{color:#333; text-decoration:none}
.km-quiz .group-item a:hover{text-decoration:underline}

/* Responsive (match your original) */
@media (max-width: 992px){
  .km-quiz .start-title{font-size:42px}
  .km-quiz .start-subtitle{width:95%; font-size:1em}
  .km-quiz .start-button{width:90%}
  .km-quiz .start-button2{width:100%; margin-bottom: 10px}
  .km-quiz .winning-group{font-size:36px}
  .km-quiz .question-card{
  background:#fff; width:auto; max-width:90vw; margin:0 0 0 0; padding:40px; border-radius:15px;
  box-shadow:0 0 10px rgba(0,0,0,.07); text-align:center; min-height:380px; display:flex; flex-direction:column; gap:0px; justify-content:space-between;} 
  .km-quiz .percentage-bar{width:auto; max-width:95vw; margin:10px auto; height:30px; background:#C5C6C7; border-radius:17px; position:relative; overflow:hidden}
}
