@charset "UTF-8";

/* EvAIOS: shared brand tokens, semantic surfaces and responsive composition. */
@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("../fonts/instrument-sans-latin.woff2") format("woff2");
}
:root {
  --navy: #10272e;
  --navy-deep: #0c1d23;
  --navy-soft: #19383f;
  --ivory: #f3f0e8;
  --paper: #eae6dd;
  --teal: #80beb5;
  --teal-dark: #2b645e;
  --gold: #c7a678;
  --warm: #dfccb0;
  --ink: #19353b;
  --muted-dark: #b0bdbd;
  --muted-light: #5e7071;
  --line-dark: rgba(243, 240, 232, .16);
  --line-light: rgba(25, 53, 59, .18);
  --page: clamp(24px, 5vw, 88px);
  --max: 1312px;
  --header: 88px;
  --ease: cubic-bezier(.2, .7, .2, 1);
  color-scheme: light;
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--navy-deep); scroll-behavior: smooth; scroll-padding-top: 110px; scrollbar-color: var(--teal-dark) var(--navy-deep); }
body { margin: 0; min-width: 0; color: var(--ivory); background: var(--navy-deep); font: 400 16px/1.65 "Instrument Sans", "Helvetica Neue", Arial, sans-serif; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body.menu-open { overflow: hidden; }
main { background: var(--ivory); }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; cursor: pointer; }
img { display: block; max-width: 100%; }
svg { display: block; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { font-weight: 500; letter-spacing: -.055em; line-height: 1.08; text-wrap: balance; }
h2 { font-size: clamp(40px, 4.7vw, 68px); }
h3 { font-size: clamp(32px, 3.1vw, 46px); }
::selection { color: var(--navy-deep); background: var(--teal); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 6px; }
.surface-ivory :focus-visible { outline-color: var(--teal-dark); }
.wrap { width: min(calc(100% - var(--page) * 2), var(--max)); margin-inline: auto; }
.section { position: relative; padding-block: clamp(84px, 8.8vw, 136px); }
.surface-ivory { background: var(--ivory); color: var(--ink); }
.eyebrow { font-size: 11px; font-weight: 600; line-height: 1.55; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow-line { width: 27px; height: 1px; background: var(--gold); display: inline-block; margin-right: 14px; vertical-align: middle; }
.section-heading h2 { margin-top: 24px; }
.section-intro { max-width: 540px; margin-top: 28px; font-size: 17px; }
.fine-label { display: block; font-size: 12px; line-height: 1.6; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 300; padding: 12px 20px; border-radius: 8px; color: var(--navy); background: var(--ivory); transform: translateY(-160%); }
.skip-link:focus { transform: none; }

/* A consistent mark, restrained wordmark and unobtrusive navigation. */
.header { position: fixed; inset: 0 0 auto; height: var(--header); padding-inline: var(--page); z-index: 100; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; transition: background .25s ease, box-shadow .25s ease; }
.header.is-scrolled, .menu-open .header { background: rgba(12, 29, 35, .96); backdrop-filter: blur(16px); box-shadow: 0 1px 0 var(--line-dark); }
.wordmark { display: inline-flex; align-items: center; gap: 10px; justify-self: start; font-size: 23px; font-weight: 600; letter-spacing: -.04em; line-height: 1; }
.wordmark img { width: 41px; height: 41px; }
.nav { display: flex; gap: 30px; }
.nav a { position: relative; padding-block: 14px; color: #d0d9d6; font-size: 13px; }
.nav a::after { position: absolute; bottom: 6px; left: 0; height: 1px; width: 100%; background: var(--gold); content: ""; transform: scaleX(0); transform-origin: left; transition: transform .25s var(--ease); }
.nav a:hover::after, .nav a.is-active::after { transform: scaleX(1); }
.header-cta { justify-self: end; padding: 12px 18px; display: flex; gap: 24px; align-items: center; border: 1px solid rgba(243, 240, 232, .24); border-radius: 30px; font-size: 12px; transition: color .2s, background .2s; }
.header-cta:hover { color: var(--navy); background: var(--ivory); }
.menu-button, .mobile-navigation { display: none; }

/* The single Eva appearance sits inside the brand's open, elliptical form. */
.hero { position: relative; isolation: isolate; overflow: clip; padding-top: var(--header); background: var(--navy-deep); }
.hero-atmosphere { position: absolute; z-index: -1; inset: 0; background: radial-gradient(ellipse at 85% 35%, rgba(70, 124, 126, .24), transparent 50%), radial-gradient(ellipse at 7% 95%, rgba(95, 129, 128, .1), transparent 50%), linear-gradient(115deg, #0c1d23, #142d34 80%); }
.hero-atmosphere::after { position: absolute; inset: 0; opacity: .11; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.2' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); content: ""; }
.hero-main { min-height: min(650px, calc(100svh - 180px)); display: grid; grid-template-columns: 1.12fr .88fr; gap: 38px; align-items: center; padding-block: 52px 64px; }
.hero-copy { position: relative; z-index: 2; padding-bottom: 12px; }
.hero-copy .eyebrow { color: #c3cdc9; font-size: 10px; }
.hero h1 { margin-top: 32px; font-size: clamp(56px, 6.3vw, 94px); line-height: 1.02; letter-spacing: -.064em; }
.hero h1 span { color: var(--teal); }
.hero-intro { max-width: 450px; margin-top: 28px; color: #c3cdca; font-size: 17px; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 30px; margin-top: 36px; }
.button { min-height: 54px; padding: 15px 25px; display: inline-flex; align-items: center; justify-content: center; gap: 32px; border: 1px solid transparent; border-radius: 50px; font-size: 13px; font-weight: 600; line-height: 1.3; transition: background .25s, transform .25s var(--ease); }
.button span { display: inline-block; font-size: 18px; transition: transform .25s var(--ease); }
.button:hover span { transform: translate(2px, -2px); }
.button:hover { transform: translateY(-2px); }
.button-ivory { background: var(--ivory); color: var(--navy); }
.button-ivory:hover { background: #fff; }
.text-link { display: inline-flex; gap: 16px; align-items: center; min-height: 48px; font-size: 12px; color: #d3d9d4; }
.text-link span { color: var(--teal); font-size: 18px; }
.hero-stage { position: relative; width: 100%; min-height: 520px; display: grid; place-items: center; }
.stage-lens { position: absolute; inset: 13px -8px 42px 9px; overflow: hidden; border-radius: 50% 50% 40% 40%; border: 1px solid rgba(145, 190, 184, .15); background: radial-gradient(ellipse at 50% 53%, rgba(92, 148, 146, .24), transparent 65%), linear-gradient(155deg, rgba(166, 202, 184, .03), rgba(4, 15, 20, .3)); box-shadow: inset 0 1px 0 rgba(231, 238, 222, .07); }
.lens-halo { position: absolute; left: 11%; right: 11%; top: 20%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(128, 190, 181, .08), transparent 70%); }
.lens-orbit { position: absolute; width: 92%; height: 45%; left: 4%; top: 31%; border-radius: 50%; border: 1px solid rgba(128, 190, 181, .17); }
.orbit-one { transform: rotate(-31deg); }
.orbit-two { transform: rotate(31deg); border-color: rgba(199, 166, 120, .12); }
.orbit-traveller { position: absolute; left: 50%; top: 50%; width: 68%; aspect-ratio: 1; margin: -34% 0 0 -34%; border-radius: 50%; animation: orbit-travel 28s linear infinite; }
.orbit-traveller::after { position: absolute; top: 6%; left: 26%; width: 5px; height: 5px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 16px rgba(199, 166, 120, .35); content: ""; }
.stage-heading { position: absolute; z-index: 3; top: 62px; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; gap: 5px; }
.stage-heading span:first-child { color: var(--gold); font-size: 10px; letter-spacing: .24em; }
.stage-heading span:last-child { color: #acbfbd; font-size: 11px; }
.hero-robot { position: relative; z-index: 4; width: 152px; margin-top: -28px; animation: eva-float 7s ease-in-out infinite; filter: drop-shadow(0 16px 17px rgba(0, 0, 0, .22)); }
.hero-robot img { width: 100%; height: auto; }
.stage-shadow { position: absolute; bottom: 149px; left: 35%; width: 30%; height: 20px; border-radius: 50%; background: radial-gradient(ellipse, rgba(0, 0, 0, .25), transparent 65%); animation: shadow-breathe 7s ease-in-out infinite; }
.quiet-status { position: absolute; bottom: 75px; left: 50%; width: max-content; max-width: 95%; display: flex; align-items: flex-start; gap: 11px; transform: translateX(-50%); }
.status-dot { flex: 0 0 auto; width: 5px; height: 5px; margin-top: 8px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 4px rgba(128, 190, 181, .06); }
.quiet-status strong { display: block; font-size: 12px; font-weight: 500; }
.quiet-status div > span { display: block; margin-top: 3px; color: #a8b8b5; font-size: 10px; }
.stage-coordinate { position: absolute; right: -5px; bottom: 20px; color: #77938f; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.hero-bottom { padding-block: 21px 33px; display: flex; justify-content: space-between; align-items: center; gap: 30px; border-top: 1px solid var(--line-dark); }
.hero-bottom > p { color: var(--gold); font-size: 12px; }
.hero-bottom > div { display: flex; gap: 42px; color: #9fb2b0; font-size: 11px; }
.hero-bottom > a { width: 36px; min-height: 44px; display: grid; place-items: center; color: var(--teal); font-size: 20px; }

/* Ivory chapters and architectural curves give the page a considered rhythm. */
.hero { padding-bottom: 86px; }
.meet { margin-top: -86px; border-radius: 86px 0 0 0; }
.meet .eyebrow { color: var(--teal-dark); }
.meet-heading { max-width: 920px; }
.meet-heading h2 { font-size: clamp(42px, 5.6vw, 80px); }
.meet-heading .section-intro { max-width: 530px; color: var(--muted-light); }
.meet-detail { margin-top: 62px; padding-top: 30px; border-top: 1px solid var(--line-light); display: grid; grid-template-columns: 1.05fr 1fr .85fr; gap: 36px; align-items: start; }
.verb-line { display: flex; flex-wrap: wrap; gap: 9px; font-size: clamp(24px, 2.7vw, 36px); font-weight: 500; letter-spacing: -.045em; line-height: 1.25; }
.verb-prefix { color: var(--ink); }
[data-verb] { color: var(--teal-dark); transition: opacity .22s, transform .22s; }
[data-verb].is-changing { opacity: 0; transform: translateY(6px); }
.verb-context { color: var(--ink); font-size: 15px; line-height: 1.7; }
.meet-aside { color: var(--muted-light); font-size: 13px; line-height: 1.8; }
.household { margin-top: 128px; display: grid; grid-template-columns: .88fr 1.12fr; gap: 80px; align-items: center; }
.household-copy h3 { margin-top: 22px; }
.household-copy > p:not(.eyebrow) { max-width: 430px; margin-top: 24px; color: var(--muted-light); font-size: 15px; }
.household-copy .fine-label { margin-top: 30px; color: var(--teal-dark); }
.household-scene { position: relative; min-height: 440px; overflow: hidden; border-radius: 130px 24px 100px 24px; background: #dce4da; border: 1px solid rgba(25, 53, 59, .05); }
.household-lines { position: absolute; inset: 15% 12%; border: 1px solid rgba(25, 53, 59, .11); border-radius: 50%; }
.household-lines span { position: absolute; inset: 12%; border: 1px solid rgba(25, 53, 59, .08); border-radius: 50%; }
.household-lines span:last-child { inset: -14%; border-color: rgba(25, 53, 59, .06); }
.household-core { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 195px; height: 195px; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; background: var(--ivory); box-shadow: 0 10px 40px rgba(25, 53, 59, .06); }
.core-glyph { font-size: 36px; line-height: 1.2; color: var(--teal-dark); }
.household-core strong { margin-top: 9px; font-size: 13px; font-weight: 500; }
.household-core small { margin-top: 4px; font-size: 10px; color: var(--muted-light); }
.person { position: absolute; display: flex; align-items: center; gap: 11px; padding: 12px 17px; border-radius: 38px; background: #f3f0e8; box-shadow: 0 3px 20px rgba(25, 53, 59, .04); }
.person-icon { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid rgba(43, 100, 94, .17); color: var(--teal-dark); border-radius: 50%; font-size: 10px; }
.person strong { display: block; font-size: 11px; font-weight: 600; line-height: 1.5; }
.person small { display: block; color: var(--muted-light); font-size: 9px; }
.person-you { top: 16%; left: 9%; }
.person-home { top: 18%; right: 6%; }
.person-family { bottom: 16%; left: 7%; }
.person-work { bottom: 14%; right: 10%; }

/* Three scenes, each with a different visual language and no repeated mascot. */
.stories { background: var(--navy-deep); color: var(--ivory); border-radius: 0 86px 0 86px; }
.story-heading { display: grid; grid-template-columns: 1.25fr .75fr; column-gap: 90px; }
.story-heading .eyebrow { grid-column: 1 / -1; color: var(--gold); }
.story-heading .section-intro { align-self: end; color: var(--muted-dark); margin-top: 24px; font-size: 15px; }
.story { display: grid; grid-template-columns: .88fr 1.12fr; gap: 85px; align-items: center; margin-top: 104px; }
.story + .story { margin-top: 112px; }
.story-family { grid-template-columns: 1.12fr .88fr; }
.story-family .story-copy { order: 2; }
.story-family .story-visual { order: 1; }
.story-label { color: var(--teal); font-size: 10px; display: flex; gap: 10px; align-items: center; }
.chapter-dot { display: block; width: 4px; height: 4px; border-radius: 50%; background: var(--gold); }
.story h3 { margin-top: 24px; font-size: clamp(32px, 3.4vw, 49px); }
.story-copy > p:not(.eyebrow) { margin-top: 26px; color: var(--muted-dark); font-size: 14px; max-width: 390px; }
.story-principle { display: block; margin-top: 31px; padding-top: 18px; border-top: 1px solid var(--line-dark); font-size: 11px; color: #c7d3ce; }
.story-visual { position: relative; min-height: 438px; overflow: hidden; isolation: isolate; border-radius: 28px; }
.scene-caption { position: absolute; z-index: 4; top: 26px; left: 28px; right: 28px; display: flex; justify-content: space-between; gap: 20px; font-size: 8px; letter-spacing: .11em; color: #aac0b9; }
.home-visual { border-radius: 120px 24px 24px 24px; background: #203d3d; }
.home-visual .scene-caption { left: 88px; }
.room { position: absolute; inset: 0; overflow: hidden; background: radial-gradient(ellipse at 80% 50%, rgba(222, 188, 139, .12), transparent 53%), linear-gradient(125deg, #203a3b 35%, #314c45); }
.room-window { position: absolute; top: 20%; left: 21%; width: 32%; height: 49%; border-radius: 80px 80px 0 0; border: 7px solid #5b7066; background: linear-gradient(165deg, #244450, #122d35 68%); box-shadow: 12px 10px 50px rgba(1, 11, 15, .17), inset 0 0 0 2px rgba(222, 220, 196, .12); }
.room-window::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 3px; background: #5b7066; }
.room-window::after { content: ""; position: absolute; top: 49%; width: 100%; height: 3px; background: #5b7066; }
.room-window i { position: absolute; top: 18%; left: 22%; width: 6px; height: 6px; border-radius: 50%; background: #d4c9a7; box-shadow: 0 0 24px rgba(212, 201, 167, .35); }
.room-lamp { position: absolute; right: 16%; top: 31%; width: 58px; height: 47px; background: #ccaf79; border-radius: 48% 48% 7% 7%; box-shadow: 0 28px 75px rgba(216, 173, 108, .19); }
.room-lamp::before { content: ""; position: absolute; left: 27px; top: 47px; width: 3px; height: 88px; background: #b0a181; }
.room-lamp::after { content: ""; position: absolute; bottom: -89px; left: 4px; height: 4px; width: 51px; background: #b0a181; border-radius: 100%; }
.room-table { position: absolute; top: 61%; right: 5%; width: 41%; height: 11px; background: #8f795d; border-radius: 50%; box-shadow: 0 8px 1px #5b4e3d; }
.room-table::after { content: ""; position: absolute; top: 14px; left: 32%; width: 5px; height: 79px; background: #736047; }
.room-floor { position: absolute; top: 71%; width: 140%; height: 65%; left: -10%; background: linear-gradient(180deg, #31433b, #23352e); transform: skewY(-9deg); border-top: 1px solid rgba(226, 224, 203, .13); z-index: -1; }
.home-notice { position: absolute; z-index: 5; right: 7%; bottom: 28px; left: 7%; display: flex; align-items: flex-start; gap: 15px; padding: 19px 20px; border-radius: 16px; background: rgba(243, 240, 232, .97); color: var(--ink); box-shadow: 0 12px 38px rgba(1, 11, 15, .12); }
.notice-icon { flex: 0 0 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--teal-dark); background: #e3e9df; }
.notice-icon svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linejoin: round; }
.home-notice small { display: block; font-size: 8px; color: var(--teal-dark); letter-spacing: .08em; margin-bottom: 4px; }
.home-notice strong { display: block; font-size: 12px; font-weight: 500; }
.home-notice p { margin-top: 4px; color: var(--muted-light); font-size: 10px; }
.family-visual { border-radius: 24px 110px 24px 24px; background: #1d343d; padding: 77px 28px 55px; }
.conversation { display: flex; flex-direction: column; gap: 15px; }
.message { max-width: 85%; padding: 16px 18px; border: 1px solid rgba(128, 190, 181, .12); border-radius: 16px 16px 16px 3px; background: #29464c; font-size: 12px; line-height: 1.65; }
.message-name { display: block; margin-bottom: 5px; color: var(--teal); font-size: 10px; font-weight: 600; }
.human-message { margin-left: auto; border-radius: 16px 16px 3px 16px; background: #d2dacc; border-color: transparent; color: var(--ink); max-width: 72%; }
.scene-footnote { position: absolute; bottom: 23px; left: 30px; color: #9eb2ae; font-size: 10px; display: flex; align-items: center; gap: 8px; }
.scene-footnote span { color: var(--gold); font-size: 16px; }
.life-visual { border-radius: 24px 24px 110px 24px; background: linear-gradient(145deg, #314944, #1a3338); }
.life-orbit { position: absolute; top: 15%; bottom: 15%; left: 14%; right: 14%; border: 1px solid rgba(221, 221, 188, .13); border-radius: 50%; }
.life-orbit::before { position: absolute; inset: 17%; border: 1px solid rgba(221, 221, 188, .12); border-radius: 50%; content: ""; }
.life-core { position: absolute; top: 50%; left: 50%; width: 172px; height: 172px; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: translate(-50%, -50%); background: #28464a; border: 1px solid rgba(128, 190, 181, .28); border-radius: 50%; box-shadow: 0 0 50px rgba(128, 190, 181, .04); }
.life-core > span { font-size: 7px; letter-spacing: .1em; color: var(--gold); }
.life-core strong { margin-top: 10px; font-size: 25px; font-weight: 400; letter-spacing: -.04em; }
.life-core small { font-size: 9px; margin-top: 5px; color: #b2c4bd; }
.life-node { position: absolute; min-width: 85px; padding: 7px 13px; border-radius: 40px; background: rgba(215, 225, 204, .08); border: 1px solid rgba(215, 225, 204, .15); text-align: center; font-size: 10px; color: #d4dfd5; }
.node-plan { top: 24%; left: 12%; }
.node-money { top: 24%; right: 12%; }
.node-case { top: 49%; left: 6%; }
.node-code { top: 49%; right: 6%; }
.node-repair { bottom: 20%; left: 13%; }
.node-drive { bottom: 20%; right: 13%; }
.illustration-note { margin-top: 51px; max-width: 650px; color: #829d99; font-size: 11px; }
[data-scene] .message, [data-scene] .home-notice { transition: opacity .7s ease, translate .9s var(--ease); }
.has-scenes [data-scene]:not(.in-view) .message, .has-scenes [data-scene]:not(.in-view) .home-notice { opacity: 0; translate: 0 14px; }
.message:nth-child(2) { transition-delay: .15s; }
.message:nth-child(3) { transition-delay: .3s; }

/* Inclusion and capability content use an editorial, accessible layout. */
.inclusion-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; }
.inclusion .eyebrow { color: var(--teal-dark); }
.inclusion h2 { margin-top: 24px; font-size: clamp(44px, 5.4vw, 76px); }
.inclusion-copy > p:last-child { margin-top: 28px; max-width: 450px; color: var(--muted-light); font-size: 15px; }
.inclusion-detail { padding-top: 37px; }
.inclusion-statement { font-size: clamp(29px, 3.3vw, 46px); font-weight: 500; line-height: 1.2; letter-spacing: -.05em; }
.inclusion-statement em { color: var(--teal-dark); font-style: normal; }
.principle-list { padding: 0; margin: 34px 0 24px; list-style: none; }
.principle-list li { padding: 13px 0 13px 23px; position: relative; border-bottom: 1px solid var(--line-light); font-size: 13px; }
.principle-list li::before { position: absolute; top: 24px; left: 0; width: 5px; height: 5px; background: var(--teal-dark); border-radius: 50%; content: ""; }
.inclusion-detail .fine-label { color: var(--muted-light); font-size: 10px; }
.platform { padding-top: 0; }
.platform .wrap { padding-top: 56px; border-top: 1px solid var(--line-light); }
.platform-heading .eyebrow { color: var(--teal-dark); margin-bottom: 24px; }
.platform h2 { font-size: clamp(35px, 4vw, 58px); max-width: 910px; }
.capability-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 38px; margin-top: 54px; }
.capability-group { border-top: 1px solid var(--line-light); }
.capability-group summary { padding-top: 24px; cursor: pointer; list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.capability-group summary::-webkit-details-marker { display: none; }
.capability-number { color: var(--teal-dark); font-size: 10px; }
.capability-group h3 { font-size: 23px; letter-spacing: -.035em; }
.details-toggle { margin-left: auto; font-size: 23px; line-height: 1; font-weight: 400; color: var(--teal-dark); transition: rotate .25s; }
.capability-group[open] .details-toggle { rotate: 45deg; }
.capability-content { padding-top: 21px; }
.capability-content > p { font-size: 12px; color: var(--muted-light); }
.capability-content ul { list-style: none; padding: 0; margin: 16px 0 0; }
.capability-content li { margin-top: 8px; font-size: 13px; }
.platform-note { max-width: 600px; margin-top: 45px; font-size: 11px; color: var(--muted-light); }

/* Trust is communicated in words and structure, without invented badges. */
.trust { background: var(--navy); color: var(--ivory); border-radius: 86px 0 0 0; }
.trust-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 104px; align-items: start; }
.trust .eyebrow { color: var(--gold); }
.trust h2 { margin-top: 25px; font-size: clamp(43px, 5.3vw, 76px); }
.trust h2 span { color: var(--teal); }
.trust-heading > p:last-of-type { max-width: 380px; margin-top: 30px; color: var(--muted-dark); font-size: 14px; }
.trust-seal { position: relative; width: 110px; height: 110px; margin-top: 38px; display: grid; place-items: center; }
.trust-seal > span { position: absolute; inset: 0; border: 1px solid rgba(128, 190, 181, .2); border-radius: 50%; }
.trust-seal > span::after { position: absolute; inset: 8px; border: 1px solid rgba(128, 190, 181, .08); border-radius: 50%; content: ""; }
.trust-seal svg { width: 41px; height: 48px; fill: none; stroke: var(--teal); stroke-width: 1.2; }
.trust-principles { margin: 42px 0 0; }
.trust-principles > div { padding: 25px 0; border-top: 1px solid var(--line-dark); }
.trust-principles > div:last-child { border-bottom: 1px solid var(--line-dark); }
.trust-principles dt { display: flex; align-items: center; gap: 20px; font-size: 21px; line-height: 1.3; letter-spacing: -.025em; }
.trust-principles dt span { color: var(--gold); font-size: 10px; letter-spacing: 0; }
.trust-principles dd { padding-left: 33px; margin: 13px 0 0; color: var(--muted-dark); font-size: 13px; }

/* An honest roadmap and a warm invitation close the story. */
.trust { padding-bottom: calc(clamp(84px, 8.8vw, 136px) + 86px); }
.reality { margin-top: -86px; border-radius: 0 86px 0 0; }
.reality .eyebrow { color: var(--teal-dark); }
.reality h2 { margin-top: 24px; }
.reality .section-intro { color: var(--muted-light); }
.build-path { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 50px; padding: 0; margin: 68px 0 0; list-style: none; }
.build-path li { position: relative; padding-top: 24px; border-top: 1px solid var(--line-light); }
.build-state { display: flex; gap: 10px; align-items: center; color: var(--teal-dark); font-size: 10px; }
.build-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--teal-dark); }
.build-path li:nth-child(2) .build-dot { background: var(--gold); }
.build-path li:nth-child(3) .build-dot { background: none; border: 1px solid var(--muted-light); }
.build-path h3 { margin-top: 22px; font-size: 29px; line-height: 1.17; }
.build-path p { margin-top: 20px; color: var(--muted-light); font-size: 13px; }
.reality-note { color: var(--muted-light); font-size: 11px; margin-top: 44px; }
.collaborate { background: var(--ivory); padding-top: 0; padding-bottom: 74px; color: var(--ink); }
.collaborate-panel { isolation: isolate; position: relative; overflow: hidden; min-height: 540px; padding: 88px 84px; border-radius: 150px 28px 150px 28px; background: var(--warm); }
.collaborate-arc { position: absolute; z-index: -1; width: 780px; height: 780px; right: -410px; top: -240px; border: 1px solid rgba(25, 53, 59, .15); border-radius: 50%; transform: rotate(-15deg); }
.collaborate-arc::before, .collaborate-arc::after { position: absolute; inset: 55px; border: 1px solid rgba(25, 53, 59, .1); border-radius: 50%; content: ""; }
.collaborate-arc::after { inset: 110px; }
.collaborate .eyebrow { color: #536458; }
.collaborate h2 { margin-top: 25px; max-width: 780px; font-size: clamp(42px, 5.1vw, 73px); }
.collaborate-panel > p:not(.eyebrow) { max-width: 495px; margin-top: 25px; font-size: 15px; color: #50635e; }
.button-dark { margin-top: 34px; background: var(--navy); color: var(--ivory); }
.button-dark:hover { background: var(--teal-dark); }
.collaborate-note { display: block; max-width: 510px; margin-top: 25px; font-size: 10px; color: #5d6b61; }
.footer { background: var(--navy-deep); padding-block: 57px 25px; }
.footer-main { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px; align-items: center; }
.footer-main > p { font-size: 12px; color: var(--muted-dark); text-align: center; }
.footer-contact { justify-self: end; display: flex; align-items: center; gap: 20px; font-size: 12px; min-height: 44px; }
.footer-contact span { color: var(--gold); }
.footer-bottom { margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--line-dark); display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px; align-items: center; color: #90a7a2; font-size: 10px; }
.footer-bottom > span:last-child { text-align: right; }
.motion-control { display: flex; justify-self: center; align-items: center; min-height: 44px; gap: 6px; padding: 5px 10px; background: none; border: 0; font-size: 10px; }
.motion-control[hidden] { display: none; }
.motion-indicator { width: 20px; height: 11px; border: 1px solid #6d8880; border-radius: 10px; margin-left: 6px; }
.motion-indicator::after { width: 5px; height: 5px; margin: 2px 0 0 11px; background: var(--teal); border-radius: 50%; display: block; content: ""; transition: margin .2s; }
.motion-control[aria-pressed="false"] .motion-indicator::after { margin-left: 2px; background: #82938b; }
.has-reveals [data-reveal] { opacity: 0; translate: 0 18px; transition: opacity .65s ease, translate .8s var(--ease); }
.has-reveals [data-reveal].in-view { opacity: 1; translate: 0 0; }

/* All decorative motion has both user and operating-system opt-outs. */
@keyframes eva-float { 0%, 100% { transform: translateY(-6px) rotate(-.7deg); } 50% { transform: translateY(6px) rotate(.7deg); } }
@keyframes orbit-travel { to { transform: rotate(360deg); } }
@keyframes shadow-breathe { 50% { transform: scaleX(.78); opacity: .6; } }
html[data-motion="off"] *, html[data-motion="off"] *::before, html[data-motion="off"] *::after { animation: none; transition: none; }
html[data-motion="off"] { scroll-behavior: auto; }
html[data-motion="off"] [data-reveal], html[data-motion="off"] [data-scene] .message, html[data-motion="off"] [data-scene] .home-notice { opacity: 1; translate: 0 0; }
html[data-page-hidden] .hero-robot, html[data-page-hidden] .orbit-traveller, html[data-page-hidden] .stage-shadow { animation-play-state: paused; }

/* Tablet is designed deliberately rather than left between two breakpoints. */
@media (max-width: 1100px) {
  :root { --page: 40px; --header: 80px; }
  .header { grid-template-columns: 1fr auto; }
  .nav, .header-cta { display: none; }
  .menu-button { justify-self: end; display: grid; place-content: center; gap: 6px; width: 46px; height: 46px; background: transparent; border: 1px solid var(--line-dark); border-radius: 50%; }
  .menu-button span { width: 17px; height: 1px; background: var(--ivory); transition: transform .25s; }
  .menu-button[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-button[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .mobile-navigation { position: fixed; inset: 0; z-index: 90; padding: calc(var(--header) + 40px) var(--page) 40px; display: flex; flex-direction: column; justify-content: center; background: var(--navy-deep); color: var(--ivory); }
  .mobile-navigation[hidden] { display: none; }
  .mobile-navigation > .eyebrow { color: var(--gold); margin-bottom: 28px; font-size: 9px; }
  .mobile-navigation > a { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 16px; border-bottom: 1px solid var(--line-dark); font-size: clamp(24px, 4vw, 42px); font-weight: 400; letter-spacing: -.04em; }
  .mobile-navigation > a span { font-size: 20px; color: var(--teal); }
  .menu-note { margin-top: 30px; font-size: 11px; color: var(--muted-dark); }
  .hero-main { gap: 10px; grid-template-columns: 1.1fr .9fr; min-height: 650px; }
  .hero h1 { font-size: clamp(53px, 6.8vw, 77px); }
  .hero-intro { font-size: 15px; }
  .hero-actions { gap: 18px; flex-wrap: wrap; }
  .hero-stage { min-height: 460px; }
  .hero-robot { width: 124px; }
  .stage-lens { inset: 28px -5px 35px 0; }
  .stage-heading { top: 72px; }
  .quiet-status { bottom: 72px; }
  .stage-shadow { bottom: 143px; }
  .household, .story { gap: 44px; }
  .household { grid-template-columns: .9fr 1.1fr; }
  .household-scene { min-height: 420px; border-radius: 92px 20px 80px 20px; }
  .household-core { width: 162px; height: 162px; }
  .person { padding: 10px 12px; gap: 8px; }
  .person-you { left: 4%; top: 14%; }
  .person-home { right: 4%; top: 25%; }
  .person-family { left: 4%; bottom: 24%; }
  .person-work { right: 4%; bottom: 13%; }
  .story-heading { column-gap: 40px; }
  .story-visual { min-height: 410px; }
  .family-visual { padding-inline: 23px; }
  .message { max-width: 94%; font-size: 11px; }
  .scene-caption { left: 23px; right: 23px; font-size: 7px; }
  .home-visual .scene-caption { left: 70px; }
  .life-core { width: 145px; height: 145px; }
  .life-node { min-width: 64px; font-size: 9px; padding: 6px 10px; }
  .node-case { left: 2%; }
  .node-code { right: 2%; }
  .inclusion-grid, .trust-grid { gap: 55px; }
  .capability-groups { gap: 25px; }
  .capability-group h3 { font-size: 20px; }
  .capability-group summary { gap: 9px; }
  .build-path { gap: 32px; }
  .build-path h3 { font-size: 26px; }
  .collaborate-panel { padding: 72px 64px; }
}

/* Compact devices get their own hierarchy, scene scale and reading pace. */
@media (max-width: 760px) {
  :root { --page: 26px; --header: 74px; }
  html { scroll-padding-top: 93px; }
  .section { padding-block: 76px; }
  .wordmark { font-size: 21px; gap: 7px; }
  .wordmark img { width: 36px; height: 36px; }
  .menu-button { width: 44px; height: 44px; }
  .hero-main { min-height: auto; grid-template-columns: 1fr; padding-top: 42px; padding-bottom: 25px; gap: 28px; }
  .hero-copy { padding-bottom: 0; }
  .hero-copy .eyebrow { font-size: 8px; letter-spacing: .11em; }
  .eyebrow-line { width: 18px; margin-right: 8px; }
  .hero h1 { font-size: clamp(48px, 10.8vw, 78px); line-height: 1.04; margin-top: 24px; }
  .hero-intro { font-size: 15px; margin-top: 22px; max-width: 460px; }
  .hero-actions { gap: 22px; margin-top: 27px; }
  .button { min-height: 49px; font-size: 12px; padding: 13px 21px; gap: 26px; }
  .text-link { font-size: 11px; gap: 10px; }
  .hero-stage { min-height: 310px; width: min(100%, 430px); margin-inline: auto; }
  .stage-lens { inset: 0 8px 5px; border-radius: 48% 48% 34% 34%; }
  .stage-heading { top: 36px; gap: 3px; }
  .stage-heading span:first-child { font-size: 8px; }
  .stage-heading span:last-child { font-size: 9px; }
  .hero-robot { width: 100px; margin-top: -20px; }
  .quiet-status { bottom: 40px; }
  .quiet-status strong { font-size: 11px; }
  .quiet-status div > span { font-size: 9px; }
  .stage-shadow { bottom: 99px; }
  .stage-coordinate { display: none; }
  .hero-bottom { padding-top: 19px; padding-bottom: 26px; gap: 14px; }
  .hero-bottom > p { font-size: 10px; }
  .hero-bottom > div { gap: 18px; font-size: 9px; }
  .hero-bottom > div span:last-child { display: none; }
  .hero-bottom > a { width: 25px; font-size: 17px; }
  .hero { padding-bottom: 55px; }
  .meet { margin-top: -55px; }
  .meet, .trust { border-top-left-radius: 55px; }
  .meet-heading h2 { font-size: clamp(35px, 7.7vw, 57px); }
  .meet-heading h2 br { display: none; }
  .section-heading h2 { margin-top: 20px; }
  .eyebrow { font-size: 9px; }
  .section-intro { font-size: 15px; margin-top: 23px; }
  .meet-detail { grid-template-columns: 1fr; gap: 18px; margin-top: 36px; padding-top: 24px; }
  .verb-line { font-size: 28px; }
  .verb-context { font-size: 14px; max-width: 340px; }
  .meet-aside { font-size: 12px; max-width: 420px; margin-top: 5px; }
  .household { margin-top: 72px; grid-template-columns: 1fr; gap: 34px; }
  .household-copy h3 { font-size: 35px; margin-top: 19px; }
  .household-copy > p:not(.eyebrow) { font-size: 15px; margin-top: 20px; }
  .household-copy .fine-label { font-size: 10px; margin-top: 21px; }
  .household-scene { min-height: 382px; border-radius: 78px 20px 68px 20px; }
  .household-core { width: 151px; height: 151px; }
  .household-core strong { font-size: 11px; }
  .household-core small { font-size: 8px; }
  .core-glyph { font-size: 30px; }
  .person { padding: 9px 11px; gap: 8px; }
  .person-icon { width: 27px; height: 27px; font-size: 9px; }
  .person strong { font-size: 10px; }
  .person small { font-size: 8px; }
  .person-you { top: 12%; left: 6%; }
  .person-home { top: 27%; right: 4%; }
  .person-family { bottom: 24%; left: 4%; }
  .person-work { bottom: 10%; right: 9%; }
  .stories { border-top-right-radius: 55px; border-bottom-left-radius: 55px; }
  .story-heading { display: block; }
  .story-heading h2 { font-size: 43px; }
  .story-heading .section-intro { font-size: 15px; max-width: 440px; }
  .story, .story-family { grid-template-columns: 1fr; gap: 32px; margin-top: 65px; }
  .story + .story { margin-top: 70px; padding-top: 38px; border-top: 1px solid var(--line-dark); }
  .story-family .story-copy, .story-family .story-visual { order: initial; }
  .story h3 { font-size: 35px; margin-top: 19px; }
  .story-copy > p:not(.eyebrow) { font-size: 15px; margin-top: 20px; max-width: 430px; }
  .story-principle { margin-top: 23px; padding-top: 16px; font-size: 10px; }
  .story-visual { min-height: 371px; }
  .home-visual { border-top-left-radius: 90px; }
  .home-notice { left: 6%; right: 6%; bottom: 22px; padding: 16px; gap: 11px; }
  .home-notice strong { font-size: 11px; }
  .home-notice p { font-size: 9px; }
  .home-notice small { font-size: 7px; }
  .room-window { top: 19%; left: 17%; width: 34%; height: 48%; }
  .room-lamp { right: 15%; width: 51px; height: 41px; }
  .family-visual { border-top-right-radius: 83px; padding-top: 67px; padding-bottom: 58px; }
  .scene-caption { top: 23px; left: 22px; right: 22px; font-size: 7px; }
  .home-visual .scene-caption { left: 69px; }
  .message { font-size: 11px; padding: 14px 16px; }
  .life-visual { border-bottom-right-radius: 86px; }
  .life-core { width: 140px; height: 140px; }
  .life-core strong { font-size: 23px; }
  .life-core small { font-size: 8px; }
  .life-core > span { font-size: 6px; }
  .life-node { padding: 6px 9px; font-size: 9px; min-width: 67px; }
  .node-plan, .node-money { top: 21%; }
  .node-plan { left: 7%; }
  .node-money { right: 7%; }
  .node-case { left: 2%; }
  .node-code { right: 2%; }
  .node-repair, .node-drive { bottom: 17%; }
  .node-repair { left: 8%; }
  .node-drive { right: 8%; }
  .illustration-note { margin-top: 29px; font-size: 10px; line-height: 1.7; }
  .inclusion-grid, .trust-grid { grid-template-columns: 1fr; gap: 35px; }
  .inclusion h2 { font-size: 47px; }
  .inclusion-copy > p:last-child { font-size: 15px; margin-top: 23px; }
  .inclusion-detail { padding-top: 0; }
  .inclusion-statement { font-size: 32px; }
  .principle-list { margin-top: 25px; }
  .principle-list li { font-size: 12px; padding-block: 12px; }
  .platform { padding-top: 0; }
  .platform .wrap { padding-top: 38px; }
  .platform h2 { font-size: 33px; line-height: 1.13; }
  .platform h2 br { display: none; }
  .capability-groups { grid-template-columns: 1fr; gap: 18px; margin-top: 36px; }
  .capability-group summary { min-height: 64px; padding-top: 14px; padding-bottom: 14px; gap: 14px; }
  .capability-group h3 { font-size: 22px; }
  .capability-number { font-size: 9px; }
  .capability-content { padding: 0 0 10px 30px; }
  .capability-content > p { font-size: 12px; }
  .capability-content li { font-size: 14px; }
  .platform-note { margin-top: 27px; font-size: 10px; }
  .trust h2 { font-size: 47px; }
  .trust-heading > p:last-of-type { font-size: 15px; margin-top: 24px; }
  .trust-seal { width: 80px; height: 80px; margin-top: 27px; }
  .trust-seal svg { width: 30px; height: 35px; }
  .trust-principles { margin-top: 0; }
  .trust-principles > div { padding: 22px 0; }
  .trust-principles dt { font-size: 20px; }
  .trust-principles dd { font-size: 12px; padding-left: 31px; }
  .trust { padding-bottom: 131px; }
  .reality { margin-top: -55px; border-top-right-radius: 55px; }
  .reality h2 { font-size: 42px; }
  .build-path { grid-template-columns: 1fr; gap: 31px; margin-top: 41px; }
  .build-path h3 { font-size: 27px; margin-top: 18px; }
  .build-path h3 br { display: none; }
  .build-path p { font-size: 14px; max-width: 420px; margin-top: 17px; }
  .reality-note { font-size: 10px; margin-top: 27px; }
  .collaborate { padding-top: 0; padding-bottom: 43px; }
  .collaborate-panel { min-height: auto; padding: 60px 29px 54px; border-radius: 70px 18px 70px 18px; }
  .collaborate h2 { font-size: clamp(33px, 8.2vw, 47px); margin-top: 24px; }
  .collaborate-panel > p:not(.eyebrow) { font-size: 14px; margin-top: 22px; }
  .collaborate .eyebrow { font-size: 8px; }
  .collaborate-arc { right: -615px; top: -170px; }
  .button-dark { margin-top: 28px; gap: 22px; }
  .collaborate-note { font-size: 9px; }
  .footer { padding-block: 36px 20px; }
  .footer-main { grid-template-columns: 1fr; gap: 19px; }
  .footer-main > p { text-align: left; font-size: 11px; }
  .footer-contact { justify-self: start; font-size: 11px; }
  .footer-bottom { grid-template-columns: 1fr auto; gap: 12px; margin-top: 25px; font-size: 8px; }
  .footer-bottom > span:last-child { grid-column: 1; text-align: left; }
  .motion-control { grid-column: 2; grid-row: 1 / 3; font-size: 9px; justify-self: end; }
}
@media (max-width: 374px) {
  :root { --page: 22px; }
  .hero h1 { font-size: 45px; }
  .hero-actions { gap: 13px; }
  .text-link { font-size: 10px; }
  .button { padding-inline: 18px; gap: 20px; }
  .hero-stage { min-height: 320px; }
  .hero-robot { width: 93px; }
  .quiet-status strong { font-size: 10px; }
  .quiet-status div > span { font-size: 8px; }
  .story-visual { min-height: 350px; }
  .life-node { min-width: 60px; font-size: 8px; }
  .life-core { width: 121px; height: 121px; }
  .life-core strong { font-size: 21px; }
  .life-core small { font-size: 7px; }
  .family-visual { padding-inline: 17px; }
  .message { font-size: 10px; padding: 13px 14px; }
  .collaborate-panel { padding-inline: 25px; }
  .collaborate h2 { font-size: 31px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none; transition: none; }
  .has-reveals [data-reveal], .has-scenes [data-scene] .message, .has-scenes [data-scene] .home-notice { opacity: 1; translate: 0 0; }
}
@media (forced-colors: active) {
  .button, .menu-button, .person, .home-notice, .message, .life-core { border: 1px solid CanvasText; }
  .hero-robot { filter: none; }
}