/* Shared light-mode surface and control styling. Layout dimensions stay in the
   original stylesheet; this file changes palette, contrast, and theme chrome. */

:root {
  color-scheme: dark;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #edf5fb;
  --bg-deep: #dceaf4;
  --ink: #102a3f;
  --muted: rgba(16, 42, 63, 0.7);
  --accent: #058fa6;
  --accent-2: #6957c6;
  --accent-3: #348ac4;
  --accent-soft: rgba(5, 143, 166, 0.14);
  --panel: rgba(255, 255, 255, 0.78);
  --panel-strong: rgba(255, 255, 255, 0.95);
  --glow: rgba(5, 143, 166, 0.25);
  --border-soft: rgba(18, 64, 94, 0.14);
  --shadow-soft: 0 18px 45px rgba(38, 78, 108, 0.14);
  --shadow-strong: 0 24px 60px rgba(38, 78, 108, 0.2);
}

html[data-theme="light"],
html[data-theme="light"] body {
  background-color: var(--bg);
}

html[data-theme="light"] body {
  background: radial-gradient(circle at top, #ffffff 0%, var(--bg) 46%, #dbe9f3 100%);
  color: var(--ink);
}

html[data-theme="light"] body::before {
  background:
    radial-gradient(circle at 50% 12%, rgba(5, 143, 166, 0.08), transparent 55%),
    radial-gradient(circle at 50% 55%, transparent, rgba(40, 91, 123, 0.04) 72%, rgba(40, 91, 123, 0.1) 100%);
}

html[data-theme="light"] body::after {
  background-image:
    linear-gradient(90deg, rgba(5, 143, 166, 0.055) 1px, transparent 1px),
    linear-gradient(0deg, rgba(5, 143, 166, 0.055) 1px, transparent 1px),
    radial-gradient(circle, rgba(5, 143, 166, 0.42) 0 1.2px, transparent 2.8px),
    radial-gradient(circle, rgba(105, 87, 198, 0.28) 0 1px, transparent 2.4px),
    radial-gradient(circle, rgba(22, 68, 99, 0.18) 0 0.9px, transparent 2px);
  opacity: 0.36;
}

html[data-theme="light"] main::before {
  background-image:
    repeating-linear-gradient(110deg, rgba(5, 143, 166, 0.07) 0 1px, transparent 1px 160px),
    repeating-linear-gradient(12deg, rgba(5, 143, 166, 0.055) 0 1px, transparent 1px 220px),
    radial-gradient(circle at 30% 40%, rgba(5, 143, 166, 0.16) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 60%, rgba(105, 87, 198, 0.14) 0 2px, transparent 3px),
    radial-gradient(circle at 50% 20%, rgba(5, 143, 166, 0.12) 0 2px, transparent 3px);
  opacity: 0.1;
}

html[data-theme="light"] main::after {
  opacity: 0.035;
}

/* The fixed dimensions intentionally mirror the existing nav controls. */
.nav-actions {
  flex: 0 0 auto;
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  width: 6.15rem;
  height: 2.85rem;
  padding: 0 0.75rem;
  border: 1px solid rgba(126, 214, 231, 0.2);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.035);
  color: rgba(241, 245, 255, 0.82);
  font: inherit;
  font-size: 0.76rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition:
    color 0.28s ease,
    background 0.28s ease,
    border-color 0.28s ease,
    box-shadow 0.28s ease,
    transform 0.24s ease;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  color: #ffffff;
  background: rgba(89, 247, 255, 0.1);
  border-color: rgba(89, 247, 255, 0.42);
  box-shadow: 0 0 20px rgba(89, 247, 255, 0.12);
  outline: none;
  transform: translateY(-1px);
}

.theme-toggle:focus-visible {
  box-shadow:
    0 0 0 3px rgba(5, 143, 166, 0.2),
    0 0 20px rgba(89, 247, 255, 0.12);
}

.theme-toggle-icon {
  display: grid;
  flex: 0 0 1rem;
  place-items: center;
  width: 1rem;
  height: 1rem;
}

.theme-toggle-icon svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.theme-toggle-icon-sun svg circle {
  fill: currentColor;
  stroke: none;
}

.theme-toggle-icon-moon {
  display: none;
}

.theme-toggle-label {
  min-width: 2.65rem;
  text-align: left;
}

