:root {
  color-scheme: dark;
  --ink: #f8f5ec;
  --muted: #a9b3ad;
  --soft: #7f8f87;
  --bg: #07100d;
  --panel: #0d1915;
  --panel-2: #12221c;
  --line: #294039;
  --line-soft: #1d3029;
  --lime: #c8f46d;
  --lime-dark: #182308;
  --orange: #ff8a4c;
  --blue: #6ba6ff;
  --yellow: #f4ca64;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 85% 3%, #18382a 0, transparent 29rem),
    radial-gradient(circle at 4% 45%, #1b2412 0, transparent 28rem),
    var(--bg);
  color: var(--ink);
  line-height: 1.5;
}
body.guide-open { overflow: hidden; }
a { color: inherit; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button, summary { -webkit-tap-highlight-color: transparent; }
.wrap { width: min(1040px, calc(100% - 112px)); margin: 0 auto; }
.button:focus-visible, a:focus-visible, summary:focus-visible, button:focus-visible { outline: 3px solid var(--lime); outline-offset: 3px; }
.skip-link { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 9px 13px; border-radius: 8px; color: #07100d; background: var(--lime); font-weight: 800; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
.site-header { position: relative; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 20px 0; }
.testing-notice { width: min(1040px, calc(100% - 112px)); margin: 0 auto; padding: 12px 16px; border: 1px solid #6f6738; border-radius: 12px; color: #e9e2bd; background: #2a2511; font-size: 13px; text-align: center; }
.testing-notice a { color: var(--lime); font-weight: 800; }
.brand { display: inline-flex; align-items: center; gap: 4px; text-decoration: none; }
.brand img { width: 27px; height: 27px; }
.od-word { color: currentColor; font-size: 16px; font-weight: 700; letter-spacing: .16em; line-height: 1; text-transform: uppercase; }
.site-nav { display: flex; align-items: center; gap: 23px; }
.site-nav a { color: var(--muted); font-size: 14px; font-weight: 700; text-decoration: none; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"] { color: var(--ink); }
.site-nav .nav-apply { padding: 9px 14px; border-radius: 999px; color: var(--lime-dark); background: var(--lime); }
.site-nav .nav-login { padding: 9px 14px; border: 1px solid #52675e; border-radius: 999px; color: var(--ink); background: #11231d; }
main { overflow: hidden; }
section { padding: 76px 0; scroll-margin-top: 30px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 17px; color: var(--lime); font-size: 12px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow::before { width: 18px; height: 2px; border-radius: 9px; background: currentColor; content: ""; }
h1, h2, h3, p { text-wrap: pretty; }
h1 { max-width: 650px; margin: 0; font-size: clamp(37px, 4vw, 50px); line-height: 1.04; letter-spacing: -.048em; }
h2 { margin: 0; font-size: clamp(28px, 3vw, 36px); line-height: 1.12; letter-spacing: -.038em; }
h3 { letter-spacing: -.025em; }
.lead { max-width: 600px; margin: 22px 0 0; color: #c5cec9; font-size: clamp(16px, 1.5vw, 18px); line-height: 1.58; }
.quiet { color: var(--muted); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; border: 1px solid transparent; border-radius: 999px; font-size: 15px; font-weight: 800; text-decoration: none; transition: transform 160ms ease, border-color 160ms ease, background 160ms ease; }
.button:hover { transform: translateY(-1px); }
.button.primary { color: var(--lime-dark); background: var(--lime); }
.button.secondary { border-color: #4a6157; background: #102019; }
.text-link { display: inline-flex; align-items: center; gap: 7px; margin-top: 19px; color: var(--lime); font-size: 14px; font-weight: 800; text-decoration: none; }
.text-link::after { content: "→"; transition: transform 160ms ease; }
.text-link:hover::after { transform: translateX(3px); }
.section-head { max-width: 680px; margin-bottom: 34px; }
.section-head > p:not(.eyebrow) { margin: 14px 0 0; color: var(--muted); font-size: 16px; }
.availability-note { max-width: 620px; color: #91a098 !important; font-size: 13px !important; }

/* Home hero */
.hero { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, .9fr) minmax(440px, 1.1fr); gap: 72px; align-items: center; min-height: 630px; padding: 70px 0 84px; }
.hero-copy, .hero-visual { position: relative; z-index: 2; }
.service-motion { position: absolute; z-index: 0; inset: -20px -90px; overflow: hidden; pointer-events: none; mask-image: linear-gradient(90deg, transparent, #000 12%, #000 92%, transparent); }
.service-motion::before { position: absolute; inset: -80px; background-image: linear-gradient(#9dcf7a0b 1px, transparent 1px), linear-gradient(90deg, #9dcf7a0b 1px, transparent 1px); background-size: 46px 46px; transform: perspective(600px) rotateX(58deg) translateY(110px); transform-origin: center bottom; animation: grid-drift 18s linear infinite; content: ""; }
.service-route { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; opacity: .58; filter: drop-shadow(0 0 8px #9ee85b55); }
.route-base { fill: none; stroke: #4f715c55; stroke-width: 2; }
.route-active { fill: none; stroke: url(#route-gradient); stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 12 20; animation: route-flow 8s linear infinite; }
.route-signal { filter: drop-shadow(0 0 7px currentColor); }
.motion-chip { position: absolute; display: flex; align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid #4a6257; border-radius: 999px; color: #dce7e1; background: #0d1b16d9; box-shadow: 0 9px 30px #0006; backdrop-filter: blur(8px); font-size: 10px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; animation: event-cycle 9s ease-in-out infinite; }
.motion-chip::before { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 10px currentColor; content: ""; }
.chip-order { top: 10%; left: 32%; }
.chip-kitchen { bottom: 4%; left: 42%; animation-delay: -6s; }
.chip-stock { right: 4%; bottom: 11%; animation-delay: -3s; }
.chip-kitchen::before { background: var(--blue); }
.chip-stock::before { background: var(--orange); }
.hero-proof { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 25px 0 0; padding: 0; color: var(--muted); font-size: 13px; font-weight: 650; list-style: none; }
.hero-proof li::before { margin-right: 7px; color: var(--lime); content: "✓"; }
.hero-visual { justify-self: end; width: min(100%, 570px); min-width: 0; }
.hero-visual::before { position: absolute; inset: 8% 4% -8% 9%; border-radius: 50%; background: #9dd64b2a; filter: blur(58px); content: ""; }
.window { position: relative; overflow: hidden; border: 1px solid #465c53; border-radius: 20px; background: #050807; box-shadow: 0 32px 80px #0009, 0 0 0 9px #ffffff05; }
.window-top { display: flex; align-items: center; gap: 7px; height: 35px; padding: 0 14px; border-bottom: 1px solid #26342f; background: #14221d; }
.window-top i { width: 7px; height: 7px; border-radius: 50%; background: #5d7168; }
.window-top span { margin-left: 7px; color: #89968f; font-size: 10px; font-style: normal; }
.product-shot { position: relative; overflow: hidden; background: #050807; }
.product-shot img { width: 100%; height: auto; }
.window--online { border-color: #597365; box-shadow: 0 28px 72px #0008, 0 0 0 1px #93c77b24; }
.window--online .window-top { border-bottom-color: #355246; background: linear-gradient(90deg, #172a22, #102019); }
.window--online .product-shot::before { position: absolute; z-index: 2; inset: 0; box-shadow: inset 0 0 0 1px #9bd17f28, inset 0 -54px 80px #07150e38; pointer-events: none; content: ""; }
.hero-visual .product-shot::after { position: absolute; z-index: 3; top: -20%; right: 0; left: 0; height: 18%; background: linear-gradient(180deg, transparent, #c8f46d16 72%, #c8f46d55 100%); transform: translateY(-120%); animation: live-scan 7s ease-in-out infinite; content: ""; }
.shot-stamp { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: 3px; padding: 7px 10px; border: 1px solid #34453e; border-radius: 9px; background: #101b17f2; box-shadow: 0 5px 14px #0008; }
.shot-stamp img { width: 17px; height: 17px; }
.shot-stamp .od-word { font-size: 10px; letter-spacing: .13em; }
.hero-visual > .window { animation: window-breathe 8s ease-in-out infinite; }
.float-card { position: absolute; right: -18px; bottom: -30px; width: 200px; padding: 16px; border: 1px solid #617662; border-radius: 16px; background: #13231cd9; backdrop-filter: blur(16px); box-shadow: 0 20px 50px #0008; animation: card-float 6s ease-in-out infinite; }
.float-card span { display: block; color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.float-card strong { display: block; margin-top: 4px; font-size: 18px; line-height: 1.2; }

/* Calm overview */
.relief-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.relief-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 80px; align-items: start; }
.relief-copy { position: sticky; top: 32px; }
.relief-copy p:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); }
.relief-list { border-top: 1px solid var(--line); }
.relief-item { display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.relief-number { color: #6f887c; font-size: 12px; font-weight: 850; letter-spacing: .08em; }
.relief-item h3 { margin: 0; font-size: 18px; }
.relief-item p { max-width: 590px; margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.workflow-wrap { border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, #0d1a15, #0b1512); box-shadow: inset 0 1px #ffffff08; }
.workflow-intro { padding: 30px 30px 6px; }
.workflow-intro h2 { max-width: 760px; }
.workflow-intro > p:not(.eyebrow) { max-width: 650px; margin: 12px 0 0; color: var(--muted); font-size: 15px; }
.workflow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; padding: 26px 20px 30px; }
.flow-step { position: relative; min-width: 0; padding: 0 10px; text-align: center; }
.flow-step:not(:last-child)::after { position: absolute; z-index: 0; top: 31px; left: calc(50% + 35px); width: calc(100% - 70px); height: 2px; background: linear-gradient(90deg, #63836f, #afda66); content: ""; }
.flow-step:not(:last-child)::before { position: absolute; z-index: 1; top: 27px; right: 23px; width: 8px; height: 8px; border-top: 2px solid #afda66; border-right: 2px solid #afda66; transform: rotate(45deg); content: ""; }
.flow-icon { position: relative; z-index: 2; display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 14px; border: 1px solid #4c6559; border-radius: 16px; color: var(--lime); background: #12231c; box-shadow: 0 0 0 6px #0c1814; font-size: 18px; font-weight: 800; }
.flow-step:nth-child(2) .flow-icon { color: var(--blue); }
.flow-step:nth-child(3) .flow-icon { color: var(--orange); }
.flow-step:nth-child(4) .flow-icon { color: var(--yellow); }
.flow-step h3 { margin: 0; font-size: 15px; }
.flow-step p { margin: 6px auto 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.screens { background: #09130f; }
.screen-feature { display: grid; grid-template-columns: .78fr 1.22fr; gap: 42px; align-items: center; }
.screen-feature .screen-copy { max-width: 390px; }
.screen-copy > span { color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.screen-copy h3 { margin: 8px 0; font-size: 25px; line-height: 1.18; }
.screen-copy p { margin: 0; color: var(--muted); font-size: 14px; }
.screen-feature .window { border-radius: 14px; box-shadow: 0 20px 48px #0007; }
.access-strip { display: grid; grid-template-columns: .8fr 1.2fr; gap: 55px; align-items: center; padding: 34px 0; border-top: 1px solid #405349; border-bottom: 1px solid #405349; }
.access-strip p { margin: 13px 0 0; color: var(--muted); }
.access-points { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
.access-points div { padding: 14px 0; border-top: 1px solid var(--line); }
.access-points strong { display: block; font-size: 14px; }
.access-points span { color: var(--muted); font-size: 12px; }
.final-cta { display: flex; align-items: center; justify-content: space-between; gap: 36px; margin: 70px auto; padding: 34px 0; border-top: 1px solid #405349; border-bottom: 1px solid #405349; }
.final-cta h2 { max-width: 650px; font-size: clamp(27px, 3.2vw, 37px); }
.final-cta p { margin: 12px 0 0; color: var(--muted); }
.guide-intro { display: grid; grid-template-columns: 1.12fr .88fr; gap: 58px; align-items: center; }
.guide-intro-image { overflow: hidden; border: 1px solid #4b6257; border-radius: 22px; background: #0b1713; box-shadow: 0 26px 65px #0007; }
.guide-intro-image img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; object-position: center; }
.guide-intro-copy > p:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); }
.guide-role-links { display: grid; gap: 8px; margin-top: 22px; }
.guide-role-links a { display: grid; gap: 3px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; text-decoration: none; background: #0a1712; }
.guide-role-links a:hover, .guide-role-links a:focus-visible { border-color: #688478; background: #10231b; }
.guide-role-links strong { font-size: 13px; }
.guide-role-links span { color: var(--muted); font-size: 11px; }
.guide-intro-copy .guide-status { padding-top: 15px; border-top: 1px solid var(--line); color: var(--soft); font-size: 12px; }
.guide-about { display: grid; grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr); gap: 48px; align-items: start; }
.guide-about-image { overflow: hidden; margin: 0; border: 1px solid #4b6257; border-radius: 18px; background: #0b1713; box-shadow: 0 20px 52px #0006; }
.guide-about-image img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.guide-about-image figcaption { padding: 12px 15px 14px; border-top: 1px solid var(--line); color: var(--soft); font-size: 11px; line-height: 1.5; }
.guide-principles { grid-template-columns: 1fr; }
.guide-principles .principle:first-child { border-top: 1px solid var(--line); }
.origin-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: linear-gradient(135deg, #09140f, #0d1b15); }
.origin-layout { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); gap: 72px; align-items: start; }
.origin-copy { position: sticky; top: 34px; }
.origin-copy > p:not(.eyebrow) { margin: 18px 0 0; color: var(--muted); font-size: 15px; }
.fiction-note { padding: 18px 0; border-top: 1px solid #50685d; border-bottom: 1px solid #50685d; }
.fiction-note strong { color: var(--ink); }
.origin-inspirations { border-top: 1px solid var(--line); }
.origin-inspirations article { padding: 25px 0; border-bottom: 1px solid var(--line); }
.origin-inspirations article > span { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.origin-inspirations h3 { margin: 8px 0 0; font-size: 20px; }
.origin-inspirations article p { margin: 10px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.origin-disclaimer { margin: 20px 0 0; color: #aab6b0; font-size: 13px; line-height: 1.6; }
.origin-sources { margin: 12px 0 0; color: var(--soft); font-size: 12px; line-height: 1.6; }
.origin-sources a { color: #b9c8c0; }
.guide-scenes { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 42px; }
.guide-scene { overflow: hidden; margin: 0; border: 1px solid #4b6257; border-radius: 18px; background: #0b1713; box-shadow: 0 18px 44px #0005; }
.guide-scene img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.guide-scene figcaption { display: grid; gap: 5px; padding: 15px 17px 18px; border-top: 1px solid var(--line); }
.guide-scene figcaption strong { font-size: 14px; }
.guide-scene figcaption span { color: var(--muted); font-size: 12px; line-height: 1.55; }
.beta-invite { display: grid; grid-template-columns: 1fr auto; gap: 56px; align-items: end; }
.beta-invite > div { max-width: 720px; }
.beta-invite > div > p:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); }

/* Interior pages */
.page-hero { position: relative; isolation: isolate; max-width: 820px; padding: 108px 0 92px; }
.page-hero::after { position: absolute; z-index: -1; top: 4%; left: 54%; width: 430px; height: 310px; border-radius: 50%; background: #213d2d66; filter: blur(75px); content: ""; }
.page-hero .lead { max-width: 670px; }
.breadcrumb { margin: 0 0 24px; color: var(--soft); font-size: 13px; font-weight: 700; }
.breadcrumb a { text-decoration: none; }
.breadcrumb a:hover { color: var(--ink); }
.feature-group { display: grid; grid-template-columns: .64fr 1.36fr; gap: 72px; padding: 70px 0; border-top: 1px solid var(--line); }
.feature-group h2 { max-width: 330px; }
.feature-group-copy > p { margin: 14px 0 0; color: var(--muted); }
.feature-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; border-top: 1px solid var(--line); }
.feature-item { padding: 22px 0 25px; border-bottom: 1px solid var(--line); }
.feature-item h3 { margin: 0; font-size: 17px; }
.feature-detail-link { grid-column: 1 / -1; margin-top: 18px; }
.inline-link { color: var(--lime); font-weight: 750; text-decoration: none; }
.inline-link:hover, .inline-link:focus-visible { text-decoration: underline; }
.feature-item p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.automation-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: linear-gradient(135deg, #08130f, #102219); }
.automation-layout { border-top: 0; }
.automation-flow { border-top: 1px solid #456154; }
.automation-flow article { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 18px; padding: 20px 0; border-bottom: 1px solid #31483e; }
.automation-flow article > span { color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .08em; }
.automation-flow h3 { margin: 0; font-size: 19px; }
.automation-flow p { margin: 7px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.automation-boundary { margin: 22px 0 0; padding: 18px 20px; border: 1px solid #6f6738; border-radius: 14px; color: #cec6a8; background: #211e10; font-size: 13px; line-height: 1.65; }
.automation-boundary strong { color: #f1daa0; }
.feature-guidance { padding: 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.feature-guidance-inner { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr); gap: 72px; align-items: center; padding-top: 64px; padding-bottom: 64px; }
.feature-guidance h2 { max-width: 560px; }
.feature-guidance p { margin: 14px 0 0; color: var(--muted); }
.feature-guidance-action { padding-left: 32px; border-left: 1px solid var(--line); }
.feature-guidance-action .button { margin-top: 22px; }
.feature-stack { min-width: 0; }
.insights-guide { display: grid; grid-template-columns: minmax(220px, .88fr) minmax(0, 1.12fr); gap: 24px; align-items: center; margin-top: 30px; overflow: hidden; border: 1px solid #4b6257; border-radius: 18px; background: #0b1713; }
.insights-guide img { width: 100%; height: 100%; min-height: 230px; object-fit: cover; }
.insights-guide > div { padding: 24px 28px 24px 0; }
.insights-guide h3 { margin-top: 8px; font-size: 24px; }
.insights-guide > div > p:not(.eyebrow) { margin: 10px 0 0; color: var(--muted); font-size: 13px; }
.insights-guide .text-link { margin-top: 14px; }
.feature-visual { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 40px; }
.feature-visual .window { border-radius: 14px; box-shadow: 0 18px 44px #0007; }
.feature-visual .window:first-child { grid-column: 1 / -1; }
.scope-banner { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; padding: 28px 30px; border: 1px solid #465c50; border-radius: 18px; background: #102019; }
.scope-banner h2 { font-size: 24px; }
.scope-banner p { max-width: 680px; margin: 9px 0 0; color: var(--muted); font-size: 14px; }

/* Restaurant insights */
.insights-hero { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr); gap: 60px; align-items: center; padding-top: 84px; padding-bottom: 92px; }
.insights-hero-copy h1 { max-width: 700px; }
.strategist-hero { overflow: hidden; margin: 0; border: 1px solid #4b6257; border-radius: 22px; background: #0b1713; box-shadow: 0 26px 65px #0007; }
.strategist-hero img { width: 100%; height: clamp(300px, 32vw, 360px); object-fit: cover; object-position: 60% center; }
.strategist-hero figcaption { position: relative; display: grid; gap: 7px; padding: 21px 24px 24px 27px; border-top: 1px solid var(--line); }
.strategist-hero figcaption::before { position: absolute; top: 22px; bottom: 24px; left: 0; width: 2px; border-radius: 2px; background: linear-gradient(var(--lime), #54745f); content: ""; }
.strategist-hero figcaption .strategist-role { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .13em; line-height: 1.4; text-transform: uppercase; }
.strategist-hero figcaption strong { font-size: 19px; letter-spacing: -.02em; }
.strategist-hero figcaption span:last-child { color: var(--muted); font-size: 12px; line-height: 1.58; }
.insight-source-section, .insight-reading-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.insight-source-layout { display: grid; grid-template-columns: .76fr 1.24fr; gap: 82px; align-items: start; }
.insight-source-copy { position: sticky; top: 32px; }
.insight-source-copy > p:last-child, .insight-reading-layout > div > p:last-child { margin: 15px 0 0; color: var(--muted); }
.signal-lines { margin: 0; border-top: 1px solid var(--line); }
.signal-lines > div { display: grid; grid-template-columns: 180px 1fr; gap: 28px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.signal-lines dt { color: var(--ink); font-size: 13px; font-weight: 800; }
.signal-lines dd { margin: 0; color: var(--muted); font-size: 13px; }
.insight-decisions { padding-top: 96px; padding-bottom: 96px; }
.insight-decisions .section-head { max-width: 760px; }
.decision-lines { display: grid; grid-template-columns: 1fr 1fr; gap: 0 38px; margin-top: 38px; border-top: 1px solid var(--line); }
.decision-lines article { display: grid; grid-template-columns: 42px 1fr; gap: 16px; padding: 25px 0 29px; border-bottom: 1px solid var(--line); }
.decision-lines article > span { color: #789084; font-size: 11px; font-weight: 850; letter-spacing: .1em; }
.decision-lines h3 { margin: 0; font-size: 18px; }
.decision-lines p { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.insight-reading-layout { display: grid; grid-template-columns: .86fr 1.14fr; gap: 80px; align-items: start; }
.reading-path { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; counter-reset: reading-step; }
.reading-path li { display: grid; grid-template-columns: 120px 1fr; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); counter-increment: reading-step; }
.reading-path strong { font-size: 14px; }
.reading-path strong::before { margin-right: 10px; color: var(--lime); font-size: 10px; content: "0" counter(reading-step); }
.reading-path span { color: var(--muted); font-size: 13px; }
.insight-boundary { display: grid; grid-template-columns: 1fr auto; gap: 54px; align-items: end; padding-top: 78px; padding-bottom: 78px; }
.insight-boundary > div { max-width: 760px; }
.insight-boundary p:last-child { margin: 14px 0 0; color: var(--muted); }

/* Platform tour */
.tour-hero { display: grid; grid-template-columns: minmax(0, .92fr) minmax(420px, 1.08fr); gap: 22px; align-items: end; max-width: none; padding-top: 72px; padding-bottom: 64px; }
.tour-hero-copy { min-width: 0; padding-bottom: 16px; }
.tour-guide-welcome { max-width: 560px; margin-top: 38px; padding-top: 24px; border-top: 1px solid var(--line); }
.tour-guide-welcome > div { position: relative; padding: 0 0 0 25px; }
.tour-guide-welcome > div::before { position: absolute; top: 2px; bottom: 2px; left: 0; width: 2px; border-radius: 2px; background: linear-gradient(var(--lime), #54745f); content: ""; }
.tour-guide-welcome h2 { margin-top: 9px; font-size: 30px; }
.tour-guide-welcome > div > p:last-child { margin: 11px 0 0; color: var(--muted); font-size: 14px; }
.tour-host-figure { position: relative; align-self: stretch; display: flex; align-items: end; justify-content: center; min-height: 680px; margin: -44px -34px -64px 0; overflow: visible; }
.tour-host-figure::before { position: absolute; right: 0; bottom: 7%; width: 100%; height: 73%; border-radius: 50%; background: radial-gradient(circle, #466b4942 0, #213d2d24 45%, transparent 72%); filter: blur(24px); content: ""; }
.tour-host-figure img { position: relative; z-index: 1; width: min(110%, 520px); height: auto; max-height: 760px; object-fit: contain; filter: drop-shadow(0 30px 34px #0009); }
@media (min-width: 761px) {
  .tour-host-figure { order: 1; margin-right: 0; margin-left: -34px; }
  .tour-hero-copy { order: 2; }
}
.tour-map-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.tour-map { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 8px 0 0; list-style: none; }
.tour-map li { position: relative; min-width: 0; padding: 22px 20px 22px 0; border-top: 1px solid var(--line); }
.tour-map li:not(:last-child)::after { position: absolute; top: 38px; right: 18px; width: 38px; height: 1px; background: linear-gradient(90deg, #5d766a, var(--lime)); content: ""; }
.tour-map li:not(:last-child)::before { position: absolute; top: 34px; right: 18px; width: 7px; height: 7px; border-top: 1px solid var(--lime); border-right: 1px solid var(--lime); transform: rotate(45deg); content: ""; }
.tour-map span, .tour-step { color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.tour-map strong, .tour-map small { display: block; }
.tour-map strong { margin-top: 13px; font-size: 15px; }
.tour-map small { margin-top: 4px; color: var(--muted); font-size: 12px; }
.tour-guest-section { padding: 0; border-bottom: 1px solid var(--line-soft); background: #08120e; }
.tour-guest-chapter { display: grid; grid-template-columns: minmax(0, 1.28fr) minmax(260px, .72fr); gap: 48px; align-items: center; padding-top: 72px; padding-bottom: 72px; }
.tour-guest-scene { overflow: hidden; margin: 0; border: 1px solid #4b6257; border-radius: 18px; background: #0b1713; box-shadow: 0 22px 58px #0007; }
.tour-guest-scene img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.tour-guest-scene figcaption { padding: 12px 15px 14px; border-top: 1px solid var(--line); color: var(--soft); font-size: 11px; line-height: 1.5; }
.tour-guest-copy h2 { margin-top: 11px; font-size: clamp(27px, 3.1vw, 38px); }
.tour-guest-copy > p:not(.eyebrow):not(.tour-guest-path) { margin: 15px 0 0; color: var(--muted); font-size: 14px; }
.tour-guest-path { display: flex; align-items: center; gap: 10px; margin: 24px 0 17px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #c8d1cc; font-size: 10px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.tour-guest-path i { flex: 1; min-width: 12px; height: 1px; background: linear-gradient(90deg, #5d766a, var(--lime)); }
.tour-stage { display: grid; grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr); gap: 56px; align-items: center; padding-top: 94px; padding-bottom: 94px; }
.tour-stage-section { padding: 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.tour-stage-reverse .tour-copy { order: 2; }
.tour-stage-reverse .tour-window { order: 1; }
.tour-copy h2 { margin-top: 13px; }
.tour-copy > p { margin: 15px 0 0; color: var(--muted); font-size: 15px; }
.tour-copy ul { margin: 24px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.tour-copy li { padding: 11px 0 11px 22px; border-bottom: 1px solid var(--line); color: #c5cec9; font-size: 13px; }
.tour-copy li::before { float: left; margin-left: -21px; color: var(--lime); content: "✓"; }
.tour-window { border-radius: 16px; box-shadow: 0 28px 70px #0008; }
.tour-result-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: linear-gradient(135deg, #0a1712, #101f18); }
.tour-result { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
.tour-result > div:first-child > p:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); }
.tour-result-points { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.tour-result-points p { margin: 0; padding: 18px 0; border-bottom: 1px solid var(--line); }
.tour-result-points p:nth-child(odd) { padding-right: 24px; }
.tour-result-points p:nth-child(even) { padding-left: 24px; border-left: 1px solid var(--line); }
.tour-result-points strong, .tour-result-points span { display: block; }
.tour-result-points strong { font-size: 14px; }
.tour-result-points span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.tour-note { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: end; }
.tour-note > div { max-width: 720px; }
.tour-note > div > p:not(.eyebrow) { margin: 14px 0 0; color: var(--muted); }

/* Help */
.help-search { position: relative; max-width: 680px; margin-top: 30px; }
.help-search input { width: 100%; height: 54px; padding: 0 20px 0 48px; border: 1px solid #4a6157; border-radius: 14px; outline: 0; color: var(--ink); background: #0e1d17; }
.help-search input:focus { border-color: var(--lime); box-shadow: 0 0 0 3px #c8f46d1a; }
.help-search::before { position: absolute; top: 15px; left: 19px; color: var(--muted); font-size: 17px; content: "⌕"; }
.help-layout { display: grid; grid-template-columns: 230px 1fr; gap: 64px; }
.help-aside { align-self: start; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: #0b1713; }
.help-aside strong { display: block; font-size: 14px; }
.help-aside p { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.help-aside a { display: inline-block; margin-top: 14px; color: var(--lime); font-size: 13px; font-weight: 800; text-decoration: none; }
.help-topics { border-top: 1px solid var(--line); }
.help-topic { border-bottom: 1px solid var(--line); }
.help-topic summary { position: relative; padding: 22px 40px 22px 0; cursor: pointer; list-style: none; }
.help-topic summary::-webkit-details-marker { display: none; }
.help-topic summary::after { position: absolute; top: 21px; right: 5px; color: var(--lime); font-size: 20px; content: "+"; }
.help-topic[open] summary::after { content: "−"; }
.help-topic h3 { display: inline; margin: 0; font-size: 17px; }
.help-topic .topic-tag { margin-left: 10px; color: var(--soft); font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.help-answer { max-width: 720px; padding: 0 40px 23px 0; color: var(--muted); font-size: 14px; }
.help-answer p { margin: 0 0 10px; }
.help-answer p:last-child { margin-bottom: 0; }
.help-empty { display: none; padding: 26px 0; color: var(--muted); }
.help-empty.visible { display: block; }
.training-library { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.library-intro { display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr); gap: 72px; align-items: end; margin-bottom: 38px; }
.library-intro > p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.65; }
.storyboard-preview { margin: 0 0 38px; padding: 30px; border: 1px solid #3b5449; border-radius: 22px; background: linear-gradient(145deg, #102019 0%, #0b1713 72%); box-shadow: 0 22px 60px #0003; }
.storyboard-preview-head { display: grid; grid-template-columns: minmax(250px, .75fr) minmax(320px, 1.25fr); gap: 52px; align-items: end; margin-bottom: 24px; }
.storyboard-preview-head h3 { margin: 0; font-size: clamp(26px, 3.4vw, 38px); line-height: 1.12; }
.storyboard-preview-head > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.storyboard-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.storyboard-panel { overflow: hidden; margin: 0; border: 1px solid #354d42; border-radius: 15px; background: #0b1713; }
.storyboard-panel picture { display: block; overflow: hidden; background: #07100c; }
.storyboard-panel img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.storyboard-panel figcaption { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 2px 10px; min-height: 90px; padding: 14px 15px 16px; }
.storyboard-panel figcaption span { grid-row: 1 / 3; color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .08em; }
.storyboard-panel figcaption strong { color: #e5ece8; font-size: 14px; line-height: 1.3; }
.storyboard-panel figcaption small { color: var(--soft); font-size: 11px; line-height: 1.45; }
.lesson-filters { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto; gap: 16px; align-items: end; margin-bottom: 10px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: #0b1713; }
.lesson-filters label span { display: block; margin-bottom: 7px; color: var(--soft); font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.lesson-filters select { width: 100%; height: 43px; padding: 0 38px 0 12px; border: 1px solid #40574d; border-radius: 10px; outline: 0; color: var(--ink); background: #0e1d17; font: inherit; font-size: 14px; }
.lesson-filters select:focus { border-color: var(--lime); box-shadow: 0 0 0 3px #c8f46d1a; }
.lesson-filter-reset { min-height: 43px; padding: 0 16px; border: 1px solid #40574d; border-radius: 10px; color: #d7e0da; background: transparent; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.lesson-filter-reset:hover, .lesson-filter-reset:focus-visible { border-color: var(--lime); color: var(--lime); outline: 0; }
.lesson-filter-summary { margin: 0 0 24px; color: var(--soft); font-size: 12px; }
.lesson-module { overflow: hidden; border: 1px solid #42594f; border-radius: 20px; background: #0c1914; box-shadow: 0 20px 54px #0004; }
.lesson-module-head { display: grid; grid-template-columns: 90px 1fr auto; gap: 20px; align-items: baseline; padding: 20px 24px; border-bottom: 1px solid var(--line); background: #102019; }
.lesson-module-head span { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.lesson-module-head h3 { margin: 0; font-size: 19px; }
.lesson-module-head p { margin: 0; color: var(--soft); font-size: 12px; }
.lesson-card { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(270px, .8fr); gap: 42px; padding: 30px 32px 32px; }
.lesson-card-main h3 { margin: 16px 0 0; font-size: clamp(22px, 2.7vw, 30px); line-height: 1.16; }
.lesson-card-main > p { max-width: 630px; margin: 13px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.lesson-card-flags { display: flex; flex-wrap: wrap; gap: 8px; }
.tutorial-availability { margin-top: 18px !important; padding-top: 16px; border-top: 1px solid var(--line); color: #b8c5be !important; }
.lesson-card-flags span { padding: 6px 9px; border: 1px solid #3c554a; border-radius: 999px; color: #a9b7b0; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.lesson-card-flags .lesson-status { border-color: #72683b; color: #f1daa0; background: #2a2511; }
.lesson-card-flags .lesson-status.available { border-color: #617b3d; color: #dcf4a8; background: #1b2910; }
.lesson-card-flags .lesson-status.script-ready { border-color: #527266; color: #c7e8d8; background: #13271f; }
.lesson-card-flags .lesson-status.pending { border-color: #40534b; color: #b6c0bb; background: transparent; }
.lesson-card-meta { margin: 0; border-top: 1px solid var(--line); }
.lesson-card-meta div { display: grid; grid-template-columns: 112px 1fr; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.lesson-card-meta dt { color: var(--soft); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.lesson-card-meta dd { margin: 0; color: #cbd4cf; font-size: 12px; }
.planned-lessons { margin-top: 48px; }
.planned-lessons-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .85fr); gap: 56px; align-items: end; margin-bottom: 22px; }
.planned-lessons-head h3 { max-width: 640px; margin: 0; font-size: clamp(24px, 3vw, 32px); line-height: 1.16; }
.planned-lessons-head > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.planned-lesson-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.planned-lesson-card { display: flex; min-height: 150px; padding: 24px; border: 1px solid #385046; border-radius: 17px; background: #0c1914; flex-direction: column; }
.planned-lesson-card .planned-module { margin: 18px 0 0; color: var(--lime); font-size: 12px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.planned-lesson-card h4 { margin: 9px 0 0; font-size: 21px; line-height: 1.2; }
.planned-lesson-card > p:not(.planned-module) { margin: 12px 0 22px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.planned-lesson-card .planned-lesson-id { overflow-wrap: anywhere; color: #9eaaa4; font-size: 12px; }
.planned-lesson-card .planned-lesson-link { margin: 0 0 18px; }
.planned-lesson-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 18px; margin: auto 0 0; border-top: 1px solid var(--line); }
.planned-lesson-card dl div { padding-top: 14px; }
.planned-lesson-card dt { color: var(--soft); font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.planned-lesson-card dd { margin: 6px 0 0; color: #cbd4cf; font-size: 13px; }
.library-empty { display: none; margin: 24px 0 0; padding: 22px; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); background: #0b1713; font-size: 14px; }
.library-empty.visible { display: block; }

/* Complete lesson detail */
.lesson-hero { max-width: 880px; }
.lesson-overview { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(290px, .85fr); gap: 58px; align-items: start; }
.lesson-production { padding: 24px; border: 1px solid #72683b; border-radius: 18px; background: #211e10; }
.lesson-production .lesson-status { display: inline-block; padding: 6px 9px; border: 1px solid #8a7942; border-radius: 999px; color: #f1daa0; font-size: 10px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.lesson-production h2 { margin-top: 17px; font-size: 24px; }
.lesson-production p { margin: 10px 0 0; color: #cec6a8; font-size: 13px; line-height: 1.6; }
.lesson-facts { margin: 0; border-top: 1px solid var(--line); }
.lesson-facts div { padding: 17px 0; border-bottom: 1px solid var(--line); }
.lesson-facts dt { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.lesson-facts dd { margin: 6px 0 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.lesson-story-return { margin: 18px 0 0; font-size: 13px; }
.lesson-story-return[hidden] { display: none; }
.lesson-return-link { color: var(--lime); font-weight: 800; text-decoration: none; }
.lesson-return-link:hover, .lesson-return-link:focus-visible { text-decoration: underline; text-underline-offset: 4px; }
.lesson-player-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #08120e; }
.lesson-player-head { display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr); gap: 68px; align-items: end; margin-bottom: 30px; }
.lesson-player-head h2 { margin: 0; }
.lesson-player-head > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.lesson-player-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(290px, .7fr); gap: 24px; align-items: start; }
.lesson-player-main { min-width: 0; }
.lesson-video-frame { position: relative; overflow: hidden; border: 1px solid #40574d; border-radius: 18px; background: radial-gradient(circle at 50% 42%, #183024 0, #0d1c16 52%, #07100c 100%); box-shadow: 0 24px 70px #0006; }
.lesson-video-frame video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: transparent; }
.lesson-video-pending { display: grid; min-height: 300px; aspect-ratio: 16 / 9; place-content: center; padding: 28px; text-align: center; }
.lesson-video-pending span { color: #ecf4ef; font-size: clamp(20px, 3vw, 30px); font-weight: 750; letter-spacing: -.02em; }
.lesson-video-pending small { max-width: 430px; margin: 9px auto 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.lesson-video-frame.has-media .lesson-video-pending { display: none; }
.lesson-chapter-controls { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 13px; }
.lesson-chapter-controls p { margin: 0; color: #c4cec9; font-size: 13px; text-align: center; }
.lesson-chapter-controls button { min-height: 42px; padding: 0 14px; border: 1px solid #40574d; border-radius: 10px; color: #dce5e0; background: #0d1b15; font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.lesson-chapter-controls button:hover:not(:disabled), .lesson-chapter-controls button:focus-visible { border-color: var(--lime); color: var(--lime); outline: 0; }
.lesson-chapter-controls button:disabled { color: #68736d; cursor: not-allowed; opacity: .7; }
.lesson-chapter-nav { overflow: hidden; border: 1px solid #40574d; border-radius: 18px; background: #0b1812; }
.lesson-chapter-nav-head { padding: 20px 20px 17px; border-bottom: 1px solid var(--line); }
.lesson-chapter-nav-head > span { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.lesson-chapter-nav-head h3 { margin: 7px 0 0; font-size: 20px; }
.lesson-chapter-nav-head p { margin: 8px 0 0; color: var(--soft); font-size: 12px; line-height: 1.5; }
.lesson-chapter-nav ol { max-height: 510px; margin: 0; padding: 0; overflow-y: auto; list-style: none; }
.lesson-chapter-nav li { border-bottom: 1px solid var(--line); }
.lesson-chapter-nav li:last-child { border-bottom: 0; }
.lesson-chapter-nav a { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: baseline; padding: 14px 16px; color: #dbe4df; text-decoration: none; }
.lesson-chapter-nav a:hover, .lesson-chapter-nav a:focus-visible { background: #12251c; outline: 0; }
.lesson-chapter-nav a[aria-current="true"] { background: #183123; box-shadow: inset 3px 0 0 var(--lime); }
.lesson-chapter-nav a > span { color: var(--lime); font-size: 11px; font-weight: 850; }
.lesson-chapter-nav a > strong { font-size: 13px; line-height: 1.35; }
.lesson-chapter-nav a > small { color: var(--soft); font-size: 10px; white-space: nowrap; }
.chapters-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.chapters-head { max-width: 720px; }
.chapters-head > p:not(.eyebrow) { margin: 14px 0 0; color: var(--muted); }
.chapter-list { margin: 36px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; counter-reset: lesson-chapter; }
.chapter-list li { display: grid; grid-template-columns: 66px 1fr; gap: 24px; padding: 20px 0; border-bottom: 1px solid var(--line); counter-increment: lesson-chapter; scroll-margin-top: 26px; }
.chapter-list li.is-current { background: linear-gradient(90deg, #c8f46d0d, transparent 70%); }
.chapter-list li::before { color: var(--lime); font-size: 12px; font-weight: 850; letter-spacing: .08em; content: counter(lesson-chapter, decimal-leading-zero); }
.chapter-list h3 { margin: 0; font-size: 18px; }
.chapter-list p { margin: 7px 0 0; color: var(--soft); font-size: 13px; }
.lesson-boundary { display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; }
.lesson-boundary > div > p:not(.eyebrow) { margin: 13px 0 0; color: var(--muted); }
.lesson-boundary ul { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.lesson-boundary li { padding: 15px 0; border-bottom: 1px solid var(--line); color: #c4cec9; font-size: 13px; }
.lesson-related { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 48px; align-items: end; padding-top: 56px; padding-bottom: 56px; }
.lesson-related h2 { margin: 0; font-size: clamp(24px, 3vw, 32px); }
.lesson-related p:not(.eyebrow) { max-width: 700px; margin: 12px 0 0; color: var(--muted); }
.faq { max-width: 800px; }

/* Existing app-download route retained from the live v1.385.0 site. */
.download-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; padding-bottom: 20px; }
.download-card { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 22px; align-items: start; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); }
.download-qr { padding: 10px; border-radius: 12px; background: #fff; }
.download-qr svg { display: block; width: 100%; height: auto; }
/* An app with two doors shows two codes, and says which is which — an unlabelled pair is a
   guess somebody makes with a phone in their hand. Only Staff has both today. */
.download-qr-pair { display: grid; gap: 12px; }
.download-qr-pair figure { margin: 0; }
.download-qr-pair figcaption { margin-top: 6px; color: #444; font-size: 10px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; text-align: center; }
.download-body h2 { margin: 6px 0 0; font-size: 21px; }
.download-body > p { margin: 10px 0 0; color: var(--muted); font-size: 14px; }
.download-address { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-top: 16px !important; }
.download-address span, .download-ios span { display: inline-block; color: var(--soft); font-size: 11px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.download-address a { color: var(--lime); font-size: 14px; font-weight: 800; text-decoration: none; overflow-wrap: anywhere; }
.download-address a:hover, .download-address a:focus-visible { text-decoration: underline; }
.download-ios { margin-top: 8px !important; color: var(--soft) !important; font-size: 13px !important; }
.download-play-note { margin: 6px 0 0 !important; color: var(--soft) !important; font-size: 13px !important; }
.download-notes { padding-top: 34px; }
.download-note-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.download-note { padding: 24px; border: 1px solid var(--line-soft); border-radius: 16px; background: #0b1713; }
.download-note h3 { margin: 0; font-size: 16px; }
.download-note p { margin: 10px 0 0; color: var(--muted); font-size: 14px; }

/* About */
.statement { max-width: 850px; padding: 86px 0; }
.relief-section .statement { padding: 12px 0; }
.statement blockquote { margin: 0; font-size: clamp(29px, 4vw, 45px); font-weight: 760; line-height: 1.16; letter-spacing: -.04em; }
.statement p { max-width: 650px; margin: 25px 0 0; color: var(--muted); }
.principles { display: grid; grid-template-columns: 1fr 1fr; gap: 0 38px; border-top: 1px solid var(--line); }
.principle { padding: 27px 0 30px; border-bottom: 1px solid var(--line); }
.principle span { color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .1em; }
.principle h3 { margin: 12px 0 7px; font-size: 19px; }
.principle p { margin: 0; color: var(--muted); font-size: 14px; }
.contact-panel { display: grid; grid-template-columns: 1fr auto; gap: 36px; align-items: center; padding: 38px 0; border-top: 1px solid #405349; border-bottom: 1px solid #405349; }
.contact-panel p { margin: 10px 0 0; color: var(--muted); }

/* Invitation-only beta access */
.beta-hero { max-width: 850px; }
.beta-honesty { max-width: 720px; margin: 28px 0 0; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); font-size: 14px; }
.beta-honesty strong { color: var(--ink); }
.beta-benefits { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.benefit-lines { border-top: 1px solid var(--line); }
.benefit-lines article { display: grid; grid-template-columns: 45px 1fr; gap: 18px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.benefit-lines article > span { color: var(--lime); font-size: 12px; font-weight: 850; letter-spacing: .08em; }
.benefit-lines h3 { margin: 0; font-size: 18px; }
.benefit-lines p { max-width: 800px; margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.beta-layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 70px; align-items: start; }
.beta-process { position: sticky; top: 32px; }
.beta-process ol { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; counter-reset: beta-step; }
.beta-process li { position: relative; padding: 20px 0 20px 34px; border-bottom: 1px solid var(--line); counter-increment: beta-step; }
.beta-process li::before { position: absolute; top: 21px; left: 0; color: var(--lime); font-size: 11px; font-weight: 850; content: "0" counter(beta-step); }
.beta-process strong, .beta-process span { display: block; }
.beta-process strong { font-size: 14px; }
.beta-process span { margin-top: 5px; color: var(--muted); font-size: 12px; }
.fit-note { margin-top: 26px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #0b1713; }
.fit-note strong { display: block; color: var(--ink); font-size: 12px; }
.fit-note strong:not(:first-child) { margin-top: 16px; }
.fit-note p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.beta-form-wrap > p:not(.eyebrow) { margin: 12px 0 0; color: var(--muted); }
.beta-form { margin-top: 36px; }
.beta-form fieldset { margin: 0 0 34px; padding: 0; border: 0; }
.beta-form fieldset[hidden] { display: none; }
.beta-form legend { width: 100%; margin-bottom: 19px; padding: 0 0 10px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 15px; font-weight: 850; }
.beta-form legend:focus { outline: 0; }
.step-reason { max-width: 680px; margin: -6px 0 22px; color: var(--muted); font-size: 13px; line-height: 1.55; }
.step-reason strong { color: var(--ink); }
.wizard-progress { margin-top: 30px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 14px; background: #0b1713; }
.wizard-progress-copy { display: flex; justify-content: space-between; gap: 20px; color: var(--soft); font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.wizard-progress-copy span:last-child { color: var(--lime); }
.wizard-progress-track { height: 4px; margin-top: 12px; overflow: hidden; border-radius: 999px; background: #26382f; }
.wizard-progress-track span { display: block; width: 33.333%; height: 100%; border-radius: inherit; background: var(--lime); transition: width 180ms ease; }
.wizard-progress ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 13px 0 0; padding: 0; color: var(--soft); font-size: 10px; list-style: none; }
.wizard-progress li { white-space: nowrap; }
.wizard-progress li[aria-current="step"] { color: var(--ink); }
.wizard-actions { display: none; align-items: center; justify-content: space-between; gap: 12px; margin-top: 24px; }
.wizard-active .wizard-actions { display: flex; }
.wizard-active .plain-form-submit { display: none; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.beta-form label { display: block; margin-bottom: 18px; color: #dbe3de; font-size: 12px; font-weight: 750; }
.beta-form label > span { display: block; margin-bottom: 7px; }
.beta-form label small { color: var(--soft); font-size: 10px; font-weight: 650; }
.beta-form input:not([type="checkbox"]), .beta-form select, .beta-form textarea { width: 100%; border: 1px solid #40574d; border-radius: 10px; outline: 0; color: var(--ink); background: #0b1713; }
.beta-form input:not([type="checkbox"]), .beta-form select { height: 46px; padding: 0 13px; }
.beta-form textarea { padding: 12px 13px; resize: vertical; line-height: 1.5; }
.beta-form input:focus, .beta-form select:focus, .beta-form textarea:focus { border-color: var(--lime); box-shadow: 0 0 0 3px #c8f46d18; }
.check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; margin-bottom: 22px; border-top: 1px solid var(--line); }
.check-grid label { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding: 12px 10px 12px 0; border-bottom: 1px solid var(--line); font-weight: 650; }
.check-grid label:nth-child(even) { padding-left: 18px; border-left: 1px solid var(--line); }
.check-grid label > span, .consent-line > span { margin: 0; }
.beta-form input[type="checkbox"] { width: 17px; height: 17px; flex: 0 0 auto; margin: 1px 0 0; accent-color: var(--lime); }
.consent-line { display: flex !important; align-items: flex-start; gap: 11px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #0b1713; line-height: 1.45; }
.form-privacy { color: var(--soft); font-size: 12px; }
.form-privacy a, .request-output a, .legal-layout a { color: var(--lime); }
.request-output { margin-top: 30px; padding: 24px; border: 1px solid #5c745f; border-radius: 16px; background: #102019; }
.request-output h3 { margin: 0; }
.request-output p { color: var(--muted); font-size: 13px; }
.request-output textarea { width: 100%; padding: 12px; border: 1px solid #40574d; border-radius: 10px; color: #cbd5cf; background: #08110e; resize: vertical; font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.legal-copy { max-width: 830px; }
.legal-layout { max-width: 830px; padding-top: 12px; padding-bottom: 90px; }
.legal-layout article { padding: 28px 0; border-top: 1px solid var(--line); }
.legal-layout h2 { font-size: 23px; }
.legal-layout p { margin: 11px 0 0; color: var(--muted); }
.legal { max-width: 720px; padding-bottom: 72px; }
.legal h2 { margin-top: 36px; font-size: clamp(20px, 2vw, 24px); letter-spacing: -.02em; }
.legal p { margin: 12px 0 0; color: var(--muted); font-size: 16px; line-height: 1.65; }
.legal a { color: inherit; text-decoration: underline; }

/* Security and access */
.security-hero { max-width: 900px; }
.security-boundaries { padding: 86px 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.security-heading { align-items: end; }
.security-heading > p { max-width: 470px; margin: 0; color: var(--muted); }
.gate-list { margin: 44px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.gate-list li { display: grid; grid-template-columns: 70px 1fr; gap: 18px; padding: 25px 0; border-bottom: 1px solid var(--line); }
.gate-list li > span { padding-top: 3px; color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .1em; }
.gate-list h3 { margin: 0; font-size: 19px; }
.gate-list p { max-width: 780px; margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.security-expectations { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: start; }
.security-statement { position: sticky; top: 32px; }
.security-statement > p:not(.eyebrow) { margin: 16px 0 0; color: var(--muted); }
.promise-list { border-top: 1px solid var(--line); }
.promise-list p { display: grid; grid-template-columns: 190px 1fr; gap: 24px; margin: 0; padding: 23px 0; border-bottom: 1px solid var(--line); }
.promise-list strong { font-size: 14px; }
.promise-list span { color: var(--muted); font-size: 13px; }
.security-beta { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: linear-gradient(135deg, #0a1712, #101f18); }
.security-beta-inner { display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: end; padding-top: 76px; padding-bottom: 76px; }
.security-beta-inner > div:first-child { max-width: 700px; }
.security-beta-inner p:not(.eyebrow) { margin: 13px 0 0; color: var(--muted); }
.security-beta-inner .actions { align-items: flex-start; flex-direction: column; margin: 0; }
.security-note { max-width: 830px; }
.security-note p { margin: 13px 0 20px; color: var(--muted); }

/* Connected building */
.connected-hero { max-width: 900px; }
.connected-flow-section { padding: 58px 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.connected-flow { display: grid; grid-template-columns: 1fr 35px 1fr 35px 1fr 35px 1fr; align-items: center; }
.connected-flow > div { min-height: 165px; padding: 19px 18px; border-top: 1px solid #4b6257; border-bottom: 1px solid #4b6257; }
.connected-flow span, .connected-flow strong { display: block; }
.connected-flow span { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .1em; }
.connected-flow strong { margin-top: 15px; font-size: 17px; }
.connected-flow p { margin: 7px 0 0; color: var(--muted); font-size: 12px; }
.connected-flow i { position: relative; height: 1px; background: #4b6257; }
.connected-flow i::after { position: absolute; top: -3px; right: 0; width: 7px; height: 7px; border-top: 1px solid var(--lime); border-right: 1px solid var(--lime); transform: rotate(45deg); content: ""; }
.connected-capabilities .section-heading > p { max-width: 480px; margin: 0; color: var(--muted); }
.connected-lines { margin-top: 45px; border-top: 1px solid var(--line); }
.connected-lines article { display: grid; grid-template-columns: 120px 1fr; gap: 28px; padding: 25px 0; border-bottom: 1px solid var(--line); }
.connected-lines article > span { padding-top: 4px; color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.connected-lines h3 { margin: 0; font-size: 19px; }
.connected-lines p { max-width: 800px; margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.connected-safety { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: linear-gradient(135deg, #0a1712, #101f18); }
.connected-safety-inner { display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; padding-top: 82px; padding-bottom: 82px; }
.safety-points { border-top: 1px solid var(--line); }
.safety-points p { display: grid; grid-template-columns: 150px 1fr; gap: 22px; margin: 0; padding: 20px 0; border-bottom: 1px solid var(--line); }
.safety-points strong { font-size: 13px; }
.safety-points span { color: var(--muted); font-size: 13px; }
.connected-close { max-width: 830px; }
.connected-close > p:not(.eyebrow) { margin: 13px 0 0; color: var(--muted); }

/* Supported hardware */
.hardware-hero { max-width: 900px; }
.hardware-status-section { padding: 58px 0; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #09130f; }
.hardware-notice { display: grid; grid-template-columns: minmax(220px, .72fr) minmax(0, 1.28fr); gap: 36px; align-items: start; padding: 22px 24px; border: 1px solid #6f6738; border-radius: 16px; background: #211e10; }
.hardware-notice strong { color: #f1daa0; font-size: 17px; }
.hardware-notice p { margin: 0; color: #cec6a8; font-size: 14px; line-height: 1.65; }
.hardware-status-legend { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 20px; }
.hardware-status-legend > div { padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #0d1915; }
.hardware-status-legend p { margin: 13px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.hardware-status { display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border: 1px solid #4a6157; border-radius: 999px; color: #cad5cf; background: #102019; font-size: 10px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.hardware-status.tested { border-color: #5c7844; color: #dff2b3; background: #182610; }
.hardware-status.validation { border-color: #756b3d; color: #f1daa0; background: #292411; }
.hardware-status.planned { border-color: #425a70; color: #bcd5ec; background: #101d28; }
.hardware-category .section-head { max-width: 760px; }
.hardware-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.hardware-card { padding: 24px; border: 1px solid #385046; border-radius: 17px; background: #0c1914; }
.hardware-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.hardware-card h3 { max-width: 340px; margin: 2px 0 0; font-size: 21px; line-height: 1.2; }
.hardware-card > p { margin: 16px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.hardware-card ul { margin: 19px 0 0; padding: 17px 0 0; border-top: 1px solid var(--line); color: #cbd4cf; font-size: 13px; list-style: none; }
.hardware-card li { position: relative; padding: 6px 0 6px 17px; }
.hardware-card li::before { position: absolute; top: 13px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: var(--lime); content: ""; }
.hardware-monitoring-section { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); background: #08120e; }
.hardware-boundary { display: grid; grid-template-columns: minmax(0, .95fr) minmax(320px, 1.05fr); gap: 68px; align-items: start; }
.hardware-boundary > div > p:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); }
.hardware-checklist { padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: #0d1915; }
.hardware-checklist > strong { color: var(--ink); font-size: 16px; }
.hardware-checklist ul { margin: 16px 0 0; padding: 0; color: var(--muted); font-size: 14px; list-style: none; }
.hardware-checklist li { padding: 10px 0; border-top: 1px solid var(--line); }

/* Footer */
.site-footer { border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; background: #060d0b80; }
.footer-main { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 54px; padding: 54px 0 42px; }
.footer-brand p { max-width: 330px; margin: 14px 0 0; }
.footer-column strong { display: block; margin-bottom: 13px; color: var(--ink); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.footer-column a { display: block; width: fit-content; margin-top: 9px; text-decoration: none; }
.footer-column a:hover, .footer-column a:focus-visible { color: var(--ink); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 20px 0 34px; border-top: 1px solid var(--line-soft); color: #74837c; font-size: 12px; }

/* Private, local product guide */
.guide-launcher { position: fixed; z-index: 40; right: 24px; bottom: 22px; display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 0 16px; border: 1px solid #60786c; border-radius: 999px; color: var(--ink); background: #11231ded; box-shadow: 0 12px 38px #0008; cursor: pointer; font-weight: 800; }
.guide-launcher::before { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 10px #c8f46d99; content: ""; }
.guide-panel { position: fixed; z-index: 50; right: 24px; bottom: 78px; display: none; width: min(390px, calc(100vw - 32px)); overflow: hidden; border: 1px solid #526b60; border-radius: 18px; background: #0c1814; box-shadow: 0 28px 90px #000c; }
.guide-panel.visible { display: block; }
.guide-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 18px; border-bottom: 1px solid var(--line); background: #11221c; }
.guide-head strong { display: block; font-size: 15px; }
.guide-head span { display: block; color: var(--muted); font-size: 11px; }
.guide-close { display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 50%; color: var(--muted); background: #ffffff08; cursor: pointer; font-size: 20px; }
.guide-body { max-height: min(470px, calc(100vh - 210px)); padding: 18px; overflow-y: auto; }
.guide-message { margin: 0 0 14px; padding: 12px 13px; border-radius: 12px; color: #cad3ce; background: #13231d; font-size: 13px; }
.guide-message.user { margin-left: 35px; color: #172108; background: var(--lime); }
.guide-quick { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 15px; }
.guide-quick button { padding: 7px 10px; border: 1px solid #3e554b; border-radius: 999px; color: #c7d0cb; background: transparent; cursor: pointer; font-size: 11px; }
.guide-form { display: flex; gap: 8px; padding: 13px; border-top: 1px solid var(--line); }
.guide-form input { min-width: 0; flex: 1; height: 40px; padding: 0 12px; border: 1px solid #40574d; border-radius: 10px; outline: 0; color: var(--ink); background: #08110e; font-size: 13px; }
.guide-form input:focus { border-color: var(--lime); }
.guide-form button { min-width: 58px; border: 0; border-radius: 10px; color: var(--lime-dark); background: var(--lime); cursor: pointer; font-size: 12px; font-weight: 850; }

@keyframes route-flow { to { stroke-dashoffset: -128; } }
@keyframes grid-drift { to { background-position: 46px 92px; } }
@keyframes event-cycle { 0%, 13%, 100% { opacity: .2; transform: translateY(8px) scale(.96); } 22%, 58% { opacity: .88; transform: translateY(0) scale(1); } 70% { opacity: .25; transform: translateY(-8px) scale(.98); } }
@keyframes live-scan { 0%, 16% { transform: translateY(-120%); opacity: 0; } 24% { opacity: 1; } 67% { opacity: .65; } 76%, 100% { transform: translateY(720%); opacity: 0; } }
@keyframes window-breathe { 0%, 100% { transform: translateY(0); box-shadow: 0 32px 80px #0009, 0 0 0 9px #ffffff05; } 50% { transform: translateY(-5px); box-shadow: 0 39px 95px #000a, 0 0 0 9px #c8f46d0a; } }
@keyframes card-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

@media (max-width: 980px) {
  .hero { grid-template-columns: 1fr; gap: 44px; min-height: auto; padding: 70px 0 82px; }
  .hero-copy { max-width: 760px; }
  .hero-visual { justify-self: start; width: min(720px, 94%); }
  .service-motion { inset: -10px -20px; opacity: .6; }
  .chip-order { left: 8%; }
  .chip-kitchen { left: 60%; }
  .relief-layout, .feature-group { grid-template-columns: 1fr; gap: 38px; }
  .feature-guidance-inner { grid-template-columns: 1fr; gap: 34px; }
  .feature-guidance-action { padding: 26px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .relief-copy { position: static; }
  .workflow { grid-template-columns: 1fr 1fr; gap: 20px; padding-inline: 30px; }
  .flow-step { padding: 18px 0; border-top: 1px solid #263d33; text-align: left; }
  .flow-step:not(:last-child)::after, .flow-step:not(:last-child)::before { display: none; }
  .flow-icon { display: inline-grid; width: 46px; height: 46px; margin: 0 0 14px; border-radius: 13px; box-shadow: none; }
  .flow-step p { margin-left: 0; }
  .footer-main { grid-template-columns: 1.5fr repeat(3, 1fr); gap: 28px; }
  .tour-hero { grid-template-columns: minmax(0, 1fr) 350px; gap: 18px; }
  .tour-host-figure { min-height: 590px; margin-right: 0; margin-left: -24px; }
  .tour-stage { grid-template-columns: 1fr; gap: 38px; }
  .tour-guest-chapter { grid-template-columns: 1fr; gap: 32px; }
  .tour-guest-copy { max-width: 680px; }
  .tour-stage-reverse .tour-copy, .tour-stage-reverse .tour-window { order: initial; }
  .tour-copy { max-width: 680px; }
  .beta-layout { grid-template-columns: 260px minmax(0, 1fr); gap: 44px; }
  .download-grid, .download-note-grid { grid-template-columns: 1fr; }
  .insights-hero { grid-template-columns: 1fr; }
  .strategist-hero { width: min(680px, 100%); }
  .lesson-player-layout { grid-template-columns: 1fr; }
  .lesson-chapter-nav ol { max-height: none; }
  .storyboard-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .wrap, .testing-notice { width: min(100% - 56px, 1040px); }
  .download-card { grid-template-columns: 1fr; justify-items: start; }
  .download-qr { width: 190px; }
  .site-nav { gap: 13px; }
  .site-nav a.nav-optional { display: none; }
  h1 { font-size: clamp(34px, 9vw, 42px); }
  section { padding: 64px 0; }
  .float-card { right: -6px; bottom: -46px; width: 185px; }
  .motion-chip { display: none; }
  .service-route { opacity: .42; }
  .screen-feature, .access-strip, .feature-list, .help-layout, .contact-panel, .tour-result, .tour-note, .security-expectations, .security-beta-inner, .connected-safety-inner, .guide-intro, .guide-about, .origin-layout, .library-intro, .storyboard-preview-head, .lesson-card, .lesson-overview, .lesson-boundary, .lesson-related, .planned-lessons-head, .lesson-player-head, .beta-invite, .insight-source-layout, .insight-reading-layout, .insight-boundary, .hardware-notice, .hardware-boundary { grid-template-columns: 1fr; }
  .storyboard-preview-head { gap: 16px; }
  .origin-layout { gap: 38px; }
  .origin-copy { position: static; }
  .guide-scenes { grid-template-columns: 1fr; }
  .insights-guide { grid-template-columns: 1fr; }
  .insights-guide img { max-height: 360px; }
  .insights-guide > div { padding: 0 24px 26px; }
  .insight-source-layout, .insight-reading-layout, .insight-boundary { gap: 38px; }
  .insight-source-copy { position: static; }
  .decision-lines { grid-template-columns: 1fr; }
  .connected-flow { grid-template-columns: 1fr 1fr; gap: 20px; }
  .connected-flow i { display: none; }
  .hardware-status-legend { grid-template-columns: 1fr; }
  .hardware-grid { grid-template-columns: 1fr; }
  .beta-layout { grid-template-columns: 1fr; }
  .beta-process { position: static; }
  .security-statement { position: static; }
  .access-points, .principles { grid-template-columns: 1fr; }
  .page-hero { padding: 78px 0 66px; }
  .tour-hero { grid-template-columns: 1fr; gap: 18px; padding-top: 64px; padding-bottom: 0; }
  .tour-hero-copy { padding-bottom: 0; }
  .tour-host-figure { min-height: 540px; margin: -18px 0 0; overflow: hidden; }
  .tour-host-figure img { width: min(430px, 104vw); max-height: 620px; }
  .feature-visual { grid-template-columns: 1fr; }
  .feature-visual .window:first-child { grid-column: auto; }
  .scope-banner { grid-template-columns: 1fr; }
  .help-layout { gap: 30px; }
  .lesson-filters { grid-template-columns: 1fr 1fr; }
  .lesson-filter-reset { grid-column: 1 / -1; }
  .lesson-module-head { grid-template-columns: 1fr; gap: 4px; }
  .lesson-card { gap: 30px; padding: 25px 23px 27px; }
  .planned-lessons-head { gap: 18px; }
  .planned-lesson-grid { grid-template-columns: 1fr; }
  .lesson-player-head { gap: 18px; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { align-items: flex-start; flex-direction: column; }
  .final-cta { align-items: flex-start; flex-direction: column; }
  .tour-map { grid-template-columns: 1fr 1fr; }
  .tour-map li:nth-child(2)::after, .tour-map li:nth-child(2)::before { display: none; }
  .tour-guest-chapter { padding-top: 60px; padding-bottom: 60px; }
  .tour-guest-copy { order: -1; }
}

@media (max-width: 520px) {
  .wrap, .testing-notice { width: min(100% - 44px, 1040px); }
  .brand img { width: 25px; height: 25px; }
  .brand .od-word { font-size: 14px; }
  .site-nav a.mobile-hide { display: none; }
  .site-nav > a:first-child { display: none; }
  .hero { padding-top: 46px; }
  .lead { font-size: 17px; }
  .actions .button { width: 100%; }
  .hero-proof { display: grid; }
  .workflow-intro { padding: 26px 22px 7px; }
  .workflow { grid-template-columns: 1fr; padding: 20px; }
  .storyboard-preview { padding: 20px; }
  .storyboard-strip { grid-template-columns: 1fr; }
  .access-strip { padding-inline: 0; }
  .float-card { display: none; }
  .screen-feature { gap: 28px; }
  .footer-main { grid-template-columns: 1fr; }
  .footer-brand { grid-column: auto; }
  .guide-launcher { right: 12px; bottom: 12px; min-height: 40px; padding: 0 12px; gap: 7px; font-size: 0; }
  .guide-launcher::after { font-size: 12px; content: "Guide"; }
  .guide-panel { right: 16px; bottom: 69px; }
  .tour-map { grid-template-columns: 1fr; }
  .tour-guide-welcome > div { padding-left: 20px; }
  .tour-host-figure { min-height: 500px; margin-top: -8px; }
  .tour-host-figure img { width: min(390px, 108vw); max-height: 570px; }
  .tour-map li::after, .tour-map li::before { display: none; }
  .tour-guest-path { flex-wrap: wrap; }
  .tour-guest-path i { flex-basis: 18px; }
  .tour-result-points { grid-template-columns: 1fr; }
  .tour-result-points p:nth-child(odd), .tour-result-points p:nth-child(even) { padding-right: 0; padding-left: 0; border-left: 0; }
  .site-nav .nav-apply { padding: 8px 10px; }
  .lesson-filters { grid-template-columns: 1fr; }
  .lesson-filter-reset { grid-column: auto; }
  .planned-lesson-card dl { grid-template-columns: 1fr; }
  .lesson-video-pending { bottom: 42px; padding: 20px; }
  .lesson-video-pending small { display: none; }
  .lesson-chapter-controls { grid-template-columns: 1fr 1fr; }
  .lesson-chapter-controls p { grid-column: 1 / -1; grid-row: 1; text-align: left; }
  .lesson-chapter-nav a { grid-template-columns: 24px minmax(0, 1fr); }
  .lesson-chapter-nav a > small { grid-column: 2; }
  .form-grid, .check-grid { grid-template-columns: 1fr; }
  .promise-list p { grid-template-columns: 1fr; gap: 6px; }
  .connected-flow { grid-template-columns: 1fr; }
  .connected-flow > div { min-height: auto; }
  .hardware-card-head { flex-direction: column; }
  .safety-points p { grid-template-columns: 1fr; gap: 6px; }
  .check-grid label:nth-child(even) { padding-left: 0; border-left: 0; }
  .wizard-progress ol { display: none; }
  .wizard-actions { align-items: stretch; flex-direction: column-reverse; }
  .wizard-actions .button { width: 100%; }
  .insights-hero { padding-top: 58px; padding-bottom: 68px; }
  .signal-lines > div, .reading-path li { grid-template-columns: 1fr; gap: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button, .text-link::after, .wizard-progress-track span { transition: none; }
  .service-motion::before, .route-active, .motion-chip, .hero-visual .product-shot::after, .hero-visual > .window, .float-card { animation: none; }
  .motion-chip { opacity: .45; transform: none; }
  .hero-visual .product-shot::after, .route-signal { display: none; }
}

/* AI assistance page — status badges and the give/approve line on a feature card. */
.ai-item h3 { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.ai-badge { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); white-space: nowrap; }
.ai-badge.ai-live { border-color: rgba(200, 244, 109, .55); color: #c8f46d; }
.ai-badge.ai-setup { border-color: rgba(107, 166, 255, .5); color: #6ba6ff; }
.ai-badge.ai-soon { border-color: rgba(255, 138, 76, .45); color: #ff8a4c; }
.ai-flow { margin-top: 9px !important; font-size: 12.5px; line-height: 1.6; }
.ai-flow strong { color: var(--ink, inherit); font-weight: 600; }

/* Features page — the AI tag on a card, in the same shape as the /ai/ status badges. */
.ai-tag { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border-radius: 999px; border: 1px solid rgba(200, 244, 109, .55); color: #c8f46d; text-decoration: none; white-space: nowrap; }
.ai-tag:hover, .ai-tag:focus-visible { background: rgba(200, 244, 109, .12); }
.feature-item h3:has(.ai-tag) { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.ai-lesson { display: inline-block; margin-top: 7px; font-size: 12.5px; }

/* --- app install codes on the homepage (closed testing on Google Play) --- */
.app-qr-section { padding-top: 34px; }
.app-qr-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.app-qr-card { padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.app-qr-code { padding: 8px; border-radius: 10px; background: #fff; }
.app-qr-code svg { display: block; width: 100%; height: auto; }
.app-qr-card .eyebrow { margin-top: 14px; }
.app-qr-card h3 { margin: 4px 0 0; font-size: 16px; }
.app-qr-pkg { margin: 6px 0 0; color: var(--soft); font-size: 12px; overflow-wrap: anywhere; }
.app-qr-links { display: flex; flex-wrap: wrap; gap: 10px; margin: 10px 0 0; }
.app-qr-links a { color: var(--lime); font-size: 13px; font-weight: 800; text-decoration: none; }
.app-qr-links a:hover, .app-qr-links a:focus-visible { text-decoration: underline; }
.app-qr-foot { margin-top: 18px; color: var(--muted); font-size: 14px; }
@media (max-width: 1040px) { .app-qr-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px) { .app-qr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ── rank 1141 · one shift, start to finish ────────────────────────────────────
   A horizontal strip the reader drags or scrolls, two-up on a laptop and one-up on a
   phone. Static markup on purpose (see the note in odarius/index.html): no scripted
   frame swapping, so there is nothing that can leave a blank frame, and it reads the
   same with JavaScript off. House tokens only. */
.intro-section { padding-top: 6px; }
.shift-strip {
  display: grid; grid-auto-flow: column; grid-auto-columns: min(78%, 430px);
  gap: 16px; margin: 26px 0 14px; padding: 0 4px 14px; list-style: none;
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #3c5349 transparent;
}
.shift-strip::-webkit-scrollbar { height: 8px; }
.shift-strip::-webkit-scrollbar-thumb { border-radius: 99px; background: #3c5349; }
.shift-frame {
  display: flex; flex-direction: column; overflow: hidden; counter-increment: shift;
  border: 1px solid #3a4f46; border-radius: 18px; background: var(--panel);
  box-shadow: 0 18px 44px #00000059; scroll-snap-align: start;
}
.shift-frame img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-bottom: 1px solid #22332c; }
.shift-frame p { display: grid; gap: 6px; margin: 0; padding: 15px 17px 18px; color: #dbe5df; font-size: 14px; line-height: 1.5; }
.shift-frame p span { color: var(--lime); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.shift-frame p span::before { content: counter(shift, decimal-leading-zero) " · "; color: var(--soft); }
.shift-strip { counter-reset: shift; }
.shift-note { margin: 0; max-width: 72ch; color: var(--soft); font-size: 13px; }
@media (min-width: 1000px) { .shift-strip { grid-auto-columns: 430px; } }

/* ── rank 1141 · the comparison table ──────────────────────────────────────────
   A real table semantically (role=table/row/cell) so a screen reader reads the pairing,
   and a grid visually so the three columns collapse to stacked labelled blocks on a
   phone rather than scrolling sideways. House tokens only. */
.compare-section { padding-top: 6px; }
.compare-table { display: grid; gap: 10px; margin: 26px 0 16px; }
.compare-row { display: grid; grid-template-columns: 1fr; gap: 6px; padding: 16px 18px; border: 1px solid #2c4139; border-radius: 16px; background: var(--panel); }
.compare-row [role="rowheader"] { color: var(--lime); font-size: 11px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.compare-row [role="cell"] { color: #dbe5df; font-size: 14px; line-height: 1.55; }
.compare-row [role="cell"]:last-child { color: var(--muted); }
.compare-row [role="cell"]:nth-child(2)::before { display: block; margin-bottom: 3px; color: var(--soft); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; content: "With Odarius"; }
.compare-row [role="cell"]:nth-child(3)::before { display: block; margin-bottom: 3px; color: var(--soft); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; content: "Common in the category"; }
.compare-head { display: none; }
.compare-note { margin: 0; max-width: 78ch; padding: 15px 17px; border: 1px solid #3f4d2a; border-radius: 14px; color: #dbe5df; background: #141b0e; font-size: 13px; line-height: 1.6; }
@media (min-width: 900px) {
  .compare-table { gap: 0; border: 1px solid #2c4139; border-radius: 18px; overflow: hidden; }
  .compare-row { grid-template-columns: 0.8fr 1.35fr 1.35fr; gap: 20px; align-items: start; border: 0; border-top: 1px solid #22332c; border-radius: 0; padding: 18px 20px; background: transparent; }
  .compare-row:nth-child(odd) { background: #0b1611; }
  .compare-head { display: grid; border-top: 0; background: #12211b; }
  .compare-head [role="columnheader"] { color: var(--soft); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
  .compare-row [role="cell"]:nth-child(2)::before, .compare-row [role="cell"]:nth-child(3)::before { display: none; }
}

/* --- Dario, the access guide (rank 1135) ------------------------------------------------
   The conversation is an alternative way to fill in the form below it, so it sits above the
   form and reads as part of the same panel rather than as a separate product. */
.access-guide-offer { margin: 0 0 1.5rem; padding: 1rem 1.15rem; border: 1px solid rgba(127,127,127,.24); border-radius: 12px; }
.access-guide-offer .button { margin: 0 0 .6rem; }
.access-guide-note { font-size: .85rem; line-height: 1.5; opacity: .78; margin: 0; }
.access-guide-panel { margin: 0 0 1.75rem; padding: 1rem 1.15rem; border: 1px solid rgba(127,127,127,.28); border-radius: 12px; }
.access-guide-head { display: flex; gap: 1rem; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; margin: 0 0 .85rem; }
.access-guide-head strong { display: block; }
.access-guide-head .access-guide-note { max-width: 46ch; margin: .2rem 0 0; }
.access-guide-log { max-height: 20rem; overflow-y: auto; padding: .35rem 0; margin: 0 0 .85rem; }
.access-guide-line { display: grid; grid-template-columns: 4.5rem 1fr; gap: .75rem; margin: 0 0 .7rem; font-size: .92rem; line-height: 1.55; }
.access-guide-who { font-size: .74rem; text-transform: uppercase; letter-spacing: .04em; opacity: .6; padding-top: .22rem; }
.access-guide-compose { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; margin: 0 0 .6rem; }
.access-guide-compose input { flex: 1 1 14rem; min-width: 0; padding: .6rem .7rem; border: 1px solid rgba(127,127,127,.34); border-radius: 8px; background: rgba(127,127,127,.06); color: inherit; font: inherit; }
.access-guide-compose .button { flex: 0 0 auto; }
.access-guide-panel .access-guide-note + .access-guide-note { margin-top: .5rem; }
@media (max-width: 640px) {
  .access-guide-line { grid-template-columns: 1fr; gap: .1rem; }
  .access-guide-compose .button { flex: 1 1 auto; }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }