/* Bashem quiz — typography, softened corners, and a forest + warm-white palette.
   The gold/brown accent (#C8973A) is replaced throughout with a very slightly warm white,
   leaving deep forest green as the only strong colour. Fonts already loaded on the page
   (Cormorant Garamond + Jost) — no new webfont requests. */

:root{
  --bq-forest:#1C3A22;
  --bq-cream:#F7F2E8;      /* body text */
  --bq-warm:#FBF7F0;       /* very slightly warm white — replaces the gold */
  --bq-radius:6px;
}

/* 1. The question must outrank the answers. It was 15px Jost/600 while the options were 16px —
      the wrong way round, which is what made it read as a form rather than a question. */
#quiz .quiz-q-text{
  font-family:"Cormorant Garamond",Georgia,serif !important;
  font-size:clamp(26px,3.2vw,34px) !important;
  font-weight:500 !important;
  line-height:1.24 !important;
  color:var(--bq-cream) !important;
  margin:0 0 8px !important;
  text-transform:none !important;
}
/* Italic hint kept — it gives the question a spoken, human quality. Just made legible. */
#quiz .quiz-q-hint{
  font-family:Jost,sans-serif !important;
  font-size:16px !important;
  font-style:italic !important;
  color:rgba(247,242,232,.68) !important;
  letter-spacing:normal !important;
  text-transform:none !important;
  margin:0 0 22px !important;
}

/* 2. Options: softened corners, a visible edge, and room to breathe. */
#quiz .quiz-option{
  background:rgba(251,247,240,.055) !important;
  border:1px solid rgba(251,247,240,.22) !important;
  border-radius:var(--bq-radius) !important;
  padding:16px 18px !important;
  font-size:16.5px !important;
  transition:background .16s ease,border-color .16s ease !important;
}
#quiz .quiz-option:hover{
  background:rgba(251,247,240,.11) !important;
  border-color:rgba(251,247,240,.5) !important;
}
#quiz .quiz-option[aria-checked="true"],
#quiz .quiz-option.selected,
#quiz .quiz-option.is-selected{
  background:rgba(251,247,240,.15) !important;
  border-color:var(--bq-warm) !important;
  box-shadow:inset 3px 0 0 0 var(--bq-warm) !important;
}
/* option sub-labels were small and dim */
#quiz .quiz-option small,
#quiz .quiz-option .quiz-opt-desc,
#quiz .quiz-option span:last-child{ font-size:14.5px !important; }

/* 3. Buttons: warm white on forest, softened corners, no shouting. */
#quiz #btn-next,#quiz .quiz-btn-next,
#quiz #btn-back,#quiz .quiz-btn-back,
#quiz button,#quiz .quiz-cta,#quiz input[type=submit]{
  font-family:Jost,sans-serif !important;
  font-size:15px !important;
  font-weight:500 !important;
  letter-spacing:.04em !important;
  text-transform:none !important;
  border-radius:var(--bq-radius) !important;
  padding:14px 30px !important;
}
#quiz #btn-next,#quiz .quiz-btn-next,#quiz input[type=submit]{
  background:var(--bq-warm) !important;
  color:var(--bq-forest) !important;
  border:1px solid var(--bq-warm) !important;
}
#quiz #btn-next:hover,#quiz .quiz-btn-next:hover,#quiz input[type=submit]:hover{
  background:#fff !important;border-color:#fff !important;
}
#quiz #btn-back,#quiz .quiz-btn-back{
  background:transparent !important;
  color:rgba(247,242,232,.72) !important;
  border:1px solid rgba(247,242,232,.26) !important;
}

/* 4. Progress + meta: readable, quiet, sentence case. */
#quiz .quiz-progress-wrap{
  font-family:Jost,sans-serif !important;
  font-size:14px !important;
  color:rgba(247,242,232,.66) !important;
  text-transform:none !important;
  letter-spacing:normal !important;
}
#quiz .quiz-progress-bar,#quiz .quiz-progress-fill,
#quiz [class*=progress] [class*=fill],#quiz [class*=progress] > span{
  background:var(--bq-warm) !important;
  border-radius:99px !important;
}

/* 5. Retire the remaining uppercase tracking — the biggest template tell on the page. */
#quiz .quiz-intro-p,#quiz .quiz-check,#quiz .quiz-checks li{
  text-transform:none !important;letter-spacing:normal !important;font-size:16px !important;
}
#quiz .quiz-check-icon{ color:var(--bq-warm) !important; }

/* 6. Cards and the result gate pick up the same radius and palette. */
#quiz .quiz-card,#quiz #quiz-card,#quiz .quiz-outer,#quiz #quiz-gate,#quiz .quiz-gate{
  border-radius:var(--bq-radius) !important;
}
#quiz #quiz-gate input,#quiz .quiz-gate input{
  border-radius:var(--bq-radius) !important;
  font-size:16px !important;
  padding:13px 15px !important;
}
/* anything still painted in the old gold */
#quiz [style*="C8973A"],#quiz [style*="c8973a"]{ color:var(--bq-warm) !important; }

#quiz .quiz-intro-h2{ font-weight:500 !important;line-height:1.16 !important; }

@media(max-width:600px){
  #quiz .quiz-q-text{ font-size:24px !important; }
  #quiz .quiz-option{ padding:15px 16px !important;font-size:16px !important; }
}

/* remaining gold carriers, found by inspecting computed styles on the live page */
#quiz .quiz-check-icon{ background:var(--bq-warm) !important;color:var(--bq-forest) !important; }
#quiz #quiz-pct,#quiz .quiz-pct{ color:var(--bq-warm) !important;border-color:rgba(251,247,240,.35) !important; }
#quiz .quiz-option-check{ border-color:rgba(251,247,240,.45) !important; }
#quiz .quiz-option[aria-checked="true"] .quiz-option-check,
#quiz .quiz-option.selected .quiz-option-check{ background:var(--bq-warm) !important;border-color:var(--bq-warm) !important; }
#quiz #quiz-nav,#quiz .quiz-nav{ border-color:rgba(251,247,240,.18) !important; }
#quiz .gate-blur-preview{ border-color:rgba(251,247,240,.28) !important; }
#quiz #gate-fname,#quiz #gate-email,#quiz .quiz-gate input{
  border-color:rgba(251,247,240,.32) !important;background:rgba(251,247,240,.06) !important;color:var(--bq-cream) !important; }
