/* Practical interpretation comes before assessment detail. */
.interpretation-intro {padding:28px;background:var(--brand-soft);border:1px solid var(--line);border-radius:16px;margin:24px 0;}
.interpretation-intro h2,.example-screen>h2 {font-size:clamp(26px,3vw,36px);line-height:1.2;margin:8px 0 16px;}
.interpretation-intro>p {max-width:80ch;}
.interpretation-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:20px;margin:24px 0;}
.interpretation-grid>article {min-width:0;padding:22px;background:var(--white);border:1px solid var(--line);border-radius:12px;}
.interpretation-grid h3 {font-size:21px;line-height:1.3;margin:10px 0;}
.interpretation-grid p {font-size:15px;}
.interpretation-grid .eyebrow {font-size:11px;}
.interpretation-grid details {font-size:14px;border-top:1px solid var(--line);padding-top:12px;}
.interpretation-grid summary,.more-findings>summary {cursor:pointer;font-weight:600;}
.interpretation-next {border-top:1px solid var(--line);padding-top:18px;margin-bottom:0;}
.reflection-prompt {border-left:3px solid var(--brand);padding:8px 22px;margin:24px 0;max-width:85ch;}
.reflection-prompt h2 {font-size:23px;}
.reflection-prompt p {margin-bottom:8px;}
.assessment-detail-heading {font-size:28px;margin-top:36px;}
.score-reading {padding:16px 20px;border:1px solid var(--line);border-radius:10px;background:var(--brand-soft);margin:18px 0;}
.score-reading p {font-size:14px;margin:0 0 12px;}
.score-reading p:last-child {margin:0;}
.evidence-sources {font-size:13px;}
.evidence-sources dt {font-weight:700;margin-top:12px;}
.evidence-sources dd {margin:3px 0 12px;}
.more-findings {margin-top:18px;}
.more-findings>summary {font-size:14px;}
.preview-boundary {font-size:13px;padding:12px 16px;border:1px solid var(--line);border-radius:8px;}
.audience-paths {display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:48px;}
.audience-paths article {padding:28px;background:var(--white);border:1px solid var(--line);border-radius:14px;}
.audience-paths h2 {font-size:27px;line-height:1.2;}
.audience-paths a {font-weight:600;}
/* Show the example profiles first; deeper interpretation is optional. */
.example-page {max-width:1200px;padding-top:36px;}
.example-header h1 {font-size:clamp(38px,5vw,60px);line-height:1.1;margin:8px 0 12px;}
.example-header .example-intro {font-size:18px;margin:0;}
.example-header .example-person {font-size:16px;margin:18px 0 0;font-weight:600;}
.example-header .eyebrow {font-size:11px;margin:0;}
.example-selector {display:flex;flex-wrap:wrap;gap:8px;margin-top:20px;}
.example-selector a {padding:9px 14px;border:1px solid var(--line);border-radius:20px;font-size:14px;text-decoration:none;}
.example-selector a[aria-current="page"] {background:var(--ink);color:var(--white);border-color:var(--ink);font-weight:600;}
.example-selector a:focus-visible {outline:2px solid var(--ink);outline-offset:3px;}
.example-selector span {font-weight:400;}
.example-profile-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:28px 0 20px;align-items:start;}
.example-profile {--profile-color:var(--archetypes-ink);--profile-tint:var(--archetypes-tint);min-width:0;padding:24px;border:1px solid var(--profile-color);border-top:6px solid var(--profile-color);border-radius:16px;background:var(--profile-tint);}
.example-motivation {--profile-color:var(--motivation-ink);--profile-tint:var(--motivation-tint);}
.example-traits {--profile-color:var(--traits-ink);--profile-tint:var(--traits-tint);}
.example-profile-symbol {display:block;font-size:52px;line-height:1;color:var(--profile-color);margin:0 0 24px;}
.example-profile .eyebrow {font-size:10px;color:var(--profile-color);margin:0 0 14px;}
.example-profile h2 {font-size:clamp(28px,3.2vw,43px);line-height:1.08;letter-spacing:-.04em;min-height:94px;margin:0 0 16px;overflow-wrap:anywhere;}
.example-profile h2 span {display:block;}
.example-traits h2 span {font-size:.8em;}
.example-result-context {font-size:12px;line-height:1.5;min-height:36px;margin:0 0 16px;}
.example-profile-line {font-size:16px;line-height:1.5;margin:0 0 24px;}
.example-profile details {border-top:1px solid var(--profile-color);padding-top:14px;font-size:14px;}
.example-profile summary,.example-explanation>summary {cursor:pointer;font-weight:600;}
.example-profile details p {margin-bottom:0;}
.example-action {display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:32px;}
.example-action p {font-size:13px;color:var(--muted);margin:0;}
.example-screen {padding:28px 0;border-top:1px solid var(--line);scroll-margin-top:24px;}
.example-screen>p {max-width:75ch;}
.example-findings {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:24px 0;}
.example-findings article {border-left:3px solid var(--brand);padding-left:18px;min-width:0;}
.example-findings .eyebrow {font-size:10px;margin:0 0 10px;}
.example-findings h3 {font-size:19px;line-height:1.4;margin:0 0 8px;}
.example-findings p:last-child {font-size:14px;margin:0;}
.example-explanation {padding:16px 0;border-top:1px solid var(--line);font-size:14px;}
.example-explanation>p {max-width:85ch;}
@media(max-width:800px){
  .example-profile-grid {grid-template-columns:1fr;gap:12px;margin-top:22px;}
  .example-profile {position:relative;padding:16px 20px;border-top-width:4px;}
  .example-profile-symbol {position:absolute;right:18px;top:40px;font-size:36px;margin:0;}
  .example-profile .eyebrow {margin-bottom:8px;font-size:9px;}
  .example-profile h2 {font-size:28px;min-height:0;padding-right:32px;margin-bottom:8px;}
  .example-profile h2 span {display:inline;font-size:23px;}
  .example-result-context {min-height:0;margin-bottom:10px;}
  .example-profile-line {font-size:14px;margin-bottom:12px;padding-right:28px;}
  .example-profile-line br {display:none;}
  .example-profile details {padding-top:10px;font-size:13px;}
  .example-findings {grid-template-columns:1fr;gap:20px;}
  .example-action {gap:10px;}
}
@media(max-width:720px){
  .interpretation-intro {padding:20px;}
  .interpretation-grid {grid-template-columns:1fr;gap:14px;}
  .audience-paths {grid-template-columns:1fr;}
}

