/* ==========================================================================
   Interview question pages — loaded after style.css.
   ========================================================================== */

/* ---------- Breadcrumb ---------- */
.crumbs{background:var(--alt);border-bottom:1px solid var(--line);font-size:.88rem}
.crumbs ol{list-style:none;margin:0;padding:.85rem 0;display:flex;flex-wrap:wrap;
  align-items:center;gap:.15rem}
.crumbs li{margin:0;display:flex;align-items:center;gap:.5rem;color:var(--muted)}
.crumbs li+li::before{content:"›";color:#c3ccd8;font-size:1.05rem;line-height:1}
.crumbs a{color:var(--body);padding:.15rem .1rem;border-radius:4px}
.crumbs a:hover{color:var(--brand-dark)}
.crumbs [aria-current="page"]{color:var(--ink);font-weight:700}

/* ---------- Page hero ---------- */
.qhero{position:relative;overflow:hidden;
  background:radial-gradient(900px 500px at 72% -24%,#10334c 0%,var(--navy) 62%);
  color:#c3ccdd;padding:clamp(2.5rem,6vw,4.25rem) 0}
.qhero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNDAwIiBoZWlnaHQ9IjU2MCIgdmlld0JveD0iMCAwIDE0MDAgNTYwIj4gPGcgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDBjNThlIiBzdHJva2Utb3BhY2l0eT0iMC4zMiIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCI+IDxwYXRoIGQ9Ik02MCA0ODAgTDIzMCA0ODAgTDMwMCAzOTIgTDQ3MCAzOTIgTDU0MCAzMTIgTDcyMCAzMTIgTDc5MCAyMTIgTDk4MCAyMTIgTDEwNTAgMTMyIEwxMzQwIDEzMiIvPiA8cGF0aCBkPSJNNjAgNTI4IEwyODAgNTI4IEwzNTAgNDQ4IEw2MjAgNDQ4IEw2OTAgMzY4IEw5MDAgMzY4IEw5NzAgMjY4IEwxMzQwIDI2OCIvPiA8cGF0aCBkPSJNOTgwIDIxMiBMMTA1MCAzMTIgTDEzNDAgMzEyIi8+IDxwYXRoIGQ9Ik01NDAgMzEyIEw2MTAgMjMyIEw3OTAgMjMyIi8+IDwvZz4gPGcgZmlsbD0iIzAwYzU4ZSIgZmlsbC1vcGFjaXR5PSIwLjU1Ij4gPGNpcmNsZSBjeD0iMjMwIiBjeT0iNDgwIiByPSI0LjUiLz48Y2lyY2xlIGN4PSI0NzAiIGN5PSIzOTIiIHI9IjQuNSIvPiA8Y2lyY2xlIGN4PSI3MjAiIGN5PSIzMTIiIHI9IjQuNSIvPjxjaXJjbGUgY3g9Ijk4MCIgY3k9IjIxMiIgcj0iNC41Ii8+IDxjaXJjbGUgY3g9IjMwMCIgY3k9IjM5MiIgcj0iMyIvPjxjaXJjbGUgY3g9IjU0MCIgY3k9IjMxMiIgcj0iMyIvPiA8Y2lyY2xlIGN4PSI3OTAiIGN5PSIyMTIiIHI9IjMiLz48Y2lyY2xlIGN4PSIxMDUwIiBjeT0iMTMyIiByPSIzIi8+IDxjaXJjbGUgY3g9IjYyMCIgY3k9IjQ0OCIgcj0iMy41Ii8+PGNpcmNsZSBjeD0iOTAwIiBjeT0iMzY4IiByPSIzLjUiLz4gPGNpcmNsZSBjeD0iMzUwIiBjeT0iNDQ4IiByPSIzIi8+PGNpcmNsZSBjeD0iNjEwIiBjeT0iMjMyIiByPSIzIi8+IDwvZz4gPGcgZmlsbD0iI2ZmZmZmZiIgZmlsbC1vcGFjaXR5PSIwLjA5Ij4gPGNpcmNsZSBjeD0iMjMwIiBjeT0iNDgwIiByPSIxMiIvPjxjaXJjbGUgY3g9IjcyMCIgY3k9IjMxMiIgcj0iMTIiLz48Y2lyY2xlIGN4PSI5ODAiIGN5PSIyMTIiIHI9IjEyIi8+IDwvZz48L3N2Zz4=");
  background-position:center bottom;background-repeat:no-repeat;background-size:cover;
  mask-image:linear-gradient(90deg,transparent 6%,#000 50%);
  -webkit-mask-image:linear-gradient(90deg,transparent 6%,#000 50%)}
.qhero > .wrap{position:relative;z-index:2}
.qhero__icon{font-size:2.6rem;line-height:1;display:block;margin-bottom:1rem}
.qhero h1{color:#fff;font-size:clamp(1.9rem,4.4vw,2.9rem);margin-bottom:.4em;max-width:20ch}
.qhero h1 span{color:var(--brand);display:block;font-size:.62em;font-weight:700;letter-spacing:-.01em}
.qhero__blurb{font-size:clamp(1rem,1.9vw,1.15rem);max-width:60ch;margin-bottom:1.5rem}
.qhero__meta{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:0}
.qhero__meta span{padding:.4rem .9rem;border-radius:100px;font-size:.85rem;font-weight:700;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#dbe3f0}
.qhero__meta span:first-child{background:rgba(0,197,142,.16);border-color:rgba(0,197,142,.3);color:#6ee7c0}

/* ---------- Intro + toolbar ---------- */
.qintro{max-width:72ch;font-size:1.03rem;margin:0 auto clamp(1.75rem,4vw,2.5rem);text-align:center}

.qtoolbar{display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center;
  padding:1.1rem 1.25rem;border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;box-shadow:var(--shadow);margin-bottom:1.5rem}
@media (max-width:720px){.qtoolbar{grid-template-columns:1fr}}
.qsearch{position:relative}
.qsearch input{font:inherit;font-size:.97rem;width:100%;padding:.72rem .9rem .72rem 2.5rem;
  border:1.5px solid var(--line);border-radius:var(--radius-sm);background:var(--alt);color:var(--ink);
  transition:border-color .15s,box-shadow .15s,background .15s}
.qsearch input:focus{outline:none;background:#fff;border-color:var(--brand-dark);
  box-shadow:0 0 0 3px rgba(0,197,142,.16)}
.qsearch::before{content:"⌕";position:absolute;left:.9rem;top:50%;transform:translateY(-52%);
  font-size:1.25rem;color:var(--muted);pointer-events:none}
.qtoolbar__side{display:flex;align-items:center;gap:.6rem;justify-content:flex-end;flex-wrap:wrap}
.search-count{font-size:.85rem;color:var(--muted)}

/* ---------- Progress ---------- */
.qprogress{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:.95rem 1.25rem;border:1px solid var(--line);border-radius:var(--radius);
  background:var(--brand-soft);border-color:#b7ead9;margin-bottom:2.25rem}
.qprogress__track{flex:1;min-width:160px;height:8px;border-radius:100px;background:#c8ecdf;overflow:hidden}
.qprogress__bar{height:100%;width:0;border-radius:100px;
  background:linear-gradient(90deg,var(--brand),#0ea5a0);transition:width .3s ease}
.qprogress__label{font-size:.9rem;font-weight:700;color:#0a5c47;white-space:nowrap}
.qprogress button{font:inherit;font-size:.85rem;font-weight:700;cursor:pointer;
  background:none;border:1.5px solid #9fdcc7;color:#0a5c47;border-radius:100px;padding:.35rem .85rem}
.qprogress button:hover{background:#fff}

/* ---------- Jump links ---------- */
.qjump{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2.25rem;justify-content:center}
.qjump a{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:100px;
  border:1.5px solid var(--line);background:#fff;color:var(--body);font-size:.9rem;font-weight:600}
.qjump a:hover{border-color:var(--brand-dark);color:var(--brand-dark);text-decoration:none}
.qjump b{font-size:.75rem;font-weight:800;padding:.08rem .42rem;border-radius:100px;
  background:var(--alt);color:var(--muted)}

/* ---------- Question sections ---------- */
.qsection{margin-bottom:2.5rem;scroll-margin-top:100px}
.qsection__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:.75rem;padding-bottom:.75rem;border-bottom:2px solid var(--ink);margin-bottom:.35rem}
.qsection__head h2{font-size:clamp(1.25rem,2.6vw,1.6rem);margin:0}
.qsection__n{font-size:.82rem;font-weight:700;color:var(--muted);letter-spacing:.02em;
  text-transform:uppercase}
.qsection__note{font-size:.92rem;color:var(--muted);margin:.6rem 0 1.1rem;font-style:italic}

.qitems{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.qitem{display:flex;gap:.85rem;align-items:flex-start;margin:0;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:.95rem 1.1rem;transition:border-color .15s,box-shadow .15s,background .15s}
.qitem:hover{border-color:#cfe0d9;box-shadow:0 4px 14px rgba(11,16,32,.05)}
.qitem.is-done{background:var(--brand-soft);border-color:#b7ead9}
.qitem.is-done .qtext{color:#3f7c6b}
.qitem__body{flex:1;min-width:0}
.qnum{display:inline-block;font-size:.75rem;font-weight:800;color:var(--brand-dark);
  background:var(--brand-soft);border-radius:5px;padding:.05rem .38rem;margin-right:.5rem;
  vertical-align:1px}
.qitem.is-done .qnum{background:#fff}
.qtext{font-size:1rem;color:var(--ink);line-height:1.55}

.qcheck{flex:none;width:22px;height:22px;margin-top:.15rem;border-radius:6px;cursor:pointer;
  border:2px solid #cbd4e0;background:#fff;padding:0;position:relative;transition:.15s}
.qcheck:hover{border-color:var(--brand-dark)}
.qcheck::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;
  border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg) scale(.4);
  opacity:0;transition:.15s}
.qitem.is-done .qcheck{background:var(--brand);border-color:var(--brand)}
.qitem.is-done .qcheck::after{opacity:1;transform:rotate(45deg) scale(1)}

/* optional answers */
.qa{margin-top:.6rem}
.qa summary{cursor:pointer;font-size:.85rem;font-weight:700;color:var(--brand-dark);
  list-style:none;display:inline-flex;align-items:center;gap:.35rem}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"▾";font-size:.7rem;transition:transform .15s}
.qa[open] summary::after{transform:rotate(180deg)}
.qa__body{margin-top:.6rem;padding:.9rem 1rem;border-radius:var(--radius-sm);
  background:var(--alt);border:1px solid var(--line);font-size:.95rem}
.qa__body>:last-child{margin-bottom:0}

.q-empty{text-align:center;padding:3rem 1rem;color:var(--muted)}

/* ---------- Pager ---------- */
.pager{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:3rem}
@media (max-width:620px){.pager{grid-template-columns:1fr}}
.pager__link{display:block;padding:1.1rem 1.35rem;border:1px solid var(--line);
  border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);
  transition:transform .15s,box-shadow .15s,border-color .15s}
.pager__link:hover{text-decoration:none;transform:translateY(-2px);
  box-shadow:var(--shadow-lg);border-color:#cfe8de}
.pager__link small{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;
  font-weight:800;color:var(--muted);margin-bottom:.3rem}
.pager__link b{color:var(--ink);font-size:1.02rem}
.pager__link--next{text-align:right}

/* ---------- Hub track cards ---------- */
.tcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:var(--radius);padding:1.75rem 1.6rem 1.4rem;box-shadow:var(--shadow);
  transition:transform .18s,box-shadow .18s,border-color .18s}
.tcard:hover{text-decoration:none;transform:translateY(-4px);box-shadow:var(--shadow-lg);
  border-color:#cfe8de}
.tcard__icon{font-size:1.9rem;line-height:1;margin-bottom:.9rem}
.tcard h3{font-size:1.18rem;margin-bottom:.45rem}
.tcard p{font-size:.94rem;color:var(--body);flex:1}
.tcard__foot{display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding-top:.95rem;border-top:1px solid var(--line);margin-top:.35rem}
.tcard__count{font-size:.85rem;font-weight:800;color:var(--brand-dark)}
.tcard__level{font-size:.78rem;color:var(--muted)}

/* ---------- Home-page track cards (link out) ---------- */
.qlink{position:relative;display:flex;flex-direction:column;background:#fff;
  border:1px solid var(--line);border-radius:var(--radius);padding:1.7rem 1.6rem 1.35rem;
  box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s,border-color .18s}
.qlink:hover{text-decoration:none;transform:translateY(-4px);box-shadow:var(--shadow-lg);
  border-color:#cfe8de}
.qlink__top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.9rem}
.qlink__icon{font-size:1.75rem;line-height:1}
.qlink__pill{font-size:.74rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding:.24rem .6rem;border-radius:100px;background:var(--brand-soft);color:var(--brand-dark)}
.qlink h3{font-size:1.13rem;margin-bottom:.4rem}
.qlink p{font-size:.93rem;flex:1;margin-bottom:1.1rem;color:var(--body)}
.qlink__foot{display:flex;align-items:center;justify-content:space-between;gap:.75rem;
  padding-top:.95rem;border-top:1px solid var(--line);font-size:.9rem;font-weight:700;
  color:var(--brand-dark)}
.qlink__foot .arrow{transition:transform .18s}
.qlink:hover .qlink__foot .arrow{transform:translateX(3px)}
.qlink__level{font-size:.78rem;font-weight:500;color:var(--muted)}

.qall{margin-top:2rem;text-align:center}

/* ---------- Print ---------- */
@media print{
  .site-header,.crumbs,.qtoolbar,.qprogress,.qjump,.pager,.wa-float,.site-footer,
  .qcheck,.q-cta,.print-hide{display:none!important}
  body{font-size:11.5pt;color:#000;background:#fff}
  .qhero{background:#fff!important;color:#000;padding:0 0 1rem;border-bottom:2px solid #000}
  .qhero::before{display:none!important}
  .qhero h1,.qhero h1 span{color:#000!important;-webkit-text-fill-color:#000}
  .qhero__meta span{background:#fff!important;border:1px solid #999;color:#000}
  .section{padding:1rem 0}
  .qitem{border:0;border-bottom:1px solid #ddd;border-radius:0;padding:.35rem 0;background:#fff!important;
    break-inside:avoid}
  .qsection{break-inside:auto}
  .qsection__head{border-bottom:1.5px solid #000}
  a{color:#000;text-decoration:none}
}
