/* components.css - Neurokompas V2 */
:root{
  --bg:#f7f4ee;
  --surface:rgba(255,255,255,.72);
  --text:#1f3128;
  --muted:#66736c;
  --green:#274b3e;
  --copper:#b87942;
  --border:rgba(39,75,62,.08);
  --shadow:0 18px 40px rgba(0,0,0,.08);
  --radius:24px;
}
.hero-card,.card,.result-card{
 background:var(--surface);
 backdrop-filter:blur(14px);
 border:1px solid var(--border);
 border-radius:var(--radius);
 box-shadow:var(--shadow);
}
.card{
 padding:2rem;
 transition:.3s ease;
 cursor:pointer;
}
.card:hover{
 transform:translateY(-8px);
 border-color:rgba(184,121,66,.35);
 box-shadow:0 28px 60px rgba(0,0,0,.12);
}
.card h3{
 margin:0 0 .75rem;
 font-size:1.25rem;
 color:var(--green);
}
.card p{
 margin:0;
 line-height:1.7;
 color:var(--muted);
}
.button-primary{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 padding:.95rem 1.6rem;
 border:none;
 border-radius:999px;
 background:linear-gradient(135deg,var(--green),#335e4d);
 color:#fff;
 font-weight:700;
 cursor:pointer;
 transition:.25s;
}
.button-primary:hover{transform:translateY(-2px);}
.progress-route{
 display:flex;
 gap:.75rem;
 align-items:center;
}
.progress-node{
 width:14px;
 height:14px;
 border-radius:50%;
 background:#d8ddd8;
}
.progress-node.active{
 background:var(--copper);
 box-shadow:0 0 0 6px rgba(184,121,66,.12);
}

/* Meetmotor V1 — antwoordschalen */
.scale-question{padding:1.15rem 1.2rem;border:1px solid rgba(43,55,49,.12);border-radius:18px;background:rgba(255,255,255,.72);margin-bottom:.8rem}.scale-question__text{font-weight:600;line-height:1.45;margin:0 0 .9rem}.scale-question__options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}.scale-option{appearance:none;border:1px solid rgba(43,55,49,.16);background:#fff;border-radius:999px;padding:.65rem .55rem;font:inherit;font-size:.82rem;cursor:pointer}.scale-option:hover{border-color:rgba(43,55,49,.38)}.scale-option.is-selected{background:#263c34;color:#fff;border-color:#263c34}@media(max-width:720px){.scale-question__options{grid-template-columns:repeat(2,minmax(0,1fr))}}

.beta-feedback{max-width:900px;margin:48px auto 80px;padding:32px;border:1px solid rgba(37,55,47,.16);border-radius:24px;background:rgba(255,255,255,.72)}
.beta-feedback h2{margin:.25rem 0 .8rem;font-size:clamp(1.55rem,3vw,2.25rem)}
.beta-feedback p{max-width:760px;line-height:1.7}.beta-feedback__small{font-size:.92rem;opacity:.72}.intro__lead strong{font-weight:650}

[data-beta-feedback]{display:none!important}
body:has([data-screen="result"]:not([hidden])) [data-beta-feedback]{display:block!important;position:relative;z-index:3;margin-left:calc(36% + 40px);margin-right:6%;background:#fffaf4;box-shadow:0 12px 35px rgba(25,45,38,.06)}
@media(max-width:900px){body:has([data-screen="result"]:not([hidden])) [data-beta-feedback]{margin:32px 20px 60px}}

@media(max-width:720px){
  .scale-question__options .scale-option:nth-child(5):last-child{grid-column:1/-1}
}