/* Uranus ice-blue: luminous surfaces, glacial blue accents, readable slate text. */
body[data-page="index"] {
  --night: #163e54;
  --deep: #e1f4fb;
  --ice: #163e54;
  --mist: #315e73;
  --uranus: #116a91;
  --aqua: #1597c5;
  --blue: #17658e;
  --line: #23678629;
  --muted: #46687b;
  background: #eef9fd;
  color: #163e54;
  color-scheme: light;
}
.top { background: #f0fbffe8; border-bottom: 1px solid var(--line); backdrop-filter: blur(16px); }
.top-brand { letter-spacing: .12em; }
.top-brand img { width: 38px; height: 38px; object-fit: contain; }
.top-nav { font-size: .875rem; }
.top-nav a { padding: .45rem 0; }
.top-nav a:hover { color: #08749b; }
::selection { background: #98dbf5; color: #163e54; }
a:focus-visible, summary:focus-visible { outline: 2px solid var(--uranus); outline-offset: 6px; }
section[id] { scroll-margin-top: 6rem; }
.uranus-hero {
  min-height: min(920px, 100svh);
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.2fr);
  padding: 9rem var(--pad) 10rem;
  gap: 2.5vw;
  background: radial-gradient(ellipse at 80% 46%, #8ad4f780, transparent 52%), linear-gradient(125deg, #f5fcff, #d4effa);
}
.uranus-hero::before, .uranus-hero::after { content: none; }
.hero-copy { max-width: 46rem; }
.eyebrow { font-size: .875rem; letter-spacing: .16em; margin-bottom: 1.7rem; }
.hero-copy h1 { font-size: clamp(2.8rem, 5.6vw, 6rem); line-height: 1.17; letter-spacing: -.055em; }
.hero-copy em { color: #187ca6; }
.lede { max-width: 35rem; color: #46687b; font-size: 1.0625rem; line-height: 1.95; }
.hero-actions { gap: 1.4rem; margin-top: 2rem; }
.button-primary {
  background: linear-gradient(135deg, #c3f1ff, #6bceff);
  border: 1px solid #c9f3ff;
  border-radius: 8px;
  padding: .95rem 1.4rem;
  box-shadow: 0 8px 30px #40b7ff20;
  transition: background .2s, box-shadow .2s;
}
.button-primary:hover { background: #dcf6ff; box-shadow: 0 8px 35px #40b7ff40; }
.button-text { color: #285b73; padding: .6rem 0; }
.edition-note { font-size: .875rem; letter-spacing: .02em; line-height: 1.7; }
.planet-panel { width: 100%; position: relative; opacity: 1; right: auto; top: auto; }
.planet-panel img {
  display: block; width: 100%; max-width: none; height: auto;
  border-radius: 12px; box-shadow: 0 24px 48px #0b2a4433;
  filter: drop-shadow(0 16px 36px #2989d82e);
}
.planet-glow { width: 70%; background: #278bea; opacity: .12; filter: blur(70px); }
.signal { bottom: -1.5rem; right: auto; display: flex; align-items: center; gap: .8rem; color: #46687b; font-size: .75rem; letter-spacing: .12em; }
.signal .signal-rule { width: 3rem; height: 1px; border-radius: 0; margin: 0; background: #81b8dd; box-shadow: none; }
.hero-specs { padding-top: 1.6rem; border-top: 1px solid var(--line); bottom: 2.4rem; gap: 4rem; }
.hero-specs b { font-size: 1.4rem; margin-bottom: .45rem; }
.hero-specs span { font-size: .8125rem; letter-spacing: .04em; }
.manifesto { background: #e9f5fc; }
.manifesto h2, .library-heading h2, .skin-section h2, .metadata-section h2, .performance h2, .final-cta h2 {
  font-size: clamp(2rem, 3.6vw, 3.6rem); line-height: 1.25; letter-spacing: -.04em;
}
.section-index { font-size: .875rem; line-height: 1.5; }
.manifesto p:last-child { color: #3c5870; }
.feature-grid { padding: var(--pad); gap: 1.25rem; background: #f1faff; grid-template-columns: 1.45fr .8fr; }
.feature { border: 1px solid var(--line); border-radius: 16px; padding: clamp(1.5rem, 3vw, 3rem); min-height: 17rem; background: #f8fdff; }
.feature-wide { min-height: 36rem; background: linear-gradient(145deg, #dbf3ff, #edf9ff); }
.feature h2 { font-size: clamp(2rem, 3.5vw, 3.7rem); line-height: 1.25; }
.feature > p:not(.section-index) { color: #46687b; }
.feature-stat { background: linear-gradient(125deg, #b6eaff, #69c5fa); }
.feature-stat strong { font-size: clamp(4rem, 7vw, 6.5rem); }
.feature-stat p { color: #153e60 !important; }
.audio-path { margin-top: 6rem; font-size: .8125rem; }
.library-section { background: #dceff7; grid-template-columns: 1fr 1fr; gap: 5vw; }
.library-copy > .lead-copy { color: #315e73; }
.library-copy li > span, .capability-list span { font-size: .8125rem; }
.skin-section { background: radial-gradient(ellipse at 90% 5%, #e1f8ff, transparent 60%), linear-gradient(120deg, #8cd3fb, #bcecff); }
.skin-section > p:not(.section-index) { color: #244862; }
.skin-section .section-index { color: #185d89; }
.skin-orbit { display: none; }
.tech-tags span { font-size: .875rem; border-color: #23668b50; }
.metadata-section { background: #f1faff; grid-template-columns: 1fr 1fr; gap: 5vw; }
.metadata-section > div > p:last-child { margin-top: 1.5rem; }
.performance { background: #dceff7; }
.performance-grid { background: transparent; gap: 1.25rem; margin-top: 3rem; }
.performance-grid p { background: transparent; padding: 1.5rem 0; border-top: 1px solid #6696be70; }
.performance-grid span { font-size: 1rem; }
.final-cta { background: #e9f5fc; grid-template-columns: 1.2fr 1fr; }
.final-cta > div:last-child p { color: #3c5870; font-size: 1rem; }
.license { background: #e9f5fc; }
.license p { color: #3c5870; }
.foot { background: #cfe9f5; }
.foot-tag, .foot-copy { font-size: .875rem; }
/* Compact product overview: readable feature groups, without oversized spacer sections. */
.uranus-hero { min-height: auto; padding-top: 7.5rem; padding-bottom: 7rem; }
.hero-copy h1 { font-size: clamp(2.5rem, 4.3vw, 4.5rem); }
.planet-panel { max-width: none; width: 100%; justify-self: stretch; }
.planet-panel img { width: 100%; }
.lede { margin-top: 1.2rem; }
.hero-specs { bottom: 1.5rem; padding-top: 1rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.hero-specs div { align-content: start; }
.hero-specs b { font-size: 1.125rem; line-height: 1.5; }
.hero-specs span { font-size: .875rem; line-height: 1.6; letter-spacing: 0; }
.product-overview { padding: 2.5rem var(--pad) 3rem; background: #e5f3fa; }
.overview-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.5rem; }
.overview-heading .section-index { margin-bottom: .5rem; }
.overview-heading h2 { margin: 0; font-size: clamp(1.6rem, 2.4vw, 2.25rem); line-height: 1.35; letter-spacing: -.03em; }
.overview-heading > p { margin: 0; max-width: 27rem; color: #46687b; font-size: 1rem; }
.overview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.overview-card { padding: clamp(1.25rem, 2.2vw, 2rem); border: 1px solid #23678624; border-radius: 12px; background: #f8fdff; scroll-margin-top: 6rem; }
.overview-card-accent { background: linear-gradient(125deg, #d4effc, #edfbff); border-color: #71bbdf70; }
.overview-card .section-index { margin-bottom: .6rem; font-size: .8125rem; }
.overview-card h3 { margin: 0; font-size: clamp(1.25rem, 1.8vw, 1.6rem); line-height: 1.45; }
.overview-card > p:not(.section-index) { margin: .6rem 0 1rem; color: #46687b; font-size: 1rem; line-height: 1.7; }
.overview-card ul { padding-left: 1.15rem; margin: 0; display: grid; gap: .65rem; color: #365a70; font-size: 1rem; line-height: 1.7; }
.overview-card li::marker { color: #3496c0; }
.overview-card strong { color: #163e54; font-weight: 600; }
.final-cta { padding-top: 2.5rem; padding-bottom: 2.5rem; align-items: center; gap: 2rem; }
.final-cta h2 { font-size: clamp(1.6rem, 2.5vw, 2.4rem); }
.final-cta .section-index { margin-bottom: .5rem; }
@media (max-width: 900px) {
  .overview-heading { display: block; }
  .overview-heading > p { max-width: none; margin-top: .75rem; }
}
@media (max-width: 640px) {
  .overview-grid { grid-template-columns: 1fr; }
}
.everyday-settings { padding: 2.5rem var(--pad) 3rem; background: #eef9fd; border-top: 1px solid var(--line); }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2rem; margin: 0; }
.settings-grid > div { padding: 1.15rem 0; border-top: 1px solid var(--line); }
.settings-grid dt { font-weight: 600; font-size: 1.0625rem; color: #163e54; }
.settings-grid dd { margin: .4rem 0 0; color: #365a70; font-size: 1rem; line-height: 1.75; }
@media (max-width: 640px) {
  .settings-grid { grid-template-columns: 1fr; }
}
/* Reading remains possible with scripts disabled or a failed observer. */
main > section:not(.uranus-hero) { opacity: 1; transform: none; }
@media (min-width: 1600px) {
  body[data-page="index"] { --pad: max(5rem, calc((100vw - 1440px) / 2)); }
}
@media (max-width: 900px) {
  .uranus-hero { min-height: auto; grid-template-columns: 1fr; padding-top: 8rem; }
  .hero-copy h1 { font-size: clamp(2.6rem, 6vw, 4.5rem); }
  .planet-panel { width: min(100%, 720px); margin: 1.5rem auto 0; }
  .planet-panel img { width: 100%; }
  .manifesto, .library-section, .metadata-section, .final-cta { grid-template-columns: 1fr; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-wide { min-height: auto; }
}
@media (max-width: 640px) {
  .top { padding-block: .7rem; }
  .top-brand img { width: 32px; height: 32px; }
  .top-nav { display: flex; gap: 1rem; }
  .top-nav a { display: none; }
  .top-nav a:last-child, .top-nav a:nth-last-child(2) { display: inline; }
  .uranus-hero { grid-template-columns: 1fr; padding-top: 6.5rem; padding-bottom: 2rem; }
  .hero-copy h1 { font-size: clamp(2rem, 9vw, 3.6rem); }
  .planet-panel { width: 100%; max-width: none; margin: .5rem auto 2rem; }
  .planet-panel img { width: 100%; }
  .signal { bottom: -.5rem; font-size: .75rem; }
  .hero-specs { position: static; grid-template-columns: 1fr; gap: .85rem; margin-top: 1.5rem; }
  .hero-specs div { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: .75rem; align-items: baseline; }
  .hero-specs div { flex: 1; }
  .hero-specs span { font-size: .875rem; letter-spacing: 0; }
  .audio-path { gap: .4rem; font-size: .75rem; margin-top: 3rem; }
  .performance-grid { grid-template-columns: 1fr; }
}