html[data-theme="light"] .theme-toggle {
  border-color: rgba(18, 88, 111, 0.22);
  background: rgba(255, 255, 255, 0.72);
  color: #17516b;
  box-shadow: 0 8px 22px rgba(38, 78, 108, 0.08);
}

html[data-theme="light"] .theme-toggle:hover,
html[data-theme="light"] .theme-toggle:focus-visible {
  color: #103d58;
  background: rgba(5, 143, 166, 0.1);
  border-color: rgba(5, 143, 166, 0.46);
  box-shadow: 0 0 20px rgba(5, 143, 166, 0.14);
}

html[data-theme="light"] .theme-toggle-icon-sun {
  display: none;
}

html[data-theme="light"] .theme-toggle-icon-moon {
  display: grid;
}

html[data-theme="light"] .nav-shell {
  --nav-surface: rgba(255, 255, 255, 0.72);
  border-color: rgba(53, 133, 153, 0.22);
  box-shadow: var(--shadow-soft), 0 0 22px rgba(5, 143, 166, 0.08);
}

html[data-theme="light"] .site-header.is-scrolled .nav-shell,
html[data-theme="light"] .site-header.is-open .nav-shell {
  --nav-surface: rgba(255, 255, 255, 0.92);
  border-color: rgba(53, 133, 153, 0.3);
  box-shadow: var(--shadow-strong), 0 0 24px rgba(5, 143, 166, 0.1);
}

html[data-theme="light"] .brand-name {
  background: linear-gradient(105deg, #16324b 0%, #058fa6 58%, #6957c6 100%);
  background-clip: text;
  -webkit-background-clip: text;
}

html[data-theme="light"] .nav-link,
html[data-theme="light"] .nav-dropdown-toggle {
  color: rgba(16, 42, 63, 0.76);
}

html[data-theme="light"] .nav-link:hover,
html[data-theme="light"] .nav-link:focus-visible,
html[data-theme="light"] .nav-dropdown-toggle:hover,
html[data-theme="light"] .nav-dropdown-toggle:focus-visible,
html[data-theme="light"] .nav-link.is-active,
html[data-theme="light"] .nav-dropdown.is-open .nav-dropdown-toggle {
  color: #102a3f;
  background: rgba(5, 143, 166, 0.08);
}

html[data-theme="light"] .mega-menu {
  border-color: rgba(35, 101, 127, 0.16);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(239, 247, 252, 0.98)),
    rgba(255, 255, 255, 0.98);
  box-shadow: 0 30px 80px rgba(37, 76, 104, 0.2);
  color: var(--ink);
}

html[data-theme="light"] .mega-menu-kicker,
html[data-theme="light"] .section-kicker {
  color: rgba(16, 42, 63, 0.56);
}

html[data-theme="light"] .product-card {
  border-color: rgba(18, 64, 94, 0.1);
  background: rgba(255, 255, 255, 0.64);
  color: var(--ink);
}

html[data-theme="light"] .product-card:hover,
html[data-theme="light"] .product-card:focus-visible {
  border-color: rgba(5, 143, 166, 0.32);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 20px 35px rgba(37, 76, 104, 0.12);
}

html[data-theme="light"] .product-card-featured {
  border-color: rgba(5, 143, 166, 0.24);
  background:
    linear-gradient(135deg, rgba(5, 143, 166, 0.1), rgba(105, 87, 198, 0.08)),
    rgba(255, 255, 255, 0.82);
}

html[data-theme="light"] .product-card-upcoming,
html[data-theme="light"] .product-card-upcoming:hover {
  border-color: rgba(105, 87, 198, 0.28);
  background:
    linear-gradient(135deg, rgba(105, 87, 198, 0.09), rgba(255, 255, 255, 0.5)),
    rgba(255, 255, 255, 0.66);
}

