:root {
  --navy: #293b54;
  --ink: #182334;
  --teal: #007c89;
  --aqua: #18b7b7;
  --mint: #72d6ac;
  --lime: #abe5b0;
  --canvas: #f7f7f7;
  --mist: #dde7e7;
  --white: #ffffff;
  --line: rgba(24, 35, 52, 0.14);
  --shadow: 0 30px 80px rgba(15, 39, 54, 0.12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; }
body {
  margin: 0;
  background: var(--canvas);
  color: var(--ink);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
img { max-width: 100%; height: auto; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 {
  font-family: Manrope, "Segoe UI", Arial, sans-serif;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.skip-link {
  position: fixed;
  z-index: 9999;
  left: 1rem;
  top: -5rem;
  padding: .8rem 1rem;
  background: var(--ink);
  color: var(--white);
  border-radius: .5rem;
}
.skip-link:focus { top: 1rem; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(247, 247, 247, .9);
  border-bottom: 1px solid rgba(24, 35, 52, .08);
  backdrop-filter: blur(18px);
}
.header-inner {
  min-height: 88px;
  display: grid;
  grid-template-columns: 240px 1fr auto;
  align-items: center;
  gap: 2rem;
}
.brand { display: inline-flex; width: 168px; }
.brand img, .footer-brand img { mix-blend-mode: multiply; }
.desktop-nav {
  display: flex;
  justify-content: center;
  gap: clamp(1.25rem, 3vw, 2.75rem);
}
.desktop-nav a {
  text-decoration: none;
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--navy);
}
.desktop-nav a:hover, .desktop-nav a:focus-visible { color: var(--teal); }
.mobile-menu { display: none; }

.btn {
  border-radius: 999px;
  font-weight: 750;
  letter-spacing: -.01em;
  padding: .86rem 1.25rem;
  border-width: 1px;
  min-height: 48px;
}
.btn-verno {
  background: var(--teal);
  color: var(--white);
  border-color: var(--teal);
  box-shadow: 0 10px 24px rgba(0, 124, 137, .2);
}
.btn-verno:hover, .btn-verno:focus-visible {
  background: #006873;
  border-color: #006873;
  color: var(--white);
  transform: translateY(-1px);
}
.btn-mint {
  background: var(--lime);
  color: var(--ink);
  border-color: var(--lime);
}
.btn-mint:hover, .btn-mint:focus-visible {
  background: #c4efc7;
  border-color: #c4efc7;
  color: var(--ink);
}
.btn-light { color: var(--teal); }
.text-link {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 750;
  color: var(--teal);
  text-decoration: none;
  padding: .75rem 0;
  border-bottom: 1px solid rgba(0, 124, 137, .35);
}
.text-link:hover, .text-link:focus-visible { color: var(--ink); border-color: var(--ink); }

.hero {
  position: relative;
  overflow: hidden;
  min-height: 790px;
  background:
    radial-gradient(circle at 82% 28%, rgba(171, 229, 176, .55), transparent 28%),
    linear-gradient(135deg, #f8fbfa 0%, #eef8f5 100%);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .22;
  background-image: linear-gradient(rgba(41,59,84,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(41,59,84,.15) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(90deg, transparent 0%, black 45%, black 100%);
}
.hero-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  align-items: center;
  min-height: 700px;
  gap: 2rem;
  padding-top: 3.5rem;
  padding-bottom: 3rem;
}
.eyebrow {
  display: flex;
  align-items: center;
  gap: .65rem;
  color: var(--teal);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .16em;
  line-height: 1.3;
  margin-bottom: 1.5rem;
}
.eyebrow span { width: 28px; height: 2px; background: var(--teal); }
.eyebrow.light { color: var(--lime); }
.hero h1 {
  font-size: clamp(3.4rem, 6.25vw, 6.7rem);
  max-width: 760px;
  color: var(--navy);
  margin-bottom: 1.7rem;
}
.hero h1 span { display: block; color: var(--teal); }
.hero-lead {
  font-size: clamp(1.08rem, 1.5vw, 1.32rem);
  line-height: 1.7;
  color: #405166;
  max-width: 630px;
  margin-bottom: 2rem;
}
.hero-actions { display: flex; align-items: center; gap: 1.7rem; flex-wrap: wrap; }
.hero-actions .btn { padding-inline: 1.7rem; }
.device-list {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 2.5rem;
}
.device-list span {
  padding: .42rem .72rem;
  background: rgba(255,255,255,.68);
  border: 1px solid rgba(41,59,84,.12);
  border-radius: 999px;
  color: var(--navy);
  font-size: .72rem;
  font-weight: 700;
}
.hero-visual { position: relative; height: 590px; }
.orbit {
  position: absolute;
  border: 1px solid rgba(0,124,137,.22);
  border-radius: 50%;
  inset: 8% -7% 2% 5%;
}
.orbit-two { inset: 18% 2% 13% 16%; border-color: rgba(41,59,84,.13); }
.reader {
  position: absolute;
  width: 260px;
  height: 390px;
  padding: 13px;
  background: var(--ink);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 25px;
  box-shadow: var(--shadow);
}
.reader-screen { width: 100%; height: 100%; border-radius: 15px; background: #fff; padding: 1.2rem; overflow: hidden; }
.reader-back { left: 7%; top: 17%; transform: rotate(-8deg); opacity: .94; }
.reader-front { right: 3%; top: 7%; transform: rotate(5deg); }
.screen-label, .chapter {
  font-size: .52rem;
  letter-spacing: .18em;
  font-weight: 800;
  color: var(--teal);
}
.book-cover {
  margin-top: 1rem;
  height: 245px;
  display: flex;
  align-items: end;
  padding: 1.3rem;
  color: var(--white);
  background: linear-gradient(145deg, var(--navy), var(--teal) 62%, var(--mint));
  font-family: Manrope, "Segoe UI", Arial, sans-serif;
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1.02;
}
.mini-lines { margin-top: 1rem; display: grid; gap: .45rem; }
.mini-lines i { display: block; height: 4px; background: var(--mist); border-radius: 2px; }
.mini-lines i:nth-child(2) { width: 76%; }
.mini-lines i:nth-child(3) { width: 52%; }
.reading-screen { padding: 2rem 1.7rem; background: #fbf6ea; }
.reading-screen h2 { font-family: Georgia, serif; font-size: 2rem; letter-spacing: -.03em; color: var(--navy); margin: 3rem 0 1.2rem; }
.reading-screen p { font-family: Georgia, serif; font-size: .94rem; color: #526070; }
.progress-line { position: absolute; left: 30px; right: 30px; bottom: 28px; height: 3px; background: #d8d2c5; }
.progress-line span { display: block; width: 62%; height: 100%; background: var(--teal); }
.audio-card {
  position: absolute;
  z-index: 4;
  right: 13%;
  bottom: 6%;
  min-width: 310px;
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: .95rem 1rem;
  border-radius: 14px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 18px 45px rgba(15,39,54,.16);
  backdrop-filter: blur(12px);
}
.play { width: 40px; height: 40px; display: grid; place-items: center; background: var(--teal); color: #fff; border-radius: 50%; font-size: .72rem; }
.audio-card small { display:block; font-size:.51rem; letter-spacing:.14em; color:#6c7b87; }
.audio-card strong { display:block; color:var(--navy); font-size:.88rem; }
.wave { display:flex; align-items:center; gap:3px; margin-left:auto; }
.wave i { width:3px; height:14px; background:var(--aqua); border-radius:2px; }
.wave i:nth-child(2), .wave i:nth-child(4) { height:24px; }
.wave i:nth-child(3) { height:31px; }
.sync-pill {
  position: absolute;
  left: 0;
  top: 7%;
  display: flex;
  gap: .5rem;
  align-items: center;
  background: var(--navy);
  color: #fff;
  border-radius: 999px;
  padding: .6rem .9rem;
  font-size: .72rem;
  font-weight: 700;
  box-shadow: var(--shadow);
}
.sync-pill span { display:grid; place-items:center; width:21px; height:21px; color:var(--ink); background:var(--lime); border-radius:50%; }

/* Hero motion: quiet sequencing for the message, gentle depth for the product scene. */
.hero-copy .eyebrow,
.hero-copy h1,
.hero-lead,
.hero-actions,
.device-list {
  animation: hero-copy-in .72s cubic-bezier(.22, 1, .36, 1) both;
}
.hero-copy h1 { animation-delay: .1s; }
.hero-lead { animation-delay: .2s; }
.hero-actions { animation-delay: .3s; }
.device-list { animation-delay: .4s; }
.orbit-one { animation: orbit-breathe 7s ease-in-out 1s infinite; }
.orbit-two { animation: orbit-breathe 7s ease-in-out 1.7s infinite reverse; }
.reader-back {
  animation: reader-back-in .9s cubic-bezier(.22, 1, .36, 1) .18s both,
    reader-back-float 7s ease-in-out 1.4s infinite;
}
.reader-front {
  animation: reader-front-in .95s cubic-bezier(.22, 1, .36, 1) .28s both,
    reader-front-float 6.4s ease-in-out 1.5s infinite;
}
.audio-card {
  animation: hero-object-in .65s cubic-bezier(.22, 1, .36, 1) .75s both,
    audio-float 5.6s ease-in-out 1.55s infinite;
}
.sync-pill {
  animation: hero-object-in .65s cubic-bezier(.22, 1, .36, 1) .6s both,
    sync-float 5s ease-in-out 1.3s infinite;
}
.sync-pill span { animation: sync-pulse 3.6s ease-out 1.8s infinite; }
.wave i { animation: sound-wave 1.55s ease-in-out infinite; transform-origin:center; }
.wave i:nth-child(2) { animation-delay:.12s; }
.wave i:nth-child(3) { animation-delay:.24s; }
.wave i:nth-child(4) { animation-delay:.36s; }
.wave i:nth-child(5) { animation-delay:.48s; }

@keyframes hero-copy-in {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes hero-object-in {
  from { opacity: 0; transform: translateY(16px) scale(.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes reader-back-in {
  from { opacity:0; transform:translate(-18px, 28px) rotate(-12deg) scale(.94); }
  to { opacity:.94; transform:translate(0, 0) rotate(-8deg) scale(1); }
}
@keyframes reader-front-in {
  from { opacity:0; transform:translate(22px, 34px) rotate(9deg) scale(.94); }
  to { opacity:1; transform:translate(0, 0) rotate(5deg) scale(1); }
}
@keyframes reader-back-float {
  0%, 100% { transform:translateY(0) rotate(-8deg); }
  50% { transform:translateY(-8px) rotate(-7.2deg); }
}
@keyframes reader-front-float {
  0%, 100% { transform:translateY(0) rotate(5deg); }
  50% { transform:translateY(-11px) rotate(4.2deg); }
}
@keyframes audio-float {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(-7px); }
}
@keyframes sync-float {
  0%, 100% { transform:translateY(0); }
  50% { transform:translateY(6px); }
}
@keyframes sync-pulse {
  0%, 55%, 100% { box-shadow:0 0 0 0 rgba(171,229,176,0); }
  68% { box-shadow:0 0 0 8px rgba(171,229,176,.18); }
}
@keyframes sound-wave {
  0%, 100% { transform:scaleY(.55); opacity:.7; }
  50% { transform:scaleY(1); opacity:1; }
}
@keyframes orbit-breathe {
  0%, 100% { opacity:.72; transform:scale(1); }
  50% { opacity:1; transform:scale(1.018); }
}
.hero-ticker {
  position: relative;
  z-index: 2;
  min-height: 90px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 1rem;
  background: var(--navy);
  color: #fff;
  font: 800 clamp(1rem, 1.7vw, 1.5rem)/1 Manrope, "Segoe UI", sans-serif;
  letter-spacing: .13em;
}
.hero-ticker i { color: var(--mint); font-style: normal; }

.section { padding: clamp(5.5rem, 9vw, 9rem) 0; }
.section-heading { margin-bottom: 3.5rem; }
.section-heading h2, .experience-copy h2, .library-copy h2, .partner-grid h2 {
  color: var(--navy);
  font-size: clamp(2.8rem, 5vw, 5.1rem);
}
.split-heading { display:grid; grid-template-columns: 1fr .75fr; align-items:end; gap:3rem; }
.split-heading > p { max-width: 500px; margin-bottom: .5rem; color: #526276; font-size:1.05rem; }
.path-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.path-card { position:relative; min-height: 345px; padding: 2rem 1.65rem; border-right:1px solid var(--line); transition:.25s ease; }
.path-card:last-child { border-right:0; }
.path-card:hover { background:#fff; transform:translateY(-8px); box-shadow:0 18px 45px rgba(15,39,54,.08); }
.path-number { color:var(--teal); font-size:.72rem; font-weight:800; letter-spacing:.16em; }
.path-card h3 { font-size:1.65rem; color:var(--navy); margin:4.2rem 0 1rem; }
.path-card p { color:#647184; font-size:.9rem; }
.path-card a { position:absolute; bottom:2rem; text-decoration:none; font-size:.78rem; font-weight:800; color:var(--teal); }

.ecosystem-section { background:var(--navy); color:#fff; overflow:hidden; }
.ecosystem-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:4rem; align-items:center; }
.ecosystem-copy h2 { color:#fff; font-size:clamp(2.8rem,5vw,5.2rem); }
.ecosystem-copy > p:not(.eyebrow) { color:#d8e3e7; max-width:540px; font-size:1.05rem; margin:1.5rem 0 2.2rem; }
.ecosystem-map { min-height:540px; display:grid; place-items:center; }
.map-ring {
  position:relative;
  width:min(510px, 90vw);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(171,229,176,.35);
  box-shadow:inset 0 0 0 55px rgba(255,255,255,.025), inset 0 0 0 120px rgba(255,255,255,.025);
}
.map-ring::before, .map-ring::after { content:""; position:absolute; background:rgba(171,229,176,.23); }
.map-ring::before { width:1px; height:100%; left:50%; }
.map-ring::after { height:1px; width:100%; top:50%; }
.map-core { position:absolute; inset:34%; display:grid; place-items:center; align-content:center; gap:.5rem; background:#f6fbf8; color:var(--teal); border-radius:50%; z-index:2; box-shadow:0 18px 60px rgba(0,0,0,.22); }
.map-core img { width:100px; mix-blend-mode:multiply; }
.map-core span { font-size:.52rem; font-weight:800; letter-spacing:.18em; }
.map-node { position:absolute; z-index:3; width:118px; height:118px; display:grid; place-items:center; align-content:center; border-radius:50%; background:var(--teal); border:6px solid var(--navy); box-shadow:0 10px 35px rgba(0,0,0,.2); }
.map-node strong { font-size:.62rem; color:var(--lime); }
.map-node span { font-weight:800; }
.node-one { left:38%; top:-5%; }
.node-two { right:-3%; top:39%; }
.node-three { left:38%; bottom:-5%; }
.node-four { left:-3%; top:39%; }

.offers-section { background:#eef5f2; }
.offers-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(24,35,52,.12); border:1px solid rgba(24,35,52,.12); }
.offer-card { min-height:430px; background:#fff; padding:2.2rem; display:flex; flex-direction:column; }
.offer-top { display:flex; justify-content:space-between; color:var(--teal); font-size:.67rem; font-weight:800; letter-spacing:.15em; }
.offer-icon { position:relative; width:120px; height:100px; margin:2.3rem 0 1.5rem; }
.offer-icon i { position:absolute; display:block; border-radius:8px; background:linear-gradient(135deg,var(--aqua),var(--mint)); }
.offer-icon i:nth-child(1) { width:62px; height:78px; left:0; top:12px; transform:rotate(-7deg); }
.offer-icon i:nth-child(2) { width:62px; height:82px; right:2px; top:4px; transform:rotate(7deg); background:linear-gradient(135deg,var(--mint),var(--lime)); }
.offer-icon i:nth-child(3) { width:10px; height:70px; left:55px; top:17px; background:#fff; }
.offer-2 .offer-icon i { border-radius:20px; background:var(--navy); }
.offer-2 .offer-icon i:nth-child(1) { width:80px; height:95px; left:20px; top:0; transform:none; }
.offer-2 .offer-icon i:nth-child(2) { width:57px; height:70px; left:31px; top:10px; transform:none; background:#eef5f2; }
.offer-2 .offer-icon i:nth-child(3) { width:22px; height:3px; left:49px; top:86px; background:var(--mint); }
.offer-3 .offer-icon i { transform:none; border-radius:5px; }
.offer-3 .offer-icon i:nth-child(1) { width:100px; height:68px; left:10px; top:18px; background:var(--teal); }
.offer-3 .offer-icon i:nth-child(2) { width:78px; height:6px; left:21px; top:33px; background:#fff; box-shadow:0 15px 0 #fff, 0 30px 0 #fff; }
.offer-3 .offer-icon i:nth-child(3) { width:46px; height:9px; left:37px; top:5px; background:var(--mint); }
.offer-4 .offer-icon i { transform:none; }
.offer-4 .offer-icon i:nth-child(1) { width:80px; height:60px; left:20px; top:18px; background:var(--navy); }
.offer-4 .offer-icon i:nth-child(2) { width:42px; height:42px; left:39px; top:1px; border-radius:50%; background:var(--mint); }
.offer-4 .offer-icon i:nth-child(3) { width:94px; height:5px; left:13px; top:85px; background:var(--aqua); }
.offer-card h3 { color:var(--navy); font-size:2.15rem; margin-bottom:1rem; }
.offer-card p { color:#657385; max-width:500px; }
.offer-card a { margin-top:auto; font-size:.8rem; font-weight:800; color:var(--teal); text-decoration:none; }

.experience-grid { display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center; }
.experience-art { position:relative; min-height:620px; background:linear-gradient(145deg,#dff4ee,#bfe8d3); overflow:hidden; }
.page-stack { position:absolute; width:330px; height:430px; background:#fff; box-shadow:var(--shadow); }
.page-one { left:14%; top:18%; transform:rotate(-11deg); }
.page-two { right:9%; top:10%; transform:rotate(8deg); background:#faf5e9; }
.quote-card { position:absolute; z-index:3; left:18%; top:23%; width:320px; height:390px; padding:2.2rem; background:var(--navy); color:#fff; box-shadow:var(--shadow); }
.quote-card > span { font:700 5rem/1 Georgia,serif; color:var(--mint); }
.quote-card p { font:700 2.45rem/1.15 Georgia,serif; }
.quote-card small { position:absolute; bottom:2rem; letter-spacing:.16em; color:var(--lime); font-weight:800; }
.note-card { position:absolute; z-index:4; right:3%; bottom:8%; display:flex; align-items:baseline; gap:.7rem; padding:1rem 1.3rem; background:#fff; box-shadow:0 20px 45px rgba(15,39,54,.16); }
.note-card strong { color:var(--teal); font-size:2rem; }
.note-card span { font-size:.75rem; color:#637082; }
.lead-copy { font-size:1.08rem; color:#58677a; margin:1.5rem 0 2rem; }
.feature-list { list-style:none; padding:0; margin:0; }
.feature-list li { display:grid; grid-template-columns:44px 1fr; gap:1rem; border-top:1px solid var(--line); padding:1.2rem 0; }
.feature-list li > span { color:var(--teal); font-size:.68rem; font-weight:800; letter-spacing:.12em; }
.feature-list strong { color:var(--navy); }
.feature-list p { color:#697588; margin:.25rem 0 0; font-size:.9rem; }

.libraries-section { padding-top:0; }
.library-panel { display:grid; grid-template-columns:1fr .8fr; min-height:530px; background:var(--teal); color:#fff; overflow:hidden; }
.library-copy { padding:clamp(3rem,6vw,6rem); }
.library-copy h2 { color:#fff; }
.library-copy > p:not(.eyebrow) { max-width:580px; color:#d9f3f1; font-size:1.05rem; margin:1.5rem 0 2rem; }
.library-metrics { display:grid; align-content:center; background:linear-gradient(150deg,rgba(24,35,52,.12),rgba(24,35,52,.5)); padding:3rem; }
.library-metrics div { display:grid; grid-template-columns:70px 1fr; align-items:center; gap:1rem; min-height:100px; border-bottom:1px solid rgba(255,255,255,.2); }
.library-metrics strong { font-size:.75rem; color:var(--lime); letter-spacing:.15em; }
.library-metrics span { font:700 1.2rem/1.2 Manrope,"Segoe UI",sans-serif; }

.partner-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; }
.partner-copy > p { font-size:1.15rem; color:#566577; max-width:620px; }
.partner-types { display:flex; flex-wrap:wrap; gap:.65rem; margin:2rem 0 1.5rem; }
.partner-types span { padding:.75rem 1rem; border:1px solid var(--line); background:#fff; font-size:.78rem; font-weight:750; color:var(--navy); }

.closing-section {
  padding:clamp(6rem,10vw,10rem) 0;
  background:
    radial-gradient(circle at 80% 20%, rgba(171,229,176,.28), transparent 26%),
    var(--navy);
  color:#fff;
}
.closing-inner { text-align:center; }
.closing-inner .eyebrow { justify-content:center; }
.closing-inner h2 { font-size:clamp(3rem,6vw,6rem); color:#fff; }
.closing-inner > p:not(.eyebrow) { color:#dce6e8; font-size:1.05rem; max-width:670px; margin:1.5rem auto 2.4rem; }
.closing-actions { display:flex; align-items:center; justify-content:center; gap:1.2rem; flex-wrap:wrap; }
.status-pill { display:inline-flex; align-items:center; gap:.55rem; padding:.7rem 1rem; border:1px solid rgba(255,255,255,.2); border-radius:999px; color:#dce6e8; font-size:.75rem; }
.status-pill i { width:8px; height:8px; background:var(--lime); border-radius:50%; box-shadow:0 0 0 5px rgba(171,229,176,.14); }

.site-footer { background:#eef3f2; padding:5rem 0 2rem; }
.footer-top { display:grid; grid-template-columns:1fr 1.5fr; gap:4rem; padding-bottom:4rem; }
.footer-brand img { width:170px; }
.footer-brand p { color:#5e6b7c; margin-top:1.2rem; }
.footer-nav { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.footer-nav div { display:flex; flex-direction:column; gap:.75rem; }
.footer-nav strong { font-size:.66rem; letter-spacing:.16em; color:var(--teal); margin-bottom:.5rem; }
.footer-nav a, .footer-nav span { text-decoration:none; font-size:.85rem; color:var(--navy); }
.footer-nav a:hover, .footer-nav a:focus-visible { color:var(--teal); }
.footer-bottom { display:flex; justify-content:space-between; gap:1rem; padding-top:1.5rem; border-top:1px solid var(--line); color:#667386; font-size:.72rem; }

:focus-visible { outline:3px solid var(--aqua); outline-offset:4px; }

@media (max-width: 991px) {
  .header-inner { grid-template-columns:1fr auto; }
  .desktop-nav, .header-cta { display:none; }
  .mobile-menu { display:block; position:relative; }
  .mobile-menu summary { list-style:none; cursor:pointer; font-weight:800; color:var(--navy); padding:.7rem .9rem; border:1px solid var(--line); border-radius:999px; }
  .mobile-menu summary::-webkit-details-marker { display:none; }
  .mobile-menu nav { position:absolute; right:0; top:3.4rem; width:min(290px,85vw); display:grid; padding:.7rem; background:#fff; box-shadow:var(--shadow); border-radius:1rem; }
  .mobile-menu nav a { padding:.8rem; text-decoration:none; font-weight:700; color:var(--navy); }
  .hero-grid { grid-template-columns:1fr; padding-top:5rem; }
  .hero-copy { text-align:center; }
  .hero-copy .eyebrow, .hero-actions, .device-list { justify-content:center; }
  .hero-lead { margin-inline:auto; }
  .hero-visual { max-width:650px; width:100%; margin:auto; }
  .split-heading, .ecosystem-grid, .experience-grid, .partner-grid { grid-template-columns:1fr; }
  .path-grid { grid-template-columns:repeat(2,1fr); }
  .path-card:nth-child(2) { border-right:0; }
  .path-card:nth-child(-n+2) { border-bottom:1px solid var(--line); }
  .ecosystem-copy { text-align:center; }
  .ecosystem-copy .eyebrow { justify-content:center; }
  .ecosystem-copy > p:not(.eyebrow) { margin-inline:auto; }
  .experience-art { order:2; }
  .library-panel { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; }
}

@media (max-width: 640px) {
  html { scroll-padding-top:76px; }
  .header-inner { min-height:74px; padding-inline:1rem; }
  .brand { width:140px; }
  .hero { min-height:auto; }
  .hero-grid { padding:3.6rem 1.1rem 1.5rem; }
  .hero h1 { font-size:clamp(3rem,14vw,4.4rem); }
  .hero-visual { height:470px; transform:scale(.9); transform-origin:top center; margin-bottom:-35px; }
  .reader { width:210px; height:325px; }
  .reader-back { left:1%; }
  .reader-front { right:0; }
  .reading-screen h2 { font-size:1.55rem; margin-top:2rem; }
  .audio-card { right:3%; min-width:260px; }
  .hero-ticker { overflow:hidden; justify-content:flex-start; padding:0 1.5rem; }
  .hero-ticker span:nth-of-type(n+4), .hero-ticker i:nth-of-type(n+4) { display:none; }
  .section { padding:5rem 0; }
  .section-heading h2, .experience-copy h2, .library-copy h2, .partner-grid h2 { font-size:2.8rem; }
  .split-heading { gap:1.3rem; }
  .path-grid, .offers-grid { grid-template-columns:1fr; }
  .path-card, .path-card:nth-child(2) { border-right:0; border-bottom:1px solid var(--line); }
  .path-card:last-child { border-bottom:0; }
  .path-card { min-height:300px; }
  .ecosystem-map { min-height:390px; margin-top:1rem; }
  .map-ring { width:340px; }
  .map-node { width:88px; height:88px; border-width:4px; font-size:.75rem; }
  .map-core img { width:72px; }
  .offer-card { min-height:390px; }
  .experience-grid { gap:3rem; }
  .experience-art { min-height:500px; }
  .quote-card { left:10%; width:270px; height:340px; }
  .quote-card p { font-size:2rem; }
  .library-copy { padding:3rem 1.5rem; }
  .library-metrics { padding:1.5rem; }
  .partner-grid { gap:1.5rem; }
  .footer-nav { grid-template-columns:1fr 1fr; }
  .footer-bottom { flex-direction:column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior:auto !important;
    transition:none !important;
    animation:none !important;
  }
}


.error-page { background:#f7f7f7; }
.error-title { color:#293b54; font-size:clamp(3rem,8vw,6rem); }
.error-copy { max-width:560px; color:#526276; }