/**
 * ============================================================================
 * HERO AD SLOT - TOP BANNER ADVERTISEMENT
 * ============================================================================
 * Prominent advertisement space at top of pages.
 * ============================================================================
 */

/* ========================================================================== */
/* MAIN CONTAINER */
/* ========================================================================== */
.hero-ad-slot {
  width: 100%; /* Full width */
  padding: 30px 0; /* Vertical spacing */
}

.hero-ad-slot__container {
  width: 100%; /* Full width */
  display: flex; /* Flexbox */
  align-items: center; /* Vertically center */
  justify-content: center; /* Horizontally center */
  text-align: center; /* Center content */
}

/* LABELS SECTION */
.hero-ad-slot__labels {
  display: flex; /* Horizontal layout */
  align-items: center; /* Vertically center */
  gap: 10px; /* Space between labels */
  margin-bottom: 15px; /* Space below */
}

/* AD BADGE */
.hero-ad-slot__badge {
  display: inline-block; /* Inline but with block properties */
  background-color: #211d25; /* Dark background */
  color: #ffffff; /* White text */
  padding: 6px 16px; /* Internal spacing */
  font-size: 11px; /* Small text */
  font-weight: 500; /* Medium weight */
  text-transform: uppercase; /* ALL CAPS */
  letter-spacing: 1px; /* Letter spacing */
}

/* AD CONTENT AREA */
.hero-ad-slot__content {
  width: 100%; /* Full width */
  background-color: #211d25; /* Dark background */
  padding: 50px 40px; /* Generous padding */
  display: flex; /* Flexbox */
  align-items: center; /* Vertically center */
  justify-content: center; /* Horizontally center */
  min-height: 300px; /* Increased minimum height for larger banner */
}

/* AFFILIATE BANNER STYLING */
.hero-ad-slot__container img {
  max-width: 100%; /* Responsive */
  height: auto; /* Maintain aspect ratio */
  display: block; /* Remove inline spacing */
}

.hero-ad-slot__container a {
  display: inline-block; /* Proper link display */
  line-height: 0; /* Remove extra spacing */
}

/* PLACEHOLDER TEXT */
.hero-ad-slot__text {
  color: rgba(255, 255, 255, 0.4); /* Very dimmed white */
  font-size: 16px; /* Text size */
  font-weight: 400; /* Regular weight */
  margin: 0; /* No margin */
  text-align: center; /* Center text */
}