/* --------------------------------------------------------------------------
   Security readiness self-test

   Scoped under .cbn-st and driven by the site's own tokens, with fallbacks so
   the module still looks right if it is ever used outside this theme.
   -------------------------------------------------------------------------- */

.cbn-st{
  --st-bg:var(--cbn-card,#111418);
  --st-panel:var(--cbn-panel,#161a1f);
  --st-hair:var(--cbn-hair,rgba(255,255,255,.09));
  --st-edge:var(--cbn-edge,rgba(255,255,255,.16));
  --st-bone:var(--cbn-bone,#F2F4F6);
  --st-steel:var(--cbn-steel,#9AA4AE);
  --st-faint:var(--cbn-faint,#68737E);
  --st-red:var(--cbn-crimson,#C1272D);
  --st-ember:var(--cbn-ember,#E8323C);
  --st-ok:#3FB08A;
  --st-warn:#E2AA3C;
  --st-mono:"JetBrains Mono",ui-monospace,monospace;
  --st-display:"Saira Condensed",sans-serif;
  color:var(--st-steel);
}

.cbn-st__head{max-width:62ch;margin:0 0 clamp(28px,3.4vw,42px);}
.cbn-st__eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 16px;
  font-family:var(--st-mono);font-size:.62rem;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--st-ember);}
.cbn-st__rule{display:block;width:34px;height:1px;background:currentColor;}
.cbn-st__h{font-family:var(--st-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.01em;line-height:1.05;font-size:clamp(2rem,4.2vw,3.1rem);
  color:var(--st-bone);margin:0 0 18px;}
.cbn-st__intro{font-size:1rem;font-weight:300;line-height:1.75;margin:0;}

.cbn-st__shell{background:var(--st-bg);border:1px solid var(--st-hair);border-radius:3px;
  padding:clamp(24px,3.4vw,44px);}

/* --- progress ------------------------------------------------------------ */
.cbn-st__progress{margin:0 0 26px;}
.cbn-st__count{font-family:var(--st-mono);font-size:.6rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--st-faint);margin:0 0 10px;}
.cbn-st__bar{display:block;height:2px;background:var(--st-hair);border-radius:2px;overflow:hidden;}
.cbn-st__bar > span{display:block;height:100%;background:var(--st-ember);
  transition:width .32s cubic-bezier(.4,0,.2,1);}

/* --- questions ----------------------------------------------------------- */
.cbn-st__q{border:0;margin:0;padding:0;min-width:0;}
.cbn-st__legend{display:block;width:100%;padding:0;margin:0 0 22px;}
.cbn-st__domain{display:block;font-family:var(--st-mono);font-size:.58rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--st-ember);margin:0 0 12px;}
.cbn-st__question{display:block;font-family:var(--st-display);font-weight:600;
  text-transform:none;letter-spacing:0;line-height:1.28;
  font-size:clamp(1.28rem,2.3vw,1.7rem);color:var(--st-bone);max-width:34ch;}

/* Without JavaScript every question is visible, so they need separating. */
.cbn-st:not(.is-enhanced) .cbn-st__q{padding:26px 0;border-top:1px solid var(--st-hair);}
.cbn-st:not(.is-enhanced) .cbn-st__q:first-of-type{border-top:0;padding-top:0;}

.cbn-st__answers{display:grid;gap:10px;}
@media (min-width:781px){ .cbn-st__answers{grid-template-columns:1fr 1fr;} }

.cbn-st__answer{position:relative;display:flex;align-items:flex-start;gap:13px;
  padding:16px 18px;background:var(--st-panel);border:1px solid var(--st-hair);
  border-radius:3px;cursor:pointer;
  transition:border-color .16s ease,background-color .16s ease,transform .16s ease;}
.cbn-st__answer:hover{border-color:var(--st-edge);transform:translateY(-1px);}
.cbn-st__answer input{position:absolute;opacity:0;width:1px;height:1px;margin:0;}
.cbn-st__tick{flex:none;width:16px;height:16px;margin-top:2px;border-radius:50%;
  border:1px solid var(--st-edge);position:relative;transition:border-color .16s ease;}
.cbn-st__tick::after{content:"";position:absolute;inset:3px;border-radius:50%;
  background:var(--st-ember);transform:scale(0);transition:transform .16s ease;}
.cbn-st__label{font-size:.92rem;font-weight:300;line-height:1.55;color:var(--st-steel);}
.cbn-st__answer:has(input:checked){border-color:var(--st-ember);background:rgba(232,50,60,.06);}
.cbn-st__answer:has(input:checked) .cbn-st__tick{border-color:var(--st-ember);}
.cbn-st__answer:has(input:checked) .cbn-st__tick::after{transform:scale(1);}
.cbn-st__answer:has(input:checked) .cbn-st__label{color:var(--st-bone);}
.cbn-st__answer:has(input:focus-visible){outline:2px solid var(--st-ember);outline-offset:2px;}

/* --- buttons ------------------------------------------------------------- */
.cbn-st__nav{display:flex;gap:12px;margin:28px 0 0;}
.cbn-st__btn{display:inline-block;font-family:"Poppins",sans-serif;font-weight:600;
  font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;
  padding:14px 28px;border-radius:2px;cursor:pointer;
  background:var(--st-red);color:#fff;border:1px solid var(--st-red);
  transition:background-color .18s ease,border-color .18s ease,opacity .18s ease;}
.cbn-st__btn:hover{background:var(--st-ember);border-color:var(--st-ember);color:#fff;}
.cbn-st__btn[disabled]{opacity:.34;cursor:not-allowed;}
.cbn-st__btn--ghost{background:transparent;color:var(--st-steel);border-color:var(--st-edge);}
.cbn-st__btn--ghost:hover{background:transparent;color:var(--st-bone);border-color:var(--st-bone);}
.cbn-st__btn--cta{background:var(--st-red);color:#fff;border-color:var(--st-red);}

/* --- result -------------------------------------------------------------- */
.cbn-st__scorecard{display:grid;gap:clamp(22px,3vw,38px);align-items:center;
  padding:0 0 clamp(26px,3vw,34px);border-bottom:1px solid var(--st-hair);}
@media (min-width:721px){ .cbn-st__scorecard{grid-template-columns:auto 1fr;} }

.cbn-st__dial{position:relative;width:150px;height:150px;flex:none;margin:0 auto;}
.cbn-st__dial svg{width:100%;height:100%;transform:rotate(-90deg);}
.cbn-st__track{fill:none;stroke:var(--st-hair);stroke-width:6;}
.cbn-st__value{fill:none;stroke:var(--st-ember);stroke-width:6;stroke-linecap:round;
  stroke-dashoffset:327;}
.cbn-st__result[data-tone="ok"] .cbn-st__value{stroke:var(--st-ok);}
.cbn-st__result[data-tone="warn"] .cbn-st__value{stroke:var(--st-warn);}
.cbn-st__score{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  gap:2px;margin:0;font-family:var(--st-mono);color:var(--st-bone);}
.cbn-st__score span{font-size:2.4rem;font-weight:500;line-height:1;}
.cbn-st__score em{font-style:normal;font-size:.72rem;color:var(--st-faint);align-self:flex-end;
  padding-bottom:6px;}

.cbn-st__band{font-family:var(--st-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.02em;font-size:clamp(1.5rem,2.6vw,2rem);color:var(--st-bone);margin:0 0 12px;}
.cbn-st__result[data-tone="ok"] .cbn-st__band{color:#9FE3C0;}
.cbn-st__result[data-tone="warn"] .cbn-st__band{color:#F2C879;}
.cbn-st__result[data-tone="bad"] .cbn-st__band{color:#F0A0A5;}
.cbn-st__copy{font-size:.95rem;font-weight:300;line-height:1.75;margin:0;max-width:58ch;}

.cbn-st__sub{font-family:var(--st-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;font-size:1.1rem;color:var(--st-bone);margin:clamp(26px,3vw,34px) 0 18px;}

.cbn-st__domains{list-style:none !important;margin:0;padding:0 !important;display:grid;gap:14px;}
.cbn-st__domains li::marker{content:"" !important;}
.cbn-st__domain-row{display:grid;grid-template-columns:1fr;gap:8px;align-items:center;}
@media (min-width:641px){
  .cbn-st__domain-row{grid-template-columns:minmax(180px,1.1fr) 3fr auto;gap:18px;}
}
.cbn-st__domain-name{font-size:.9rem;color:var(--st-bone);font-weight:400;}
.cbn-st__domain-bar{display:block;height:6px;background:var(--st-hair);border-radius:3px;overflow:hidden;}
.cbn-st__domain-bar > span{display:block;height:100%;border-radius:3px;background:var(--st-ember);
  transition:width .6s cubic-bezier(.4,0,.2,1);}
.cbn-st__domain-row[data-tone="ok"] .cbn-st__domain-bar > span{background:var(--st-ok);}
.cbn-st__domain-row[data-tone="warn"] .cbn-st__domain-bar > span{background:var(--st-warn);}
.cbn-st__domain-pct{font-family:var(--st-mono);font-size:.66rem;letter-spacing:.08em;
  color:var(--st-faint);text-align:right;}

.cbn-st__focus{margin:clamp(26px,3vw,34px) 0 0;padding:22px 24px;border-radius:3px;
  background:rgba(232,50,60,.06);border:1px solid rgba(232,50,60,.28);}
.cbn-st__focus-h{font-family:var(--st-display);font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;font-size:1.02rem;color:var(--st-bone);margin:0 0 8px;}
.cbn-st__focus-copy{font-size:.9rem;font-weight:300;line-height:1.7;margin:0 0 14px;max-width:62ch;}
.cbn-st__focus-link{display:inline-block;font-family:var(--st-mono);font-size:.6rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--st-bone);text-decoration:none;
  border-bottom:1px solid var(--st-ember);padding-bottom:3px;}
.cbn-st__focus-link:hover{color:var(--st-ember);}

.cbn-st__actions{display:flex;flex-wrap:wrap;gap:12px;margin:clamp(26px,3vw,34px) 0 0;}
.cbn-st__note{font-size:.76rem;font-weight:300;line-height:1.7;color:var(--st-faint);
  margin:20px 0 0;max-width:62ch;}

@media (prefers-reduced-motion:reduce){
  .cbn-st *{transition-duration:.01ms !important;}
}