html[data-theme="light"] .product-icon,
html[data-theme="light"] .showcase-icon {
  border-color: rgba(18, 64, 94, 0.12);
  background: linear-gradient(145deg, rgba(5, 143, 166, 0.16), rgba(52, 138, 196, 0.08));
  color: #08657a;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

html[data-theme="light"] .product-icon-auth-x,
html[data-theme="light"] .mobile-product-logo {
  border: 0;
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .product-icon-upcoming {
  border-color: rgba(105, 87, 198, 0.3);
  background: rgba(105, 87, 198, 0.1);
  color: #5f4aaf;
}

html[data-theme="light"] .product-name,
html[data-theme="light"] .mobile-product-card span:first-child {
  color: var(--ink);
}

html[data-theme="light"] .product-upcoming-label,
html[data-theme="light"] .mobile-product-upcoming-label {
  color: rgba(76, 65, 139, 0.72);
}

html[data-theme="light"] .product-badge {
  border-color: rgba(5, 143, 166, 0.28);
  background: rgba(5, 143, 166, 0.12);
  color: #08657a;
}

html[data-theme="light"] .button-link-muted {
  color: #1a4562;
  background: rgba(255, 255, 255, 0.64);
  border-color: rgba(18, 64, 94, 0.14);
}

html[data-theme="light"] .button-link-muted:hover,
html[data-theme="light"] .button-link-muted:focus-visible {
  background: rgba(255, 255, 255, 0.92);
  border-color: rgba(5, 143, 166, 0.28);
}

html[data-theme="light"] .button-link-primary {
  color: #06232d;
  background: linear-gradient(135deg, #54d9df, #83c7ef 48%, #b8b0ff 100%);
  box-shadow: 0 16px 34px rgba(5, 143, 166, 0.18);
}

html[data-theme="light"] .button-link-primary:hover,
html[data-theme="light"] .button-link-primary:focus-visible {
  box-shadow: 0 22px 42px rgba(5, 143, 166, 0.24);
}

html[data-theme="light"] .nav-toggle {
  border-color: rgba(18, 64, 94, 0.14);
  background: rgba(255, 255, 255, 0.66);
  color: #16415c;
}

html[data-theme="light"] .mobile-menu-inner {
  border-color: rgba(18, 64, 94, 0.13);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: var(--shadow-strong);
}

html[data-theme="light"] .mobile-nav-link,
html[data-theme="light"] .mobile-products-toggle {
  border-bottom-color: rgba(18, 64, 94, 0.1);
  color: var(--ink);
}

html[data-theme="light"] .mobile-product-card {
  border-color: rgba(18, 64, 94, 0.1);
  background: rgba(240, 247, 251, 0.82);
}

html[data-theme="light"] .mobile-product-card-featured {
  border-color: rgba(5, 143, 166, 0.24);
  background: linear-gradient(135deg, rgba(5, 143, 166, 0.1), rgba(105, 87, 198, 0.08));
}

html[data-theme="light"] .mobile-product-card-upcoming {
  border-color: rgba(105, 87, 198, 0.28);
  background: rgba(105, 87, 198, 0.07);
}

/* Home and shared section surfaces. */
html[data-theme="light"] .hero-bg {
  background:
    radial-gradient(circle at 25% 35%, rgba(5, 143, 166, 0.13), transparent 55%),
    radial-gradient(circle at 70% 20%, rgba(52, 138, 196, 0.12), transparent 52%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(222, 237, 247, 0.55));
}

html[data-theme="light"] .hero::before {
  background-image:
    linear-gradient(120deg, rgba(16, 42, 63, 0.065) 1px, transparent 1px),
    linear-gradient(60deg, rgba(16, 42, 63, 0.045) 1px, transparent 1px);
}

html[data-theme="light"] .hero::after {
  background: radial-gradient(circle at 50% 10%, rgba(5, 143, 166, 0.08), transparent 55%);
}

html[data-theme="light"] .logo,
html[data-theme="light"] .device {
  filter: drop-shadow(0 20px 50px rgba(31, 72, 104, 0.22));
}

html[data-theme="light"] .hero-content::after {
  background: radial-gradient(ellipse at center, rgba(31, 72, 104, 0.18), transparent 70%);
}

html[data-theme="light"] .hero-core {
  background:
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.94) 0%, rgba(235, 246, 251, 0.92) 55%, rgba(214, 233, 242, 0.82) 100%);
  box-shadow:
    0 0 60px rgba(38, 121, 153, 0.2),
    inset 0 0 40px rgba(5, 143, 166, 0.1);
}

html[data-theme="light"] .hero-core::before {
  border-color: rgba(5, 143, 166, 0.18);
  box-shadow:
    0 0 0 20px rgba(5, 143, 166, 0.05),
    0 0 0 42px rgba(105, 87, 198, 0.035);
}

html[data-theme="light"] .hero-tagline,
html[data-theme="light"] .hero-feature:nth-child(2) {
  color: rgba(16, 42, 63, 0.62);
}

html[data-theme="light"] .hero-feature:nth-child(3) {
  color: rgba(52, 121, 174, 0.92);
}

html[data-theme="light"] .narrative {
  background:
    linear-gradient(180deg, rgba(227, 239, 247, 0.4), rgba(237, 245, 251, 0.74)),
    radial-gradient(circle at 20% 80%, rgba(5, 143, 166, 0.1), transparent 55%);
}

html[data-theme="light"] .network,
html[data-theme="light"] .products-section,
html[data-theme="light"] .about-section {
  background:
    radial-gradient(circle at 80% 10%, rgba(5, 143, 166, 0.1), transparent 48%),
    linear-gradient(180deg, rgba(226, 239, 247, 0.78), rgba(237, 245, 251, 0.92));
}

html[data-theme="light"] .products-section {
  background:
    radial-gradient(circle at 15% 10%, rgba(5, 143, 166, 0.1), transparent 35%),
    linear-gradient(180deg, rgba(228, 241, 248, 0.86), rgba(237, 245, 251, 0.96));
}

html[data-theme="light"] .about-section {
  background:
    radial-gradient(circle at 85% 15%, rgba(52, 138, 196, 0.09), transparent 34%),
    linear-gradient(180deg, rgba(229, 241, 248, 0.86), rgba(237, 245, 251, 0.96));
}

html[data-theme="light"] .showcase-card,
html[data-theme="light"] .about-panel,
html[data-theme="light"] .contact-panel {
  border-color: rgba(18, 64, 94, 0.13);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(241, 248, 252, 0.86));
  box-shadow: var(--shadow-soft);
}

