/* Header autonome (clair, responsive simple) — v6 */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e5e7eb;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.sh-wrap{max-width:1200px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;color:#111827;text-decoration:none}
.brand:hover{opacity:0.85}
.nav{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-left:auto}
.nav-link{color:#111827;text-decoration:none;font-weight:600;padding:8px 12px;border-radius:8px;transition:background .15s}
.nav-link:hover{background:#f3f4f6}
.nav-spacer{flex:1;min-width:16px}
@media (max-width:720px){
  .nav{gap:10px}
  .nav-link{padding:6px 10px;font-size:14px}
  .nav-spacer{display:none}
}
/* === Quiz feedback === */
.answers { margin-top:12px; }
.opt {
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:10px 12px;
  margin:6px 0;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:10px;
  cursor:pointer;
  position:relative;
  transition:background .15s, border-color .15s;
}
.opt input {
  margin:4px 0 0 2px;
  flex:0 0 auto;
  width:18px;
  height:18px;
  cursor:pointer;
}
.opt .text {
  flex:1;
  line-height:1.35;
  font-size:15px;
  font-weight:500;
  color:#1f2937;
  word-break:break-word;
}
.qd-icon {
  position:absolute;
  top:8px;
  right:10px;
  width:24px;
  height:24px;
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:14px;
  color:#fff;
  box-shadow:0 2px 4px rgba(0,0,0,.12);
}
.opt.good {
  background:#ecfdf5;
  border-color:#10b981;
}
.opt.good .text {
  color:#065f46;
}
.opt.bad {
  background:#fff5f5;
  border-color:#ef4444;
}
.opt.bad .text {
  color:#7f1d1d;
}
.opt.disabled {
  cursor:default;
  opacity:.96;
}

.qbox {
  border:1px solid #e5e7eb;
  border-radius:16px;
  background:#fff;
  padding:0;
  box-shadow:0 10px 24px rgba(2,8,23,.06);
}
.qbox.correct {
  border-color:#10b981;
  box-shadow:0 10px 26px rgba(16,185,129,.18);
}
.qbox.wrong {
  border-color:#ef4444;
  box-shadow:0 10px 26px rgba(239,68,68,.18);
}

.qtitle {
  font-size:16px;
  font-weight:600;
  margin:0;
  padding:16px 20px 6px;
  color:#1f2937;
}
.qbox.correct .qtitle { color:#065f46; }
.qbox.wrong .qtitle { color:#7f1d1d; }

.feedback {
  padding:8px 20px 4px;
  font-size:14px;
  min-height:30px;
}
.feedback .ok { color:#10b981; font-weight:600; }
.feedback .ko { color:#ef4444; font-weight:600; }

.actions {
  display:flex;
  gap:12px;
  padding:12px 20px 20px;
  flex-wrap:wrap;
}
.actions .btn {
  appearance:none;
  border:0;
  cursor:pointer;
  font-size:14px;
  font-weight:600;
  padding:10px 18px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:background .15s, transform .15s;
}
.btn-primary { background:#2563eb; color:#fff; }
.btn-primary:hover { background:#1d4ed8; }
.btn-secondary { background:#f3f4f6; color:#111827; }
.btn-secondary:hover { background:#e5e7eb; }
.btn:disabled { opacity:.55; cursor:not-allowed; }

@media (max-width:620px){
  .opt { padding:10px 10px; }
  .qtitle { font-size:15px; }
  .actions { flex-direction:column; }
  .btn { width:100%; }
}