/* v364 · Startseite: heller Markenmodus zwischen den dunklen Ankerflächen */

main.site-dark {
  --home-stone: #cbd0ce;
  --home-stone-soft: #d4d8d5;
  --home-stone-deep: #c1c7c4;
  --home-ink: #102f2b;
  --home-ink-soft: #3d514d;
  --home-muted: #687571;
  --home-line: rgba(16, 47, 43, 0.18);
  --home-line-strong: rgba(16, 47, 43, 0.28);
  --home-copper: #a87650;
  --home-copper-deep: #83593d;
  --home-copper-soft: rgba(168, 118, 80, 0.18);
  --home-graphite: #202726;
  --home-graphite-soft: #29302f;
}

/* Der Hero bleibt die dunkle, konzentrierte Eröffnung. */
main.site-dark .hero-dark {
  background:
    radial-gradient(118% 145% at 82% -12%, #1b2528 0%, #0d171b 52%, #080e12 100%);
}

/* Gemeinsamer heller Grund für die erklärenden Abschnitte. */
main.site-dark .home-value,
main.site-dark .section.arch,
main.site-dark .section.ledger-section,
main.site-dark .section.markets,
main.site-dark .cta-stage:not(.demo-stage) {
  --bg: var(--home-stone);
  --bg-soft: var(--home-stone-soft);
  --bg-alt: var(--home-stone-deep);
  --panel: rgba(238, 240, 237, 0.58);
  --panel-soft: rgba(218, 222, 219, 0.78);
  --panel-accent: rgba(225, 228, 225, 0.88);
  --text: var(--home-ink);
  --text-soft: var(--home-ink-soft);
  --muted: var(--home-muted);
  --line: var(--home-line);
  --line-strong: var(--home-line-strong);
  --accent: var(--home-copper);
  --accent-2: var(--home-copper-deep);
  --accent-soft: var(--home-copper-soft);
  --accent-strong: var(--home-ink);
  color: var(--home-ink);
}

main.site-dark .home-value,
main.site-dark .section.markets {
  background:
    radial-gradient(76% 105% at 88% 18%, rgba(255,255,255,0.30), transparent 70%),
    linear-gradient(180deg, var(--home-stone-soft) 0%, var(--home-stone) 100%);
  border-color: var(--home-line);
}

main.site-dark .home-value-copy h2,
main.site-dark .home-value-fact strong,
main.site-dark .section.arch h2,
main.site-dark .section.arch h3,
main.site-dark .section.ledger-section h2,
main.site-dark .section.ledger-section h3,
main.site-dark .section.markets h2,
main.site-dark .cta-stage:not(.demo-stage) h2 {
  color: var(--home-ink) !important;
}

main.site-dark .home-value-copy p:not(.eyebrow),
main.site-dark .home-value-fact > span:last-child,
main.site-dark .section.arch .section-sub,
main.site-dark .arch-layer-sub,
main.site-dark .arch-cc-desc,
main.site-dark .section.ledger-section .ledger-sub,
main.site-dark .journey-primary-head p:not(.journey-kicker),
main.site-dark .journey-card > p:not(.journey-kicker),
main.site-dark .section.markets .section-sub,
main.site-dark .market-foot,
main.site-dark .cta-stage:not(.demo-stage) .cta-content > p {
  color: var(--home-ink-soft) !important;
}

main.site-dark .home-value-facts,
main.site-dark .home-value-fact,
main.site-dark .journey-primary,
main.site-dark .journey-grid,
main.site-dark .journey-card + .journey-card {
  border-color: var(--home-line-strong);
}

main.site-dark .home-value-index,
main.site-dark .home-value .eyebrow,
main.site-dark .section.arch .eyebrow,
main.site-dark .section.ledger-section .eyebrow,
main.site-dark .journey-index,
main.site-dark .journey-kicker,
main.site-dark .journey-link,
main.site-dark .section.markets .eyebrow,
main.site-dark .cta-stage:not(.demo-stage) .eyebrow {
  color: var(--home-copper-deep) !important;
}

/* Architektur: helle Bühne, große technische Zeichnung im Hintergrund. */
main.site-dark .section.arch {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(65% 88% at 50% 50%, rgba(255,255,255,0.32), transparent 76%),
    linear-gradient(180deg, var(--home-stone) 0%, var(--home-stone-deep) 100%);
}

main.site-dark .section.arch::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(760px, 62vw);
  aspect-ratio: 300 / 190;
  left: 50%;
  top: 53%;
  transform: translate(-50%, -50%);
  background: url("assets/factory-detail-frame-architectural-v220.svg") center / contain no-repeat;
  opacity: 0.075;
  filter: grayscale(1) sepia(0.16) contrast(0.92);
  pointer-events: none;
}

