/* Round 6, the About page (Krish, 2026-10-08): a plain page in the story's style: how the study came to be, who was asked, the six dimensions with
   their two questions each, how the score works, where the numbers come from. No drawn graphics. */
.r6a-page{background:#fff;color:#111}
.r6a-page .r6a-wrap{max-width:1200px;margin:0 auto;padding:0 var(--gutter,64px)}
.r6a-page .r6a-hero{padding:40px 0 56px}
.r6a-page .r6a-section{padding:56px 0;border-top:1px solid #e3e3e3}
.r6a-page .r6a-back{display:inline-block;margin:0 0 40px;font-size:14px;color:#111;text-decoration:underline;text-underline-offset:4px}
.r6a-page .r3-eyebrow{color:#111;margin-bottom:22px}
.r6a-page h1,.r6a-page h2{margin:0;text-transform:uppercase;max-width:18ch}
.r6a-page h1{max-width:16ch}
.r6a-page .r6a-deck{margin:24px 0 0;font:300 clamp(19px,1.6vw,24px)/1.4 'Equinox Sans',Arial,sans-serif;max-width:46ch;color:#222}
.r6a-page .r6a-deck-small{font-size:18px;color:#444;margin-top:18px;max-width:52ch}
.r6a-page .r6a-two{display:grid;grid-template-columns:1fr;gap:28px}
.r6a-page .r6a-prose p{margin:0 0 18px;font-size:18px;line-height:1.5;max-width:54ch;color:#222}
.r6a-page .r6a-prose p:last-child{margin-bottom:0}
.r6a-page .r6a-figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 20px;margin:32px 0 0;padding-top:20px;border-top:1px solid #ccc}
.r6a-page .r6a-figures strong{display:block;font:300 clamp(44px,5vw,72px)/1 'Equinox Sans',Arial,sans-serif;letter-spacing:-.04em}
.r6a-page .r6a-figures span{display:block;margin-top:10px;font-size:15px;line-height:1.4;color:#444;max-width:24ch}
.r6a-page .r6a-metros{margin:28px 0 0;font:400 12px/1.8 'Messina Mono',Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;color:#555}
.r6a-page .r6a-note{margin:16px 0 0;font-size:15px;line-height:1.5;color:#555;max-width:60ch}
.r6a-page .r6a-dims{list-style:none;margin:32px 0 0;padding:0}
.r6a-page .r6a-dim{display:grid;grid-template-columns:1fr;gap:18px;padding:26px 0;border-top:1px solid #ccc}
.r6a-page .r6a-dim-head{position:relative;padding-left:44px}
.r6a-page .r6a-dim-n{position:absolute;left:0;top:.35em;font:400 12px/1 'Messina Mono',Menlo,monospace;letter-spacing:.06em;color:#555}
.r6a-page .r6a-dim-head h3{margin:0;font:300 clamp(26px,2.4vw,34px)/1.1 'Equinox Sans',Arial,sans-serif;letter-spacing:-.015em}
.r6a-page .r6a-dim-head p{margin:10px 0 0;font-size:17px;line-height:1.45;color:#333;max-width:40ch}
.r6a-page .r6a-dim-label{margin:0 0 12px;font:400 11px/1.4 'Messina Mono',Menlo,monospace;letter-spacing:.09em;text-transform:uppercase;color:#555}
.r6a-page .r6a-qa+.r6a-qa{margin-top:16px}
.r6a-page .r6a-q{margin:0;font-size:17px;line-height:1.45;max-width:48ch}
.r6a-page .r6a-scale{margin:4px 0 0;font:400 12px/1.5 'Messina Mono',Menlo,monospace;letter-spacing:.02em;color:#666}
.r6a-page .r6a-steps{list-style:none;margin:0;padding:0}
.r6a-page .r6a-steps li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;padding:18px 0;border-top:1px solid #ccc}
.r6a-page .r6a-steps li:first-child{border-top:0;padding-top:0}
.r6a-page .r6a-steps strong{font:400 12px/1.6 'Messina Mono',Menlo,monospace;letter-spacing:.06em;color:#555;padding-top:4px}
.r6a-page .r6a-steps p{margin:0;font-size:18px;line-height:1.5;color:#222;max-width:52ch}
.r6a-page .r6a-invite{background:#000;color:#fff;padding:80px 0 96px}
.r6a-page .r6a-invite .r3-eyebrow{color:#fff}
.r6a-page .r6a-invite h2{color:#fff}
.r6a-page .r6a-invite .r6a-deck{color:#d8d8d8}
.r6a-page .r6a-invite .r4-invite-cta{margin-top:32px}
@media(min-width:1024px){
 .r6a-page .r6a-hero{padding:56px 0 72px}
 .r6a-page .r6a-section{padding:72px 0}
 .r6a-page .r6a-two{grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);gap:clamp(40px,6vw,90px);align-items:start}
 .r6a-page .r6a-dim{grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);gap:clamp(40px,6vw,90px)}
 .r6a-page .r6a-dim-head{padding-left:56px}
}
@media(max-width:767px){
 .r6a-page .r6a-wrap{padding:0 24px}
 .r6a-page .r6a-figures{grid-template-columns:1fr 1fr;gap:28px 16px}
 .r6a-page .r6a-figures span{max-width:none}
 .r6a-page .r6a-invite{padding:64px 0 72px}
}

/* the client's last round (2026-10-08): two figures, the metros in one line, no headline over Who we asked, the disclosure after the last module */
.r6a-page .r6a-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.r6a-page .r6a-figures{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px;margin-top:8px}
.r6a-page .r6a-metros{text-transform:none;letter-spacing:.02em;font-size:14px;line-height:1.6;max-width:70ch}
.r6a-page .r6a-disclosure{padding:32px 0 40px}
.r6a-page .r6a-disclosure-copy{margin:0;font-size:13px;line-height:1.55;color:#666;max-width:80ch}
@media(max-width:767px){ .r6a-page .r6a-figures{grid-template-columns:1fr 1fr} }
/* the client's last round (2026-10-09): on phones a dimension's number, name, meaning and questions share one left edge, the meaning in the questions' own type */
@media(max-width:767px){
 .r6a-page .r6a-dim-head{padding-left:0}
 .r6a-page .r6a-dim-n{position:static;display:block;margin-bottom:8px}
 .r6a-page .r6a-dim-head p{font-size:17px;line-height:1.45;color:#222;max-width:none}
}

/* The back link clears the header (Saturday's eye pass, 2026-10-10): the page starts under the fixed header, and the link sat at 42px on phones (fully
   hidden) and 58px on laptops (its top cut). It now sits 16px under the header, as the quiz cover's back link does; the heading below keeps its
   distance from the link. */
html #dc-root .r6a-page .r6a-back{display:block;width:fit-content} /* a block: its top is the hero's content top, whatever the type size (2026-10-11) */
html #dc-root .r6a-page .r6a-hero{padding-top:80px} /* phones: the header is 64px */
@media(min-width:768px){ html #dc-root .r6a-page .r6a-hero{padding-top:83px} } /* tablets and laptops: the header is 67px */
@media(min-width:1441px){ html #dc-root .r6a-page .r6a-hero{padding-top:80px} } /* above 1440 the header is pinned to 64px: the link keeps its 16px under it (2026-10-11) */