html[data-theme="light"] .showcase-card-featured {
  background:
    linear-gradient(150deg, rgba(5, 143, 166, 0.1), rgba(105, 87, 198, 0.09)),
    linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(239, 247, 251, 0.92));
  border-color: rgba(5, 143, 166, 0.24);
}

html[data-theme="light"] .about-metric {
  border-color: rgba(18, 64, 94, 0.14);
  background: rgba(240, 247, 251, 0.72);
}

html[data-theme="light"] .about-metric strong {
  color: #102a3f;
  text-shadow: none;
}

html[data-theme="light"] .about-metric span {
  color: rgba(16, 42, 63, 0.68);
}

html[data-theme="light"] .showcase-list li {
  color: rgba(16, 42, 63, 0.86);
}

html[data-theme="light"] .packet {
  color: #123b53;
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(5, 143, 166, 0.38);
  box-shadow: 0 0 18px rgba(5, 143, 166, 0.16);
}

html[data-theme="light"] .packet-body {
  color: #123b53;
}

html[data-theme="light"] .accent {
  color: #163c57;
  text-shadow: 0 0 22px rgba(5, 143, 166, 0.25);
}

html[data-theme="light"] .network-server,
html[data-theme="light"] .network-node,
html[data-theme="light"] .network-cipher {
  box-shadow: 0 12px 24px rgba(38, 78, 108, 0.14), 0 0 18px rgba(5, 143, 166, 0.06);
}

html[data-theme="light"] .network-server {
  border-color: rgba(105, 87, 198, 0.36);
  background: linear-gradient(135deg, rgba(242, 239, 255, 0.96), rgba(237, 247, 251, 0.96));
}

html[data-theme="light"] .network-server strong,
html[data-theme="light"] .network-node strong {
  color: #16344b;
}

html[data-theme="light"] .network-server > div:nth-child(2) span,
html[data-theme="light"] .network-node-top,
html[data-theme="light"] .network-legend,
html[data-theme="light"] .network-viz-topline,
html[data-theme="light"] .network-live {
  color: rgba(16, 42, 63, 0.58);
}

html[data-theme="light"] .network-node {
  border-color: rgba(52, 138, 196, 0.28);
  background: linear-gradient(145deg, rgba(238, 249, 252, 0.96), rgba(222, 239, 247, 0.96));
}

html[data-theme="light"] .network-cipher {
  border-color: rgba(5, 143, 166, 0.24);
  background: rgba(235, 249, 251, 0.92);
  color: rgba(10, 76, 97, 0.84);
}

