/* ready-2-scale · Ready to Scale Check Quiz */

:root{--nav-h:3.4rem;}

/* Schlanker Header nur mit Logo, ohne Menüpunkte — Fokus auf den Check,
   Start-Button soll auf dem Laptop above the fold bleiben. */
.nav--minimal .nav__inner{height:var(--nav-h);justify-content:center;}
.nav--minimal .nav__brand{font-size:.95rem;}

.intro-h1{
  font-family:var(--serif);font-weight:400;line-height:1.16;letter-spacing:-.01em;
  font-size:clamp(1.5rem,4vw,2.15rem);margin:0;
}
.intro-h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--sage);}

/* ---- Spacing utilities (kein Inline-Style wegen CSP) ---- */
.mt-a{margin-top:1rem;}
.mt-b{margin-top:1.1rem;}
.mt-c{margin-top:1.2rem;}
.mt-d{margin-top:1.3rem;}
.mt-e{margin-top:2.2rem;}
.gate-submit{width:100%;margin-top:.6rem;justify-content:center;}

/* ---- Progress & Meter (native <progress>, damit JS keine Inline-Styles
   setzen muss — CSP erlaubt hier nur style-src 'self') ---- */
.progress-shell{position:sticky;top:var(--nav-h);background:rgba(247,247,245,0.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:var(--hair);z-index:40;}
.progress-inner{max-width:760px;margin:0 auto;padding:1.1rem clamp(1.3rem,6vw,3rem);}
.progress-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.6rem;}
.progress-label{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);}
.progress-label b{color:var(--sage);font-weight:500;}

progress.progress-bar,progress.meter-bar{
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
  border:none;width:100%;display:block;background:var(--line-mid);
}
progress.progress-bar{height:2px;}
progress.meter-bar{height:3px;margin-bottom:.9rem;}
progress.progress-bar::-webkit-progress-bar,progress.meter-bar::-webkit-progress-bar{background:var(--line-mid);}
progress.progress-bar::-webkit-progress-value,progress.meter-bar::-webkit-progress-value{background:var(--sage);}
progress.progress-bar::-moz-progress-bar,progress.meter-bar::-moz-progress-bar{background:var(--sage);}

.rtsc-wrap{max-width:760px;margin:0 auto;padding:clamp(1.4rem,4vh,2.6rem) clamp(1.3rem,6vw,3rem) 4rem;padding-top:calc(var(--nav-h) + clamp(1.4rem,4vh,2.6rem));}

/* ---- Screens ---- */
.screen{display:none;}
.screen.active{display:block;animation:rtscFade .5s ease;}
@keyframes rtscFade{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}

.rtsc-wrap p{font-size:.92rem;color:var(--muted-3);max-width:62ch;margin:0;}
.rtsc-wrap p strong{font-weight:500;color:var(--charcoal);}
/* .rtsc-wrap p's eigenes margin:0 hat sonst höhere Spezifität als die
   einzelnen .mt-*-Klassen und würde sie auf <p>-Elementen wirkungslos
   machen — hier explizit erneut mit passender Spezifität setzen. */
.rtsc-wrap p.mt-a{margin-top:1rem;}
.rtsc-wrap p.mt-b{margin-top:1.1rem;}
.rtsc-wrap p.mt-c{margin-top:1.2rem;}
.rtsc-wrap p.mt-d{margin-top:1.3rem;}
.rtsc-wrap p.mt-e{margin-top:2.2rem;}
/* Gleiches Problem für die globale .overline-Klasse (style.css) auf
   <p>-Elementen hier im Quiz — ihr eigenes margin würde sonst ebenfalls
   von .rtsc-wrap p verschluckt. */
.rtsc-wrap p.overline{margin:0 0 1.75rem;}
.rtsc-wrap p.overline.mt-e{margin-top:2.2rem;}

/* ---- Intro ---- */
.intro-meta{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin:1.1rem 0 1.4rem;font-size:.72rem;letter-spacing:.04em;color:var(--muted-2);}
.intro-meta span strong{color:var(--charcoal);font-weight:500;}
.pillars-preview-label{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);margin-bottom:.7rem;}

.loading-dots{display:flex;gap:.4rem;margin-top:.9rem;}
.loading-dots span{width:.4rem;height:.4rem;background:var(--sage);display:inline-block;animation:rtscPulse 1.2s ease-in-out infinite;}
.loading-dots span:nth-child(2){animation-delay:.2s;}
.loading-dots span:nth-child(3){animation-delay:.4s;}
@keyframes rtscPulse{0%,80%,100%{opacity:.25;transform:scale(.8);}40%{opacity:1;transform:scale(1);}}
.pillars-preview{display:grid;grid-template-columns:1fr;gap:.5rem;margin:0 0 1.6rem;}
@media(min-width:560px){.pillars-preview{grid-template-columns:1fr 1fr;}}
.pp-item{border:.5px solid var(--line-mid);padding:.7rem 1rem;display:flex;align-items:baseline;gap:.7rem;}
.pp-num{font-family:var(--serif);font-style:italic;color:var(--sage);font-size:.95rem;}
.pp-name{font-size:.86rem;color:var(--charcoal);}

