/* Independent black + green variant; layout and motion stay unchanged. */
:root{--night:#151516;--paper:#f5f5f3;--lime:#b1ed83;--green:#35683d}
.immersive .promo-bar{background:#202122;color:#dce0d9;border-bottom:1px solid #b1ed8326}
.immersive .promo-bar a{color:inherit}
.immersive .promo-bar-cta{color:var(--lime)}
.immersive .promo-bar-cta{background:#2b3528;border-color:#454d40}
.hero-offer{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 16px;margin:26px 0 18px;font:12px/1.6 var(--mono);color:var(--muted)}
.hero-offer strong{font-size:22px;color:var(--lime)}
.hero-explore{display:block;width:fit-content;margin:18px auto 0;font:12px/1.5 var(--mono);color:var(--muted);text-underline-offset:4px}
.hero-explore:hover{color:var(--lime)}
.immersive .enroll .offer-label{width:fit-content;margin:24px auto 16px;padding:6px 12px;border:1px solid #b1ed8340;border-radius:4px;background:#2b3528;color:var(--lime);font:11px/1.5 var(--mono);letter-spacing:.08em}
.immersive .enroll .program-price span{font:16px/1.5 var(--mono)}
.immersive .world-hero .button,.immersive .sticky-enroll-button{background:var(--lime);border-color:var(--lime);color:var(--night)}
.immersive .world-hero .button:hover,.immersive .sticky-enroll-button:hover{background:#c5f4a2;border-color:#c5f4a2;color:var(--night)}
.immersive .site-header .rocket-ship > path{fill:var(--lime)}
.immersive .world-tag{border-color:#b1ed8340}
.immersive .signal-dot{box-shadow:0 0 12px #b1ed8355}
.immersive .chapter-eyebrow>span{background:#e2ebdd}
.immersive .route-nav a[aria-current="step"]{background:#252827;color:var(--lime)}
.immersive .route-nav a[aria-current="step"] span{color:var(--lime)}
.immersive .sticky-enroll{justify-content:space-between;padding:10px 16px}
.immersive .sticky-enroll .sticky-enroll-rocket{display:inline-block;--rocket-size:24px}
.immersive .sticky-enroll-rocket .rocket-base{filter:brightness(.3)}
@media(max-width:359px){.immersive .sticky-enroll{padding-inline:8px;gap:4px}.immersive .sticky-enroll-title{font-size:12px}}
.immersive ::selection{background:#b1ed83;color:#151516}
.immersive .included-details .feature-art{display:block;width:240px;max-width:100%;height:210px;object-fit:contain;margin:0 0 22px;pointer-events:none}
@media(max-width:700px){.immersive .included-details .feature-art{width:190px;height:170px;margin-bottom:18px}}
.hero-stack{list-style:none;margin:0;padding:0;position:absolute;inset:0;pointer-events:none}
.hero-stack li{position:absolute;display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid #b1ed8326;border-radius:4px;background:#1b1d1cf2;color:#dce1d8;font:11px/1.4 var(--mono);box-shadow:0 3px 12px #0002;white-space:nowrap;animation:tag-float 7s ease-in-out infinite;animation-play-state:paused}
.hero-stack img{display:block;width:16px;height:16px;object-fit:contain;flex:none}
.hero-stack li:nth-child(1){left:-3%;top:13%}
.hero-stack li:nth-child(2){left:-7%;top:39%;animation-delay:-2s}
.hero-stack li:nth-child(3){left:-3%;top:65%;animation-delay:-4s}
.hero-stack li:nth-child(4){right:-3%;top:13%;animation-delay:-1s}
.hero-stack li:nth-child(5){right:-7%;top:39%;animation-delay:-3s}
.hero-stack li:nth-child(6){right:-3%;top:65%;animation-delay:-5s}
.is-inview .hero-stack li{animation-play-state:running}
@media(min-width:701px) and (max-width:1200px){.hero-stack li:nth-child(-n+3){left:0}.hero-stack li:nth-child(n+4){right:0}}
@media(max-width:700px){.hero-world{aspect-ratio:auto}.hero-stack{position:relative;inset:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:89%;margin:12px auto 20px}.hero-stack li{position:static;justify-content:center;font-size:9px;padding:8px 5px;gap:5px;box-shadow:none;animation:none}.hero-stack img{width:14px;height:14px}.hero-world figcaption{position:static;margin:0 auto 12px}}
@media(max-width:360px){.hero-stack{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Full dark edition: the hero's charcoal continues through every section. */
@media screen {
  body.immersive {
    --ink: #f0f1eb;
    --muted: #b6bcb3;
    --line: #383c37;
    --green: var(--lime);
    --surface: #202321;
    background: var(--night);
    color: var(--ink);
    color-scheme: dark;
  }
  .immersive .chapter-copy,
  .immersive .route-nav { background: var(--night); }
  .immersive .route-nav { border-color: var(--line); }
  .immersive .route-nav a { color: var(--muted); }
  .immersive .route-nav a span { color: #a5ae9f; }
  .immersive .route-nav a:hover { background: var(--surface); color: var(--ink); }
  .immersive .route-nav a[aria-current="step"] { background: #2b3528; color: var(--lime); }
  .immersive .route-nav a[aria-current="step"] span { color: var(--lime); }
  .immersive .chapter-eyebrow > span { background: #2b3528; color: var(--lime); }
  .immersive .chapter-list::before { border-color: #b1ed8330; }
  .immersive .chapter-links a:hover,
  .immersive .text-link:hover { color: #d1f7b4; }
  .immersive .scene-halo { background: radial-gradient(ellipse,#b1ed8312,transparent 65%); }
  .immersive .scene-coordinate { color: #a5ae9f; }
  .immersive .build-loop b { color: #a5ae9f; }
  .immersive .enroll {
    background: var(--surface);
    border-color: #454d40;
    box-shadow: 8px 8px 0 #0b0d0b;
  }
  .immersive .enroll-package { border-color: var(--line); }
  .immersive .button,
  .immersive .sticky-enroll-button {
    color: var(--night);
    background: var(--lime);
    border-color: var(--lime);
  }
  .immersive .button:hover,
  .immersive .sticky-enroll-button:hover {
    color: var(--night);
    background: #c5f4a2;
    border-color: #c5f4a2;
  }
  .immersive .credential-logo img { filter: brightness(0) invert(.88); }
  .immersive .sticky-enroll { background: #202321f5; color: var(--ink); border-color: #454d40; }
  .immersive .skip-link { background: var(--lime); color: var(--night); }
  .immersive .faq summary:hover { color: var(--lime); }
  .immersive .faq details[open] summary { color: var(--lime); }
  .immersive .enroll .rocket-base { filter: brightness(0) invert(.88); }
}

/* Mature pixel Builder: keep the person readable on both desktop and mobile. */
.immersive .world-image { image-rendering:pixelated; }
.immersive .hero-world { width:min(840px,100%); }
.immersive .hero-world figcaption { position:static; margin:18px auto 12px; }
.immersive .hero-world .orbit,.immersive .hero-world .world-sparks { display:none; }
@media(max-width:700px) {
  .immersive .hero-world { width:100%; margin:24px auto 10px; }
  .immersive .hero-stack { width:100%; }
}
