/* Liquid Drip Transition */
.liquid-transition {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background: #065F46; /* Dark green */
  z-index: 9999;
  transition: height 0.7s cubic-bezier(0.65, 0, 0.35, 1);
}

.liquid-transition.active {
  height: 100vh;
}

/* Wave effect at the top of the liquid */
.liquid-transition::after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 100%;
  height: 50px;
  background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1200 120" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none"><path d="M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z" fill="%23065F46"/></svg>');
  background-size: 1200px 50px;
  animation: waveFlow 12s linear infinite;
}

/* Optional: Gold overlay for special pages */
.liquid-transition.special {
  background: #FFD700; /* Gold/Yellow */
}
.liquid-transition.special::after {
  background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1200 120" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none"><path d="M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z" fill="%23FFD700"/></svg>');
}

@keyframes waveFlow {
  0% { background-position-x: 0; }
  100% { background-position-x: 1200px; }
}

/* Page load animation */
body.page-load .liquid-transition {
  height: 100vh;
  bottom: auto;
  top: 0;
  transition: none;
}