/* ---- Questions ---- */
.q-pillar-tag{font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);margin-bottom:.9rem;display:block;}
.q-text{margin-bottom:1.8rem;font-size:clamp(1.3rem,3.6vw,1.7rem);}
.options{display:flex;flex-direction:column;gap:.6rem;}
.opt{
  display:block;width:100%;text-align:left;
  border:.5px solid var(--line-mid);background:transparent;
  padding:1rem 1.2rem;font-family:var(--sans);font-weight:300;font-size:.88rem;color:var(--muted-3);
  cursor:pointer;transition:border-color .2s ease, background .2s ease, color .2s ease;
}
.opt:hover{border-color:var(--sage-line);background:var(--sage-dim);color:var(--charcoal);}
.opt.selected{border-color:var(--sage);background:var(--sage-dim);color:var(--charcoal);}
.options.is-advancing{pointer-events:none;}

.nav-row{display:flex;justify-content:flex-start;align-items:center;margin-top:2.4rem;}
.btn-back{
  font-family:var(--sans);font-weight:400;font-size:.78rem;letter-spacing:.04em;
  color:var(--muted-2);background:none;border:none;cursor:pointer;padding:.5rem 0;
}
.btn-back:hover{color:var(--charcoal);}
.btn-back:disabled{opacity:0;pointer-events:none;}

.rtsc-wrap .btn:disabled{background:var(--line-mid);color:var(--muted);border-color:var(--line-mid);cursor:not-allowed;}

/* ---- Email gate ---- */
.gate-box{border:.5px solid var(--line);background:var(--off-white-2);padding:2rem clamp(1.4rem,5vw,2.4rem);margin-top:1.8rem;}
.field{margin-bottom:1.1rem;}
.field label{display:block;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-2);margin-bottom:.5rem;}
.field input{
  width:100%;border:none;border-bottom:.5px solid var(--line-mid);background:transparent;
  font-family:var(--sans);font-weight:300;font-size:.95rem;color:var(--charcoal);
  padding:.6rem .1rem;outline:none;transition:border-color .2s ease;
}
.field input:focus{border-color:var(--sage);}
.field input.invalid{border-color:#c0392b;}
.gate-fine{font-size:.7rem;color:var(--muted);margin-top:1rem;line-height:1.6;max-width:none;}

.field-check{margin-bottom:1.4rem;}
.check-label{display:flex;align-items:flex-start;gap:.7rem;cursor:pointer;}
.check-label input[type=checkbox]{
  appearance:none;-webkit-appearance:none;
  width:16px;height:16px;flex:0 0 16px;margin-top:.15rem;
  border:.5px solid var(--line-mid);background:transparent;cursor:pointer;
  position:relative;transition:border-color .2s ease, background .2s ease;
}
.check-label input[type=checkbox]:checked{background:var(--sage);border-color:var(--sage);}
.check-label input[type=checkbox]:checked::after{
  content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;
  border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg);
}
.check-label span{font-size:.8rem;color:var(--muted-3);line-height:1.55;max-width:none;}
.check-label.error input[type=checkbox]{border-color:#c0392b;}
.check-label.error span{color:#c0392b;}

/* ---- Results (Hintergrund-Template fuer die Mail, fuer Besucher nicht sichtbar) ---- */
.result-lead{margin-bottom:2.4rem;}
.stage-banner{border:.5px solid var(--sage-line);background:var(--sage-dim);padding:1.5rem 1.6rem;margin-bottom:2.6rem;}
.stage-banner .bk{font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sage);margin-bottom:.6rem;display:block;}
.stage-banner p{font-size:.9rem;color:var(--muted-3);max-width:none;}

.meter-block{padding:1.6rem 0;border-top:.5px solid var(--line);}
.meter-block:last-of-type{border-bottom:.5px solid var(--line);}
.meter-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.7rem;}
.meter-name{font-family:var(--serif);font-size:1.02rem;color:var(--charcoal);}
.meter-tier{font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--sage);}
.meter-block p{font-size:.86rem;max-width:none;}

.beleg-block{margin-top:1.1rem;padding:1.1rem 1.2rem;background:var(--off-white-2);border-left:2px solid var(--sage);}
.beleg-label{font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sage);display:block;margin-bottom:.7rem;}
.beleg-item{margin-bottom:.8rem;}
.beleg-item:last-child{margin-bottom:0;}
.beleg-quote{font-family:var(--serif);font-style:italic;font-size:.86rem;color:var(--charcoal);margin-bottom:.25rem;max-width:none;}
.beleg-note{font-size:.78rem;color:var(--muted-2);max-width:none;}

.cta-block{margin-top:3rem;text-align:center;border-top:.5px solid var(--line);padding-top:2.6rem;}
.cta-block h2{margin-bottom:.8rem;}
.cta-block p{margin:0 auto 1.8rem;}
.cta-row{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}

.waitlist-inline{border-top:.5px solid var(--line);padding-top:2rem;}
.waitlist-inline p{font-size:.9rem;margin-bottom:1.2rem;}

@media(max-width:480px){
  .cta-row{flex-direction:column;}
  .rtsc-wrap .btn,.rtsc-wrap .btn--ghost{width:100%;text-align:center;justify-content:center;}
}