/* CodLab / centered globe. Locally hosted OFL fonts; no remote font requests. */
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 300 700; font-display: swap; src: url('./fonts/space-grotesk-latin.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 300 700; font-display: swap; src: url('./fonts/space-grotesk-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap; src: url('./fonts/ibm-plex-mono-regular.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('./fonts/ibm-plex-mono-medium.woff2') format('woff2'); }
:root { --font-sans: 'Space Grotesk', ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --font-mono: 'IBM Plex Mono', Consolas, monospace; }
body { font-family: var(--font-sans); }
button, input, select, textarea { font-family: inherit; }
.brand, .rail-brand { gap: 12px; font-family: var(--font-sans); letter-spacing: -.065em; font-weight: 600; }
.brand > :is(span,strong) { font-weight: 600; font-size: 1.55rem; }
.rail-brand-text > strong { font-size: 1.35rem; letter-spacing: -.055em; }
.brand, .rail-brand { white-space: nowrap; flex-shrink: 0; }
.brand-mark { width: 36px; height: 36px; flex: none; fill: none; stroke: none; }
:is(.cv-app,.cv-review) :is(code,pre,.eyebrow,.step,.product-label,.v-eyebrow) { font-family: var(--font-mono); }
.brand-specimens { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.brand-specimens figure { margin: 0; padding: 48px 32px; border: 1px solid var(--line); border-radius: 12px; }
.brand-specimens img { display: block; max-width: 100%; margin: 0 auto 32px; }
.brand-specimens figcaption { font: .8rem/1.8 var(--font-mono); color: var(--text-soft); }
.brand-type-line { font-size: clamp(2rem,4vw,4rem); letter-spacing: -.04em; line-height: 1.2; }
.nano-home .nano-hero { position: relative; min-height: 740px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); align-items: center; padding: 48px 0 60px; gap: 0; isolation: isolate; }
.nano-home .nano-hero__copy { position: relative; z-index: 2; max-width: 690px; padding-block: 76px 60px; pointer-events: none; }
.nano-home .nano-hero__copy a { pointer-events: auto; }
.nano-home .nano-hero__eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 40px; color: var(--text-soft); font: .68rem/1.7 var(--font-mono); letter-spacing: .12em; }
.nano-hero__eyebrow::before { content: ''; width: 6px; height: 6px; background: var(--red-bright); border-radius: 50%; }
.nano-home .nano-hero h1 { font: 500 clamp(3.4rem,7.4vw,7.2rem)/.98 var(--font-sans); letter-spacing: -.065em; margin: 0 0 36px; max-width: 710px; overflow-wrap: anywhere; }
.nano-home .nano-hero h1 span { color: var(--text-soft); }
.nano-hero__intro { max-width: 350px; margin: 0; font-size: 1.05rem; line-height: 1.85; }
.nano-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.nano-home .nano-hero__art { position: absolute; z-index: 0; right: -2%; top: 0; bottom: 0; width: 67%; min-width: 0; margin: 0; }
.nano-home .nano-hero__art [data-dna-stage] { width: 100%; height: 100%; min-height: 600px; }
.nano-home .nano-hero__art [data-dna-pause] { position: absolute; bottom: 36px; right: 18px; z-index: 3; }
.nano-home .nano-hero__art > figcaption { position: absolute; bottom: 0; left: 25%; right: 18px; font: .62rem/1.7 var(--font-mono); color: var(--text-dim); text-align: right; }
.nano-hero__rail { position: absolute; top: 18px; left: 0; right: 0; display: flex; justify-content: space-between; gap: 20px; padding-top: 12px; border-top: 1px solid var(--line-soft); font: .62rem/1.6 var(--font-mono); color: var(--text-dim); letter-spacing: .12em; z-index: 3; }
.nano-hero__coda { grid-column: 1/-1; z-index: 2; border-top: 1px solid var(--line-soft); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; padding-top: 20px; margin-top: auto; font: .73rem/1.7 var(--font-mono); color: var(--text-soft); }
.nano-hero__coda a { color: var(--text); text-decoration: underline; text-underline-offset: 5px; }
.nano-home .neural-planet-stage::before { background: radial-gradient(ellipse,rgba(243,246,248,.04),transparent 64%); }
.nano-home .section-data-art .neural-planet-stage { background: transparent; }
@media(max-width:1000px) {
 .nano-home .nano-hero { min-height: 690px; }
 .nano-home .nano-hero__art { right: -4%; width: 72%; opacity: .8; }
 .nano-home .nano-hero__copy { max-width: 56%; }
 .nano-home .nano-hero h1 { font-size: clamp(3rem,7.8vw,5.6rem); }
}
@media(max-width:760px) {
 .nano-home .nano-hero { display: flex; flex-direction: column; min-height: 0; padding-top: 36px; padding-bottom: 36px; }
 .nano-home .nano-hero__copy { max-width: 100%; width: 100%; padding: 20px 0 0; }
 .nano-home .nano-hero__eyebrow { margin-bottom: 24px; }
 .nano-home .nano-hero h1 { font-size: clamp(3rem,12.5vw,5.5rem); margin-bottom: 24px; }
 .nano-home .nano-hero__art { position: relative; right: auto; width: 100%; height: 460px; opacity: 1; margin-top: 8px; }
 .nano-home .nano-hero__art [data-dna-stage] { min-height: 0; height: 420px; }
 .nano-home .nano-hero__art [data-dna-pause] { bottom: 24px; right: 0; }
 .nano-home .nano-hero__art > figcaption { left: 0; right: 0; text-align: left; bottom: 0; max-width: 64%; }
 .nano-hero__rail { font-size: .55rem; top: 0; }
 .nano-hero__intro { max-width: 37rem; }
 .nano-hero__coda { width: 100%; margin-top: 24px; }
 .brand-specimens { grid-template-columns: 1fr; }
}
@media(prefers-reduced-motion:reduce) { .nano-home *, .nano-home *::before, .nano-home *::after { scroll-behavior: auto; } }

.nano-home .nano-hero__art [data-dna-stage] { background: transparent; aspect-ratio: auto; max-height: none; }
.nano-home .planet-meta span:first-child { color: var(--text-soft); }

@media(min-width:761px) { .nano-home .nano-hero__art [data-dna-pause] { top: 44px; bottom: auto; right: 18px; font: .68rem/1.6 var(--font-mono); } }
/* Keep the portrait inside the page gutters at tablet widths. */
.nano-home .nano-hero__art { right: 0; }
@media(min-width:761px) and (max-width:1000px) { .nano-home .nano-hero__copy { max-width: 100%; } }