/* Auth-X product surfaces and charts. */
html[data-theme="light"] .auth-x-section {
  background:
    radial-gradient(circle at 10% 12%, rgba(5, 143, 166, 0.12), transparent 30%),
    radial-gradient(circle at 92% 72%, rgba(105, 87, 198, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(228, 241, 248, 0.96), rgba(237, 245, 251, 1));
}

html[data-theme="light"] .auth-x-eyebrow,
html[data-theme="light"] .founder-contact-eyebrow {
  color: rgba(16, 42, 63, 0.62);
}

html[data-theme="light"] .auth-x-title,
html[data-theme="light"] .auth-x-flow-card h3,
html[data-theme="light"] .auth-x-feature-card h3,
html[data-theme="light"] .auth-x-chart h3,
html[data-theme="light"] .auth-x-visual-core strong {
  color: #102a3f;
  text-shadow: none;
}

html[data-theme="light"] .auth-x-lede,
html[data-theme="light"] .auth-x-flow-card p,
html[data-theme="light"] .auth-x-feature-card p,
html[data-theme="light"] .auth-x-stat-card > span,
html[data-theme="light"] .auth-x-about-copy,
html[data-theme="light"] .auth-x-product-footer strong {
  color: rgba(16, 42, 63, 0.7);
}

html[data-theme="light"] .auth-x-hero-visual,
html[data-theme="light"] .auth-x-signal-flow {
  background:
    radial-gradient(circle at 50% 48%, rgba(5, 143, 166, 0.09), transparent 32%),
    linear-gradient(150deg, rgba(255, 255, 255, 0.24), rgba(226, 240, 248, 0.12));
}

html[data-theme="light"] .auth-x-visual-core {
  border-color: rgba(18, 64, 94, 0.18);
  background: radial-gradient(circle, rgba(255, 255, 255, 0.98), rgba(224, 240, 248, 0.96));
  box-shadow: 0 0 0 12px rgba(5, 143, 166, 0.05), 0 0 55px rgba(5, 143, 166, 0.16);
}

html[data-theme="light"] .auth-x-visual-node {
  border-color: rgba(18, 64, 94, 0.14);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 18px 30px rgba(38, 78, 108, 0.12);
}

html[data-theme="light"] .auth-x-visual-node strong,
html[data-theme="light"] .auth-x-visual-core small,
html[data-theme="light"] .auth-x-visual-node small,
html[data-theme="light"] .auth-x-visual-status,
html[data-theme="light"] .auth-x-signal-participant small,
html[data-theme="light"] .auth-x-signal-copy small,
html[data-theme="light"] .auth-x-signal-copy strong,
html[data-theme="light"] .auth-x-signal-participant strong {
  color: rgba(16, 42, 63, 0.66);
}

html[data-theme="light"] .auth-x-flow-card,
html[data-theme="light"] .auth-x-feature-card,
html[data-theme="light"] .auth-x-stat-card,
html[data-theme="light"] .auth-x-chart,
html[data-theme="light"] .auth-x-range-plot {
  border-color: rgba(18, 64, 94, 0.12);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(239, 247, 251, 0.86));
  box-shadow: var(--shadow-soft);
}

html[data-theme="light"] .auth-x-feature-card,
html[data-theme="light"] .auth-x-stat-card-accent {
  border-color: rgba(5, 143, 166, 0.24);
  background:
    linear-gradient(135deg, rgba(5, 143, 166, 0.09), rgba(105, 87, 198, 0.08)),
    rgba(255, 255, 255, 0.84);
}

html[data-theme="light"] .auth-x-flow-chip,
html[data-theme="light"] .auth-x-chart-scale,
html[data-theme="light"] .auth-x-primitives-status {
  border-color: rgba(5, 143, 166, 0.2);
  color: rgba(10, 76, 97, 0.72);
}

html[data-theme="light"] .auth-x-stat-card strong,
html[data-theme="light"] .auth-x-chart-label strong,
html[data-theme="light"] .auth-x-benchmark-label strong {
  color: #102a3f;
}

html[data-theme="light"] .auth-x-stat-card small,
html[data-theme="light"] .auth-x-chart-axis,
html[data-theme="light"] .auth-x-chart figcaption,
html[data-theme="light"] .auth-x-range-average strong,
html[data-theme="light"] .auth-x-range-min,
html[data-theme="light"] .auth-x-range-max,
html[data-theme="light"] .auth-x-range-legend,
html[data-theme="light"] .auth-x-benchmark-label,
html[data-theme="light"] .auth-x-chart-label {
  color: rgba(16, 42, 63, 0.58);
}

