:root {
  --matrix-background: #020503;
  --matrix-green: #00ff00;
  --matrix-head: #b8ffc8;
  --ekbe-signal: #61ff91;
  --ekbe-signal-hover: #8bffac;
  --ekbe-aqua: #67e89a;
  --ekbe-violet: #61d887;
  --ekbe-metal: #8b9b91;
  --ekbe-dark-background: #050907;
  --ekbe-dark-surface: #09120d;
  --ekbe-dark-raised: #0e1a13;
  --ekbe-dark-soft: #071009;
  --ekbe-dark-border: #1f3b29;
  --ekbe-dark-text: #f2f6f2;
  --ekbe-dark-text-secondary: #b9c8bd;
  --ekbe-dark-muted: #819087;
}

html {
  background: var(--matrix-background);
}

body {
  position: relative;
  z-index: 0;
  min-height: 100vh;
  isolation: isolate;
  background: transparent;
}

.matrix-rain {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  display: block;
  width: 100vw;
  height: 100vh;
  border: 0;
  background: var(--matrix-background);
  opacity: 0.72;
  filter: saturate(1.24) contrast(1.08);
  pointer-events: none;
  transition: opacity var(--ekbe-motion-base) var(--ekbe-ease);
}

.matrix-rain.is-paused {
  opacity: 0.18;
}

:root[data-theme="light"] .matrix-rain {
  opacity: 0.16;
}

main {
  position: relative;
  z-index: 0;
  background: color-mix(in srgb, var(--ekbe-dark-background) 18%, transparent);
}

:root[data-theme="light"] main {
  background: color-mix(in srgb, var(--ekbe-light-background) 94%, transparent);
}

.site-header {
  border-bottom-color: color-mix(in srgb, var(--matrix-green) 18%, transparent);
  background: color-mix(in srgb, var(--ekbe-dark-background) 84%, transparent);
}

.brand img,
.footer-mark img {
  width: 209px;
  height: auto;
}

.rain-button {
  display: grid;
  min-width: 44px;
  min-height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid var(--ekbe-dark-border);
  border-radius: var(--ekbe-radius-control);
  background: var(--ekbe-dark-surface);
  color: var(--ekbe-signal);
  cursor: pointer;
  font-family: var(--ekbe-font-code);
  font-size: 0.92rem;
}

.rain-button:hover {
  border-color: var(--ekbe-signal);
  background: color-mix(in srgb, var(--ekbe-signal) 8%, var(--ekbe-dark-surface));
}

.rain-button[aria-pressed="true"] {
  color: var(--ekbe-dark-muted);
}

.rain-button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.platform-hero {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--matrix-green) 7%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--matrix-green) 6%, transparent) 1px, transparent 1px),
    linear-gradient(110deg, color-mix(in srgb, var(--ekbe-dark-background) 48%, transparent), color-mix(in srgb, var(--ekbe-dark-background) 12%, transparent));
  background-size: 72px 72px, 72px 72px, auto;
}

.platform-hero::before {
  background: radial-gradient(circle, color-mix(in srgb, var(--matrix-green) 11%, transparent), transparent 68%);
}

.brand-axis,
.brand-signature,
.footer-axis {
  display: none;
}

.brand-stage {
  border-color: color-mix(in srgb, var(--matrix-green) 28%, transparent);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--matrix-green) 5%, transparent), transparent 42%),
    color-mix(in srgb, var(--ekbe-dark-surface) 88%, transparent);
  box-shadow: 0 2rem 5rem color-mix(in srgb, var(--matrix-background) 74%, transparent);
  backdrop-filter: blur(9px);
}

.brand-stage::before,
.brand-stage::after {
  border-color: color-mix(in srgb, var(--matrix-green) 16%, transparent);
}

.stage-symbol img {
  width: 132px;
  filter: drop-shadow(0 1rem 2rem color-mix(in srgb, var(--matrix-green) 22%, transparent));
}

.discovery-terminal .terminal-label {
  position: relative;
  z-index: 1;
  margin: 0 0 var(--ekbe-space-8);
  color: var(--ekbe-signal);
  font-family: var(--ekbe-font-code);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-align: center;
  text-transform: uppercase;
}

.trust-strip,
.pillars-section {
  background: color-mix(in srgb, var(--ekbe-dark-soft) 86%, transparent);
  backdrop-filter: blur(8px);
}

:root[data-theme="light"] .trust-strip,
:root[data-theme="light"] .pillars-section {
  background: color-mix(in srgb, var(--ekbe-light-soft) 94%, transparent);
}

.tool-card,
.pillar-card,
.content-card,
.detail-panel,
.related-block,
.discovery-grid a,
.global-results,
.scale-note,
.pricing-panel,
.review-notice,
.catalog-note,
.cta-panel {
  background: color-mix(in srgb, var(--ekbe-dark-surface) 90%, transparent);
  backdrop-filter: blur(8px);
}

:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .pillar-card,
:root[data-theme="light"] .content-card,
:root[data-theme="light"] .detail-panel,
:root[data-theme="light"] .related-block,
:root[data-theme="light"] .discovery-grid a,
:root[data-theme="light"] .global-results,
:root[data-theme="light"] .scale-note,
:root[data-theme="light"] .pricing-panel,
:root[data-theme="light"] .review-notice,
:root[data-theme="light"] .catalog-note {
  background: color-mix(in srgb, var(--ekbe-light-surface) 95%, transparent);
}

.outcome-section {
  background: color-mix(in srgb, var(--ekbe-dark-background) 88%, transparent);
  backdrop-filter: blur(8px);
}

.site-footer {
  background: color-mix(in srgb, var(--ekbe-dark-background) 94%, transparent);
  backdrop-filter: blur(10px);
}

.footer-grid {
  padding-top: var(--ekbe-space-4);
}

@media (max-width: 1080px) {
  .nav-links {
    position: absolute;
    top: 72px;
    right: var(--ekbe-space-6);
    left: var(--ekbe-space-6);
    display: none;
    align-items: stretch;
    flex-direction: column;
    gap: var(--ekbe-space-2);
    margin: 0;
    padding: var(--ekbe-space-4);
    border: 1px solid var(--ekbe-dark-border);
    border-radius: var(--ekbe-radius-card);
    background: color-mix(in srgb, var(--ekbe-dark-surface) 96%, transparent);
    box-shadow: var(--ekbe-shadow-overlay);
    backdrop-filter: blur(16px);
  }

  .nav-links.open {
    display: flex;
  }

  .nav-links a {
    min-height: 44px;
    padding: var(--ekbe-space-3);
  }

  .theme-button {
    margin-left: auto;
  }

  .menu-button {
    display: grid;
  }
}

@media (max-width: 620px) {
  .brand img {
    width: 174px;
  }

  .platform-hero {
    background-size: 48px 48px, 48px 48px, auto;
  }

  .matrix-rain {
    opacity: 0.82;
  }
}

@media (max-width: 360px) {
  .brand img {
    width: 144px;
  }

  .rain-button,
  .theme-button,
  .menu-button {
    min-width: 42px;
  }
}

@supports (height: 100dvh) {
  .matrix-rain {
    height: 100dvh;
  }
}

@media (prefers-reduced-motion: reduce), print, (forced-colors: active) {
  .matrix-rain {
    display: none;
  }
}