:root {
  color-scheme: light;
  --ink: #070709;
  --ink-soft: #1d1d1f;
  --paper: #f5f5f7;
  --white: #ffffff;
  --muted: #68686d;
  --line: #d9d9de;
  --cyan: #64e4e8;
  --cyan-deep: #0a8f97;
  --cyan-pale: #dffafb;
  --radius-xl: 3rem;
  --radius-lg: 2rem;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI Variable", "Helvetica Neue", Arial, sans-serif;
}

* { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  scrollbar-color: #74747a #070709;
}
html.is-scrolled { scrollbar-color: #74747a #ffffff; }
html::-webkit-scrollbar { width: 12px; }
html::-webkit-scrollbar-track { background: #070709; transition: background .3s ease; }
html.is-scrolled::-webkit-scrollbar-track { background: #ffffff; }
html::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: #74747a; background-clip: padding-box; }
section[id] { scroll-margin-top: 4.5rem; }
body {
  margin: 0;
  overflow-x: clip;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font);
  font-size: 1rem;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body:has(.mobile-nav[open]) { overflow: hidden; }
img { display: block; max-width: 100%; }
button, input { font: inherit; }
a { color: inherit; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--cyan-deep); outline-offset: 4px; }

.skip-link {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 1000;
  padding: .7rem 1rem;
  border-radius: 999px;
  background: var(--ink);
  color: white;
  font-weight: 700;
  transform: translateY(-160%);
  transition: transform .2s ease;
}
.skip-link:focus { transform: translateY(0); }

.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;
}

.section-shell {
  width: min(1240px, calc(100% - 3rem));
  margin-inline: auto;
}

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  background: rgba(7, 7, 9, .82);
  backdrop-filter: saturate(180%) blur(20px);
  transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.site-header.is-scrolled { border-bottom-color: rgba(0,0,0,.08); background: rgba(255,255,255,.94); box-shadow: 0 8px 30px rgba(0,0,0,.06); }

.nav-shell {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: min(1320px, calc(100% - 3rem));
  height: 4.5rem;
  margin-inline: auto;
}

.brand {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  width: max-content;
  color: white;
  font-size: calc(1.03rem * 1.15);
  font-weight: 760;
  letter-spacing: -.025em;
  text-decoration: none;
}

.brand small { color: #8f8f96; font-size: .84em; font-weight: 560; }
.site-header.is-scrolled .brand { color: var(--ink); }
.site-header.is-scrolled .brand small { color: #6f6f75; }
.desktop-nav { display: flex; align-items: center; gap: 2.1rem; }
.desktop-nav a { color: #b5b5bc; font-size: .84rem; font-weight: 600; text-decoration: none; }
.desktop-nav a:hover { color: white; }
.site-header.is-scrolled .desktop-nav a { color: #505057; }
.site-header.is-scrolled .desktop-nav a:hover { color: var(--ink); }
.nav-cta {
  justify-self: end;
  padding: .55rem .9rem;
  border-radius: 999px;
  background: var(--cyan);
  color: var(--ink);
  font-size: .78rem;
  font-weight: 700;
  text-decoration: none;
}
.mobile-nav { display: none; }
.site-header.is-scrolled .nav-cta { background: var(--ink); color: white; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.25rem;
  padding: .78rem 1.35rem;
  border: 1px solid transparent;
  border-radius: 999px;
  cursor: pointer;
  font-weight: 720;
  text-decoration: none;
  transition: transform .25s ease, background .25s ease, color .25s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--ink); color: white; }
.button-primary:hover { background: #26262a; }
.text-link { font-weight: 700; text-underline-offset: .3rem; }

.hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
  align-items: center;
  min-height: 100svh;
  padding: 8.5rem max(4vw, 2rem) 5rem;
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 76% 48%, rgba(100, 228, 232, .16), transparent 31%),
    linear-gradient(135deg, #070709 0%, #101216 100%);
}

.hero-copy { position: relative; z-index: 2; max-width: 760px; }
.kicker {
  margin: 0 0 1.7rem;
  color: #96969d;
  font-size: .8rem;
  font-weight: 760;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.kicker span { color: var(--cyan-deep); }
.hero h1 {
  margin: 0;
  font-size: clamp(3.4rem, 6.5vw, 7.2rem);
  font-weight: 720;
  letter-spacing: -.078em;
  line-height: .86;
  text-wrap: balance;
}
.hero-lede {
  max-width: 590px;
  margin: 2.1rem 0 0;
  color: #aaaab2;
  font-size: clamp(1.1rem, 1.7vw, 1.42rem);
  line-height: 1.47;
}
.hero-actions { display: flex; align-items: center; gap: 1.3rem; margin-top: 2rem; }
.hero .button-primary { background: var(--cyan); color: var(--ink); }
.hero .button-primary:hover { background: #98f1f3; }
.hero .text-link { color: white; }
.hero-stage {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(520px, calc(100svh - 14rem), 680px);
  perspective: 1500px;
  isolation: isolate;
}
.hero-glow {
  position: absolute;
  width: min(48vw, 660px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(100, 228, 232, .38), rgba(100, 228, 232, .05) 47%, transparent 68%);
  filter: blur(12px);
}
.hero-lock {
  position: relative;
  z-index: 1;
  width: min(54vw, 780px);
  max-height: 76svh;
  object-fit: contain;
  filter: drop-shadow(0 45px 55px rgba(0, 0, 0, .16));
  transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, -7deg)) translateZ(0);
  transform-style: preserve-3d;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), opacity .24s ease;
  will-change: transform;
}
.model-switcher {
  position: absolute;
  left: 1rem;
  top: calc(50% + min(11vw, 200px));
  z-index: 4;
  display: grid;
  grid-template-columns: auto minmax(5.8rem, auto) auto;
  align-items: center;
  gap: .45rem;
  padding: .45rem;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 999px;
  background: rgba(17,17,20,.72);
  box-shadow: 0 15px 45px rgba(0,0,0,.3);
  backdrop-filter: blur(14px);
}
.model-switcher button { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.1); color: white; cursor: pointer; font-size: 1.4rem; line-height: 1; }
.model-switcher button:hover, .model-switcher button:focus-visible { background: white; color: var(--ink); }
.model-switcher p { margin: 0; text-align: center; }
.model-switcher small, .model-switcher strong { display: block; }
.model-switcher small { color: #8f8f96; font-size: .56rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.model-switcher strong { margin-top: .08rem; color: white; font-size: .8rem; letter-spacing: -.02em; }
.finish-picker {
  position: absolute;
  right: 1rem;
  top: calc(50% + min(11vw, 200px));
  z-index: 3;
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .65rem .8rem;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  background: rgba(17, 17, 20, .72);
  box-shadow: 0 15px 45px rgba(0, 0, 0, .3);
  backdrop-filter: blur(14px);
}
.finish-picker > span { margin-right: .15rem; color: #aaaab2; font-size: .72rem; font-weight: 700; }
.hero-finish-options { display: flex; align-items: center; gap: .65rem; }
.finish-dot {
  width: 1.45rem;
  height: 1.45rem;
  padding: 0;
  border: 2px solid white;
  border-radius: 50%;
  background: linear-gradient(135deg, white, #a7a7aa);
  box-shadow: 0 0 0 1px #b3b3b7;
  cursor: pointer;
}
.finish-dot-grey { background: linear-gradient(135deg, #bfc2c5 0 46%, #303236 47% 100%); box-shadow: 0 0 0 1px #606369; }
.finish-dot-silver { background: linear-gradient(135deg, #f5f5f6, #8d8f94); box-shadow: 0 0 0 1px #a7a8ac; }
.finish-dot-gold { background: linear-gradient(135deg, #f1d58c, #a87722); box-shadow: 0 0 0 1px #8a611d; }
.finish-dot-black { background: #343437; box-shadow: 0 0 0 1px #111; }
.finish-dot.is-active { box-shadow: 0 0 0 2px var(--cyan-deep), inset 0 0 0 1px white; }
.hero-disclaimer {
  position: absolute;
  right: 1.8rem;
  bottom: 1rem;
  z-index: 2;
  max-width: 540px;
  margin: 0;
  color: #85858c;
  font-size: .7rem;
  text-align: right;
}

.scroll-story {
  position: relative;
  height: 300vh;
  background: var(--ink);
  color: white;
}
.story-sticky {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  isolation: isolate;
}
.story-sticky::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(circle at 50% 50%, rgba(100, 228, 232, .16), transparent 30%),
    linear-gradient(#070709, #0d1013);
}
.story-orbit {
  position: absolute;
  top: 50%; left: 50%;
  width: min(74vw, 940px);
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(var(--orbit-scale, .78));
  box-shadow: 0 0 0 8vw rgba(255, 255, 255, .015), 0 0 0 17vw rgba(255, 255, 255, .012);
  opacity: var(--orbit-opacity, .65);
}
.story-keypad {
  position: absolute;
  top: 50%; left: 50%;
  z-index: 1;
  width: min(24vw, 310px);
  aspect-ratio: 325 / 565;
  transform: translate(-50%, -50%) scale(var(--keypad-scale, .92));
  transform-origin: center;
  filter: drop-shadow(0 42px 46px rgba(0, 0, 0, .58));
  will-change: transform;
}
.story-keypad img { position: relative; z-index: 2; width: 100%; height: 100%; object-fit: contain; }
.keypad-aura { position: absolute; z-index: 0; inset: -24%; border-radius: 48%; background: radial-gradient(circle, rgba(100,228,232,var(--keypad-glow,.18)), rgba(100,228,232,.035) 48%, transparent 70%); filter: blur(14px); }
.keypad-pulse { position: absolute; z-index: 3; top: 3%; left: 50%; width: 38%; aspect-ratio: 1; border: 1px solid rgba(100,228,232,.72); border-radius: 50%; opacity: var(--pulse-opacity, .8); transform: translateX(-50%) scale(var(--pulse-scale, .9)); box-shadow: 0 0 28px rgba(100,228,232,.3), inset 0 0 20px rgba(100,228,232,.08); transition: opacity .45s ease; }
.keypad-scan { position: absolute; z-index: 4; top: calc(9% + var(--scan-y, 0) * 69%); left: 23%; width: 54%; height: 1px; background: linear-gradient(90deg, transparent, rgba(100,228,232,.92), transparent); box-shadow: 0 0 12px rgba(100,228,232,.7); opacity: var(--scan-opacity, .15); }
.story-device-status { position: absolute; left: 50%; top: calc(100% + 1.15rem); z-index: 4; width: max-content; margin: 0; padding: .5rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(15,16,19,.72); color: #a9a9b0; font-size: .64rem; font-weight: 760; letter-spacing: .08em; text-transform: uppercase; transform: translateX(-50%); backdrop-filter: blur(12px); transition: color .35s ease, border-color .35s ease;
}
.scroll-story[data-story-step="0"] .story-device-status { color: var(--cyan); border-color: rgba(100,228,232,.32); }
.scroll-story[data-story-step="1"] .keypad-pulse { opacity: .2; }
.scroll-story[data-story-step="1"] .keypad-scan { opacity: .9; }
.scroll-story[data-story-step="2"] .keypad-pulse { opacity: .45; }
.scroll-story[data-story-step="2"] .story-device-status { color: #d5d5da; }
.scroll-story[data-story-step="2"] .keypad-aura { opacity: .68; }
.story-chapter {
  position: absolute;
  top: 50%;
  left: max(4vw, 2rem);
  z-index: 2;
  width: min(430px, 36vw);
  opacity: 0;
  transform: translate3d(0, calc(-50% + 25px), 0);
  transition: opacity .55s ease, transform .55s ease;
  pointer-events: none;
}
.story-chapter-right { right: max(4vw, 2rem); left: auto; text-align: right; }
.story-chapter.is-active { opacity: 1; transform: translate3d(0, -50%, 0); }
.story-index { display: block; margin-bottom: 1rem; color: var(--cyan); font-size: .75rem; font-weight: 800; letter-spacing: .16em; }
.story-chapter h2 { margin: 0; font-size: clamp(2rem, 3.44vw, 4.16rem); font-weight: 650; letter-spacing: -.062em; line-height: .92; }
.story-chapter p { margin: 1.4rem 0 0; color: #a6a6ad; font-size: 1.02rem; line-height: 1.6; }

.section-heading { padding: clamp(7rem, 12vw, 11rem) 0 clamp(3.5rem, 7vw, 6rem); }
.eyebrow {
  margin: 0 0 1rem;
  color: var(--cyan-deep);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.eyebrow-light { color: var(--cyan); }
.section-heading h2,
.design-copy h2,
.app-copy h2,
.simulator-heading h2,
.status-heading h2,
.faq-heading h2,
.updates h2 {
  max-width: 940px;
  margin: 0;
  font-size: clamp(2.4rem, 5.36vw, 5.76rem);
  font-weight: 680;
  letter-spacing: -.072em;
  line-height: .91;
  text-wrap: balance;
}

.fingerprint-section {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 105svh;
  overflow: hidden;
  background: var(--ink);
  color: white;
}
.fingerprint-visual {
  position: absolute;
  inset: 0 48% 0 0;
  overflow: hidden;
}
.fingerprint-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 68%, var(--ink) 100%);
}
.fingerprint-visual img { width: 100%; height: 100%; object-fit: cover; object-position: 58% center; transform: scale(1.025); }
.fingerprint-rings { position: absolute; top: 11%; left: 55%; z-index: 2; width: 7rem; aspect-ratio: 1; transform: translate(-50%, -50%); }
.fingerprint-rings span { position: absolute; inset: 0; border: 1px solid rgba(100,228,232,.8); border-radius: 50%; animation: fingerprint-pulse 2.8s ease-out infinite; }
.fingerprint-rings span:nth-child(2) { animation-delay: .75s; }
.fingerprint-rings span:nth-child(3) { animation-delay: 1.5s; }
@keyframes fingerprint-pulse { 0% { opacity: 0; transform: scale(.24); } 20% { opacity: 1; } 100% { opacity: 0; transform: scale(1.4); } }
.fingerprint-copy { position: relative; z-index: 3; padding-block: clamp(8rem, 14vw, 13rem); padding-left: min(54vw, 730px); }
.fingerprint-copy h2,
.guest-copy h2,
.privacy-inner h2,
.bind-heading h2 {
  margin: 0;
  font-size: clamp(2.72rem, 5.76vw, 6.4rem);
  font-weight: 680;
  letter-spacing: -.075em;
  line-height: .88;
  text-wrap: balance;
}
.fingerprint-lede { max-width: 570px; margin: 2.2rem 0 0; color: #aaaab2; font-size: clamp(1.15rem, 2vw, 1.5rem); line-height: 1.45; }
.fingerprint-proof { max-width: 570px; margin: 3.2rem 0 0; padding-top: 1.4rem; border-top: 1px solid rgba(255,255,255,.16); color: #8f8f96; font-size: 1rem; }
.fingerprint-proof strong { display: block; margin-bottom: .45rem; color: white; font-size: 1.35rem; letter-spacing: -.025em; }

.guest-section { padding: clamp(8rem, 14vw, 13rem) 0 0; overflow: hidden; background: #0b0b0d; color: white; }
.guest-layout { display: grid; grid-template-columns: minmax(0, .95fr) minmax(390px, .75fr); gap: clamp(4rem, 10vw, 10rem); align-items: center; }
.guest-section .eyebrow { color: var(--cyan); }
.guest-copy h2 { max-width: 760px; font-size: clamp(2.8rem, 4.8vw, 5.6rem); }
.guest-copy > p:not(.eyebrow) { max-width: 600px; margin: 2rem 0 0; color: #aaaab2; font-size: clamp(1.05rem, 1.7vw, 1.28rem); }
.no-permanent-code { display: grid; grid-template-columns: auto 1fr; gap: 1rem; max-width: 600px; margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid rgba(255,255,255,.16); }
.no-permanent-code > span { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #ffeded; color: #ad2028; font-size: 1.25rem; font-weight: 700; }
.no-permanent-code p { margin: 0; color: #aaaab2; }
.no-permanent-code strong { color: white; }
.guest-demo { padding: clamp(1.25rem, 3vw, 2.4rem); border: 1px solid #e0e1e4; border-radius: 2.8rem; background: #f5f5f7; box-shadow: 0 45px 100px rgba(0,0,0,.12); }
.message-time { margin-bottom: 1.3rem; color: #8b8b90; font-size: .72rem; text-align: center; }
.message { width: 82%; margin-top: .8rem; padding: .9rem 1rem; border-radius: 1.25rem 1.25rem 1.25rem .35rem; background: white; box-shadow: 0 4px 18px rgba(0,0,0,.04); }
.message span { color: #85858c; font-size: .68rem; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.message p { margin: .25rem 0 0; line-height: 1.42; }
.message-out { margin-left: auto; border-radius: 1.25rem 1.25rem .35rem 1.25rem; background: var(--cyan); }
.message-small { width: 76%; font-size: .86rem; }
.guest-code-ticket { margin: 1.1rem 0; overflow: hidden; border-radius: 1.5rem; background: var(--ink); color: white; box-shadow: 0 22px 42px rgba(0,0,0,.18); }
.guest-code-ticket > div { padding: 1.4rem 1.5rem 1.1rem; }
.guest-code-ticket span { display: block; color: var(--cyan); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.guest-code-ticket strong { display: block; margin-top: .45rem; font-size: clamp(2rem, 4vw, 3.36rem); letter-spacing: .1em; line-height: 1; }
.guest-code-ticket dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border-top: 1px solid rgba(255,255,255,.13); }
.guest-code-ticket dl div { padding: .85rem 1.5rem; }
.guest-code-ticket dl div + div { border-left: 1px solid rgba(255,255,255,.13); }
.guest-code-ticket dt { color: #8f8f96; font-size: .66rem; text-transform: uppercase; }
.guest-code-ticket dd { margin: .15rem 0 0; font-weight: 750; }
.single-use-statement { display: flex; justify-content: space-between; gap: 2rem; margin-top: clamp(7rem, 12vw, 11rem); padding-bottom: clamp(7rem, 12vw, 11rem); border-top: 1px solid rgba(255,255,255,.16); }
.single-use-statement p { margin: 0; padding-top: 2.2rem; font-size: clamp(2.4rem, 5.6vw, 6.8rem); font-weight: 680; letter-spacing: -.075em; line-height: .9; }
.single-use-statement p:last-child { color: #73737a; text-align: right; }

.privacy-section { position: relative; min-height: 100svh; overflow: hidden; padding: clamp(8rem, 14vw, 13rem) 0; background: var(--ink); color: white; }
.privacy-glow { position: absolute; top: 8%; right: -12%; width: 58vw; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(100,228,232,.22), transparent 64%); filter: blur(16px); }
.privacy-inner { position: relative; z-index: 1; }
.privacy-inner h2 { max-width: 1050px; }
.privacy-lede { max-width: 650px; margin: 2rem 0 0; color: #aaaab2; font-size: clamp(1.12rem, 1.9vw, 1.42rem); }
.privacy-list { margin-top: clamp(5rem, 9vw, 8rem); border-top: 1px solid rgba(255,255,255,.16); }
.privacy-list > div { display: grid; grid-template-columns: 4.5rem minmax(210px,.7fr) 1.3fr; gap: 2rem; align-items: baseline; padding: 1.7rem 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.privacy-list span { color: var(--cyan); font-size: .72rem; font-weight: 800; letter-spacing: .12em; }
.privacy-list h3 { margin: 0; font-size: clamp(1.36rem, 2.4vw, 2.72rem); font-weight: 620; letter-spacing: -.05em; }
.privacy-list p { max-width: 630px; margin: 0; color: #98989f; font-size: 1rem; }

.bind-section { padding: clamp(8rem, 14vw, 13rem) 0; overflow: hidden; background: #eef0f2; }
.bind-heading { max-width: 1000px; }
.bind-heading > p:last-child { margin: 2rem 0 0; color: var(--muted); font-size: 1.2rem; }
.bind-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.5rem, 3vw, 3rem); margin-top: clamp(5rem, 9vw, 8rem); }
.bind-step-copy { min-height: 190px; padding-top: 1.2rem; border-top: 1px solid #c9ccd0; }
.bind-step-copy > span { color: var(--cyan-deep); font-size: .72rem; font-weight: 800; letter-spacing: .12em; }
.bind-step-copy h3 { margin: .8rem 0 .55rem; font-size: clamp(1.44rem, 2.4vw, 2.4rem); font-weight: 650; letter-spacing: -.05em; line-height: 1; }
.bind-step-copy p { max-width: 390px; margin: 0; color: var(--muted); }
.bind-screen { position: relative; display: flex; flex-direction: column; width: 100%; min-height: 610px; padding: 1.1rem 1.1rem 1.4rem; overflow: hidden; border: 7px solid #171719; border-radius: 2.7rem; background: #fafafa; box-shadow: 0 32px 70px rgba(0,0,0,.16); }
.screen-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; color: #5d5d63; font-size: .65rem; }
.screen-bar span:last-child { text-align: right; }
.screen-notch { width: 5.2rem; height: 1.25rem; border-radius: 999px; background: #171719; }
.screen-brand { display: flex; align-items: center; gap: .65rem; padding: 1.2rem .15rem; }
.screen-empty { display: grid; place-items: center; margin: auto 0; text-align: center; }
.screen-lock-icon { position: relative; display: block; width: 5.2rem; height: 5.2rem; border: 1px solid #d9dadd; border-radius: 50%; background: white; }
.screen-lock-icon::before { content: ""; position: absolute; top: 2.35rem; left: 50%; width: 1.8rem; height: 1.5rem; border: 2px solid var(--ink); border-radius: .4rem; transform: translateX(-50%); }
.screen-lock-icon::after { content: ""; position: absolute; top: 1.3rem; left: 50%; width: 1.1rem; height: 1.25rem; border: 2px solid var(--ink); border-bottom: 0; border-radius: 1rem 1rem 0 0; transform: translateX(-50%); }
.screen-empty h4, .screen-title h4 { margin: 1.35rem 0 .35rem; font-size: 1.7rem; letter-spacing: -.05em; line-height: 1; }
.screen-empty p { margin: 0; color: #88888e; font-size: .82rem; }
.bind-screen button { width: 100%; min-height: 3.2rem; margin-top: auto; border: 0; border-radius: 999px; background: var(--ink); color: white; font-weight: 750; opacity: 1; }
.screen-title { padding: 2.4rem .3rem 0; }
.screen-title small { color: var(--cyan-deep); font-weight: 750; }
.screen-title h4 { margin-top: .45rem; font-size: 2rem; }
.search-radar { position: relative; display: grid; place-items: center; width: 13rem; aspect-ratio: 1; margin: 2.8rem auto; border: 1px solid #ccebed; border-radius: 50%; box-shadow: 0 0 0 2rem rgba(100,228,232,.08), 0 0 0 4rem rgba(100,228,232,.04); }
.search-radar span { width: 1rem; height: 1rem; border-radius: 50%; background: var(--cyan-deep); box-shadow: 0 0 0 .6rem rgba(100,228,232,.25); }
.found-lock { display: grid; grid-template-columns: auto 1fr auto; gap: .7rem; align-items: center; margin-top: auto; padding: .85rem; border-radius: 1.15rem; background: white; box-shadow: 0 10px 35px rgba(0,0,0,.08); }
.found-icon { position: relative; display: block; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: var(--ink); }
.found-icon::before { content: ""; position: absolute; top: .95rem; left: 50%; width: .85rem; height: .75rem; border: 2px solid var(--cyan); border-radius: .25rem; transform: translateX(-50%); }
.found-icon::after { content: ""; position: absolute; top: .48rem; left: 50%; width: .5rem; height: .6rem; border: 2px solid var(--cyan); border-bottom: 0; border-radius: .6rem .6rem 0 0; transform: translateX(-50%); }
.found-lock strong, .found-lock small { display: block; }
.found-lock strong { font-size: .78rem; }
.found-lock small { color: #85858b; font-size: .66rem; }
.found-lock b { color: var(--cyan-deep); font-size: .66rem; }
.screen-field { display: block; margin-top: 3rem; padding: 1rem; border: 1px solid #d6d6da; border-radius: 1rem; background: white; }
.screen-field span { display: block; color: #85858b; font-size: .68rem; }
.screen-field strong { display: block; margin-top: .35rem; font-size: 1.05rem; }
.privacy-inline { display: flex; align-items: center; gap: .7rem; margin-top: 1rem; padding: .8rem; border-radius: 1rem; background: var(--cyan-pale); color: #08747b; }
.privacy-inline span { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--cyan-deep); color: white; font-size: .7rem; }
.privacy-inline p { margin: 0; font-size: .72rem; font-weight: 700; }

.app-story {
  overflow: hidden;
  background: var(--ink);
  color: white;
}
.app-layout {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(380px, 1.08fr);
  gap: clamp(3rem, 9vw, 9rem);
  align-items: center;
  min-height: 100svh;
  padding-block: clamp(7rem, 12vw, 11rem);
}
.app-copy p:not(.eyebrow) { max-width: 600px; margin: 2rem 0 0; color: #b3b3ba; font-size: clamp(1.05rem, 1.7vw, 1.28rem); }
.app-copy .evidence-note { color: #74747c; font-size: .86rem; }
.phone-wrap { display: grid; place-items: center; perspective: 1400px; }
.phone {
  position: relative;
  width: min(390px, 88vw);
  min-height: 720px;
  padding: 1.3rem 1.2rem 1.4rem;
  border: 9px solid #242426;
  border-radius: 3.4rem;
  background: #f4f5f7;
  color: var(--ink);
  box-shadow: 0 55px 110px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(255, 255, 255, .3);
  transform: rotateY(-8deg) rotateX(2deg);
}
.phone::before { content: ""; position: absolute; top: .55rem; left: 50%; width: 7rem; height: 1.65rem; border-radius: 999px; background: #171719; transform: translateX(-50%); }
.phone-top { display: flex; justify-content: space-between; padding: .3rem .45rem 1.3rem; font-size: .68rem; font-weight: 700; }
.phone-header { display: grid; grid-template-columns: 1fr auto; gap: .7rem; align-items: center; padding: .65rem .25rem 1.15rem; }
.phone-header button { border: 0; background: transparent; color: #777; font-size: 1.35rem; }
.lock-card { padding: 1.2rem; border-radius: 1.7rem; background: white; box-shadow: 0 16px 40px rgba(0, 0, 0, .08); }
.lock-card-head { display: flex; justify-content: space-between; gap: 1rem; }
.lock-card-head h3 { margin: .25rem 0 0; font-size: 1.4rem; letter-spacing: -.035em; }
.lock-card-head small { color: #777; }
.status-dot { display: inline-block; width: .48rem; height: .48rem; margin-right: .3rem; border-radius: 50%; background: var(--cyan-deep); box-shadow: 0 0 0 4px rgba(100, 228, 232, .18); }
.battery-label { align-self: start; padding: .35rem .6rem; border-radius: 999px; background: var(--cyan-pale); color: #08747b; font-size: .66rem; font-weight: 800; }
.unlock-preview {
  display: grid;
  place-items: center;
  width: 10.5rem;
  aspect-ratio: 1;
  margin: 1.5rem auto;
  border: 0;
  border-radius: 50%;
  background: var(--ink);
  color: white;
  cursor: pointer;
  box-shadow: 0 0 0 12px #edfafa, 0 0 0 13px #c4f1f2;
  transition: transform .2s ease, background .2s ease;
}
.unlock-preview:hover { transform: scale(1.025); }
.unlock-preview.is-unlocked { background: #087d83; }
.unlock-preview strong { margin-top: .3rem; font-size: .83rem; }
.unlock-preview small { color: #aeb3b6; font-size: .62rem; }
.unlock-ring { width: 2rem; height: 2.4rem; border: 2px solid var(--cyan); border-radius: 1rem 1rem .45rem .45rem; }
.unlock-preview.is-unlocked .unlock-ring { height: 1.8rem; border-top-color: transparent; transform: translateY(.2rem) rotate(-8deg); }
.app-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; border-top: 1px solid #e6e6e8; padding-top: .9rem; color: #666; font-size: .68rem; text-align: center; }
.lock-row { display: grid; grid-template-columns: auto 1fr auto; gap: .8rem; align-items: center; margin-top: .75rem; padding: .85rem 1rem; border-radius: 1.2rem; background: white; }
.lock-row-icon { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: .8rem; background: #edf1f2; color: #6b7376; font-size: .78rem; font-weight: 800; }
.lock-row strong, .lock-row small { display: block; }
.lock-row strong { font-size: .8rem; }
.lock-row small { color: #888; font-size: .63rem; }
.phone-caption { margin: 1rem 0 0; color: #999; font-size: .63rem; text-align: center; }

.design-section {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(3rem, 8vw, 8rem);
  align-items: center;
  padding-block: clamp(8rem, 14vw, 13rem);
}
.design-image { overflow: hidden; border-radius: var(--radius-xl); background: radial-gradient(circle at 55% 45%, rgba(100,228,232,.18), transparent 42%), #101114; }
.design-image img { width: 100%; aspect-ratio: 1; padding: clamp(1.5rem, 5vw, 4.5rem); object-fit: contain; filter: drop-shadow(0 34px 36px rgba(0,0,0,.35)); transition: transform 1s cubic-bezier(.2, .8, .2, 1); }
.design-image:hover img { transform: scale(1.025); }
.design-copy > p:not(.eyebrow, .source-note) { max-width: 580px; color: var(--muted); font-size: 1.13rem; }
.spec-list { margin: 2.4rem 0 0; border-top: 1px solid var(--line); }
.spec-list > div { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; padding: 1.05rem 0; border-bottom: 1px solid var(--line); }
.spec-list dt { color: var(--muted); }
.spec-list dd { margin: 0; font-weight: 680; text-align: right; }
.source-note { margin-top: 1.2rem; color: #8b8b90; font-size: .75rem; }

.finish-section { padding: 1.25rem; background: var(--ink); color: white; }
.finish-section .section-heading { padding-inline: max(1.25rem, calc((100vw - 1240px) / 2)); }
.finish-section .eyebrow { color: var(--cyan); }
.finish-stage {
  position: relative;
  display: grid;
  place-items: center;
  min-height: min(900px, 88svh);
  overflow: hidden;
  border-radius: var(--radius-xl);
  background: #111316;
}
.finish-backdrop { position: absolute; width: min(74vw, 840px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(100,228,232,.16), rgba(255,255,255,.05) 52%, transparent 69%); }
.finish-product { position: relative; z-index: 1; width: min(66vw, 820px); max-height: 72svh; object-fit: contain; filter: drop-shadow(0 55px 55px rgba(0,0,0,.18)); transition: opacity .22s ease, transform .6s cubic-bezier(.2,.8,.2,1); }
.finish-stage:hover .finish-product { transform: translateY(-8px) scale(1.012); }
.finish-control { position: absolute; bottom: 2rem; z-index: 2; display: flex; gap: .45rem; padding: .5rem; border-radius: 999px; background: rgba(255,255,255,.82); box-shadow: 0 15px 40px rgba(0,0,0,.1); backdrop-filter: blur(16px); }
.finish-control button { display: flex; align-items: center; gap: .5rem; padding: .6rem .85rem; border: 0; border-radius: 999px; background: transparent; color: #727278; cursor: pointer; font-size: .8rem; font-weight: 700; }
.finish-control button.is-active { background: var(--ink); color: white; }
.swatch { width: 1rem; height: 1rem; border: 1px solid #aaa; border-radius: 50%; }
.swatch-silver { background: linear-gradient(135deg, white, #aaa); }
.swatch-black { background: #2f2f32; border-color: #111; }

.simulator-section {
  padding: clamp(8rem, 13vw, 12rem) 0;
  overflow: hidden;
  background: #09090b;
  color: white;
}
.simulator-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr); column-gap: 4rem; align-items: end; }
.simulator-heading .eyebrow { grid-column: 1 / -1; }
.simulator-heading h2 { max-width: 880px; }
.simulator-heading > p:last-child { max-width: 560px; margin: 0 0 .35rem; color: #9a9aa1; font-size: 1.06rem; }
.simulator-layout { display: grid; grid-template-columns: minmax(280px, 340px) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; margin-top: clamp(3.5rem, 7vw, 6rem); }
.simulator-controls { padding: 1.1rem; border: 1px solid rgba(255,255,255,.1); border-radius: 2rem; background: #111113; box-shadow: 0 26px 70px rgba(0,0,0,.3); }
.simulator-group { min-width: 0; margin: 0; padding: 0; border: 0; }
.simulator-group + .simulator-group { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.1); }
.simulator-group legend { margin-bottom: .8rem; color: #a4a4aa; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.simulator-models { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.simulator-model { min-width: 0; padding: .55rem; border: 1px solid rgba(255,255,255,.08); border-radius: 1.15rem; background: #1a1a1d; color: white; cursor: pointer; text-align: left; transition: border-color .25s ease, background .25s ease, transform .25s ease; }
.simulator-model:hover { transform: translateY(-2px); border-color: rgba(100,228,232,.45); }
.simulator-model.is-active { border-color: var(--cyan); background: #202428; box-shadow: inset 0 0 0 1px rgba(100,228,232,.18); }
.simulator-thumb { display: grid; place-items: center; aspect-ratio: 1.32; overflow: hidden; border-radius: .8rem; background: radial-gradient(circle at 50% 45%, #35383d, #09090a 72%); }
.simulator-thumb img { width: 108%; height: 108%; object-fit: contain; filter: drop-shadow(0 8px 12px rgba(0,0,0,.45)); }
.simulator-model > span:last-child { display: block; padding: .65rem .2rem .15rem; }
.simulator-model strong, .simulator-model small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.simulator-model strong { font-size: .78rem; }
.simulator-model small { margin-top: .1rem; color: #85858c; font-size: .62rem; }
.simulator-colors { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.simulator-colors button { display: flex; align-items: center; gap: .42rem; min-width: 0; padding: .55rem .45rem; border: 1px solid rgba(255,255,255,.09); border-radius: .8rem; background: transparent; color: #aaaab0; cursor: pointer; font-size: .68rem; font-weight: 700; }
.simulator-colors button:hover, .simulator-colors button.is-active { border-color: var(--cyan); color: white; background: rgba(100,228,232,.08); }
.door-swatch { flex: 0 0 auto; width: 1.05rem; height: 1.05rem; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.door-swatch-white { background: #f5f3ed; }
.door-swatch-black { background: #17181a; }
.door-swatch-grey { background: #777c81; }
.door-swatch-beige { background: #b69d79; }
.door-swatch-navy { background: #202d3e; }
.door-swatch-walnut { background: #6d432b; }
.simulator-selection { margin-top: 1.35rem; padding: 1rem 1.05rem; border-radius: 1rem; background: #08080a; }
.simulator-selection span, .simulator-selection strong { display: block; }
.simulator-selection span { color: #6f6f76; font-size: .64rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.simulator-selection strong { margin-top: .25rem; font-size: .88rem; }
.simulator-stage { position: relative; margin: 0; aspect-ratio: 1.5968; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: clamp(1.5rem, 3vw, 2.8rem); background: #302b26; box-shadow: 0 45px 100px rgba(0,0,0,.42); isolation: isolate; }
.simulator-scene { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; }
.simulator-door-tint { position: absolute; z-index: 1; top: 10.45%; left: 37.5%; width: 24.92%; height: 77.3%; border-radius: 1px; background: var(--door-tone); mix-blend-mode: var(--door-blend); opacity: var(--door-opacity); transition: background .45s ease, opacity .45s ease; }
.simulator-lock-crop { position: absolute; z-index: 2; left: 58%; top: 49%; width: 13.2%; aspect-ratio: .5; overflow: hidden; transform: translate(-50%, -50%); filter: drop-shadow(0 10px 9px rgba(0,0,0,.38)); transition: opacity .2s ease, transform .42s cubic-bezier(.2,.8,.2,1); }
.simulator-lock-crop img { position: absolute; top: 0; left: -100%; width: 200%; height: 100%; max-width: none; object-fit: fill; }
.simulator-lock-crop[data-model="h91"] { left: 57.8%; top: 51%; width: 20.5%; aspect-ratio: 1.083; }
.simulator-lock-crop[data-model="929f"] { left: 57.6%; top: 50%; width: 12.2%; aspect-ratio: .556; }
.simulator-lock-crop[data-model="918e8c"] { left: 57.8%; top: 49%; width: 13.2%; aspect-ratio: .5; }
.simulator-lock-crop[data-model="929vd"] { left: 57.8%; top: 50%; width: 12.6%; aspect-ratio: .5; }
.simulator-stage:hover .simulator-lock-crop { transform: translate(-50%, -52%) scale(1.025); }
.simulator-stage figcaption { position: absolute; right: 1rem; bottom: 1rem; left: 1rem; z-index: 3; display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: .75rem 1rem; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(8,8,10,.66); box-shadow: 0 12px 35px rgba(0,0,0,.25); backdrop-filter: blur(16px); }
.simulator-stage figcaption span { font-size: .76rem; font-weight: 750; }
.simulator-stage figcaption small { color: #b0b0b5; font-size: .62rem; }

.status-section { padding: clamp(8rem, 14vw, 13rem) 0; background: var(--ink); color: white; }
.status-heading { display: grid; grid-template-columns: 1fr; max-width: 900px; }
.status-heading > p:last-child { max-width: 630px; margin: 1.8rem 0 0; color: #929299; font-size: 1.05rem; }
.status-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 4rem; }
.status-card { min-height: 290px; padding: clamp(1.7rem, 4vw, 3rem); border: 1px solid rgba(255,255,255,.11); border-radius: var(--radius-lg); background: #101012; }
.status-state { display: inline-flex; padding: .4rem .65rem; border-radius: 999px; background: rgba(100,228,232,.12); color: var(--cyan); font-size: .68rem; font-weight: 800; letter-spacing: .03em; }
.status-state-partial { background: rgba(247,193,96,.13); color: #f7c160; }
.status-state-pending { background: rgba(255,255,255,.08); color: #a7a7ad; }
.status-card h3 { margin: 2.5rem 0 .8rem; font-size: clamp(1.32rem, 2.4vw, 2.2rem); font-weight: 630; letter-spacing: -.05em; line-height: 1; }
.status-card p { max-width: 520px; margin: 0; color: #919198; }

.faq-section { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(3rem, 8vw, 8rem); padding-block: clamp(8rem, 14vw, 13rem); }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: grid; grid-template-columns: 1fr auto; gap: 1rem; align-items: center; padding: 1.5rem 0; list-style: none; cursor: pointer; font-size: 1.05rem; font-weight: 680; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border: 1px solid var(--line); border-radius: 50%; transition: transform .25s ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 690px; margin: 0; padding: 0 3rem 1.6rem 0; color: var(--muted); }

.updates { padding: 1.25rem; background: var(--ink); }
.updates-inner { display: grid; place-items: center; min-height: 82svh; padding: 5rem 1.5rem; border-radius: var(--radius-xl); background: var(--cyan); text-align: center; }
.updates h2 { max-width: 940px; }
.updates-form { display: flex; width: min(610px, 100%); gap: .7rem; margin-top: 2.5rem; }
.updates-form input { flex: 1; min-width: 0; height: 3.5rem; padding: 0 1.2rem; border: 1px solid rgba(0,0,0,.15); border-radius: 999px; background: rgba(255,255,255,.7); }
.form-note, .form-result { margin: .8rem 0 0; color: #287478; font-size: .75rem; }
.form-result { min-height: 1.1rem; color: var(--ink); font-weight: 650; }

.footer { padding: 3rem 0; background: var(--ink); }
.footer-inner { display: flex; justify-content: space-between; gap: 2rem; align-items: center; width: min(1240px, calc(100% - 3rem)); margin-inline: auto; }
.footer p { color: var(--muted); font-size: .78rem; text-align: right; }

.reveal { opacity: 0; transform: translateY(38px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.8,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (min-width: 1600px) {
  .section-shell { width: min(1480px, calc(100% - 6rem)); }
  .nav-shell { width: min(1560px, calc(100% - 6rem)); }
  .hero { padding-inline: max(6vw, 5rem); }
}

@media (max-width: 1050px) {
  .desktop-nav, .nav-cta { display: none; }
  .nav-shell { grid-template-columns: 1fr auto; }
  .mobile-nav { display: block; justify-self: end; }
  .mobile-nav > summary { position: relative; z-index: 61; padding: .55rem 0; color: white; list-style: none; cursor: pointer; font-size: .82rem; font-weight: 700; }
  .site-header.is-scrolled .mobile-nav > summary { color: var(--ink); }
  .mobile-nav > summary::-webkit-details-marker { display: none; }
  .mobile-nav[open] > summary { position: fixed; top: .85rem; right: 1.5rem; color: white; }
  .site-header.is-scrolled .mobile-nav[open] > summary { color: white; }
  .mobile-nav[open] > summary span { font-size: 0; }
  .mobile-nav[open] > summary span::after { content: "Close"; font-size: .82rem; }
  .mobile-nav-panel { position: fixed; top: 0; left: 0; z-index: 60; display: flex; flex-direction: column; justify-content: center; gap: 1.6rem; width: 100vw; height: 100svh; padding: 2rem; background: rgba(7,7,9,.98); }
  .mobile-nav-panel > a:not(.button) { color: white; font-size: clamp(2rem, 8vw, 4rem); font-weight: 650; letter-spacing: -.05em; text-decoration: none; }
  .mobile-nav-panel .button { align-self: flex-start; background: var(--cyan); color: var(--ink); }
  .hero { grid-template-columns: minmax(0, 1fr); align-content: start; padding-top: 8.5rem; }
  .hero-copy { max-width: 920px; }
  .hero-stage { width: 100%; min-width: 0; min-height: 590px; margin-top: -1rem; }
  .hero-lock { width: min(86vw, 760px); max-height: 62svh; }
  .hero-disclaimer { max-width: 420px; }
  .story-chapter { width: min(390px, 42vw); }
  .fingerprint-section { display: block; min-height: auto; }
  .fingerprint-visual { position: relative; inset: auto; height: min(72vw, 720px); }
  .fingerprint-visual::after { background: linear-gradient(180deg, transparent 68%, var(--ink) 100%); }
  .fingerprint-copy { padding-left: 0; }
  .guest-layout { grid-template-columns: 1fr; }
  .guest-demo { width: min(560px, 100%); margin-inline: auto; }
  .bind-flow { grid-template-columns: 1fr; }
  .bind-step { display: grid; grid-template-columns: minmax(0,.8fr) minmax(300px,1fr); gap: clamp(2rem,7vw,6rem); align-items: start; }
  .bind-step-copy { min-height: auto; }
  .bind-screen { width: min(430px,100%); justify-self: end; }
  .app-layout, .design-section { grid-template-columns: 1fr; }
  .app-layout { padding-top: 8rem; }
  .app-copy { max-width: 760px; }
  .phone { transform: none; }
  .design-copy { max-width: 760px; }
  .simulator-heading { grid-template-columns: 1fr; }
  .simulator-heading > p:last-child { margin-top: 1.5rem; }
  .simulator-layout { grid-template-columns: 1fr; }
  .simulator-controls { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(220px, .8fr); gap: 1.5rem; }
  .simulator-group + .simulator-group { margin: 0; padding: 0 0 0 1.5rem; border-top: 0; border-left: 1px solid rgba(255,255,255,.1); }
  .simulator-selection { grid-column: 1 / -1; margin-top: 0; }
}

@media (max-width: 768px) {
  .section-shell { width: min(100% - 1.5rem, 1240px); }
  .nav-shell, .footer-inner { width: min(100% - 1.5rem, 1240px); }
  .hero { min-height: auto; padding: 7.2rem .75rem 4rem; text-align: center; }
  .hero h1 { font-size: clamp(3.28rem, 13.6vw, 5.6rem); }
  .hero-lede { margin-inline: auto; }
  .hero-actions { justify-content: center; }
  .hero-stage { min-height: 490px; margin-top: 1.4rem; }
  .hero-lock { width: min(98vw, 650px); }
  .model-switcher { top: .35rem; bottom: auto; left: 50%; transform: translateX(-50%); }
  .finish-picker { top: auto; right: 50%; bottom: .6rem; transform: translateX(50%); }
  .hero-disclaimer { position: static; max-width: 520px; margin: 1.2rem auto 0; text-align: center; }
  .scroll-story { height: 250vh; }
  .story-keypad { top: 37%; width: min(42vw, 280px); }
  .story-orbit { top: 38%; width: 92vw; }
  .story-chapter, .story-chapter-right { top: auto; right: 1.25rem; bottom: 2.5rem; left: 1.25rem; width: auto; text-align: left; transform: translateY(20px); }
  .story-chapter.is-active { transform: translateY(0); }
  .story-chapter h2 { font-size: clamp(2.08rem, 8vw, 3.52rem); }
  .story-chapter p { max-width: 560px; margin-top: .8rem; }
  .section-heading { padding-top: 6.5rem; }
  .fingerprint-visual { height: min(92vw, 650px); }
  .fingerprint-rings { top: 10%; left: 50%; }
  .fingerprint-copy h2, .guest-copy h2, .privacy-inner h2, .bind-heading h2 { font-size: clamp(2.6rem, 10.4vw, 4.8rem); }
  .guest-copy h2 { font-size: clamp(2.4rem, 9.2vw, 4rem); }
  .single-use-statement { flex-direction: column; }
  .single-use-statement p:last-child { text-align: left; }
  .privacy-list > div { grid-template-columns: 3rem 1fr; gap: 1rem; }
  .privacy-list p { grid-column: 2; }
  .bind-step { grid-template-columns: minmax(0,.72fr) minmax(280px,1fr); gap: 1.5rem; }
  .bind-screen { min-height: 580px; }
  .status-grid { grid-template-columns: 1fr; }
  .app-layout { grid-template-columns: minmax(0, 1fr); }
  .finish-section { padding: .75rem; }
  .finish-stage { min-height: 650px; }
  .finish-product { width: min(96vw, 700px); }
  .simulator-controls { display: block; }
  .simulator-group + .simulator-group { margin-top: 1.5rem; padding: 1.5rem 0 0; border-top: 1px solid rgba(255,255,255,.1); border-left: 0; }
  .simulator-selection { margin-top: 1.35rem; }
  .simulator-stage figcaption { align-items: flex-start; flex-direction: column; gap: .1rem; border-radius: 1rem; }
  .faq-section { grid-template-columns: 1fr; }
  .updates-form { flex-direction: column; }
  .updates-form .button { width: 100%; }
  .footer-inner { align-items: flex-start; flex-direction: column; }
  .footer p { text-align: left; }
}

@media (max-width: 420px) {
  .site-header { backdrop-filter: saturate(150%) blur(16px); }
  .hero { padding-top: 6.5rem; }
  .hero h1 { font-size: clamp(2.44rem, 12.8vw, 3.4rem); }
  .hero-lede { font-size: 1.03rem; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-stage { min-height: 410px; }
  .hero-lock { width: 118vw; max-width: none; }
  .finish-picker > span { display: none; }
  .model-switcher { top: 0; }
  .scroll-story { height: 230vh; }
  .story-keypad { top: 34%; width: min(49vw, 220px); }
  .story-orbit { top: 34%; width: 112vw; }
  .story-chapter, .story-chapter-right { bottom: 2rem; }
  .story-chapter h2 { font-size: 2.04rem; }
  .story-chapter p { font-size: .9rem; line-height: 1.45; }
  .section-heading h2, .design-copy h2, .app-copy h2, .simulator-heading h2, .status-heading h2, .faq-heading h2, .updates h2 { font-size: clamp(2.24rem, 11.2vw, 3.2rem); }
  .fingerprint-copy { padding-block: 6.5rem; }
  .fingerprint-rings { width: 5rem; }
  .guest-layout { gap: 3.5rem; }
  .guest-demo { border-radius: 1.8rem; }
  .message { width: 92%; font-size: .9rem; }
  .message-small { width: 88%; }
  .guest-code-ticket strong { font-size: 1.8rem; }
  .single-use-statement { margin-top: 6rem; }
  .privacy-list > div { grid-template-columns: 2.2rem 1fr; }
  .bind-step { display: block; }
  .bind-step + .bind-step { margin-top: 4rem; }
  .bind-step-copy { margin-bottom: 2rem; }
  .bind-screen { min-height: 560px; margin-inline: auto; }
  .phone { min-height: 650px; border-width: 7px; }
  .unlock-preview { width: 9.1rem; }
  .design-section { padding-block: 6.5rem; }
  .finish-stage { min-height: 540px; border-radius: 1.8rem; }
  .simulator-section { padding-block: 6.5rem; }
  .simulator-models { grid-template-columns: 1fr 1fr; }
  .simulator-layout { gap: 1.5rem; }
  .simulator-stage { width: calc(100% + 1.5rem); margin-left: -.75rem; border-radius: 1.4rem; }
  .simulator-stage figcaption { right: .55rem; bottom: .55rem; left: .55rem; padding: .55rem .7rem; }
  .status-grid { margin-top: 2.5rem; }
  .status-card { min-height: 250px; }
  .updates-inner { min-height: 72svh; border-radius: 1.8rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .hero-lock, .story-keypad, .phone { transform: none !important; }
  .scroll-story { height: auto; }
  .story-sticky { position: relative; display: grid; min-height: auto; height: auto; padding: 7rem 1.25rem; }
  .story-keypad { position: relative; top: auto; left: auto; width: min(48vw, 270px); margin: 0 auto 5rem; transform: none; }
  .story-orbit { display: none; }
  .story-chapter, .story-chapter-right { position: relative; inset: auto; width: min(720px, 100%); margin: 0 auto 3rem; opacity: 1; text-align: left; transform: none; }
  .reveal { opacity: 1; transform: none; }
}