/* The assessments are the entry point; interpretation follows the profiles. */
.assessment-hero h1{font-size:clamp(42px,4.8vw,68px);line-height:1.08}
.assessment-hero .hero-copy>.eyebrow{font-size:10px;line-height:1.8}
.assessment-pillars{display:grid;gap:16px;min-width:0}
.assessment-pillar{display:flex;align-items:center;gap:22px;padding:24px;border:1px solid var(--archetypes-ink);border-radius:14px;background:var(--archetypes-tint);text-decoration:none}
.assessment-pillar>span{font-size:48px;line-height:1;color:var(--archetypes-ink)}
.assessment-pillar small{font-size:10px;letter-spacing:.08em}
.assessment-pillar h2{font-size:28px;line-height:1.15;margin:8px 0}
.assessment-pillar p{font-size:14px;margin:0}
.pillar-motivation{border-color:var(--motivation-ink);background:var(--motivation-tint)}.pillar-motivation>span{color:var(--motivation-ink)}
.pillar-traits{border-color:var(--traits-ink);background:var(--traits-tint)}.pillar-traits>span{color:var(--traits-ink)}
.profile-interpretation{margin:24px 0;border-top:1px solid var(--line);padding-top:18px}
.profile-interpretation>summary{cursor:pointer;font-size:20px;font-weight:600}
@media(max-width:800px){.assessment-pillar{padding:20px;gap:16px}.assessment-pillar h2{font-size:24px}.assessment-pillar>span{font-size:38px}}

