@import url('studio.css');

:root {
  --assessment-ink: #102d27;
  --assessment-forest: #173d34;
  --assessment-paper: #f6f0e6;
  --assessment-line: #c9c4b7;
  --assessment-rust: #9e4f39;
  --assessment-coral: #d18768;
  --assessment-muted: #68756a;
  --type-body: 1rem;
  --type-lead: 1.25rem;
  --type-h3: 1.777rem;
  --type-h2: 2.369rem;
  --type-h1: 3.157rem;
}

body { background:var(--assessment-paper); color:var(--assessment-ink); }
button, a { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none!important; }
.assessment-shell { width:min(100% - 64px,1220px); margin:auto; padding:24px 0 96px; }
.assessment-topbar,.assessment-return { display:flex; align-items:center; justify-content:space-between; gap:28px; padding-bottom:20px; border-bottom:1px solid var(--assessment-line); }
.brand-lockup { display:inline-flex; align-items:center; gap:11px; color:var(--assessment-ink)!important; }
.brand-lockup span { display:grid; width:30px; height:30px; place-items:center; color:var(--assessment-paper); background:var(--assessment-forest); font:600 11px var(--body); letter-spacing:.08em; }
.brand-lockup strong { font:600 11px var(--body); letter-spacing:.12em; text-transform:uppercase; }
.assessment-topbar nav,.assessment-return>div { display:flex; align-items:center; gap:28px; }
.assessment-topbar nav a,.assessment-return>div a { position:relative; padding:7px 0; color:var(--assessment-muted); font:600 11px var(--body); letter-spacing:.1em; text-transform:uppercase; }
.assessment-topbar nav a::after,.assessment-return>div a::after { position:absolute; right:100%; bottom:0; left:0; height:2px; content:''; background:var(--assessment-rust); transition:right .2s; }
.assessment-topbar nav a:hover::after,.assessment-topbar nav a.is-current::after,.assessment-return>div a:hover::after,.assessment-return>div a.is-current::after { right:0; }
.assessment-topbar nav a.is-current,.assessment-return>div a.is-current { color:var(--assessment-ink); }
.screen { padding-top:50px; }
.intro { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(240px,.7fr); gap:10%; align-items:center; min-height:0; padding-bottom:64px; }
.intro-main { max-width:760px; }
.screen>span,.progress span,.screen small,.intro-main>span,.full-map>div:first-child>span,.full-next>span { color:var(--assessment-rust); font:600 11px var(--body); letter-spacing:.14em; text-transform:uppercase; }
.intro h1,.screen>h1 { max-width:900px; margin:24px 0 25px; color:var(--assessment-ink); font-size:clamp(52px,6.2vw,84px); }
.intro h1 em,.full-next h2 em { color:var(--assessment-rust); font-style:italic; }
.intro p,.lead { max-width:620px; color:#48594d; font:400 clamp(18px,1.8vw,22px)/1.42 var(--display); letter-spacing:-.02em; }
.intro-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px 28px; margin-top:36px; }
.intro button,.actions button,.actions a,#next,.full-intro button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:52px; padding:14px 20px; color:var(--assessment-paper); background:var(--assessment-rust); border:1px solid var(--assessment-rust); font:600 14px var(--body); transition:background .2s, transform .2s, border-color .2s; }
.intro button span,.actions button span,#next span,.full-intro button span { font-size:20px; font-weight:400; line-height:0; }
.intro button:hover,.actions button:hover,.actions a:hover,#next:hover,.full-intro button:hover { background:var(--assessment-ink); border-color:var(--assessment-ink); transform:translateY(-2px); }
.assessment-path { color:var(--assessment-ink); border-bottom:1px solid currentColor; font:600 13px var(--body); }
.assessment-path:hover { color:var(--assessment-rust); }
.intro-aside { padding:30px 0 6px; border-top:1px solid var(--assessment-ink); }
.aside-rule { width:44px; height:4px; margin-bottom:24px; background:var(--assessment-coral); }
.aside-label { max-width:260px; color:var(--assessment-ink)!important; font:400 26px/1.1 var(--display)!important; }
.aside-copy { max-width:290px; margin-top:23px; color:var(--assessment-muted)!important; font:14px/1.6 var(--body)!important; }
.intro-aside small { display:block; max-width:280px; margin-top:36px; color:var(--assessment-muted); font-size:12px; line-height:1.5; }
.assessment-facts { display:grid; gap:0; margin:40px 0 0; }
.assessment-facts div { display:flex; gap:18px; padding:13px 0; border-top:1px solid var(--assessment-line); }
.assessment-facts dt { color:var(--assessment-rust); font:600 11px var(--body); letter-spacing:.08em; }
.assessment-facts dd { margin:0; color:var(--assessment-ink); font-size:13px; }
.progress { display:grid; grid-template-columns:auto minmax(100px,1fr) auto; align-items:center; gap:17px; padding:17px 0; border-top:1px solid var(--assessment-line); border-bottom:1px solid var(--assessment-line); }
.progress span,.progress strong { color:var(--assessment-muted); font:600 11px var(--body); letter-spacing:.12em; text-transform:uppercase; }
.progress strong { color:var(--assessment-rust); font-weight:600; }
.progress i { display:block; height:5px; overflow:hidden; background:#ddd5c8; }
.progress b { display:block; width:20%; height:100%; background:var(--assessment-rust); transition:width .35s ease; }
.question-layout { display:grid; grid-template-columns:minmax(0,1.618fr) minmax(320px,1fr); gap:8%; align-items:start; padding-top:56px; }
.question-intro { position:sticky; top:30px; }
#region { color:var(--assessment-rust); font:600 11px var(--body); letter-spacing:.13em; text-transform:uppercase; }
.screen>h2,.question-intro h2 { max-width:720px; margin:20px 0 0; color:var(--assessment-ink); font-size:clamp(38px,4.6vw,60px); }
.question-note { margin-top:22px; color:var(--assessment-muted); font:13px/1.6 var(--body)!important; }
.answer-column { min-width:0; }
.answers { display:grid; gap:10px; counter-reset:answer; }
.answers button { position:relative; display:grid; grid-template-columns:32px 1fr; align-items:start; gap:14px; width:100%; padding:18px; color:var(--assessment-ink); text-align:left; background:transparent; border:1px solid var(--assessment-line); font:15px/1.45 var(--body); transition:background .2s, border-color .2s, color .2s, transform .2s; }
.answers button::before { display:grid; width:24px; height:24px; place-items:center; content:counter(answer); counter-increment:answer; color:var(--assessment-rust); border:1px solid currentColor; border-radius:50%; font:600 11px var(--body); }
.answers button:hover { border-color:var(--assessment-rust); background:#eee5d8; transform:translateX(4px); }
.answers button.selected { color:var(--assessment-paper); background:var(--assessment-forest); border-color:var(--assessment-forest); }
.answers button.selected::before { color:var(--assessment-paper); border-color:var(--assessment-coral); background:var(--assessment-rust); }
.answers button:focus-visible,.intro button:focus-visible,.actions>*:focus-visible,#next:focus-visible { outline:2px solid var(--assessment-rust); outline-offset:4px; }
#next { margin-top:22px; }
.motion-pairing,.full-pairing { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:42px 0 20px; }
.motion-profile { position:relative; min-height:390px; margin:0; overflow:hidden; background:var(--assessment-forest); border:0; }
.motion-profile-art { position:absolute; inset:0; pointer-events:none; }
.motion-profile-art::after { position:absolute; inset:0; content:''; background:linear-gradient(90deg,var(--assessment-forest) 4%,#173d34ad 47%,#173d3420); }
.motion-profile-ground .motion-profile-art::after { background:linear-gradient(270deg,var(--assessment-forest) 4%,#173d34ad 47%,#173d3420); }
.motion-profile-art img { position:absolute; right:-22px; bottom:-5px; width:min(75%,360px); height:100%; object-fit:contain; object-position:bottom right; opacity:.36; filter:saturate(.72); }
.motion-profile-ground .motion-profile-art img { right:auto; left:-22px; object-position:bottom left; opacity:.82; filter:none; }
.motion-profile figcaption { position:relative; z-index:1; width:min(72%,340px); padding:30px; color:var(--assessment-paper); }
.motion-profile-ground figcaption { margin-left:auto; text-align:right; }
.motion-profile figcaption small { color:#d9c3b2; }
.motion-profile h2 { margin:9px 0 13px; font-size:clamp(42px,5vw,65px); }
.motion-profile p { color:#d5ddd3; font-size:14px; line-height:1.55; }
.report-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.report-grid article,.resources>div { padding:25px; background:#e9e0d3; }
.report-grid article small,.resources small,.full-guidance small { color:var(--assessment-rust); font:600 11px var(--body); letter-spacing:.1em; text-transform:uppercase; }
.report-grid p,.resources p { margin-top:13px; color:#48594d; font-size:14px; line-height:1.6; }
.ocean,.resources { margin-top:58px; }
.ocean h2,.resources h2 { color:var(--assessment-ink); font-size:clamp(36px,4vw,54px); }
.ocean-intro,.resources-intro { max-width:650px; margin:12px 0 0; color:#536153; font-size:15px; line-height:1.6; }
.ocean>div { display:grid; grid-template-columns:repeat(4,1fr); align-items:end; gap:14px; min-height:270px; margin-top:24px; padding:22px 16px 18px; background:#e9e0d3; border-bottom:2px solid var(--assessment-ink); }
.ocean-current { display:grid; grid-template-rows:170px auto auto; gap:8px; min-width:0; }
.ocean-current i { position:relative; display:block; align-self:end; height:170px; background:repeating-linear-gradient(to bottom,transparent 0 33px,#102d2712 34px 35px); }
.ocean-current i b { position:absolute; bottom:0; left:0; width:100%; min-height:8px; background:linear-gradient(#d18768aa,#d18768); }
.ocean-current.is-primary i b { background:linear-gradient(#b9674c,#9e4f39); box-shadow:0 0 22px #9e4f3938; }
.ocean-current strong { color:var(--assessment-ink); font:18px/1.05 var(--display); }
.ocean-current em { color:var(--assessment-muted); font:10px/1.35 var(--body); letter-spacing:.07em; text-transform:uppercase; }
.resources>div { margin-top:20px; }
.resources .practice-why { padding-top:14px; border-top:1px solid var(--assessment-line); font-size:13px; }
.resources ol { display:grid; gap:10px; margin:22px 0 0; padding:0; list-style:none; counter-reset:steps; }
.resources li { display:grid; grid-template-columns:28px 1fr; gap:10px; color:#48594d; font-size:14px; line-height:1.5; }
.resources li::before { counter-increment:steps; content:'0' counter(steps); color:var(--assessment-rust); font:600 11px var(--body); letter-spacing:.08em; }
.resources a { color:var(--assessment-rust); text-decoration:underline; }
.actions { display:flex; flex-wrap:wrap; align-items:center; gap:14px 24px; margin-top:45px; }
.actions>* { margin-top:0!important; }
.actions a { color:var(--assessment-ink); background:transparent; border-color:var(--assessment-ink); }
.actions a:hover { color:var(--assessment-paper); }

@media (max-width:760px) {
  .assessment-shell { width:calc(100% - 40px); padding-bottom:60px; }
  .assessment-topbar,.assessment-return { align-items:flex-start; }
  .assessment-topbar nav,.assessment-return>div { gap:13px; flex-direction:column; align-items:flex-end; }
  .screen { padding-top:60px; }
  .intro,.question-layout { grid-template-columns:1fr; gap:55px; min-height:0; }
  .intro h1 { font-size:clamp(48px,13vw,70px); }
  .intro-aside,.question-intro { position:static; }
  .question-layout { padding-top:42px; }
  .question-intro h2 { font-size:clamp(38px,10.5vw,54px); }
  .motion-pairing,.full-pairing,.report-grid { grid-template-columns:1fr; }
  .motion-profile { min-height:330px; }
  .motion-profile-ground figcaption { margin-left:0; text-align:left; }
  .motion-profile-ground .motion-profile-art::after { background:linear-gradient(90deg,var(--assessment-forest) 4%,#173d34ad 47%,#173d3420); }
  .motion-profile-ground .motion-profile-art img { right:-22px; left:auto; object-position:bottom right; }
  .ocean>div { grid-template-columns:repeat(2,1fr); min-height:0; }
}

@media print {
  body { background:#fff; color:#132a25; }
  .assessment-topbar,.assessment-return,.actions { display:none; }
  .assessment-shell { width:100%; padding:0; }
  .screen { padding:0; }
  .report-grid article,.resources>div,.ocean>div { background:#f1eee7; }
  .motion-profile-art { display:none; }
  .motion-profile { min-height:0; }
  .motion-profile p,.lead,.report-grid p,.resources p,.ocean-intro,.resources-intro,.ocean-current em,.resources li { color:#263d35; }
}

.result-orientation {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  margin:42px 0 0;
  background:var(--assessment-line);
  border-top:1px solid var(--assessment-line);
  border-bottom:1px solid var(--assessment-line);
}
.result-orientation>div { padding:24px; background:#e9e0d3; }
.result-orientation small { display:block; margin-bottom:14px; color:var(--assessment-coral); font:600 10px var(--body); letter-spacing:.1em; text-transform:uppercase; }
.result-orientation strong { display:block; color:var(--assessment-ink); font:400 24px/1.1 var(--display); }
.result-orientation p { margin:12px 0 0; color:#536153; font-size:13px; line-height:1.55; }

@media (max-width:760px) {
  .result-orientation { grid-template-columns:1fr; }
}

@media print {
  .result-orientation { background:#dedbd3; border-color:#d8d2c7; }
  .result-orientation>div { background:#f1eee7; }
  .result-orientation strong,.result-orientation p { color:#263d35; }
}

/* Match the assessment experience to the editorial TBM site. */
body { min-height:100vh; background:var(--assessment-paper); color:var(--assessment-ink); }
.assessment-shell { width:100%; max-width:none!important; margin:0; padding:0; }
.assessment-switcher { color:var(--assessment-ink); background:#e7ddd0; border-bottom:1px solid var(--assessment-line); }
.assessment-switcher-inner { display:flex; align-items:center; justify-content:space-between; gap:30px; width:min(100% - 112px,1376px); min-height:58px; margin:auto; }
.assessment-switcher strong { font:400 18px/1 var(--display); letter-spacing:-.025em; }
.assessment-switcher div { display:flex; align-items:center; gap:28px; }
.assessment-switcher a { position:relative; padding:18px 0; color:#536153; font-size:10px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; }
.assessment-switcher a::after { position:absolute; right:100%; bottom:13px; left:0; height:1px; content:''; background:var(--assessment-rust); transition:right .2s; }
.assessment-switcher a:hover,.assessment-switcher a.is-current { color:var(--assessment-ink); }
.assessment-switcher a:hover::after,.assessment-switcher a.is-current::after { right:0; }
.screen { width:min(100% - 112px,1376px); margin-inline:auto; padding-top:76px; padding-bottom:96px; }
.intro { position:relative; width:100%; max-width:none; overflow:hidden; padding:100px max(56px,calc((100vw - 1376px)/2)) 112px; color:var(--assessment-paper); background:var(--ink); }
.intro::before { position:absolute; right:-14vw; bottom:-34vw; width:min(72vw,920px); aspect-ratio:1; border:1px solid #d1876848; border-radius:50%; box-shadow:0 0 0 82px #d1876810,0 0 0 164px #d1876809; content:''; }
.intro-main,.intro-aside { position:relative; z-index:1; }
.intro-main { max-width:850px; }
.intro h1 { max-width:980px; margin-top:0; color:var(--assessment-paper); font-size:clamp(58px,7vw,102px); line-height:1.01; }
.intro h1 em { color:var(--assessment-coral); }
.intro-main>span { display:none; }
.intro p { color:#d5ddd3; }
.intro button,.full-intro button,#next,.actions button { color:var(--assessment-paper); background:var(--teal); border-color:var(--teal); }
.intro button:hover,.full-intro button:hover,#next:hover,.actions button:hover { background:var(--assessment-rust); border-color:var(--assessment-rust); }
.assessment-path { color:var(--assessment-paper); }
.intro-aside { border-top-color:#ffffff40; }
.aside-label { color:var(--assessment-paper)!important; }
.aside-copy,.intro-aside small,.assessment-facts dd { color:#c6d0c2!important; }
.assessment-facts div { border-top-color:#ffffff25; }
.assessment-facts dt { color:var(--assessment-coral); }
.progress { margin-top:0; }
.screen>h1 { color:var(--assessment-ink); }
.result-orientation { background:var(--assessment-line); border-color:var(--assessment-line); }
.result-orientation>div { background:#e9e0d3; }
.result-orientation strong { color:var(--assessment-ink); }
.result-orientation p { color:#536153; }
.assessment-footer { width:min(100% - 112px,1376px); }

@media (min-width:1300px) {
  .intro h1 { white-space:nowrap; }
}
@media (max-width:900px) {
  .assessment-switcher-inner,.screen,.assessment-footer { width:calc(100% - 64px); }
  .intro { padding-inline:32px; }
}
@media (max-width:760px) {
  .assessment-switcher-inner { display:block; width:calc(100% - 40px); padding:15px 0 12px; }
  .assessment-switcher strong { display:block; }
  .assessment-switcher div { gap:17px; margin-top:10px; overflow-x:auto; }
  .assessment-switcher a { flex:none; padding:8px 0; }
  .assessment-switcher a::after { bottom:3px; }
  .screen,.assessment-footer { width:calc(100% - 40px); }
  .screen { padding-top:58px; padding-bottom:68px; }
  .intro { width:100%; gap:42px; padding:65px 20px 76px; }
  .intro h1 { font-size:clamp(49px,13.5vw,72px); }
}
@media print {
  .site-header,.assessment-switcher,.studio-footer { display:none!important; }
  .screen { width:100%; }
}