/* Cross-page theme tokens and late cascade overrides. */
html[data-theme="light"] {
  color-scheme: light;
  --ink: #18202a;
  --muted: #56616e;
  --soft: #66717c;
  --line: rgba(24,32,42,.16);
  --bg: #f7f7f3;
  --bg-soft: #fff;
  --blue: #006b7d;
  --arcade-cyan: #006b7d;
  --arcade-yellow: #9a6e00;
  --arcade-action: #74d7e8;
  --pixel-shadow: rgba(24,32,42,.13);
}
html[data-theme="light"] body { color: var(--ink); background-color: var(--bg); background-image: linear-gradient(rgba(24,32,42,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(24,32,42,.025) 1px, transparent 1px); }
html[data-theme="light"] body::before { background: radial-gradient(ellipse at 86% 8%, rgba(0,107,125,.08), transparent 32rem), radial-gradient(ellipse at 8% 45%, rgba(109,83,196,.045), transparent 28rem); }
html[data-theme="light"] body::after { opacity: .012; }
html[data-theme="light"] .site-header-overlay { border-color: rgba(24,32,42,.14); background: rgba(247,247,243,.94); box-shadow: 0 2px 0 rgba(24,32,42,.045); backdrop-filter: blur(12px); }
html[data-theme="light"] .product-page .site-header-overlay { background: linear-gradient(to bottom, rgba(247,247,243,.96), rgba(247,247,243,.72)); }
html[data-theme="light"] .brand-mark { box-shadow: 2px 2px 0 rgba(24,32,42,.12); }
html[data-theme="light"] .header-cta { color: var(--ink); border-color: rgba(24,32,42,.24); background: rgba(255,255,255,.7); box-shadow: none; }
html[data-theme="light"] .header-cta:hover { border-color: var(--arcade-cyan); background: #fff; }
html[data-theme="light"] .header-support { color: #07131a; border-color: #74d7e8; background: #74d7e8; box-shadow: none; }
html[data-theme="light"] .nav-links { color: #56616e; }
html[data-theme="light"] .neural-story, html[data-theme="light"] .neural-viewport { background: #f7f7f3; }
html[data-theme="light"] .neural-viewport { background-image: radial-gradient(circle at 58% 52%, rgba(0,107,125,.09), transparent 32%), linear-gradient(rgba(247,247,243,.24), rgba(247,247,243,.24)); }
html[data-theme="light"] .network-noise { opacity: .08; }
html[data-theme="light"] .story-copy h1 { color: #18202a; text-shadow: 2px 2px 0 rgba(0,107,125,.1); }
html[data-theme="light"] .network-node { color: #18202a; background: rgba(255,255,255,.92); box-shadow: 4px 4px 0 rgba(24,32,42,.13), 0 0 25px color-mix(in srgb, var(--node-accent) 18%, transparent); }
html[data-theme="light"] .network-node-label { color: #34404b; background: rgba(255,255,255,.9); }
html[data-theme="light"] .network-detail { color: var(--ink); border-color: var(--line); background: rgba(255,255,255,.94); box-shadow: 7px 7px 0 rgba(24,32,42,.12); }
html[data-theme="light"] .network-detail p, html[data-theme="light"] .network-detail > span { color: var(--muted); }
html[data-theme="light"] .content-section { border-color: var(--line); }
html[data-theme="light"] .product-card { border-color: var(--line); background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(244,247,246,.94)); box-shadow: 0 8px 24px rgba(24,32,42,.055); }
html[data-theme="light"] .product-card h3, html[data-theme="light"] .section-heading h2, html[data-theme="light"] .platform-copy h2, html[data-theme="light"] .contact-section h2, html[data-theme="light"] .product-hero h1, html[data-theme="light"] .product-cta h2 { text-shadow: none; }
html[data-theme="light"] .button-primary { color: #07131a; border-color: #74d7e8; background: #74d7e8; box-shadow: 3px 3px 0 rgba(24,32,42,.12); }
html[data-theme="light"] .button-primary:hover { background: #8be0ed; }
html[data-theme="light"] .button-quiet, html[data-theme="light"] .button-outline { color: var(--ink); border-color: rgba(24,32,42,.26); }
html[data-theme="light"] .button-quiet:hover, html[data-theme="light"] .button-outline:hover { border-color: var(--arcade-cyan); background: rgba(0,107,125,.06); }
html[data-theme="light"] .pix-card { border-color: rgba(24,32,42,.14); background: linear-gradient(145deg, #fff, #f0f4f4); box-shadow: 6px 6px 0 rgba(24,32,42,.1); }
html[data-theme="light"] .pix-brand-lockup { border-color: var(--line); }
html[data-theme="light"] .support-uses { border-color: rgba(0,107,125,.3); }
html[data-theme="light"] .story-evidence { border-color: rgba(24,32,42,.18); background: #fff; box-shadow: 5px 5px 0 rgba(24,32,42,.1); }
html[data-theme="light"] .story-screenshot { background: #f0f1ef; }
html[data-theme="light"] .story-copy .hero-description { color: #46515c; }

.theme-toggle { display: inline-flex; min-height: 36px; align-items: center; justify-content: center; padding: 4px 0 4px 13px; margin-left: 3px; border: 0; border-left: 1px solid var(--line); border-radius: 0; color: var(--muted); background: transparent; cursor: pointer; transition: border-color .2s ease; }
.theme-toggle:hover { border-left-color: var(--arcade-cyan); background: transparent; }
.theme-toggle:focus-visible { outline: 3px solid var(--arcade-cyan); outline-offset: 3px; }
.theme-toggle [data-theme-label] { display: none; }
.theme-switch { position: relative; display: inline-flex; width: 42px; height: 24px; flex: 0 0 42px; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--ink) 8%, transparent); transition: border-color .2s ease, background-color .2s ease; }
.theme-switch-thumb { position: absolute; top: 2px; left: 2px; display: grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; color: #09131d; background: var(--arcade-cyan); box-shadow: 0 1px 4px rgba(0,0,0,.25); transition: transform .24s cubic-bezier(.2,.8,.2,1), background-color .2s ease, box-shadow .2s ease; }
.theme-toggle-icon { color: var(--arcade-yellow); font: 700 .72rem/1 var(--font-body); }
html[data-theme="light"] .theme-switch { border-color: color-mix(in srgb, var(--arcade-cyan) 48%, var(--line)); background: color-mix(in srgb, var(--arcade-cyan) 15%, transparent); }
html[data-theme="light"] .theme-switch-thumb { transform: translateX(18px); color: #fff; background: var(--arcade-cyan); box-shadow: 0 0 10px color-mix(in srgb, var(--arcade-cyan) 40%, transparent); }
.site-header-simple .about-header-actions { gap: 9px; }
@media (max-width: 700px) {
  .theme-toggle { min-height: 38px; padding: 6px 0 6px 9px; margin-left: 0; }
  .about-header-actions { gap: 6px; }
  .site-header-overlay:not(.site-header-simple) .header-actions { gap: 4px; }
}
@media (max-width: 360px) {
  .site-header-overlay:not(.site-header-simple) .brand { gap: 5px; font-size: .72rem; }
  .site-header-overlay:not(.site-header-simple) .header-support { width: 76px; }
  .site-header-overlay:not(.site-header-simple) .header-cta[data-whatsapp-link] { min-width: 76px; }
  .site-header-overlay:not(.site-header-simple) .header-cta[data-whatsapp-link]::before { font-size: .58rem; }
  .site-header-overlay:not(.site-header-simple) .theme-toggle { padding-left: 5px; }
  .site-header-overlay:not(.site-header-simple) .theme-switch { width: 26px; flex-basis: 26px; }
  .site-header-overlay:not(.site-header-simple) .theme-switch-thumb { transform: translateX(0); }
  html[data-theme="light"] .site-header-overlay:not(.site-header-simple) .theme-switch-thumb { transform: translateX(2px); }
}

/* About hero and expandable, scroll-progress timeline. */
.about-page .about-content { width: min(100%,1260px); padding: 128px 56px 88px; }
.about-page .about-intro { grid-template-columns: minmax(0,1.25fr) minmax(260px,.75fr); gap: clamp(40px,7vw,100px); min-height: auto; padding: 72px 0 96px; }
.about-page .about-intro h1 { max-width: 760px; font-size: clamp(3rem,5.7vw,5.2rem); line-height: 1.02; }
.about-page .about-intro .about-lead { max-width: 650px; }
.about-page .about-intro-note { display: flex; flex-direction: column; align-items: flex-start; padding: 30px; border: 1px solid var(--about-line); background: var(--about-card); box-shadow: var(--about-shadow); }
.about-page .about-note-mark { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid var(--about-cyan); color: var(--about-cyan); font: 700 .85rem var(--font-display); }
.about-page .about-intro-note p { margin: 24px 0 6px; color: var(--about-muted); font-size: .84rem; }
.about-page .about-intro-note strong { max-width: 330px; color: var(--about-ink); font: 700 clamp(1.25rem,2vw,1.65rem)/1.2 var(--font-display); letter-spacing: -.035em; }
.about-page .about-note-caption { margin-top: 20px; color: var(--about-soft); font-size: .78rem; }
.about-page .about-history { position: relative; display: grid; grid-template-columns: minmax(240px,.72fr) minmax(0,1.28fr); align-items: start; gap: clamp(34px,7vw,90px); padding: 86px 0; border-top: 1px solid var(--about-line); }
.about-page .about-history-heading { position: sticky; top: 125px; }
.about-page .history-scroll-hint { display: flex; align-items: center; gap: 8px; margin-top: 20px; color: var(--about-cyan); font-size: .76rem !important; font-weight: 700; }
.about-page .history-scroll-hint span { display: grid; width: 24px; height: 24px; place-items: center; border: 1px solid var(--about-line); border-radius: 50%; animation: scroll-nudge 1.8s ease-in-out infinite; }
.about-page .about-section-heading h2 { font-size: clamp(2.25rem,4vw,3.55rem); }
.about-page .history-progress { position: absolute; top: 0; bottom: 0; left: calc(36% + clamp(34px,7vw,90px) - 34px); width: 2px; background: var(--about-line); transform: translateX(-50%); }
.about-page .history-progress span { display: block; width: 100%; height: 100%; background: var(--about-cyan); transform: scaleY(0); transform-origin: top; box-shadow: 0 0 12px color-mix(in srgb,var(--about-cyan) 45%,transparent); }
.about-page .history-chapters { min-width: 0; }
.about-page .history-chapter { position: relative; border-top: 1px solid var(--about-line); }
.about-page .history-chapter:nth-of-type(even) { margin-left: 18px; }
.about-page .history-chapter:last-child { border-bottom: 1px solid var(--about-line); }
.about-page .history-chapter::before { position: absolute; top: 30px; left: -34px; width: 11px; height: 11px; border: 2px solid var(--about-cyan); border-radius: 50%; background: var(--about-paper); content: ""; }
.about-page .history-chapter::after { position: absolute; top: 35px; left: -23px; width: 23px; border-top: 1px solid var(--about-line); content: ""; transition: border-color .25s ease, width .25s ease; }
.about-page .history-chapter:nth-of-type(even)::before { left: -52px; }
.about-page .history-chapter:nth-of-type(even)::after { left: -41px; width: 41px; }
.about-page .history-chapter summary { display: grid; grid-template-columns: 40px minmax(0,1fr) 24px; align-items: center; gap: 14px; min-height: 112px; cursor: pointer; list-style: none; }
.about-page .history-chapter summary::-webkit-details-marker { display: none; }
.about-page .history-chapter summary:focus-visible { outline: 2px solid var(--about-cyan); outline-offset: 4px; }
.about-page .history-index { align-self: start; padding-top: 29px; color: var(--about-cyan); font: 700 .74rem var(--font-display); }
.about-page .history-summary small, .about-page .history-summary strong, .about-page .history-summary > span { display: block; }
.about-page .history-summary small { margin: 0 0 7px; color: var(--about-cyan); font: 700 .74rem/1.5 var(--font-display); }
.about-page .history-summary strong { color: var(--about-ink); font: 700 clamp(1.05rem,1.7vw,1.35rem)/1.2 var(--font-display); letter-spacing: -.025em; }
.about-page .history-summary > span { margin-top: 7px; color: var(--about-muted); font-size: .83rem; line-height: 1.5; }
.about-page .history-expand { position: relative; width: 22px; height: 22px; border: 1px solid var(--about-line); border-radius: 50%; }
.about-page .history-expand::before, .about-page .history-expand::after { position: absolute; top: 10px; left: 6px; width: 8px; height: 1.5px; background: var(--about-cyan); content: ""; }
.about-page .history-expand::after { transform: rotate(90deg); transition: transform .2s ease; }
.about-page .history-chapter[open] .history-expand::after { transform: none; }
.about-page .history-chapter-body { padding: 0 38px 28px 54px; }
.about-page .history-context { max-width: 620px; margin: 0 0 24px; color: var(--about-muted); font-size: .91rem; line-height: 1.75; }
.about-page .history-events { position: relative; display: grid; gap: 0; margin: 0; padding: 0 0 0 18px; border-left: 1px solid var(--about-line); list-style: none; }
.about-page .history-events li { position: relative; display: grid; grid-template-columns: minmax(115px,.4fr) minmax(0,1fr); gap: 15px; padding: 0 0 23px; }
.about-page .history-events li:last-child { padding-bottom: 0; }
.about-page .history-events li::before { position: absolute; top: 5px; left: -23px; width: 8px; height: 8px; border-radius: 50%; background: var(--about-cyan); content: ""; }
.about-page .history-events time { color: var(--about-cyan); font: 700 .72rem/1.7 var(--font-display); }
.about-page .history-events strong { color: var(--about-ink); font: 700 .94rem/1.35 var(--font-display); }
.about-page .history-events p { margin: 5px 0 0; color: var(--about-muted); font-size: .82rem; line-height: 1.65; }
.about-page .history-mantra { margin: 23px 0 14px; padding: 14px 16px; border-left: 2px solid var(--about-cyan); color: var(--about-ink); background: var(--about-cyan-soft); font: 600 .94rem/1.55 var(--font-display); }
.about-page .about-founders, .about-page .about-start { grid-template-columns: 1fr; padding: 88px 0; }
.about-page .about-founder-grid { gap: 18px; }
.about-page .about-founder-card { min-height: 275px; }
.about-page .about-app-card { min-height: 280px; }
.about-page .history-future { position: relative; display: block; margin-top: 26px; padding: 25px 24px 25px 54px; border-top: 1px dashed var(--about-line); border-bottom: 1px dashed var(--about-line); }
.about-page .history-future::before { position: absolute; top: 28px; left: -34px; width: 11px; height: 11px; border: 2px solid var(--about-cyan); border-radius: 50%; background: var(--about-paper); content: ""; transition: background-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.about-page .history-future .eyebrow { margin: 0 0 8px; color: var(--about-cyan); font: 700 .7rem/1.6 var(--font-display); }
.about-page .history-future-copy { min-width: 0; }
.about-page .history-future h3 { margin: 0 0 8px; color: var(--about-cyan); font: 700 clamp(1.25rem,2.4vw,1.8rem)/1.2 var(--font-display); letter-spacing: -.035em; }
.about-page .history-future-copy > p { max-width: 700px; margin: 0; color: var(--about-muted); font-size: .88rem; line-height: 1.7; }
.about-page .history-future-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 13px; }
.about-page .history-future-tags span { padding: 5px 8px; border: 1px solid var(--about-line); color: var(--about-muted); font-size: .7rem; line-height: 1.4; }
.about-page .history-future small { display: block; margin-top: 14px; color: var(--about-soft); font-size: .72rem; }
.about-page .history-chapter::before { transition: background-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.about-page .history-chapter.is-active::before, .about-page .history-future.is-active::before { background: var(--about-cyan); box-shadow: 0 0 0 5px var(--about-cyan-soft), 0 0 16px color-mix(in srgb,var(--about-cyan) 60%,transparent); transform: scale(1.06); }
.about-page .history-chapter.is-active::after { width: 29px; border-color: var(--about-cyan); }
.about-page .history-chapter:nth-of-type(even).is-active::after { width: 47px; }
.about-page .history-chapter.is-past::before, .about-page .history-future.is-past::before { background: var(--about-cyan); }
.about-page .history-chapter.is-active .history-index, .about-page .history-chapter.is-active .history-summary small { color: var(--about-ink); }
.about-page .history-progress span { transition: transform .18s linear; }
.about-page .site-footer { font-family: var(--font-body); font-size: .8rem; letter-spacing: normal; }
@keyframes scroll-nudge { 0%,100% { transform: translateY(-2px); } 50% { transform: translateY(2px); } }
@media (max-width: 900px) {
  .about-page .about-content { padding-right: 34px; padding-left: 34px; }
  .about-page .about-history { grid-template-columns: 1fr; gap: 30px; }
  .about-page .about-history-heading { position: static; max-width: 720px; }
  .about-page .history-progress { left: 13px; }
  .about-page .history-chapters { margin-left: 37px; }
  .about-page .history-chapter:nth-of-type(even) { margin-left: 0; }
  .about-page .history-chapter::before { left: -30px; }
  .about-page .history-chapter::after { left: -19px; width: 19px; }
  .about-page .history-chapter:nth-of-type(even)::before { left: -30px; }
  .about-page .history-chapter:nth-of-type(even)::after { left: -19px; width: 19px; }
  .about-page .history-chapter:nth-of-type(even).is-active::after { width: 25px; }
  .about-page .history-chapter.is-active::after { width: 25px; }
  .about-page .history-future::before { left: -30px; }
}
@media (max-width: 700px) {
  .about-page .about-content { padding: 100px 22px 64px; }
  .about-page .about-intro { grid-template-columns: 1fr; gap: 30px; padding: 45px 0 64px; }
  .about-page .about-intro h1 { font-size: clamp(2.55rem,12vw,4rem); }
  .about-page .about-intro .about-lead { font-size: .98rem; }
  .about-page .about-intro-note { padding: 22px; }
  .about-page .about-history, .about-page .about-founders, .about-page .about-start { gap: 27px; padding: 58px 0; }
  .about-page .about-section-heading h2 { font-size: clamp(2.05rem,9vw,3rem); }
  .about-page .history-chapters { margin-left: 28px; }
  .about-page .history-chapter summary { grid-template-columns: 27px minmax(0,1fr) 20px; gap: 8px; min-height: 103px; }
  .about-page .history-chapter::before { left: -20px; width: 9px; height: 9px; }
  .about-page .history-chapter::after { top: 32px; left: -11px; width: 11px; }
  .about-page .history-chapter.is-active::after { width: 17px; }
  .about-page .history-chapter:nth-of-type(even).is-active::after { width: 17px; }
  .about-page .history-index { padding-top: 28px; font-size: .75rem; }
  .about-page .history-summary small { font-size: .75rem; }
  .about-page .history-summary strong { font-size: 1rem; }
  .about-page .history-summary > span { font-size: .76rem; }
  .about-page .history-expand { width: 19px; height: 19px; }
  .about-page .history-expand::before, .about-page .history-expand::after { top: 8px; left: 5px; }
  .about-page .history-chapter-body { padding: 0 8px 24px 35px; }
  .about-page .history-events { padding-left: 14px; }
  .about-page .history-events li { grid-template-columns: 1fr; gap: 4px; padding-bottom: 20px; }
  .about-page .history-events li::before { left: -19px; }
  .about-page .history-events time { font-size: .75rem; }
  .about-page .history-events strong { font-size: .9rem; }
  .about-page .history-events p, .about-page .history-context { font-size: .82rem; }
  .about-page .about-founder-grid, .about-page .about-app-grid { grid-template-columns: 1fr; }
  .about-page .about-founder-card { min-height: 0; padding: 22px; }
  .about-page .about-app-card, .about-page .about-app-card:last-child { min-height: 250px; }
  .about-page .history-future { padding: 22px 14px 22px 35px; }
  .about-page .history-future::before { left: -20px; width: 9px; height: 9px; }
  .about-page .site-footer { align-items: flex-start; gap: 14px; margin: 0 22px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .about-page .history-chapter-body { animation: none; }
  .about-page .history-progress span, .about-page .history-chapter::before, .about-page .history-chapter::after, .about-page .history-future::before, .about-page .history-scroll-hint span { transition: none; animation: none; }
  .theme-toggle, .theme-switch, .theme-switch-thumb, .about-page .history-expand::after { transition: none; }
}

/* Keep the primary section links available on compact screens without adding a menu layer. */
@media (max-width: 820px) {
  .site-header-overlay:not(.site-header-simple) {
    height: auto;
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "brand actions" "nav nav";
    row-gap: 7px;
    padding: 8px 12px 7px;
  }
  .site-header-overlay:not(.site-header-simple) .brand { grid-area: brand; }
  .site-header-overlay:not(.site-header-simple) .nav-links {
    display: flex;
    grid-area: nav;
    width: 100%;
    justify-self: stretch;
    justify-content: center;
    flex-wrap: wrap;
    column-gap: clamp(12px,3.4vw,26px);
    row-gap: 2px;
    padding-top: 4px;
    font-size: .65rem;
  }
  .site-header-overlay:not(.site-header-simple) .header-actions { grid-area: actions; }
  .site-header-overlay:not(.site-header-simple) .nav-links a { min-height: 26px; display: inline-flex; align-items: center; }
  .site-header-overlay:not(.site-header-simple) .nav-links a::before { content: none; }
  .content-section { scroll-margin-top: 112px; }
}
@media (max-width: 700px) {
  .site-header-overlay:not(.site-header-simple) {
    width: calc(100% - 24px);
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "brand theme" "nav nav" "support cta";
    row-gap: 4px;
    padding: 7px 8px 6px;
  }
  .site-header-overlay:not(.site-header-simple) .header-actions { display: contents; }
  .site-header-overlay:not(.site-header-simple) .theme-toggle { grid-area: theme; justify-self: end; }
  .site-header-overlay:not(.site-header-simple) .header-support { grid-area: support; justify-self: start; width: auto; min-height: 34px; padding: 6px 10px; font-size: .62rem; }
  .site-header-overlay:not(.site-header-simple) .header-cta { grid-area: cta; justify-self: end; padding: 7px 10px; font-size: .68rem; }
  .site-header-overlay:not(.site-header-simple) .nav-links { justify-content: space-between; column-gap: 8px; font-size: .59rem; letter-spacing: .02em; }
  .site-header-overlay:not(.site-header-simple) .nav-links a { white-space: nowrap; }
  .content-section { scroll-margin-top: 142px; }
}
@media (max-width: 360px) {
  .site-header-overlay:not(.site-header-simple) .nav-links { font-size: .55rem; }
  .site-header-overlay:not(.site-header-simple) .header-support { padding-right: 7px; padding-left: 7px; }
}

.history-artifact { margin: 0 0 25px; padding: 12px; border: 1px solid var(--about-line); background: var(--about-card); }
.history-artifact img { display: block; width: 100%; height: auto; background: #fff; }
.history-artifact figcaption { padding: 11px 4px 1px; color: var(--about-soft); font-size: .76rem; line-height: 1.55; }
@media (max-width: 700px) {
  .history-artifact { padding: 7px; }
  .history-artifact figcaption { padding: 9px 3px 2px; font-size: .7rem; }
}