/* Motive3 design system: tokens from the Motive3 Design System (v1.0). */
:root{
  --lime:#c6de41; --lime-dark:#afc22e;
  --navy:#153b44; --navy-dark:#0d2830; --teal:#2d6d7d;
  --off-white:#f9f7f2; --white:#ffffff; --near-black:#111111;
  --blue-gray:#737587; --mid-gray:#6b6b6b; --border:#e0e0e0; --error:#a3341f;
  --font-display:'Playfair Display', Georgia, serif;
  --font-body:'DM Sans', 'Helvetica Neue', Arial, sans-serif;
  --shadow-card:0 2px 12px rgba(0,0,0,0.08);
  --radius-card:8px; --radius-btn:6px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;}
body{font-family:var(--font-body);font-size:17px;line-height:1.65;background:var(--off-white);color:var(--near-black);-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column;}
a{color:var(--teal);}
.topbar{border-bottom:1px solid rgba(21,59,68,0.10);background:var(--off-white);}
.topbar-inner{max-width:760px;margin:0 auto;padding:18px 24px;display:flex;align-items:baseline;justify-content:space-between;gap:16px;}
.brand{font-family:var(--font-display);font-weight:700;font-size:20px;color:var(--navy);letter-spacing:-0.01em;text-decoration:none;}
.brand .by{font-style:italic;font-weight:500;color:var(--teal);font-size:16px;}
.topbar .meta{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--blue-gray);font-weight:500;}
main{flex:1;width:100%;max-width:760px;margin:0 auto;padding:40px 24px 64px;}
.eyebrow{font-size:12px;font-weight:500;letter-spacing:0.2em;text-transform:uppercase;color:var(--teal);margin-bottom:16px;}
h1{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,5vw,44px);line-height:1.12;letter-spacing:-0.02em;color:var(--navy);margin-bottom:24px;}
h1 em{font-style:italic;font-weight:500;color:var(--teal);}
.card{background:var(--white);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:32px;}
.card + .card{margin-top:16px;}
.card.featured{border-left:4px solid var(--lime);}
.lede p{margin-bottom:14px;}
.lede p:last-child{margin-bottom:0;}
.anon{margin-top:24px;padding:16px 20px;border-left:4px solid var(--lime);background:var(--off-white);border-radius:0 var(--radius-card) var(--radius-card) 0;font-size:15px;color:var(--navy);}
.anon strong{font-weight:600;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-body);font-weight:600;font-size:15px;border-radius:var(--radius-btn);padding:14px 26px;cursor:pointer;border:1.5px solid transparent;transition:background .15s,opacity .15s;line-height:1;min-height:48px;}
.btn-primary{background:var(--lime);color:var(--navy);}
.btn-primary:hover{background:var(--lime-dark);}
.btn-ghost{background:var(--white);color:var(--navy);border-color:var(--navy);}
.btn-ghost:hover{opacity:.8;}
.btn-link{background:none;border:none;color:var(--teal);padding:14px 4px;}
.btn-link:hover{opacity:.75;}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.btn:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--teal);outline-offset:2px;}
.actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:28px;flex-wrap:wrap;}
.actions .spacer{flex:1;}

/* progress */
.progress{margin-bottom:24px;}
.progress-label{display:flex;justify-content:space-between;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--blue-gray);font-weight:500;margin-bottom:8px;}
.progress-track{height:6px;background:rgba(21,59,68,0.10);border-radius:3px;overflow:hidden;}
.progress-fill{height:100%;background:var(--navy);border-radius:3px;transition:width .3s ease;}

/* questions */
fieldset{border:none;}
legend,.q-text{font-family:var(--font-display);font-weight:600;font-size:clamp(21px,3.2vw,26px);line-height:1.3;color:var(--navy);letter-spacing:-0.01em;margin-bottom:8px;padding:0;}
.q-help{font-size:15px;color:var(--mid-gray);margin-bottom:20px;}
.q-hint{font-size:13px;letter-spacing:0.14em;text-transform:uppercase;color:var(--teal);font-weight:500;margin-bottom:12px;}
.options{display:flex;flex-direction:column;gap:10px;}
.option{position:relative;display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-card);background:var(--white);cursor:pointer;transition:border-color .15s,background .15s;font-size:16px;line-height:1.4;}
.option:hover{border-color:var(--teal);}
.option input{appearance:none;-webkit-appearance:none;flex:0 0 20px;width:20px;height:20px;border:1.5px solid var(--blue-gray);background:var(--white);display:grid;place-items:center;cursor:pointer;margin:0;}
.option input[type=radio]{border-radius:50%;}
.option input[type=checkbox]{border-radius:4px;}
.option input:checked{border-color:var(--navy);background:var(--navy);}
.option input[type=radio]:checked::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime);}
.option input[type=checkbox]:checked::after{content:"";width:10px;height:6px;border-left:2px solid var(--lime);border-bottom:2px solid var(--lime);transform:translateY(-1px) rotate(-45deg);}
.option.selected{border-color:var(--navy);background:rgba(198,222,65,0.10);}
.option.disabled{opacity:.45;cursor:not-allowed;}
.option.disabled input{cursor:not-allowed;}
textarea{width:100%;min-height:150px;font-family:var(--font-body);font-size:16px;line-height:1.6;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-card);resize:vertical;background:var(--white);color:var(--near-black);}
textarea:focus{border-color:var(--teal);}
.counter{font-size:13px;color:var(--mid-gray);margin-top:6px;text-align:right;}
.error{color:var(--error);font-size:15px;font-weight:500;margin-top:14px;min-height:1px;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.fade{animation:fade .25s ease;}
@keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
footer{border-top:1px solid rgba(21,59,68,0.10);}
footer .inner{max-width:760px;margin:0 auto;padding:20px 24px;font-size:13px;color:var(--mid-gray);}

/* results */
.stat-row{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.stat{flex:1 1 160px;background:var(--white);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:20px 24px;}
.stat .label{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--blue-gray);font-weight:500;}
.stat .value{font-family:var(--font-display);font-size:36px;font-weight:700;color:var(--navy);line-height:1.2;}
.result-q{font-family:var(--font-display);font-weight:600;font-size:20px;color:var(--navy);line-height:1.35;margin-bottom:4px;}
.result-meta{font-size:13px;color:var(--mid-gray);margin-bottom:16px;}
.bar-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 48px;gap:12px;align-items:center;font-size:15px;padding:6px 0;}
.bar-track{height:10px;background:rgba(21,59,68,0.08);border-radius:5px;overflow:hidden;}
.bar-fill{height:100%;background:var(--teal);border-radius:5px;}
.bar-n{text-align:right;font-variant-numeric:tabular-nums;color:var(--navy);font-weight:600;}
.quotes{list-style:none;display:flex;flex-direction:column;gap:10px;}
.quotes li{border-left:3px solid var(--lime);padding:4px 0 4px 14px;font-size:15px;}
.quotes .when{display:block;font-size:12px;color:var(--mid-gray);}
input[type=password]{width:100%;max-width:360px;font-family:var(--font-body);font-size:16px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius-btn);}
.inline-form{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:16px;}
.toolbar{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 24px;}
@media (max-width:520px){
  main{padding:28px 16px 48px;}
  .topbar-inner,footer .inner{padding-left:16px;padding-right:16px;}
  .card{padding:22px 18px;}
  .bar-row{grid-template-columns:minmax(0,1fr) 64px 36px;font-size:14px;}
  .actions .btn-primary{flex:1;}
}
