/* Components CSS - A&L Home Solutions */
/* Enhanced Visual Design with Modern Aesthetics */

/* Circular Logo Styles */
img[src*="allhomesolutionslogo"] {
  border-radius: 50% !important;
  object-fit: cover !important;
  aspect-ratio: 1 / 1 !important;
}

/* Specific logo container fixes */
.logo-container img,
.consent-gate__logo,
.splash-logo img,
.nav-logo img {
  border-radius: 50% !important;
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}

/* Ensure circular logos maintain aspect ratio */
.circular-logo {
  border-radius: 50%;
  overflow: hidden;
  display: inline-block;
}

/* Additional logo styling for different contexts */
.navbar img[src*="allhomesolutionslogo"] {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  object-fit: cover;
}

.splash-screen img[src*="allhomesolutionslogo"] {
  border-radius: 50%;
  width: 120px;
  height: 120px;
  object-fit: cover;
}

.footer img[src*="allhomesolutionslogo"] {
  border-radius: 50%;
  width: 60px;
  height: 60px;
  object-fit: cover;
}

.about-section img[src*="allhomesolutionslogo"] {
  border-radius: 50%;
  max-width: 200px;
  max-height: 200px;
  object-fit: cover;
}

/* Hero Gradient Text Effect */
.hero-gradient-text {
  background: linear-gradient(135deg, #FFD700, #FFA500, #FFD700, #FF6B35, #FFD700);
  background-size: 300% 300%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: heroGlow 4s ease-in-out infinite;
  font-weight: 800;
  text-shadow: 0 0 30px rgba(255, 215, 0, 0.5);
  position: relative;
}

@keyframes heroGlow {
  0%, 100% {
    background-position: 0% 50%;
    filter: drop-shadow(0 0 20px rgba(255, 215, 0, 0.6));
    transform: scale(1);
  }
  25% {
    background-position: 25% 50%;
    filter: drop-shadow(0 0 30px rgba(255, 165, 0, 0.7));
    transform: scale(1.02);
  }
  50% {
    background-position: 100% 50%;
    filter: drop-shadow(0 0 40px rgba(255, 107, 53, 0.8));
    transform: scale(1.03);
  }
  75% {
    background-position: 75% 50%;
    filter: drop-shadow(0 0 35px rgba(255, 140, 0, 0.7));
    transform: scale(1.02);
  }
}