/* Tumman asun jaetut osat, joihin tokenit ja tuotettu kerros eivät riitä. */

html[data-kampanja-asu="tumma"] body { background: var(--bg); color: var(--text); }

/* Navigaation lasipinta: sumennus pois ja pinta peittäväksi, jotta teksti erottuu tummasta sisällöstä. */
html[data-kampanja-asu="tumma"] body .nav {
  background: #0e1017;
  border-color: rgba(255, 255, 255, 0.14);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.55);
}

/* Liekkilogo on pimeän valonlähde: värit säilyvät ja liekin ympärillä on lämmin hehku. */
html[data-kampanja-asu="tumma"] .nav-logo img { filter: drop-shadow(0 0 9px rgba(255, 138, 60, 0.6)); }

/* Valintojen korostus ja vierityspalkki. */
html[data-kampanja-asu="tumma"] ::selection { background: rgb(var(--kv-hehku) / 0.35); color: #fff; }
html[data-kampanja-asu="tumma"] { scrollbar-color: #2b3044 #07080d; }

/* Valokuvaherot: kuva himmenee kuin valot olisi sammutettu, jolloin vaalea otsikko erottuu sen päältä. */
html[data-kampanja-asu="tumma"] .photo-hero-image { filter: brightness(0.5) saturate(0.92); }

/* Tietoa meistä -heron taustakuva on vaalea. Tuotettu kerros tummentaa sitä vain 25–55 %, jolloin harmaa
   leipäteksti jäi vaalean kuvan päälle. Valitsimessa on body, jotta sääntö voittaa tuotetun kerroksen. */
html[data-kampanja-asu="tumma"] body .hero-about {
  background:
    linear-gradient(180deg, rgba(7, 8, 13, 0.78) 0%, rgba(7, 8, 13, 0.9) 100%),
    url('../../kosminen_tausta_desk.webp') center center / cover no-repeat,
    #07080d;
}

/* Navigaation pääkehote on vaalea nappi tummalla tekstillä. */
html[data-kampanja-asu="tumma"] .nav-cta { background: #fff; color: #0a0b10; }
html[data-kampanja-asu="tumma"] .nav-cta:hover,
html[data-kampanja-asu="tumma"] .nav-cta:focus-visible { background: rgb(var(--kv-hehku)); color: #0a0b10; }

/* Navigaatio on peittävä: ilman sumennusta sen alla vierivä teksti näkyisi läpi. Valitsimessa on body, jotta
   sääntö voittaa tuotetun kerroksen saman valitsimen. Mobiilissa kokoon vetäytynyt navigaatio on pelkkä
   valikkopainike, joten sen pohja pysyy läpinäkyvänä kuten vaaleassa asussa. */
html[data-kampanja-asu="tumma"] body .nav.scrolled { background: #0b0d14; }
@media (max-width: 768px) {
  html[data-kampanja-asu="tumma"] body .nav.is-collapsed { background: transparent; border-color: transparent; box-shadow: none; }
}