main.site-dark .section.arch .container {
  position: relative;
  z-index: 1;
}

main.site-dark .arch-cc {
  border-color: var(--home-line-strong);
  background: rgba(224, 228, 225, 0.46);
  backdrop-filter: blur(4px);
}

main.site-dark .arch-cc-kicker,
main.site-dark .arch-num {
  color: var(--home-copper-deep);
}

main.site-dark .arch-cc-name,
main.site-dark .arch-layer-name,
main.site-dark .arch-mod-name {
  color: var(--home-ink);
}

main.site-dark .arch-grid::before,
main.site-dark .arch-cc-bridge {
  background: var(--home-copper-soft);
}

main.site-dark .arch-col[data-layer] {
  --layer-color: var(--home-copper);
}

main.site-dark .arch-mod {
  background: rgba(231, 234, 231, 0.67);
  border-color: rgba(16,47,43,0.16);
  box-shadow: 0 12px 30px -26px rgba(13,34,31,0.50);
  backdrop-filter: blur(3px);
}

main.site-dark .arch-mod-ico {
  color: #c68c62;
  background: var(--home-graphite);
  border: 1px solid rgba(168,118,80,0.34);
}

main.site-dark .arch-mod:hover,
main.site-dark .arch-mod:focus-visible,
main.site-dark .arch-mod.is-active {
  color: var(--home-ink);
  background: rgba(239,241,238,0.86);
  border-color: rgba(168,118,80,0.66);
  box-shadow: 0 16px 34px -24px rgba(13,34,31,0.48), 0 0 0 1px rgba(168,118,80,0.10);
}

main.site-dark .arch-mod:hover .arch-mod-ico,
main.site-dark .arch-mod:focus-visible .arch-mod-ico,
main.site-dark .arch-mod.is-active .arch-mod-ico {
  color: #e1ad82;
  background: var(--home-graphite-soft);
  box-shadow: 0 0 18px rgba(168,118,80,0.22);
}

main.site-dark .arch-mod-desc {
  color: var(--home-ink-soft);
}