html[data-theme="light"] .auth-x-benchmark-track,
html[data-theme="light"] .auth-x-chart-track {
  border-color: rgba(18, 64, 94, 0.12);
  background:
    repeating-linear-gradient(90deg, rgba(18, 64, 94, 0.09) 0 1px, transparent 1px 20%),
    rgba(222, 237, 245, 0.76);
}

html[data-theme="light"] .auth-x-range-grid {
  background: repeating-linear-gradient(90deg, rgba(18, 64, 94, 0.09) 0 1px, transparent 1px 33.333%);
}

html[data-theme="light"] .auth-x-product-footer {
  border-top-color: rgba(18, 64, 94, 0.12);
}

html[data-theme="light"] .auth-x-signal-line {
  border-top-color: rgba(5, 143, 166, 0.42);
}

html[data-theme="light"] .auth-x-signal-row-reverse .auth-x-signal-line {
  border-top-color: rgba(105, 87, 198, 0.44);
}

html[data-theme="light"] .auth-x-signal-line::after,
html[data-theme="light"] .auth-x-signal-row-reverse .auth-x-signal-line::after {
  border-color: rgba(16, 72, 95, 0.9);
}

html[data-theme="light"] .auth-x-orbit-word,
html[data-theme="light"] .auth-x-primitives-core span {
  color: #102a3f;
  text-shadow: 0 0 24px rgba(5, 143, 166, 0.3);
}

html[data-theme="light"] .auth-x-orbit-ring {
  border-color: rgba(5, 143, 166, 0.72);
  box-shadow:
    0 0 18px rgba(5, 143, 166, 0.26),
    0 0 0 1px rgba(5, 143, 166, 0.08);
}

html[data-theme="light"] .auth-x-orbit-ring-two {
  border-color: rgba(105, 87, 198, 0.62);
  box-shadow:
    0 0 18px rgba(105, 87, 198, 0.24),
    0 0 0 1px rgba(105, 87, 198, 0.08);
}

html[data-theme="light"] .auth-x-orbit-ring::before {
  background: #058fa6;
  box-shadow: 0 0 14px rgba(5, 143, 166, 0.78);
}

html[data-theme="light"] .auth-x-orbit-ring::after {
  background: #6957c6;
  box-shadow: 0 0 14px rgba(105, 87, 198, 0.72);
}

