/* Hero Section Animation */
.titlu-prezentare {
   text-shadow: 2px 2px 8px var(--color-black-opac-8);
   animation: slideInFromCorner 1.5s ease-out forwards;
}

@keyframes slideInFromCorner {
   0% {
      transform: translateY(0vh);
      opacity: 0;
   }
   100% {
      transform: translateY(20vh);
      opacity: 1;
   }
}

/* Background Images */
.bg-img-1, .bg-img-2, .bg-img-3 {
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   max-width: 100%;
   height: 65vh;
   margin-bottom: 20px;
   background-attachment: fixed;
}

.bg-img-1 {
   background-image: url('../images/car-city.jpg');
   background-attachment: scroll;
   margin-top: -80px;
   height: 100vh;
   background-position: 50% 80%;
}

.bg-img-2 {
   background-image: url('../images/car-mountain.jpg');
   background-position: 75% 20%;
   margin-bottom: 0;
}

.bg-img-3 {
   background-image: url('../images/variety-cars.jpg');
   margin-bottom: 0;
}

@media (max-width: 768px) {
   .bg-img-1, .bg-img-2, .bg-img-3 {
      background-attachment: scroll;
   }
}

.bg-img-3 {
   background-image: url('../images/variety-cars.jpg');
   margin-bottom: 0;
}

@media (max-width: 768px) {
   .bg-img-1, .bg-img-2, .bg-img-3 {
      background-attachment: scroll;
   }
}

/* Title Section Animations */
.title-section.animate1 {
   text-shadow: 4px 4px 8px var(--color-black-opac-4);
   display: inline-block;
   padding: 10px;
}

.title-section.animate1 span {
   opacity: 0;
   white-space: nowrap;
   animation: fadeIn 2s ease-in-out 0.5s forwards;
}

@keyframes fadeIn {
   0% {
      opacity: 0;
   }
   100% {
      opacity: 1;
   }
}

.despre-noi.animate2 {
   box-shadow: 6px 6px 12px var(--color-black-opac-6);
   animation: popIn 2s ease-in-out;
}

@keyframes popIn {
   0% {
      transform: scale(0.5) rotateZ(180deg);
      opacity: 0;
   }
   100% {
      transform: scale(1);
      opacity: 1;
   }
}

/* Car Cards Hover Effects */
.cars-container:has(.car:hover) .car:not(:hover) {
   filter: blur(2px) brightness(85%) grayscale(50%);
   opacity: 0.7;
}