:root {
  color-scheme: light dark;
  --bs-primary: #5eb6ff; 
  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #91d2ff;
}

/* Общие стили */
body {
  background-color: var(--bs-body-bg);
  color: var(--bs-body-color);
  scroll-behavior: smooth;
  transition: background-color 0.4s ease, color 0.4s ease;
}

/* Заголовки для разных тем */
html[data-bs-theme="dark"] h2.section-title {
  color: #5eb6ff;
}

html[data-bs-theme="light"] h2.section-title {
  color: #222;
}

h2.section-title {
  display: flex;
  align-items: center;
  gap: 14px; /* расстояние между текстом и линией */
}

/* двойная горизонтальная линия справа, с зазором между линиями и смещением вниз */
h2.section-title::after {
  content: "";
  flex: 1;
  height: 9px; /* общая "высота" блока линии (регулирует отступ и визуальное положение) */
  background-image:
    linear-gradient(to bottom,
      currentColor 0px,
      currentColor 2px,    /* верхняя линия — толщина 2px */
      transparent 2px,
      transparent 5px,     /* зазор между линиями — 3px (5-2) */
      currentColor 5px,
      currentColor 7px,    /* нижняя линия — толщина 2px (7-5) */
      transparent 7px);
  background-repeat: no-repeat;
  background-position: 0 center;
  background-size: 100% 100%;
  transform: translateY(5px); /* опустить линию вниз — подправь значение (px) по вкусу */
  opacity: 0.85;
}


/* Плавная смена цвета фона и текста при переключении темы */
html[data-bs-theme="dark"] body {
  transition: background-color 0.4s ease, color 0.4s ease;
}

/* Дополнительная плавность для ссылок и кнопок */
a, .btn {
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

/* === Navbar === */
.navbar {
  transition: background-color 0.4s ease, color 0.4s ease, border-color 0.4s ease, box-shadow 0.3s ease;
  background-color: rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(6px);
}

/* Тёмная тема при скролле */
html[data-bs-theme="dark"] .navbar.scrolled {
  background-color: rgba(0, 0, 0, 0.9);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

/* Светлая тема при скролле */
html[data-bs-theme="light"] .navbar.scrolled {
  background-color: rgba(255, 255, 255, 0.95);
  border-bottom: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Ссылки и логотип при скролле в светлой теме */
html[data-bs-theme="light"] .navbar.scrolled .nav-link,
html[data-bs-theme="light"] .navbar.scrolled .navbar-brand,
html[data-bs-theme="light"] .navbar.scrolled .btn-outline-light {
  color: #222 !important;
}

/* Кнопки справа (иконки) в светлой теме */
html[data-bs-theme="light"] .navbar.scrolled .btn-outline-light {
  border-color: #222;
}

html[data-bs-theme="light"] .navbar.scrolled .btn-outline-light:hover {
  background-color: #FFF;
  color: #fff;
}

/* Навигационные ссылки в тёмной теме (по умолчанию) */
.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.9);
  transition: color 0.2s ease;
}

.navbar-dark .navbar-nav .nav-link:hover {
  color: var(--bs-primary);
}

/* Герой-секция */
.hero {
  position: relative;
  height: 100vh;
  min-height: 560px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.15), rgba(0,0,0,0.6));
  z-index: 1;
}
.hero-content {
  position: relative;
  z-index: 3;
}

/* Снег (canvas) */
#snow-canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

/* Герой-секция: текст всегда светлый, независимо от темы */
.hero .hero-content h1,
.hero .hero-content p {
  color: #f2f5ff;
}

/* карточеки под тёмную и светлую тему */
.card-placeholder {
  border-radius: var(--bs-border-radius-lg);
  background-color: var(--bs-tertiary-bg);
  color: var(--bs-body-color);
  border: 1px solid var(--bs-border-color);
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}

/* Дополнительный эффект при наведении */
.card-placeholder:hover {
  border-color: var(--bs-primary);
  background-color: var(--bs-secondary-bg);
  color: var(--bs-primary);
}

/* Подвал */
footer .card {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

/* Мобильные адаптации */
@media (max-width: 991.98px) {
  /* Скрыть правые кнопки, когда меню раскрыто */
  .navbar-collapse.show ~ .d-flex {
    display: none !important;
  }
}

@media (max-width: 767.98px) {
  /* увеличиваем верхний внутренний отступ контейнера героя */
  .hero .container-xl {
    padding-top: 5.25rem; /* ~84px — учитывает высоту navbar + запас */
  }

  /* дополнительно уменьшаем размер заголовка и межстрочный отступ */
  .hero .display-5 {
    font-size: 1.6rem;
    line-height: 1.15;
  }
}

/* Галерея */
    .masonry-grid {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }
    .masonry-item {
      flex: 1 1 calc(25% - 10px);
      margin-bottom: 10px;
    }
    .masonry-item img {
      width: 100%;
      height: 150px;
      object-fit: cover;
      cursor: pointer;
      border-radius: 6px;
      transition: transform 0.3s;
    }
    .masonry-item img:hover { transform: scale(1.02); }

    #lightbox {
      position: fixed;
      top:0; left:0; right:0; bottom:0;
      display:flex;
      justify-content:center;
      align-items:center;
      background: rgba(0,0,0,0.85);
      z-index: 999;
      display:none;
    }
    #lightbox img { max-width:90%; max-height:90%; }
    #lb-close { position:absolute; top:20px; right:30px; font-size:2rem; color:#fff; cursor:pointer; }
    #lb-prev, #lb-next {
      position: absolute; top:50%; transform: translateY(-50%);
      font-size: 2rem; color:#fff; cursor:pointer; user-select:none;
    }
    #lb-prev { left: 30px; }
    #lb-next { right: 30px; }

/* Секция спец. пред. */
.specials .nav-tabs {
  border: none;
  border-right: 4px solid #5eb6ff; /* вертикальная полоса */
  height: 100%;
  padding-right: -3px;
}

.specials .nav-link {
  border: none;
  border-radius: 0;
  padding: 12px 15px;
  color: #cde9ff;
  font-weight: 600;
  font-size: 15px;
  transition: 0.3s ease;
  border-right: 2px solid transparent;
  background: transparent;
  text-align: left;
}

.specials .nav-link:hover {
  color: #5eb6ff;
  background: rgba(94,182,255,0.1);
  border-right: 2px solid #5eb6ff;
}

.specials .nav-link.active {
  color: #1a1a1a;
  background: #5eb6ff;
  border-right: 2px solid #5eb6ff;
  font-weight: 700;
}

/* Контент вкладок */
.specials .tab-pane.active {
  animation: fadeIn 0.5s ease-out;
}

.specials .details h3 {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 15px;
  color: #fff;
}

.specials .details p {
  color: #bcd6f3;
}

.specials img {
  max-height: 200px;
}


@keyframes fadeIn {
  from {opacity: 0; transform: translateY(10px);}
  to {opacity: 1; transform: translateY(0);}
}

@media (max-width: 992px) {
  .specials .nav-tabs {
    border-right: none;
    border-bottom: 3px solid rgba(94,182,255,0.4);
    padding-right: 0;
  }

  .specials .nav-link {
    border-right: none;
    border-bottom: 2px solid transparent;
  }

  .specials .nav-link.active {
    border-bottom: 2px solid #5eb6ff;
  }
}