/* About and contact pages. */
html[data-theme="light"] .about-lore-hero,
html[data-theme="light"] .founder-contact-hero {
  background:
    radial-gradient(circle at 13% 22%, rgba(5, 143, 166, 0.13), transparent 30%),
    radial-gradient(circle at 91% 72%, rgba(105, 87, 198, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(238, 247, 251, 0.98), rgba(224, 239, 247, 0.98));
}

html[data-theme="light"] .about-story-section,
html[data-theme="light"] .about-evidence-section,
html[data-theme="light"] .about-principles-section,
html[data-theme="light"] .about-next-section {
  color: var(--ink);
}

html[data-theme="light"] .about-story-section {
  background:
    radial-gradient(circle at 82% 18%, rgba(105, 87, 198, 0.09), transparent 34%),
    linear-gradient(180deg, rgba(232, 243, 249, 0.98), rgba(239, 247, 251, 0.98));
}

html[data-theme="light"] .about-evidence-section {
  background:
    radial-gradient(circle at 18% 18%, rgba(5, 143, 166, 0.09), transparent 32%),
    linear-gradient(180deg, rgba(239, 247, 251, 0.98), rgba(231, 243, 249, 0.98));
}

html[data-theme="light"] .about-principles-section {
  background:
    radial-gradient(circle at 12% 35%, rgba(5, 143, 166, 0.08), transparent 32%),
    linear-gradient(180deg, rgba(231, 243, 249, 0.98), rgba(239, 247, 251, 0.98));
}

html[data-theme="light"] .about-next-section {
  background:
    radial-gradient(circle at 72% 28%, rgba(5, 143, 166, 0.1), transparent 48%),
    linear-gradient(180deg, rgba(239, 247, 251, 0.98), rgba(223, 238, 247, 0.98));
}

html[data-theme="light"] .about-lore-hero::before,
html[data-theme="light"] .founder-contact-hero::before,
html[data-theme="light"] .founder-profile-grid {
  background-image:
    linear-gradient(rgba(5, 143, 166, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 143, 166, 0.07) 1px, transparent 1px);
}

html[data-theme="light"] .about-lore-title,
html[data-theme="light"] .about-section-title,
html[data-theme="light"] .about-next-title,
html[data-theme="light"] .founder-contact-title,
html[data-theme="light"] .founder-profile-person h2,
html[data-theme="light"] .about-origin-title,
html[data-theme="light"] .about-evidence-card h3,
html[data-theme="light"] .about-story-copy h3,
html[data-theme="light"] .about-principle-card h3 {
  color: #102a3f;
  text-shadow: none;
}

html[data-theme="light"] .about-lore-lede,
html[data-theme="light"] .about-section-summary,
html[data-theme="light"] .about-story-copy p,
html[data-theme="light"] .about-origin-copy,
html[data-theme="light"] .about-next-copy,
html[data-theme="light"] .about-evidence-card p,
html[data-theme="light"] .founder-contact-lede,
html[data-theme="light"] .founder-profile-copy {
  color: rgba(16, 42, 63, 0.7);
}

html[data-theme="light"] .about-lore-link:hover,
html[data-theme="light"] .about-lore-link:focus-visible,
html[data-theme="light"] .founder-profile-footer a:hover,
html[data-theme="light"] .founder-profile-footer a:focus-visible {
  color: #0b647e;
  border-color: #0b647e;
}

html[data-theme="light"] .about-lore-link-muted {
  color: rgba(16, 42, 63, 0.64);
  border-color: rgba(16, 42, 63, 0.24);
}

html[data-theme="light"] .about-origin-card,
html[data-theme="light"] .founder-profile-card,
html[data-theme="light"] .about-next-card,
html[data-theme="light"] .about-evidence-card,
html[data-theme="light"] .about-principle-card {
  border-color: rgba(18, 64, 94, 0.14);
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.9), rgba(234, 245, 250, 0.92)),
    rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow-soft);
}

html[data-theme="light"] .about-evidence-card-award,
html[data-theme="light"] .about-principle-card:nth-child(2) {
  border-color: rgba(105, 87, 198, 0.24);
  background: linear-gradient(150deg, rgba(243, 240, 255, 0.9), rgba(234, 245, 250, 0.94));
}

html[data-theme="light"] .about-principle-card p {
  color: rgba(16, 42, 63, 0.7);
}

html[data-theme="light"] .about-origin-head,
html[data-theme="light"] .about-origin-foot,
html[data-theme="light"] .about-origin-identity-label,
html[data-theme="light"] .about-evidence-caption-head,
html[data-theme="light"] .about-story-label,
html[data-theme="light"] .founder-profile-head,
html[data-theme="light"] .founder-profile-role,
html[data-theme="light"] .founder-profile-footer,
html[data-theme="light"] .founder-contact-note {
  color: rgba(16, 42, 63, 0.58);
}

html[data-theme="light"] .about-origin-cross {
  border-color: rgba(5, 143, 166, 0.3);
  color: #0a5d76;
  background: rgba(239, 250, 252, 0.94);
  box-shadow: 0 0 28px rgba(5, 143, 166, 0.14);
  text-shadow: none;
}

html[data-theme="light"] .about-origin-logo-aspid {
  background: transparent;
  box-shadow: none;
}

html[data-theme="light"] .about-origin-logo-aspid img {
  background: transparent;
  mix-blend-mode: multiply;
  filter: drop-shadow(0 10px 18px rgba(38, 78, 108, 0.14));
}

html[data-theme="light"] .about-evidence-image {
  background: #dcecf4;
}

html[data-theme="light"] .about-story-list,
html[data-theme="light"] .about-story-row,
html[data-theme="light"] .founder-focus-list div,
html[data-theme="light"] .founder-profile-footer {
  border-color: rgba(18, 64, 94, 0.12);
}

