/* ============================================================
   Shared Revolut-style morning sky canvas.
   Used by the homepage sky hero (.rv2-hero.rv2-sky)
   and any page that should match that first-viewport treatment.
   ============================================================ */

.rv2-sky {
  position: relative;
  overflow: hidden;
  /* Clear morning sky — matches index.html hero */
  background: linear-gradient(180deg,
    #a7c8e8 0%,
    #bcd6ee 34%,
    #d7e6f4 62%,
    #eef4fa 100%);
}

/* Haze at the horizon so content sits "in" the sky */
.rv2-sky::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2%;
  height: 34%;
  background: linear-gradient(180deg, rgba(238, 244, 250, 0) 0%, #eef4fa 75%);
  pointer-events: none;
  z-index: 2;
}

/* Drifting clouds — decorative */
.rv2-cloud {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(ellipse closest-side, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0) 70%);
  filter: blur(6px);
  pointer-events: none;
  will-change: transform;
  z-index: 1;
}
.rv2-cloud--a { width: 46vw; height: 12vw; top: 16%; left: -6%; opacity: 0.9; animation: cloud-drift 90s linear infinite; }
.rv2-cloud--b { width: 34vw; height: 9vw; top: 9%; right: -4%; opacity: 0.75; animation: cloud-drift 120s linear infinite reverse; }
.rv2-cloud--c { width: 55vw; height: 13vw; top: 38%; left: 18%; opacity: 0.5; animation: cloud-drift 150s linear infinite; }

@keyframes cloud-drift {
  from { transform: translateX(-4vw); }
  to { transform: translateX(10vw); }
}