.assessment-page { background: linear-gradient(180deg, #fbf8fb 0%, #f7f1f8 100%); }
.assessment-hero { padding: 96px 0 54px; display:grid; grid-template-columns: 1.15fr .85fr; gap:72px; align-items:end; }
.assessment-intro h1 { margin:18px 0 20px; max-width:760px; font:600 clamp(54px,7vw,92px)/.98 "Fraunces",Georgia,serif; letter-spacing:-.04em; }
.assessment-intro > p { max-width:690px; font-size:19px; color:var(--muted); }
.privacy-chip { display:inline-flex; margin-top:20px; padding:10px 14px; border-radius:999px; background:#fff; border:1px solid var(--line); font-size:12px; font-weight:600; color:var(--plum-2); }
.assessment-map { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.assessment-map div { min-height:145px; padding:18px; display:flex; flex-direction:column; border-radius:20px; background:#fff; border:1px solid var(--line); }
.assessment-map span { font-size:10px; letter-spacing:.14em; color:var(--orchid); font-weight:700; }
.assessment-map strong { margin-top:28px; font:600 25px/1.05 "Fraunces",serif; }
.assessment-map small { margin-top:auto; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--plum-2); font-weight:700; }
.assessment-shell { padding:36px 0 110px; }
.assessment-card { max-width:900px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:32px; box-shadow:var(--shadow); overflow:hidden; }
.assessment-screen { display:none; padding:clamp(28px,6vw,64px); }
.assessment-screen.active { display:block; }
.assessment-screen h2 { margin:10px 0 18px; font-size:clamp(38px,5vw,58px); line-height:1.02; }
.assessment-screen > p { color:var(--muted); font-size:17px; }
.assessment-disclaimer { margin-top:30px!important; font-size:12px!important; line-height:1.5; color:#8b818d!important; }
.progress-row { display:flex; justify-content:space-between; gap:20px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--plum-2); }
.progress-track { height:6px; margin:12px 0 38px; border-radius:999px; background:#eee6ef; overflow:hidden; }
#progress-bar { height:100%; width:0; border-radius:inherit; background:var(--plum); transition:width .3s ease; }
.question-number { color:var(--orchid); font:600 13px/1 "DM Sans",sans-serif; letter-spacing:.12em; }
#question-text { max-width:760px; margin-top:20px; }
.question-prompt { margin-top:0!important; font-size:14px!important; }
.answer-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:34px; }
.answer-button { padding:18px 20px; text-align:left; cursor:pointer; border:1px solid var(--line); border-radius:18px; background:#fbf9fb; color:var(--ink); font-weight:600; transition:transform .18s ease, border-color .18s ease, background .18s ease; }
.answer-button:hover { transform:translateY(-2px); border-color:rgba(75,47,80,.28); background:#f5eef6; }
.answer-button small { display:block; margin-top:4px; color:var(--muted); font-weight:400; }
.text-button { margin-top:26px; padding:0; border:0; background:none; cursor:pointer; color:var(--plum-2); font-weight:700; }
.result-summary { max-width:760px; }
.domain-results { display:grid; gap:12px; margin:34px 0 42px; }
.domain-row { display:grid; grid-template-columns:140px 1fr 54px; gap:14px; align-items:center; }
.domain-row strong { font:600 18px/1.1 "Fraunces",serif; }
.score-track { height:12px; border-radius:999px; background:#eee7ef; overflow:hidden; }
.score-fill { height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--orchid),var(--plum)); }
.domain-score { text-align:right; font-size:12px; font-weight:700; color:var(--plum-2); }
.result-insights { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.insight-card, .next-practice { padding:26px; border-radius:22px; border:1px solid var(--line); }
.insight-card span, .next-practice .card-kicker { font-size:10px; letter-spacing:.14em; font-weight:700; color:var(--plum-2); }
.insight-card h3, .next-practice h3 { margin:10px 0 8px; font:600 27px/1.08 "Fraunces",serif; }
.insight-card p, .next-practice p { margin:0; color:var(--muted); }
.anchor-card { background:#f2edf4; }
.edge-card { background:#f5f7f2; }
.next-practice { margin-top:14px; background:#fffaf2; }
.results-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.assessment-why { padding:96px 0; }
.assessment-why h2 { margin:14px 0 22px; font-size:clamp(42px,5vw,66px); line-height:1.02; }
.assessment-why p { color:#e7dfe8; font-size:19px; }
@media (max-width: 900px) { .assessment-hero { grid-template-columns:1fr; gap:34px; padding-top:70px; } .assessment-map { max-width:650px; } }
@media (max-width: 640px) { .assessment-hero { padding-top:52px; } .assessment-intro h1 { font-size:52px; } .assessment-map { grid-template-columns:1fr 1fr; } .assessment-map div { min-height:120px; } .answer-grid { grid-template-columns:1fr; } .result-insights { grid-template-columns:1fr; } .domain-row { grid-template-columns:105px 1fr 44px; } .assessment-screen { padding:28px 22px; } }
