/* ------------------------------------------------------------
   Video Fade With Sunrise — 40s cycle
   ------------------------------------------------------------ */
.global-video-bg video {
  animation: videoFadeWithSun 20s ease-in-out infinite;
}

@keyframes videoFadeWithSun {
  0%   { opacity: 1; }
  32%  { opacity: 0.9; }
  58%  { opacity: 0.75; }
  82%  { opacity: 0.5; }
  100% { opacity: 1; }
}


/* ------------------------------------------------------------
   Radial Sun Disk — POWERFUL Solar Bloom
   ------------------------------------------------------------ */
.sunrise-sun {
  position: absolute;
  inset: 0;
  z-index: 3; /* above haze; below glow balls */
  pointer-events: none;

  background: radial-gradient(
      circle at 50% 72%,
      rgba(255, 240, 200, 0.55) 0%,     /* intense bright core */
      rgba(255, 210, 140, 0.40) 18%,    /* golden radiance */
      rgba(255, 170, 110, 0.28) 34%,    /* warm orange ring */
      rgba(255, 140, 90, 0.16) 55%,     /* soft warm haze */
      rgba(255, 120, 75, 0.05) 72%,     /* distant glow */
      rgba(255, 120, 75, 0) 100%        /* fade into sky */
  );

  opacity: 0;
  transform: scale(1.4);
  animation: sunPulse 30s ease-in-out infinite;
}

@keyframes sunPulse {
  0% {
    opacity: 0;
    transform: scale(1.1);
    filter: blur(4px);
  }
  25% {
    opacity: 0.12;
    transform: scale(1.25);
    filter: blur(6px);
  }
  55% {
    opacity: 0.28;
    transform: scale(1.45);
    filter: blur(10px);
  }
  78% {
    opacity: 0.48;                /* stronger apogee */
    transform: scale(1.75);       /* bigger, fuller sunrise */
    filter: blur(20px);           /* intense diffusion glow */
  }
  100% {
    opacity: 0;
    transform: scale(1.1);
    filter: blur(4px);
  }
}
/* ------------------------------------------------------------
   Atmospheric Haze Layer — subtle noise + diffusion
   ------------------------------------------------------------ */
.sunrise-haze {
  position: absolute;
  inset: 0;
  z-index: 2; /* above gradient; below ember glow */
  pointer-events: none;

  background: 
    radial-gradient(
      circle at 50% 65%,
      rgba(255, 255, 255, 0.12) 0%,
      rgba(255, 255, 255, 0.05) 40%,
      rgba(255, 255, 255, 0.0) 100%
    ),
    url("data:image/svg+xml;utf8,\
      <svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'>\
        <filter id='noiseFilter'>\
          <feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' />\
        </filter>\
        <rect width='300' height='300' filter='url(%23noiseFilter)'/>\
      </svg>"
    );

  background-size: cover, 300px 300px;
  opacity: 0.13;
  animation: hazePulse 30s ease-in-out infinite;
}

@keyframes hazePulse {
  0%   { opacity: 0.08; filter: blur(0px); }
  40%  { opacity: 0.11; filter: blur(0.5px); }
  70%  { opacity: 0.16; filter: blur(1px); }   /* near apogee */
  100% { opacity: 0.08; filter: blur(0px); }
}



/* ------------------------------------------------------------
   Vertical Sunrise Gradient — 30s cycle
   ------------------------------------------------------------ */
.sunrise-gradient-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;

  background: linear-gradient(
    0deg,
    #0A1A3C 0%,      /* midnight */
    #2E2C65 18%,     /* indigo */
    #6B4C97 34%,     /* lavender */
    #C07DBE 50%,     /* lilac glow */
    #FF9B73 66%,     /* peach sunrise */
    #FFDDA4 82%      /* morning gold */
  );

  background-size: 100% 350%;
  animation: verticalSunrise 30s ease-in-out infinite;

  opacity: 0.60;
  mix-blend-mode: screen;
}

@keyframes verticalSunrise {
  0% {
    background-position: 50% 100%;
    opacity: 0.35;
  }
  28% {
    background-position: 50% 55%;    /* lavender bloom */
    opacity: 0.50;
  }
  55% {
    background-position: 50% 20%;    /* peach rising */
    opacity: 0.70;
  }
  78% {
    background-position: 50% 0%;     /* apogee */
    opacity: 0.85;
  }
  100% {
    background-position: 50% 100%;
    opacity: 0.35;
  }
}

/* ------------------------------------------------------------
   ABOUT AUTHOR — Animated Vertical Sunrise Background
   ------------------------------------------------------------ */
#about-author {
  position: relative;
  overflow: hidden;
  background: #FFF7F2; /* soft fallback base */
}

/* Animated gradient layer */
#about-author::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;

  background: linear-gradient(
    0deg,
    #0A1A3C 0%,      /* midnight */
    #2E2C65 18%,     /* indigo */
    #6B4C97 34%,     /* lavender */
    #C07DBE 50%,     /* lilac glow */
    #FF9B73 66%,     /* peach sunrise */
    #FFDDA4 82%      /* morning gold */
  );

  background-size: 100% 350%;
  animation: aboutAuthorSunrise 30s ease-in-out infinite;

  opacity: 0.45;              /* softer than hero so text stays readable */
  mix-blend-mode: screen;     /* same luminous feel as hero */
}

/* Make sure content sits above the animated layer */
#about-author .container,
#about-author .row,
#about-author .content {
  position: relative;
  z-index: 1;
}


/* ------------------------------------------------------------
   ABOUT AUTHOR — Sunrise Gradient Background Layer
   ------------------------------------------------------------ */
.about-author-sunrise-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;

  background: linear-gradient(
    0deg,
    #0A1A3C 0%,       /* midnight */
    #2E2C65 18%,      /* indigo */
    #6B4C97 34%,      /* lavender */
    #C07DBE 50%,      /* lilac glow */
    #FF9B73 66%,      /* peach sunrise */
    #FFDDA4 82%       /* morning gold */
  );

  background-size: 100% 350%;
  animation: aboutAuthorSunrise 30s ease-in-out infinite;

  opacity: 0.45;               /* softened for readability */
  mix-blend-mode: screen;      /* consistent with hero */
}

/* Ensure content sits above the animated layer */
#about-author > *:not(.about-author-sunrise-bg) {
  position: relative;
  z-index: 1;
}