:root{--navy-900:#071f38;--navy-850:#0b2a4a;--navy-800:#13385d;--navy-700:#1e4a75;--navy-100:#eef4fa;--gold:#caa34d;--gold-soft:#f5ecd4;--white:#fff;--ink:#1d2a38;--muted:#5f6f80;--line:#dbe5ef;--success-bg:#edf8f1;--success-text:#1b6e3b;--shadow:0 18px 42px rgba(13,40,67,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:radial-gradient(circle at top left,rgba(202,163,77,.14),transparent 26%),linear-gradient(180deg,#f8fbfe 0%,#eff4f9 100%)}
.page-shell{min-height:100vh}.hero{background:linear-gradient(135deg,rgba(7,31,56,.98),rgba(11,42,74,.95) 55%,rgba(19,56,93,.90)),radial-gradient(circle at 88% 20%,rgba(255,255,255,.08),transparent 26%);color:var(--white);padding:20px 18px 76px;position:relative;overflow:hidden}.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,transparent 72%,rgba(255,255,255,.05) 72%,rgba(255,255,255,.05) 77%,transparent 77%,transparent 100%);pointer-events:none}.hero__inner{max-width:1180px;margin:0 auto;position:relative;z-index:1;text-align:center}.logo-badge{display:inline-flex;align-items:center;gap:2px;font-size:90px!important;family:Montserrat,Inter,sans-serif;font-size:2.1rem;font-weight:800;letter-spacing:.04em;margin-bottom:10px}.logo-badge span{color:var(--gold)}
.eba-logo{
display:block;
margin:10px auto -80px auto;
width:720px;
max-width:90%;
height:auto;
position:relative;
z-index:10;
}
@media (max-width:720px){

    .eba-logo{
        width:520px;
    }

    .content-wrap{
        width:calc(100% - 18px);
        margin:-18px auto 28px;
    }

    .section-banner{
        padding:16px 18px;
    }

    .section-body{
        padding:10px 14px 18px;
    }

    .question-item{
        padding:44px 0 48px;
    }

    .options-row{
  gap:14px;
  margin-top:28px;
  align-items:center;
}

    .option{
    min-width:100%;
    border:1.5px solid #d7dde7;
    box-shadow:0 2px 6px rgba(0,0,0,0.05);
    min-height:56px;
}

    .sticky-panel{
        padding:14px 16px;
    }

    .sticky-panel__top{
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

    .results-actions{
        width:100%;
        display:flex;
        gap:10px;
    }

    .results-actions .btn{
        flex:1;
    }
}
.hero__eyebrow{margin:0 0 12px;color:rgba(255,255,255,.82);text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;font-weight:700}
.hero h1{margin-top:-55px;
font-family:Montserrat,Inter,sans-serif;
font-size:clamp(2rem,5vw,4rem);
line-height:1.15;
letter-spacing:-0.3px;
}
.hero__sub{
max-width:980px;
margin:20px auto 0;
font-size:clamp(1.02rem,1.6vw,1.2rem);
line-height:1.65;color:rgba(255,255,255,.94)
}
.spectrum{
max-width:1200px;
margin:42px auto 0;
padding:0 24px;
}

.spectrum-title-wrap{
display:flex;
align-items:center;
justify-content:center;
gap:18px;
margin-bottom:22px;
}

.spectrum-line{
width:90px;
height:2px;
border-radius:999px;
background:linear-gradient(
90deg,
rgba(183,132,38,0),
rgba(244,212,106,.95),
rgba(183,132,38,0)
);
}

.spectrum__title{
margin:0;
font-size:.95rem;
font-weight:800;
letter-spacing:.16em;
background:linear-gradient(
90deg,
#f7de7a,
#c8962f,
#ffe58d
);

-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
text-transform:uppercase;
}

.spectrum-panel{
position:relative;
padding:34px 50px 24px;
border-radius:28px;

background:linear-gradient(
90deg,
#f7de7a,
#c8962f,
#ffe58d
)

border:1px solid rgba(255,215,120,.18);

box-shadow:
0 10px 40px rgba(0,0,0,.35),
inset 0 1px 0 rgba(255,255,255,.04);

backdrop-filter:blur(8px);
}

.spectrum-bar{
position:relative;
height:18px;
margin-bottom:28px;
}

.spectrum-track-left,
.spectrum-track-right{
position:absolute;
top:50%;
transform:translateY(-50%);
height:10px;
border-radius:999px;
}

.spectrum-track-left{
left:0;
width:50%;
background:
linear-gradient(
90deg,
#c6ced9 0%,
#eef2f7 100%
);

box-shadow:
0 0 12px rgba(255,255,255,.18);
}

.spectrum-track-right{
right:0;
width:50%;
background:
linear-gradient(
90deg,
#f4d46a 0%,
#c8962f 45%,
#f7de85 100%
);

box-shadow:
0 0 12px rgba(244,197,66,.28);
}

.spectrum-node{
position:absolute;
top:50%;
transform:translate(-50%,-50%);
width:30px;
height:30px;
border-radius:50%;
border:4px solid rgba(255,255,255,.9);
}

.node-left{
left:15%;
background:
radial-gradient(circle at 30% 30%,#19335c,#08172e);
box-shadow:
0 0 16px rgba(255,255,255,.15);
}

.node-middle{
left:50%;
background:
radial-gradient(circle at 30% 30%,#ffdf7d,#8a6514);
box-shadow:
0 0 22px rgba(244,197,66,.35);
}

.node-right{
left:85%;
background:
radial-gradient(circle at 30% 30%,#ffe89c,#c08a18);
box-shadow:
0 0 18px rgba(244,197,66,.35);
}

.spectrum-labels{
display:flex;
justify-content:space-between;
align-items:center;
text-align:center;
}

.spectrum-label{
font-size:1.05rem;
font-weight:700;
letter-spacing:-.01em;
}

.spectrum-label.weak{
color:#eef2f7;
}

.spectrum-label.developing{
color:#f5f7fb;
}

.spectrum-label.strong{
color:#f0c95f;
}
.content-wrap{width:min(1180px,calc(100% - 28px));margin:-42px auto 40px;position:relative;z-index:2}.form-card{background:var(--white);border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);margin-bottom:18px;overflow:hidden}.intro-card{padding:28px 34px}.intro-grid{display:grid;grid-template-columns:1fr;gap:22px}.intro-grid h2,.section-banner h2,.results-card h2{margin:0 0 8px;font-family:Montserrat,Inter,sans-serif;color:var(--navy-900)}.intro-grid p{margin:0;line-height:1.72;font-size:1rem}
.respondent-grid{display:grid;grid-template-columns:1.2fr 1fr 180px;gap:16px;padding:24px}.field span{display:block;margin-bottom:8px;font-weight:700;color:var(--navy-900)}.field input{width:100%;border:1px solid var(--line);border-radius:14px;padding:14px 15px;font:inherit;background:#fbfdff;color:var(--ink)}.field input:focus{outline:2px solid rgba(202,163,77,.35);border-color:var(--gold)}
.section-banner{padding:20px 24px;background:linear-gradient(180deg,#fbfdff,#f4f8fc);border-bottom:1px solid var(--line)}.section-banner__label{color:var(--navy-700);text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;font-weight:800;margin-bottom:8px}
.section-card .section-banner{background:linear-gradient(135deg,var(--navy-900),var(--navy-700));color:var(--white)}.section-card .section-banner h2,.section-card .section-banner__label{color:var(--white)}
.section-body{padding:18px 24px 24px}.question-item{padding:18px 0;border-bottom:1px solid #e9eff6}.question-item:last-child{border-bottom:0}.question-number{color:var(--navy-700);font-weight:800;margin-bottom:7px}.question-text{margin:0;line-height:1.62;font-weight:600}.options-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:0px}.option{position:relative;min-width:170px}.option input{position:absolute;opacity:0;pointer-events:none}.option span{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:12px 14px;border-radius:999px;border:1px solid var(--line);background:#fbfdff;font-weight:700;color:var(--navy-900);transition:.18s ease}
.option{
  position:relative;
  min-width:170px;
  transition:transform .18s ease;
}

.option:hover{
  transform:translateY(-2px);
}

.option span:hover{
  border-color:var(--gold);
  box-shadow:0 8px 18px rgba(16,43,78,.12);
}

.option input:checked + span{
  background: linear-gradient(180deg,#163d6b 0%, #102b4e 100%);
  color:#ffffff;
  border-color: var(--gold);
  box-shadow: 0 14px 30px rgba(16,43,78,.28);
  letter-spacing: .2px;
  transform: translateY(-1px);
}
.sticky-panel{position:sticky;bottom:12px;padding:18px 20px;z-index:40;border:1px solid rgba(19,56,93,.12)}.sticky-panel__top{display:flex;justify-content:space-between;gap:18px;align-items:center}.sticky-label{color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-size:.72rem;font-weight:800;margin-bottom:4px}.sticky-actions,.results-actions{display:flex;gap:10px;flex-wrap:wrap}.progress-track{margin-top:14px;height:12px;width:100%;background:#e6edf5;border-radius:999px;overflow:hidden}.progress-bar{height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,var(--gold),var(--navy-700))}.success-banner{margin-top:14px;background:var(--success-bg);color:var(--success-text);border-radius:12px;padding:12px 14px;font-weight:700}
.btn{border:0;border-radius:14px;padding:12px 16px;font:inherit;font-weight:800;cursor:pointer}.btn--primary{background:linear-gradient(180deg,var(--gold),#b98f35);color:#1d1b17}.btn--ghost{background:#f3f7fb;color:var(--navy-900);border:1px solid var(--line)}.btn:hover{filter:brightness(.98)}
.results-card{padding-bottom:22px}.results-banner{background:linear-gradient(180deg,var(--gold-soft),#fffaf0)}.result-message{padding:0 24px;line-height:1.65}.score-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 24px 18px}.score-pill{background:#fbfdff;border:1px solid var(--line);border-radius:18px;padding:16px 18px}.score-pill__label{color:var(--navy-700);font-weight:800;margin-bottom:6px}.score-pill__value{font-size:1.45rem;font-weight:800;color:var(--navy-900)}.results-actions{padding:0 24px 16px}#summaryOutput{width:calc(100% - 48px);margin:0 24px;border-radius:18px;border:1px solid var(--line);padding:16px;resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92rem;line-height:1.55;color:#1b2e3f;background:#fbfdff}
.site-footer{text-align:center;color:var(--muted);padding:8px 18px 38px;line-height:1.6;font-size:.94rem}.hidden{display:none}#previewBtn{display:none!important}#resultsPanel{display:none!important}
@media (max-width:900px){.respondent-grid,.score-grid,.spectrum__grid{grid-template-columns:1fr}.sticky-panel__top{flex-direction:column;align-items:flex-start}.hero__sub{max-width:100%}.spectrum__line{margin-bottom:18px}.spectrum__item{padding-top:4px}}
@media (max-width:720px){.content-wrap{width:min(100% - 18px,1180px)}.hero{padding:0px 14px 64px}.intro-card,.section-body,.respondent-grid,.result-message,.score-grid,.results-actions,.section-banner{padding-left:16px;padding-right:16px}#summaryOutput{width:calc(100% - 32px);margin:0 16px}.option{min-width:100%}.spectrum__dot--left{left:14%}.spectrum__dot--mid{left:50%}.spectrum__dot--right{left:80%}}
@media print{.hero,.sticky-panel,.results-actions,.site-footer{display:none!important}body{background:#fff}.content-wrap{width:100%;margin:0}.form-card{box-shadow:none;border-radius:0}}
.success-screen.hidden{display:none!important}.success-screen{position:fixed;inset:0;z-index:9999}.success-screen__overlay{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 18px;background:radial-gradient(circle at 12% 30%, rgba(212,189,146,0.22), transparent 18%),radial-gradient(circle at 86% 72%, rgba(255,255,255,0.10), transparent 20%),linear-gradient(135deg, #04162d 0%, #08244a 52%, #0f315b 100%)}.success-screen__card{width:min(920px, 100%);background:#f8f8fb;border-radius:26px;box-shadow:0 28px 80px rgba(0,0,0,0.30);padding:44px 58px 52px;text-align:center}.success-screen__logo{font-family:Montserrat, Inter, sans-serif;font-size:4.2rem;font-weight:800;line-height:1;color:#0b2245;letter-spacing:.03em}.success-screen__logo span{color:var(--gold);font-size:.55em;vertical-align:top}.success-screen__eyebrow{margin-top:12px;text-transform:uppercase;letter-spacing:.18em;font-weight:700;color:#0b2245;font-size:.88rem}.success-screen__icon-wrap{width:130px;height:130px;border-radius:50%;margin:34px auto 28px;background:rgba(202,163,77,0.09);display:flex;align-items:center;justify-content:center}.success-screen__icon{width:88px;height:88px;border-radius:50%;background:#112c58;color:#f1bc4d;display:flex;align-items:center;justify-content:center;font-size:3rem;line-height:1;box-shadow:0 12px 28px rgba(17,44,88,.18)}.success-screen__title{margin:0 auto;max-width:720px;font-family:Montserrat, Inter, sans-serif;font-size:clamp(2rem, 3vw, 3rem);line-height:1.18;color:#0b2245}.success-screen__accent{width:86px;height:3px;border-radius:999px;background:var(--gold);margin:24px auto 26px}.success-screen__lead,.success-screen__body{max-width:760px;margin:0 auto;color:#202c3d;font-size:1.05rem;line-height:1.7}.success-screen__divider{height:1px;background:#d8dde6;margin:32px 0 28px}@media (max-width:720px){.success-screen__card{padding:34px 24px 38px}.success-screen__logo{font-size:3.2rem}.success-screen__icon-wrap{width:110px;height:110px;margin:26px auto 22px}.success-screen__icon{width:76px;height:76px;font-size:2.5rem}.success-screen__lead,.success-screen__body{font-size:1rem}}

.top-progress{
  margin-top:28px;
  padding:20px 24px;
  border-radius:24px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.12);
  backdrop-filter:blur(10px);
}

.top-progress__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
  font-size:0.95rem;
  font-weight:700;
  color:#ffffff;
  letter-spacing:.04em;
}

.top-progress__head strong{
  color:#f4c542;
  font-size:1rem;
}

.top-progress__track{
  width:100%;
  height:12px;
  border-radius:999px;
  background:rgba(255,255,255,0.14);
  overflow:hidden;
}

.top-progress__fill{
  width:0%;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#f4c542,#ffd978);
  transition:width .35s ease;
  box-shadow:0 0 18px rgba(244,197,66,.45);
}


/* =========================================================
   FINAL MOBILE SPECTRUM POLISH
   Corrected clean version — no duplicate media blocks
   ========================================================= */
@media (max-width:768px){

  .spectrum{
    margin-top:38px;
    padding:0 14px;
  }

  .spectrum-title-wrap{
    gap:12px;
    margin-bottom:22px;
  }

  .spectrum-line{
    width:64px;
    height:2px;
  }

  .spectrum__title{
    font-size:.86rem;
    line-height:1.35;
    letter-spacing:.15em;
  }

  .spectrum-panel{
    padding:32px 24px 30px;
    border-radius:28px;
  }

  .spectrum-bar{
    height:18px;
    margin-bottom:30px;
  }

  .spectrum-track-left,
  .spectrum-track-right{
    height:8px;
  }

  .spectrum-node{
    width:34px;
    height:34px;
    border-width:5px;
  }

  .spectrum-labels{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
  }

  .spectrum-label{
    width:33.333%;
    max-width:none;
    font-size:15px;
    line-height:1.15;
    font-weight:800;
    margin-top:0;
  }
}

/* =========================================================
   FINAL EBA ASSESSMENT QUESTION SPACING FIX
   Applies to desktop and mobile.
   Keeps answer buttons lower and gives each question more breathing space.
   ========================================================= */
.question-item{
  padding:44px 0 48px !important;
}

.options-row{
  display:flex;
  gap:14px !important;
  flex-wrap:wrap;
  margin-top:28px !important;
  align-items:center !important;
  justify-content: flex-start;
  padding-left: 120px;
}

.options-row .option{
  margin-top:6px;
}
.option input:checked + span::before {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.85) !important;
  background: rgba(255,255,255,0.10) !important;
}
.options-row .option input:checked + span::before {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.9) !important;
  background: rgba(255,255,255,0.12) !important;
}

.options-row .option input:checked + span {
  color: #ffffff !important;
}