/* Erkenntniskette: helle, ruhige Systemfläche mit Graphitbelegen. */
main.site-dark .section.ledger-section {
  background:
    linear-gradient(rgba(16,47,43,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,47,43,0.035) 1px, transparent 1px),
    linear-gradient(180deg, #d5d9d6 0%, #c9cfcc 100%) !important;
  background-size: 52px 52px, 52px 52px, auto;
  border-color: var(--home-line);
}

main.site-dark .chain-block {
  background: var(--home-graphite);
  border-color: rgba(168,118,80,0.76);
  box-shadow: 5px 5px 0 rgba(131,89,61,0.34);
}

main.site-dark .chain-block.chain-now {
  background: #29302f;
  border-color: #bd8962;
  box-shadow: 5px 5px 0 rgba(131,89,61,0.48);
}

main.site-dark .chain-block .cb-ev,
main.site-dark .chain-block.chain-now .cb-ev,
main.site-dark .chain-block .cb-h {
  color: #ddb08d;
}

main.site-dark .chain-block .cb-k,
main.site-dark .chain-block .cb-prev {
  color: rgba(236,234,226,0.60);
}

main.site-dark .chain-arrow,
main.site-dark .chain-arrow::after {
  border-color: var(--home-copper-deep);
}

main.site-dark .chain-arrow {
  background: var(--home-copper-deep);
}

main.site-dark .journey-closing {
  color: var(--home-ink);
  border-left-color: var(--home-copper);
}

main.site-dark .journey-link:hover,
main.site-dark .journey-link:focus-visible {
  color: var(--home-ink);
}

/* Märkte: Graphitkarten als dunkle, aber leichte Inseln im hellen Feld. */
main.site-dark .cluster-card {
  border-color: rgba(16,47,43,0.20);
  background: linear-gradient(170deg, #272e2d 0%, #1c2222 100%);
  box-shadow: 0 24px 48px -34px rgba(10,29,27,0.58);
}

main.site-dark .cluster-head,
main.site-dark .cluster-body {
  background: transparent;
}

main.site-dark .cluster-head {
  border-bottom-color: rgba(221,176,141,0.18);
}

main.site-dark .cluster-head h3 {
  color: #eef0eb;
}

main.site-dark .cluster-head .cluster-ico {
  color: #dda77d;
  background: rgba(168,118,80,0.10);
  border-color: rgba(221,167,125,0.28);
}

main.site-dark .cluster-ghost {
  color: rgba(221,167,125,0.10);
}

main.site-dark .cluster-body .cluster-desc {
  color: rgba(237,239,234,0.72);
}

main.site-dark .cluster-body .cluster-tags span {
  color: #e2c0a4;
  background: rgba(168,118,80,0.10);
  border-color: rgba(221,167,125,0.20);
}

main.site-dark .cluster-body .cluster-tags span::before {
  background: #c38b63;
}

/* Gründer- und Datenhoheitsband bleiben dunkel, nun leicht blau statt schwarz. */
main.site-dark .founder-stage {
  background: linear-gradient(160deg, #10191e, #080e12);
}

main.site-dark .founder-macro-bg {
  filter: saturate(0.82) brightness(0.95) contrast(1.04);
}

main.site-dark .deploy-band {
  background:
    radial-gradient(70% 120% at 50% 0%, rgba(75,105,119,0.15), transparent 70%),
    linear-gradient(180deg, #10191e 0%, #080e12 100%);
}

/* Kontakt-Teaser hell; Bild und Formular bilden danach wieder dunkle Markenanker. */
main.site-dark .cta-stage:not(.demo-stage) {
  background:
    radial-gradient(72% 115% at 82% 20%, rgba(255,255,255,0.28), transparent 70%),
    linear-gradient(180deg, var(--home-stone) 0%, var(--home-stone-soft) 100%);
  border-top: 1px solid var(--home-line);
}

main.site-dark .cta-stage:not(.demo-stage) .cta-card {
  background: rgba(229,232,229,0.50);
  border: 1px solid rgba(16,47,43,0.16);
  box-shadow: 0 26px 58px -42px rgba(13,34,31,0.46);
  backdrop-filter: blur(4px);
}

main.site-dark .cta-stage:not(.demo-stage) .button.primary {
  background: var(--home-graphite);
  border-color: var(--home-graphite);
  color: #f4ece4;
}

main.site-dark .cta-stage:not(.demo-stage) .button.primary:hover {
  background: var(--home-ink);
  border-color: var(--home-ink);
  box-shadow: 0 0 0 4px rgba(168,118,80,0.16);
}

main.site-dark .demo-stage.demo-unified-dark {
  background:
    radial-gradient(80% 90% at 25% 12%, rgba(43,70,78,0.17), transparent 72%),
    linear-gradient(180deg, #10191e 0%, #080e12 100%) !important;
}

main.site-dark .demo-stage.demo-unified-dark .demo-block {
  background: linear-gradient(165deg, rgba(28,38,41,0.98), rgba(14,21,24,0.98)) !important;
}

@media (max-width: 860px) {
  main.site-dark .section.arch::before {
    width: min(680px, 92vw);
    top: 48%;
    opacity: 0.06;
  }
}

@media (max-width: 620px) {
  main.site-dark .section.arch::before {
    width: 135vw;
    top: 56%;
    opacity: 0.045;
  }

  main.site-dark .arch-mod {
    background: rgba(234,236,233,0.88);
  }

  main.site-dark .journey-card + .journey-card {
    border-top-color: var(--home-line-strong);
  }
}

@media (prefers-reduced-motion: reduce) {
  main.site-dark .arch-mod,
  main.site-dark .arch-mod-ico {
    transition: none;
  }
}
