/* ==========================================================
   AIKCU — Background Atmosphere v4
   Calm MASTER-like atmosphere.

   Goal:
   - dark clean navy remains dominant
   - clouds are larger, softer and less contrasty
   - cyan dust is sparse and mostly micro-sized
   - orange sparks are rare but intentional
   - diagonal traces are barely visible
   - one continuous page-wide environment
   - no section-based seams
   - no blur/filter on Hero or About scenes
   ========================================================== */

html {
  background: #031423;
}

body {
  background-color: #031423;

  background-image:
    url("../images/background-atmosphere-texture-v4.webp"),

    /* restrained upper depth */
    radial-gradient(
      ellipse 76rem 42rem at 54% 8%,
      rgba(35, 94, 127, .105) 0%,
      rgba(20, 61, 86, .038) 48%,
      transparent 78%
    ),

    /* restrained lower cool depth */
    radial-gradient(
      ellipse 82rem 58rem at 70% 77%,
      rgba(24, 72, 101, .070) 0%,
      transparent 78%
    ),

    /* one continuous deep navy field */
    linear-gradient(
      180deg,
      #031321 0%,
      #041827 27%,
      #051b2b 55%,
      #041826 78%,
      #031521 100%
    );

  background-size:
    112rem 112rem,
    auto,
    auto,
    auto;

  background-position:
    center top,
    center top,
    center 72%,
    center;

  background-repeat:
    repeat,
    no-repeat,
    no-repeat,
    no-repeat;
}

/* Mobile keeps the same atmosphere, slightly quieter. */
@media (max-width: 760px) {
  body {
    background-image:
      url("../images/background-atmosphere-texture-v4.webp"),

      radial-gradient(
        ellipse 32rem 22rem at 54% 8%,
        rgba(35, 94, 127, .090) 0%,
        rgba(20, 61, 86, .032) 48%,
        transparent 78%
      ),

      linear-gradient(
        180deg,
        #031321 0%,
        #041827 48%,
        #031521 100%
      );

    background-size:
      78rem 78rem,
      auto,
      auto;

    background-position:
      center top,
      center top,
      center;

    background-repeat:
      repeat,
      no-repeat,
      no-repeat;
  }
}