/* Brio Entity Quiz — full-screen slide wizard (Brio Clarity design). */

.beq{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:#fff;color:#666D80;font-family:"Poppins",sans-serif;}
.beq *,.beq *::before,.beq *::after{box-sizing:border-box;}
.beq a{color:#1641FF;text-decoration:none;}
.beq a:hover{text-decoration:underline;}
.beq mark{background:linear-gradient(0deg,#FFF501 0%,#FFF501 42%,transparent 42%);color:#1A1B25;padding:0 .1em;}

.beq-top{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;}
.beq-logo{display:inline-flex;align-items:center;}
.beq .beq-logo-img{height:34px;width:auto;max-width:none;display:block;}
.beq-logo-text{font-weight:600;font-size:1.25rem;color:#1A1B25;}
.beq-exit{font-size:1.9rem;line-height:1;color:#666D80;padding:4px 10px;border-radius:4px;}
.beq-exit:hover{color:#1A1B25;text-decoration:none;background:#FAFCFF;}

.beq-progress{height:4px;background:#ECEFF3;}
.beq-progress span{display:block;height:100%;width:0;background:#1641FF;transition:width .3s ease;}

.beq-stage{flex:1;display:flex;align-items:center;justify-content:center;padding:2.5rem 1.25rem 3.5rem;}
.beq-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}

.beq-slide{display:none;width:100%;max-width:640px;}
.beq-slide.is-active{display:block;animation:beqIn .35s ease;}
@keyframes beqIn{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.beq-slide.is-active{animation:none;}.beq-progress span{transition:none;}}

.beq-kicker{font-size:.85rem;font-weight:500;color:#1641FF;margin:0 0 .6rem;letter-spacing:.02em;}
.beq h1,.beq h2{font-family:"Poppins",sans-serif;font-weight:600;color:#1A1B25;line-height:1.15;margin:0 0 .75rem;outline:none;}
.beq h1{font-size:clamp(1.8rem,4vw,2.6rem);}
.beq h2{font-size:clamp(1.4rem,3vw,1.9rem);}
.beq-sub{line-height:1.65;margin:0 0 1.5rem;max-width:36rem;}

.beq-back{background:none;border:none;padding:0;margin:0 0 1.25rem;font-family:inherit;font-size:.9rem;font-weight:500;color:#666D80;cursor:pointer;}
.beq-back:hover{color:#1A1B25;}

.beq-label{display:block;font-size:.9rem;font-weight:500;color:#1A1B25;margin:0 0 .4rem;}
.beq-input{width:100%;max-width:26rem;display:block;font-family:inherit;font-size:1.05rem;color:#1A1B25;background:#FAFCFF;border:1px solid #ECEFF3;border-radius:4px;padding:13px 16px;margin:0 0 1rem;}
.beq-input:focus{outline:none;border-color:#1641FF;box-shadow:0 0 0 3px rgba(22,65,255,.12);background:#fff;}

.beq-btn{display:inline-flex;align-items:center;justify-content:center;font-family:"Poppins",sans-serif;font-size:1.05rem;font-weight:500;line-height:1.1;color:#fff;background:#1641FF;border:none;border-radius:4px;padding:12px 26px;min-height:46px;cursor:pointer;transition:background-color .15s ease;}
.beq-btn:hover{background:#1A1B25;color:#fff;text-decoration:none;}
.beq a.beq-btn{color:#fff;}
.beq a.beq-btn:hover{color:#fff;text-decoration:none;}
.beq-btn--ghost{background:transparent;color:#1A1B25;border:1px solid #ECEFF3;}
.beq-btn--ghost:hover{background:#FAFCFF;color:#1A1B25;border-color:#1A1B25;}
.beq a.beq-btn--ghost{color:#1A1B25;}
.beq a.beq-btn--ghost:hover{color:#1A1B25;}
.beq-btn[disabled]{opacity:.6;cursor:default;}

.beq-hint-key{font-size:.8rem;color:#666D80;margin:.6rem 0 0;}
.beq-fine{font-size:.8rem;color:#666D80;line-height:1.6;margin:1.25rem 0 0;max-width:34rem;}
.beq-fine a{color:#666D80;text-decoration:underline;}

.beq-options{display:grid;gap:10px;max-width:34rem;}
.beq-option{display:flex;align-items:center;gap:14px;width:100%;text-align:left;font-family:inherit;font-size:1rem;font-weight:500;color:#1A1B25;background:#fff;border:1px solid #ECEFF3;border-radius:10px;padding:14px 16px;cursor:pointer;transition:border-color .12s ease,background-color .12s ease;}
.beq-option:hover,.beq-option:focus-visible{border-color:#1641FF;background:#FAFCFF;outline:none;}
.beq-option.is-picked{border-color:#1641FF;background:#F2F6FF;}
.beq-option-key{flex:none;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:600;color:#1641FF;border:1px solid #ECEFF3;border-radius:4px;background:#FAFCFF;}
.beq-option.is-picked .beq-option-key{background:#FFF501;color:#1A1B25;border-color:#FFF501;}

.beq-error{color:#C0392B;font-size:.9rem;margin:0 0 1rem;}

.beq-loading p{font-size:1.1rem;color:#1A1B25;font-weight:500;animation:beqPulse 1.1s ease infinite alternate;}
@keyframes beqPulse{from{opacity:.45;}to{opacity:1;}}
@media (prefers-reduced-motion:reduce){.beq-loading p{animation:none;}}

.beq-result-headline{margin-bottom:1.25rem;}
.beq-reasons{list-style:none;margin:0 0 1.25rem;padding:0;display:grid;gap:12px;max-width:38rem;}
.beq-reasons li{position:relative;padding-left:38px;line-height:1.6;}
.beq-reasons li::before{content:"\2713";position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:4px;background:#FFF501;color:#1A1B25;font-weight:600;font-size:.95rem;display:flex;align-items:center;justify-content:center;}
.beq-note{background:#FAFCFF;border:1px solid #ECEFF3;border-radius:10px;padding:14px 18px;line-height:1.6;font-size:.95rem;margin:0 0 1rem;max-width:38rem;}
.beq-state{margin:0 0 1.75rem;line-height:1.6;max-width:38rem;}
.beq-state strong{color:#1A1B25;font-weight:600;}
.beq-ctas{display:flex;gap:12px;flex-wrap:wrap;}
.beq-restart{background:none;border:none;padding:0;margin-left:8px;font-family:inherit;font-size:.8rem;color:#666D80;text-decoration:underline;cursor:pointer;}
.beq-restart:hover{color:#1A1B25;}

@media (max-width:767px){
  .beq-top{padding:12px 16px;}
  .beq .beq-logo-img{height:28px;}
  .beq-stage{padding:1.75rem 1rem 2.5rem;align-items:flex-start;}
  .beq-btn{width:100%;}
  .beq-ctas{flex-direction:column;}
  .beq-input{max-width:none;}
  .beq-hint-key{display:none;}
}

/* .beq a (0,1,1) outranks .beq-exit (0,1,0), so the close control rendered
   accent-blue instead of grey. */
.beq a.beq-exit{color:#666D80;}
.beq a.beq-exit:hover{color:#1A1B25;text-decoration:none;background:#FAFCFF;}

/* Keyboard focus was styled identically to hover, so tabbing was invisible. */
.beq-option:focus-visible,
.beq-input:focus-visible,
.beq-btn:focus-visible,
.beq-back:focus-visible,
.beq-restart:focus-visible,
.beq a:focus-visible{outline:2px solid #1641FF;outline-offset:2px;}

/* The logo is an SVG; WordPress reports a bogus 300x300 "medium" size for it,
   so the browser reserves a square box and the top bar jumps once the real
   2.884:1 artwork paints. Pin the true ratio (819x284) instead — this is
   height-independent, so it survives the 28px logo at <=767px. */
.beq .beq-logo-img{aspect-ratio:819/284;}