/* assets/css/hero-video.css */
.hero-video {
  overflow: hidden;
}

.hero-video__background {
  object-fit: cover;
  z-index: -2;
  filter: brightness(0.6);
}

.hero-video__overlay {
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.3) 0%,
    rgba(28, 28, 28, 0.7) 100%
  );
  z-index: -1;
}

.hero-video__scroll {
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  text-decoration: none;
  transition: opacity 0.3s;
  z-index: 10;
}

.hero-video__scroll:hover {
  opacity: 0.7;
}

@media (max-width: 768px) {
  .hero-video__background {
    /* Відео тепер працює на мобільних */
    display: block !important;
    object-fit: cover !important;
    height: 100vh !important;
    width: 100vw !important;
    filter: brightness(0.5) !important;
    position: absolute !important;
  }

  .hero-video {
    background: linear-gradient(135deg, #1c1c1c 0%, #2d2d2d 100%);
  }

  /* Адаптивні розміри для мобільних */
  .hero-video .btn-lg,
  .hero .btn-lg {
    padding: 0.8rem 2rem !important;
    font-size: 1rem !important;
    min-height: 50px !important;
    display: inline-block !important;
    margin: 0.5rem !important;
  }

  /* Обидві кнопки в ряд на планшетах */
  .hero-content-area > div:last-child {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 1rem !important;
    padding: 0 1rem !important;
  }

  .hero .btn-dark,
  .hero .btn-outline-light {
    flex: 1 1 auto !important;
    min-width: 180px !important;
    max-width: 250px !important;
  }
}

@media (max-width: 576px) {
  .hero-video__background {
    filter: brightness(0.4);
  }

  .hero-video .display-1 {
    font-size: 2rem !important;
  }

  /* Мобільні кнопки - повна ширина для кращої видимості */
  .hero-video .btn-lg,
  .hero .btn-lg {
    padding: 0.875rem 1.5rem !important;
    font-size: 1rem !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 1rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .hero-video .btn-lg.me-3,
  .hero .btn-lg.me-3 {
    margin-right: 0 !important;
    margin-bottom: 1rem !important;
  }

  /* Темна кнопка "Réserver" - золота з темним текстом */
  .hero .btn-dark {
    background-color: #D4AF37 !important;
    border-color: #D4AF37 !important;
    color: #121212 !important;
  }

  /* Прозора кнопка "Portfolio" - біла обведення з білим текстом */
  .hero .btn-outline-light {
    background-color: transparent !important;
    border: 2px solid #FFFFFF !important;
    color: #FFFFFF !important;
  }

  /* Контейнер кнопок */
  .hero-content-area .animate__animated.animate__fadeInUp {
    width: 100% !important;
    padding: 0 1rem !important;
  }
}