/**
 * ============================================================================
 * HERO AD SLOT EFFECTS - BANNER ADVERTISEMENT HOVER ANIMATIONS
 * ============================================================================
 * Simple hover effects for the hero ad banner elements.
 * ============================================================================
 */

/* ========================================================================== */
/* CONTAINER EFFECTS */
/* ========================================================================== */
.hero-ad-slot__container {
  transition: all 0.3s ease; /* Smooth transitions */
}

/* CONTAINER HOVER STATE - Lift */
.hero-ad-slot__container:hover {
  transform: translateY(-2px); /* Lift up */
}

/* ========================================================================== */
/* BADGE EFFECTS */
/* ========================================================================== */
.hero-ad-slot__badge {
  transition: all 0.3s ease; /* Smooth transitions */
}

/* BADGE HOVER STATE - Lift and shadow */
.hero-ad-slot__badge:hover {
  background-color: #2a2530; /* Lighter background */
  transform: translateY(-2px); /* Lift up */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); /* Drop shadow */
}

/* ========================================================================== */
/* CONTENT AREA EFFECTS */
/* ========================================================================== */
.hero-ad-slot__content {
  transition: all 0.3s ease; /* Smooth transitions */
}

/* CONTENT HOVER STATE - Lighten and shadow */
.hero-ad-slot__content:hover {
  background-color: #2a2530; /* Lighter background */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); /* Drop shadow */
}

/* ========================================================================== */
/* TEXT EFFECTS */
/* ========================================================================== */
.hero-ad-slot__text {
  transition: color 0.3s ease; /* Smooth color change */
}

/* TEXT HOVER STATE - Brighten */
.hero-ad-slot__content:hover .hero-ad-slot__text {
  color: rgba(255, 255, 255, 0.6); /* Brighter text */
}