/* Public homepage: approved Type A / Nimbus Sans, October 2026.
   Historical design-guide pages keep their own styles and source references. */
@font-face {
  font-family: "Nimbus Sans";
  src: url("./fonts/NimbusSans-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Nimbus Sans";
  src: url("./fonts/NimbusSans-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
/* A native-scroll prototype; all copy remains readable without enhancement. */
:root { color-scheme: dark; --jet:#0a0a0a; --dark:#1a1a1a; --steel:#2b2b2b; --silver:#b3b3b3; --white:#fff; --gutter:clamp(20px,5vw,80px); --stage-height:clamp(220px,36svh,310px); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; background:var(--jet); color:var(--white); font:400 17px/1.5 "Nimbus Sans",Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
button,a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
button { font:inherit; }
a { color:inherit; text-underline-offset:.22em; }
:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
::selection { background:var(--white); color:var(--jet); }
[hidden] { display:none !important; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-weight:700; text-wrap:balance; }
h1 { font-size:clamp(40px,9vw,64px); line-height:.98; letter-spacing:-.045em; }
h2 { font-size:clamp(34px,7vw,52px); line-height:1.04; letter-spacing:-.035em; }
h3 { font-size:clamp(32px,6vw,44px); line-height:1.06; letter-spacing:-.03em; }
.section-width { width:min(100% - var(--gutter)*2,1440px); margin-inline:auto; }
.skip-link { position:fixed; top:12px; left:16px; z-index:20; padding:12px 20px; background:var(--white); color:var(--jet); transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.site-header { position:relative; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:84px; padding:16px var(--gutter); border-bottom:1px solid var(--steel); background:var(--jet); }
.wordmark { display:inline-flex; align-items:center; gap:9px; min-height:44px; font-size:19px; font-weight:700; letter-spacing:-.025em; text-decoration:none; }
.wordmark img { display:block; flex:none; }
.site-header nav { display:flex; align-items:center; gap:clamp(4px,2vw,28px); }
.site-header nav a { display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 8px; color:var(--silver); font-size:14px; text-decoration:none; }
.site-header nav a:hover,.site-header nav a:focus-visible { color:var(--white); text-decoration:underline; }
.sphere-story { position:relative; }
.sphere-stage { padding:28px var(--gutter) 8px; }
.hero-visual { width:min(100%,500px); margin-inline:auto; }
.globe-art { position:relative; width:100%; aspect-ratio:1; overflow:hidden; }
.globe-art img,.globe-art canvas { display:block; position:absolute; width:100%; height:100%; object-fit:contain; }
.globe-poster { opacity:1; }
body[data-globe-ready="true"] .globe-poster { opacity:0; }
.orb-dev-motes { opacity:.42; pointer-events:none; }
.data-flock { opacity:.68; touch-action:pan-y; }
.hero-visual figcaption { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; color:var(--silver); font-size:11px; }
#motion-toggle { flex:none; min-height:44px; padding:4px 0 4px 12px; border:0; background:transparent; color:var(--silver); font-size:12px; text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
#motion-toggle:hover { color:var(--white); }
.story-track { height:1px; background:var(--steel); overflow:hidden; }
.story-track span { display:block; width:100%; height:1px; background:var(--silver); transform-origin:0 50%; transform:scaleX(var(--story-progress,0)); }
.story-step { position:relative; padding:64px var(--gutter); }
.story-step + .story-step,.story-chapter + .story-step,.story-chapter > .story-step + .story-step { border-top:1px solid var(--steel); }
.orbit-panel { position:relative; max-width:580px; margin-inline:auto; }
.eyebrow { margin:0 0 24px; color:var(--silver); font-size:12px; line-height:1.5; letter-spacing:.08em; text-transform:uppercase; }
.section-number { margin-right:14px; }
.hero-copy,.section-copy { margin-top:24px; color:var(--silver); font-size:18px; line-height:1.55; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.button { display:inline-flex; justify-content:space-between; align-items:center; gap:20px; min-height:50px; padding:12px 16px; border:1px solid #757575; font-size:14px; font-weight:700; text-decoration:none; }
.button--primary { background:var(--white); color:var(--jet); border-color:var(--white); }
.button:hover { background:var(--steel); color:var(--white); }
.button--primary:hover { background:var(--silver); border-color:var(--silver); color:var(--jet); }
.hero-status { display:flex; align-items:center; gap:10px; margin-top:32px; color:var(--silver); font-size:12px; }
.status-dot { width:5px; height:5px; flex:none; background:#3a82f6; }
.card-index { display:block; margin-bottom:28px; color:var(--silver); font-size:12px; }
.principle p,.research-panel > p:not(.eyebrow) { margin-top:24px; color:var(--silver); font-size:18px; line-height:1.55; }
.research-panel { border-left:1px solid #757575; padding-left:24px; }
.research-panel .eyebrow { font-size:11px; letter-spacing:.055em; }
.research-panel blockquote { margin:24px 0; font-size:clamp(23px,3vw,31px); line-height:1.25; letter-spacing:-.015em; }
.panel-diagram { display:flex; justify-content:space-between; align-items:center; gap:4px; margin-block:32px; font-size:11px; color:var(--silver); }
.panel-diagram span { padding:10px 7px; border:1px solid #757575; }
.panel-diagram span + span::before { content:""; }
.current-stage { display:grid; grid-template-columns:1fr; margin:32px 0 0; padding:0; border-top:1px solid var(--steel); }
.current-stage > div { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 16px; padding:12px 0; border-bottom:1px solid var(--steel); }
.current-stage dt { font-size:16px; font-weight:700; }
.current-stage dd { margin:0; color:var(--silver); font-size:14px; }
.contact-row { display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; margin-top:32px; }
.email-link { display:inline-flex; align-items:center; min-height:44px; font-size:17px; }
.site-footer { position:relative; z-index:5; padding-block:36px; border-top:1px solid #c9c9c9; background:var(--white); color:#545454; }
.site-footer .section-width { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 28px; font-size:12px; }
.site-footer a { display:inline-flex; align-items:center; width:100%; min-height:44px; color:var(--jet); font-size:18px; font-weight:700; text-decoration:none; }
/* Enhancement is opt-in: no JS and reduced motion keep the compact static flow. */
body[data-scroll-ready="true"] .sphere-stage { position:sticky; top:0; z-index:3; display:flex; align-items:center; height:var(--stage-height); padding:8px var(--gutter) 12px; background:var(--jet); }
body[data-scroll-ready="true"] .hero-visual { width:calc(var(--stage-height) - 66px); }
body[data-scroll-ready="true"] .hero-visual figcaption { min-width:calc(100vw - var(--gutter)*2); position:relative; left:50%; transform:translateX(-50%); }
body[data-scroll-ready="true"] .story-step { min-height:78svh; display:flex; align-items:center; padding-block:52px 96px; scroll-margin-top:calc(var(--stage-height) + 28px); }
body[data-scroll-ready="true"] .story-chapter { scroll-margin-top:calc(var(--stage-height) + 28px); }
body[data-scroll-ready="true"] .orbit-panel { width:100%; }
body[data-scroll-motion="on"] .orbit-panel { transform:translate3d(var(--orbit-x,0px),var(--orbit-y,0px),0); opacity:var(--panel-opacity,1); }
body[data-scroll-motion="off"] .orbit-panel,body[data-scroll-motion="on"] .orbit-panel:focus-within { transform:none; opacity:1; }
body[data-scroll-motion="off"] .story-track span { transform:none; }
@media (max-width:419px) {
 .site-header { gap:4px; padding-inline:14px; }
 .wordmark { gap:3px; font-size:15px; }
 .wordmark img { width:32px; height:32px; }
 .site-header nav a { padding-inline:6px; font-size:12px; }
 .site-header nav a span { display:none; }
 .hero-actions .button { width:100%; }
}
@media (min-width:760px) and (max-width:1099px) {
 :root { --stage-height:clamp(250px,38svh,350px); }
 body[data-scroll-ready="true"] .orbit-panel { max-width:620px; }
 .hero-actions { flex-wrap:nowrap; }
 .current-stage { grid-template-columns:repeat(3,1fr); gap:20px; }
 .current-stage > div { display:block; }
 .current-stage dd { margin-top:8px; }
}
@media (min-width:1100px) {
 :root { --stage-height:100svh; }
 body[data-scroll-ready="true"] .sphere-stage { height:100svh; margin-bottom:-100svh; padding:0; background:transparent; pointer-events:none; }
 body[data-scroll-ready="true"] .hero-visual { width:min(33vw,540px); }
 body[data-scroll-ready="true"] .globe-art,body[data-scroll-ready="true"] #motion-toggle { pointer-events:auto; }
 body[data-scroll-ready="true"] .hero-visual figcaption { min-width:0; left:0; transform:none; }
 body[data-scroll-ready="true"] .story-step { min-height:100svh; padding:88px 5vw; border:0; scroll-margin-top:0; }
 body[data-scroll-ready="true"] .story-chapter { scroll-margin-top:0; }
 body[data-scroll-ready="true"] .orbit-panel { width:min(24vw,410px); margin:0; }
 body[data-scroll-ready="true"] .story-step--right { justify-content:flex-end; }
 body[data-scroll-ready="true"] h1 { font-size:clamp(42px,3.5vw,64px); }
 body[data-scroll-ready="true"] h2 { font-size:clamp(36px,2.9vw,54px); }
 body[data-scroll-ready="true"] h3 { font-size:clamp(34px,2.8vw,48px); }
 body[data-scroll-ready="true"] .hero-copy,body[data-scroll-ready="true"] .section-copy,body[data-scroll-ready="true"] .principle p,body[data-scroll-ready="true"] .research-panel > p:not(.eyebrow) { font-size:17px; }
 body[data-scroll-ready="true"] .research-panel blockquote { font-size:clamp(23px,1.7vw,30px); }
 .site-footer a { width:auto; }
}
@media (prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 .orbit-panel,.story-track span { transform:none !important; opacity:1 !important; }
}
@media (forced-colors:active) {
 .status-dot { background:CanvasText; }
 .button { border-color:ButtonText; }
 .globe-art { forced-color-adjust:none; }
}