/* Public employer examples: the same profiles in different workplaces. */
.example-audience {padding-bottom:16px;border-bottom:1px solid var(--line);}
.example-workplace {margin:28px 0 40px;}
.example-workplace>.eyebrow {margin-bottom:12px;}
.example-workplace .example-selector {margin:0 0 24px;}
.example-workplace h2,.employer-example-heading {font-size:clamp(25px,3vw,34px);line-height:1.2;margin:0 0 14px;}
.example-workplace>p {font-size:15px;}
.example-workplace-conditions {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px;}
.workplace-profile h3 {font-size:clamp(27px,2.8vw,36px);line-height:1.15;letter-spacing:-.04em;margin:0 0 18px;}
.workplace-profile h3 span {display:inline;}
.workplace-profile .profile-label {min-height:36px;text-transform:uppercase;}
.workplace-card-line {font-size:16px;margin-bottom:20px;}
.example-workplace-conditions .workplace-profile {padding:24px;}
.example-workplace-conditions .profile-symbol {font-size:52px;margin-bottom:24px;}
.example-people-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:24px 0 32px;align-items:start;}
.example-person-comparison {min-width:0;}
.example-person-comparison>header h3 {font-size:28px;margin:0 0 8px;}
.example-person-comparison>header p {font-size:12px;margin:0 0 18px;}
.employer-example-page .employer-example-card {padding:24px;margin-bottom:20px;}
.employer-example-card h4 {font-size:clamp(28px,3.2vw,43px);line-height:1.08;letter-spacing:-.04em;font-weight:500;margin:0 0 16px;}
.employer-example-card.assessment-theme-traits h4 {font-size:clamp(27px,2.7vw,36px);}
.employer-example-card .profile-label {font-size:10px;}
.employer-example-page .employer-example-card .profile-symbol {font-size:52px;margin-bottom:24px;}
.employer-example-card .profile-label {text-transform:uppercase;}
.example-employer-discussion {font-size:14px;margin:0;}
.example-card-takeaway {font-size:16px;line-height:1.5;margin:0 0 24px;}
.example-card-detail {border-top:1px solid var(--profile-color);padding-top:14px;font-size:14px;}
.example-card-detail summary {font-weight:600;cursor:pointer;}
.example-card-detail p {font-size:14px;margin:14px 0 0;}
.employer-example-card .assessment-catalog {margin-top:14px;}
@media(min-width:801px){
.example-people-grid {align-items:stretch;}
.example-person-comparison {display:grid;grid-template-rows:subgrid;grid-row:span 5;gap:0;}
.example-person-comparison>header {padding-bottom:6px;}
.example-person-comparison>.example-interview {align-self:start;}
}
.example-interview {padding:16px;border:1px solid var(--line);border-radius:10px;font-size:14px;background:var(--white);}
.example-interview summary {cursor:pointer;font-weight:600;}
.example-interview p {margin:14px 0 0;}
@media(max-width:800px){.example-workplace-conditions,.example-people-grid{grid-template-columns:1fr}.example-people-grid{gap:32px}.employer-example-page .employer-example-card,.example-workplace-conditions .workplace-profile{padding:20px}.employer-example-card h4{font-size:32px}.employer-example-page .employer-example-card .profile-symbol,.example-workplace-conditions .profile-symbol{font-size:40px;margin-bottom:18px}}

.example-navigation-status {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;}
.example-page[aria-busy="true"] .example-selector {cursor:progress;}

.example-recommendation {padding:28px;margin:0 0 24px;background:var(--brand-soft);border:2px solid var(--green);border-radius:16px;}
.example-recommendation>.eyebrow {margin-bottom:16px;}
.example-fit-badge {display:inline-block;background:var(--green);color:var(--white);padding:5px 10px;border-radius:6px;font-size:12px;font-weight:600;margin:0 0 14px;}
.example-recommendation h2 {font-size:clamp(30px,3.8vw,46px);line-height:1.12;max-width:28ch;margin:0 0 24px;}
.example-fit-reasons {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.example-fit-reasons>div {border-top:3px solid var(--profile-color);padding-top:12px;}
.example-fit-reasons .profile-label {font-size:12px;font-weight:600;color:var(--profile-color);margin-bottom:8px;}
.example-fit-reasons p {font-size:15px;margin:0;}
.example-fit-check {margin:22px 0 14px;font-size:15px;}
.example-recommendation>a {font-size:14px;font-weight:600;}
.example-recommendation>.micro {margin-bottom:0;}
.example-person-comparison[data-highlighted]>header {border-left:4px solid var(--green);padding-left:14px;}
.example-person-comparison>header h3 {scroll-margin-top:24px;}
@media(max-width:800px){.example-recommendation{padding:20px}.example-fit-reasons{grid-template-columns:1fr;gap:16px}}

/* Homepage: explain the outcome, then the everyday reason to use it. */
.home-situation {display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding-block:28px;border-block:1px solid var(--line);}
.home-situation h2 {font-size:clamp(24px,2.4vw,32px);line-height:1.2;margin:0;}
.home-situation p {font-size:16px;line-height:1.7;margin:0;max-width:58ch;}
#assessments .assessment-grid {align-items:start;}
@media(max-width:720px){.home-situation{grid-template-columns:1fr;gap:16px;padding-block:24px}}

.home-audience {margin:28px auto 0;}
.home-page .assessment-hero {padding-top:32px;}
.home-page[aria-busy="true"] .home-audience {cursor:progress;}
#assessments .card-bottom>a {font-size:13px;font-weight:600;}