html[data-theme="light"] .founder-profile-card::before,
html[data-theme="light"] .about-origin-card::before {
  background: linear-gradient(90deg, transparent, #0b849b, rgba(105, 87, 198, 0.78), transparent);
  box-shadow: 0 0 18px rgba(5, 143, 166, 0.2);
}

html[data-theme="light"] .founder-avatar {
  border-color: rgba(18, 64, 94, 0.18);
  background: #dcecf4;
  box-shadow:
    0 0 0 0.45rem rgba(5, 143, 166, 0.04),
    0 20px 42px rgba(38, 78, 108, 0.16),
    0 0 24px rgba(5, 143, 166, 0.1);
}

html[data-theme="light"] .founder-avatar::before {
  background: linear-gradient(180deg, transparent 58%, rgba(16, 42, 63, 0.12));
}

html[data-theme="light"] .founder-focus-list strong {
  color: rgba(16, 42, 63, 0.82);
}

/* Auth-X primitives are in their own stylesheet, so keep their light surface
   overrides here after that stylesheet in the cascade. */
html[data-theme="light"] .auth-x-primitives-stage {
  border-color: rgba(18, 64, 94, 0.13);
  background:
    radial-gradient(circle at 10% 0%, rgba(5, 143, 166, 0.1), transparent 35%),
    radial-gradient(circle at 92% 100%, rgba(105, 87, 198, 0.1), transparent 38%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(232, 244, 249, 0.94));
}

html[data-theme="light"] .auth-x-primitives-stage::before {
  background-image:
    linear-gradient(rgba(5, 143, 166, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(5, 143, 166, 0.08) 1px, transparent 1px);
}

html[data-theme="light"] .auth-x-primitives-core {
  border-color: rgba(18, 64, 94, 0.2);
  background:
    radial-gradient(circle at 35% 25%, rgba(5, 143, 166, 0.16), transparent 46%),
    radial-gradient(circle, rgba(255, 255, 255, 0.98), rgba(222, 239, 247, 0.98));
  box-shadow:
    0 0 0 0.7rem rgba(5, 143, 166, 0.045),
    0 0 0 1.3rem rgba(105, 87, 198, 0.03),
    0 0 48px rgba(5, 143, 166, 0.18);
}

html[data-theme="light"] .auth-x-primitives-core small,
html[data-theme="light"] .auth-x-primitives-note {
  color: rgba(16, 42, 63, 0.56);
}

html[data-theme="light"] .auth-x-primitive-card {
  border-color: rgba(5, 143, 166, 0.26);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.9), rgba(229, 242, 248, 0.94));
  box-shadow: 0 16px 34px rgba(38, 78, 108, 0.14), 0 0 22px rgba(5, 143, 166, 0.06);
}

html[data-theme="light"] .auth-x-primitive-card-hmac,
html[data-theme="light"] .auth-x-primitive-card-x25519 {
  border-color: rgba(105, 87, 198, 0.3);
  box-shadow: 0 16px 34px rgba(38, 78, 108, 0.14), 0 0 22px rgba(105, 87, 198, 0.07);
}

html[data-theme="light"] .auth-x-primitive-card-ascon {
  border-color: rgba(213, 143, 53, 0.32);
}

html[data-theme="light"] .auth-x-primitive-card h3 {
  color: #102a3f;
}

html[data-theme="light"] .auth-x-primitive-mark {
  border-color: rgba(5, 143, 166, 0.3);
  background: rgba(5, 143, 166, 0.07);
}

html[data-theme="light"] .auth-x-primitive-mark-hmac,
html[data-theme="light"] .auth-x-primitive-mark-x25519 {
  border-color: rgba(105, 87, 198, 0.3);
  background: rgba(105, 87, 198, 0.07);
}

/* Footer contrast follows the same light surface hierarchy. */
html[data-theme="light"] .site-footer {
  border-top-color: rgba(53, 133, 153, 0.16);
  background: linear-gradient(180deg, rgba(230, 241, 248, 0.28), rgba(212, 229, 239, 0.88));
}

html[data-theme="light"] .site-footer-branding p,
html[data-theme="light"] .site-footer-nav a,
html[data-theme="light"] .site-footer-meta,
html[data-theme="light"] .site-footer-meta p {
  color: rgba(16, 42, 63, 0.58);
}

html[data-theme="light"] .site-footer-nav a:hover,
html[data-theme="light"] .site-footer-nav a:focus-visible {
  color: #058fa6;
}

html[data-theme="light"] .site-footer-meta {
  border-top-color: rgba(53, 133, 153, 0.14);
}

@media (max-width: 768px) {
  .nav-actions {
    gap: 0.5rem;
  }

  .theme-toggle {
    width: 2.9rem;
    min-width: 2.9rem;
    padding: 0;
  }

  .theme-toggle-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}