/* Shared landing-site palette and depth. Existing layouts and controls stay intact. */
.landing-page {
  --bg: #08090c; --surface: #111216; --surface-2: #1b1d24;
  --ink: #f2f2f7; --muted: #adb0be; --line: #30333e; --lime: #b8b1ee; --dark: #19172c;
  --depth-page: radial-gradient(ellipse 80% 650px at 90% 0%, #7660ba18, transparent 75%), linear-gradient(160deg, #101015 0%, #080a0d 42%, #050608 100%);
  --depth-nav: linear-gradient(180deg, #131318 0%, #080a0d 100%);
  --depth-panel: linear-gradient(145deg, #201e29 0%, #12151c 45%, #0b0e13 100%);
  --depth-card: linear-gradient(145deg, #1d1c25 0%, #14171e 45%, #0e1218 100%);
  --depth-card-hover: linear-gradient(145deg, #2a2638 0%, #1b2230 50%, #141b25 100%);
  --depth-section: radial-gradient(ellipse at 15% 25%, #7054ad1c, transparent 65%), linear-gradient(130deg, #13121b, #090d12 80%);
  --depth-button: linear-gradient(145deg, #ddd0ff 0%, #b9bcfa 45%, #84b1f0 100%);
  --depth-button-hover: linear-gradient(145deg, #ece1ff, #ccd0ff 45%, #a1c8ff);
  --depth-button-ink: #172140;
  --depth-dark-button: linear-gradient(145deg, #51477c, #303e70 48%, #1d3254);
  --depth-cta: radial-gradient(ellipse at 15% 5%, #7760bf26, transparent 60%), linear-gradient(130deg, #17151f, #0e131c 55%, #080c12);
  --depth-art-a: #272d3d; --depth-art-b: #111722; --depth-art-c: #414760; --depth-art-line: #6b7f9f;
  --depth-highlight: #ffffff0d;
  background: var(--depth-page);
}
html[data-theme='light'] .landing-page {
  --bg: #f4f5fb; --surface: #fff; --surface-2: #e6ebf8;
  --ink: #222b44; --muted: #586580; --line: #c7cfe5; --lime: #5854a4; --dark: #222344;
  --depth-page: radial-gradient(ellipse 85% 900px at 90% 0%, #b8a6e933, transparent 75%), linear-gradient(150deg, #ffffff 0%, #f0f2fb 45%, #e6ecf8 100%);
  --depth-nav: linear-gradient(180deg, #fff, #e9edfa);
  --depth-panel: linear-gradient(140deg, #ffffff 0%, #eae9f8 48%, #d6e5f6 100%);
  --depth-card: linear-gradient(145deg, #ffffff 0%, #efedf9 55%, #dfeaf8 100%);
  --depth-card-hover: linear-gradient(145deg, #ffffff 0%, #e4def6 50%, #cedff5 100%);
  --depth-section: radial-gradient(ellipse at 15% 25%, #ffffffb3, transparent 65%), linear-gradient(130deg, #eeebfa, #d8e6f7 80%);
  --depth-button: linear-gradient(145deg, #6b4daa 0%, #515eac 45%, #28649d 100%);
  --depth-button-hover: linear-gradient(145deg, #5d3f99, #444f9c 45%, #1d558d);
  --depth-button-ink: #fff;
  --depth-dark-button: linear-gradient(145deg, #594385, #384879 50%, #243d62);
  --depth-cta: radial-gradient(ellipse at 15% 5%, #ffffffb3, transparent 60%), linear-gradient(130deg, #e9dff8, #d7dff7 55%, #bed9f4);
  --depth-art-a: #d0ddf0; --depth-art-b: #e6eaf7; --depth-art-c: #afbae1; --depth-art-line: #697ca8;
  --depth-highlight: #ffffffb3;
}
html:root .landing-page .nav,
html:root .landing-page .nav-drawer { background: var(--depth-nav); }
html:root .landing-page .home-platform-map,
html:root .landing-page .preview,
html:root .landing-page .code-window,
html:root .landing-page .products-mega { background: var(--depth-panel); border-color: var(--line); box-shadow: inset 0 1px 0 var(--depth-highlight); }
html:root .landing-page .home-map-node,
html:root .landing-page .home-product-card,
html:root .landing-page .foundation-card { background: var(--depth-card); border-color: var(--line); box-shadow: inset 0 1px 0 var(--depth-highlight); }
html:root .landing-page .home-map-node:hover,
html:root .landing-page .home-product-card:hover { background: var(--depth-card-hover); }
html:root .landing-page .model-section { background: var(--depth-section); }
html:root .landing-page .cta-section { background: var(--depth-cta); color: var(--ink); }
html:root .landing-page .button {
  background: var(--depth-button); color: var(--depth-button-ink);
  box-shadow: inset 0 1px 0 #ffffff40, inset 0 -1px 0 #00000014, 0 4px 12px #0000001a;
}
html:root .landing-page .button:hover { background: var(--depth-button-hover); }
html:root .landing-page .button-dark,
html:root .landing-page .button-dark:hover { background: var(--depth-dark-button); color: #f4f2ff; }

/* Connector logos share the glass palette without recoloring brand artwork. */
html:root .landing-page .connector-chip {
  background: var(--glass-card); color: var(--muted); border-color: var(--glass-edge);
  box-shadow: inset 0 1px 0 var(--glass-highlight), inset 0 -1px 0 #00000014;
}
html:root .landing-page .connector-chip:hover { background: var(--glass-hover); border-color: var(--lime); color: var(--ink); }
html:root .landing-page .connection-heading > p { color: var(--ink); }
html:root .landing-page .connection-tools { color: var(--muted); }
html:root .landing-page .connector-marquee {
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}
@media(prefers-reduced-motion:reduce) {
  html:root .landing-page .connector-marquee { -webkit-mask-image: none; mask-image: none; }
}

/* Recolor the original illustrations without changing their geometry. */
html:root .landing-page .architecture [stroke] { stroke: var(--depth-art-line); }
html:root .landing-page .architecture :is([stroke='#ccff9b'],[stroke='#d4ffae']) { stroke: var(--lime); }
html:root .landing-page .architecture :is([fill='#141b17'],[fill='#1b2920'],[fill='#1c241e']) { fill: var(--depth-art-b); }
html:root .landing-page .architecture :is([fill='#263927'],[fill='#253128']) { fill: var(--depth-art-a); }
html:root .landing-page .architecture [fill='#3d5543'] { fill: var(--depth-art-c); }
html:root .landing-page .architecture [fill='#d4ffae'] { fill: var(--lime); }
html:root .landing-page .architecture [fill='#93bf68'] { fill: #7498d7; }
html:root .landing-page .architecture [fill='#b8e989'] { fill: #aaa0e3; }
html:root .landing-page .architecture [fill='#b4c0b4'] { fill: var(--muted); }
html:root .landing-page .architecture #plane stop:first-child { stop-color: var(--depth-art-a); }
html:root .landing-page .architecture #plane stop:last-child { stop-color: var(--depth-art-b); }
html:root .landing-page .architecture #core stop:first-child { stop-color: #ddceff; }
html:root .landing-page .architecture #core stop:last-child { stop-color: #9db9f6; }
html:root .landing-page .packet { fill: #e5dcff; }
html:root .landing-page .home-map-node::before { background: var(--depth-art-line); }
html:root .landing-page .home-map-icon { border-color: var(--line); }
html:root .landing-page .home-map-node strong { color: var(--ink); }
html:root .landing-page :is(.hero-lede,.home-map-node small,.desktop-nav a,.sign-in,.language,.home-product-card .learn-link) { color: var(--muted); }
html:root .landing-page :is(.home-map-node>span:last-child,.home-path-arrow) { color: var(--lime); }
html:root .landing-page .orbit { border-color: var(--depth-art-line); }
html:root .landing-page .orbit-label { background: var(--depth-card); border-color: var(--line); color: var(--ink); }
html:root .landing-page .orbit-core { background: var(--depth-panel); }
html:root .landing-page .storage-art i { background: #748fce; border-color: #637db9; }
html:root .landing-page .storage-art i:nth-child(n+5) { background: #9391c8; border-color: #7d7bb5; }
html:root .landing-page .storage-art i:nth-child(n+9) { background: #a8b8d5; border-color: #8b9cc0; }
html:root .landing-page :is(.pipeline-node,.entity,.products-mega-card) { background: var(--depth-card); border-color: var(--line); }
html:root .landing-page .node-output { border-color: var(--lime); animation-name: home-depth-pulse; }
html:root .landing-page :is(.home-path>a:hover,.products-mega-card:hover) { background: var(--depth-card-hover); }
html:root .landing-page .preview-table>div:first-child { background: var(--surface-2); color: var(--ink); }
html:root .landing-page .chart-bars i { background: #748fce; }
html:root .landing-page .chart-bars i:nth-child(2n) { background: #a597d9; }
html:root .landing-page :is(.check-list,.capability-tabs button>span:first-child,.journey-number span,.card-bottom) { color: var(--muted); }
html:root .landing-page .cta-section .eyebrow { color: var(--lime); }
html:root .landing-page .cta-actions .text-link:hover { color: var(--lime); }
html:root .landing-page .home-platform-map :is(.visual-topline,.visual-bottomline) { border-color: var(--line); }
@keyframes home-depth-pulse { 0%,70%,100% { border-color: var(--line); } 80%,90% { border-color: var(--lime); } }

/* One continuous glass backdrop behind every landing page. */
.landing-page {
  --glass-panel: linear-gradient(135deg, #c2b3ea1c 0%, #242632a8 30%, #0d121bd9 75%, #789fd51a);
  --glass-card: linear-gradient(140deg, #d8d1f21a 0%, #2528357a 40%, #0e141ea3 100%);
  --glass-hover: linear-gradient(140deg, #c5b4f12b 0%, #323b538f 45%, #172337b8 100%);
  --glass-nav: linear-gradient(180deg, #191923d9, #0a0d14e8);
  --glass-edge: #c4c9e429;
  --glass-highlight: #edf0ff21;
  --glass-atmosphere: radial-gradient(ellipse 70% 90% at 100% 5%, #7960b82e, transparent 72%), radial-gradient(ellipse 65% 85% at 0% 90%, #3b80b72b, transparent 72%);
  --glass-sheen: linear-gradient(118deg, transparent 12%, #dae4ff0a 13%, #c9d9ff02 29%, transparent 31%, transparent 65%, #b5a9e808 66%, transparent 85%);
  --glass-section: linear-gradient(125deg, #1b182369, #0f141b4d);
  --glass-pointer-light: #bdd5ff29;
  position: relative;
  isolation: isolate;
}
html[data-theme='light'] .landing-page {
  --glass-panel: linear-gradient(135deg, #ffffffed 0%, #eeedf8c9 35%, #dbe8f4b8 100%);
  --glass-card: linear-gradient(140deg, #fffffff0 0%, #eceaf7b3 45%, #dae6f3b8 100%);
  --glass-hover: linear-gradient(140deg, #fffffffa, #e1def3cc 45%, #cbdff2d9);
  --glass-nav: linear-gradient(180deg, #ffffffed, #e9edf9e6);
  --glass-edge: #727d9e45;
  --glass-highlight: #ffffffcc;
  --glass-atmosphere: radial-gradient(ellipse 70% 90% at 100% 5%, #a48cd638, transparent 72%), radial-gradient(ellipse 65% 85% at 0% 90%, #83b4dd38, transparent 72%);
  --glass-sheen: linear-gradient(118deg, transparent 12%, #ffffff66 13%, #ffffff0d 29%, transparent 31%, transparent 65%, #ffffff47 66%, transparent 85%);
  --glass-section: linear-gradient(125deg, #eeebf866, #dce8f04d);
  --glass-pointer-light: #ffffffb3;
}
html:root .landing-page::before,
html:root .landing-page::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
}
html:root .landing-page::before {
  z-index: -2;
  background: radial-gradient(ellipse 460px 340px at var(--glass-light-x, 70%) var(--glass-light-y, 240px), var(--glass-pointer-light), transparent 75%), var(--glass-atmosphere);
}
html:root .landing-page::after {
  z-index: -1;
  background: url('./site-vectors.svg') center / 100% 100% no-repeat, var(--glass-sheen);
  opacity: .7;
}
html:root .landing-page :is(.model-section,.cta-section,.connections) { background: transparent; }
html:root .landing-page .architecture [fill='url(#plane)'] { fill-opacity: .64; }
html:root .landing-page .architecture :is([fill='#141b17'],[fill='#1b2920']) { fill-opacity: .78; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html:root .landing-page .nav {
    background: var(--glass-nav);
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  }
  html:root .landing-page :is(.home-platform-map,.preview,.code-window,.foundation-card) {
    background: var(--glass-panel); border-color: var(--glass-edge);
    box-shadow: inset 0 1px 0 var(--glass-highlight), inset 0 -1px 0 #0000001a;
    -webkit-backdrop-filter: blur(14px) saturate(115%);
    backdrop-filter: blur(14px) saturate(115%);
  }
  html:root .landing-page :is(.home-map-node,.home-product-card) {
    background: var(--glass-card); border-color: var(--glass-edge);
    box-shadow: inset 0 1px 0 var(--glass-highlight);
  }
  html:root .landing-page :is(.home-map-node:hover,.home-product-card:hover) { background: var(--glass-hover); }
}
@media(max-width:700px) {
  html:root .landing-page::after { opacity: .55; }
}