html, body {
  height: 100%;
  margin: 0;
}
/* OLD */
/* @font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-Light.woff2') format('woff2'),
       url('fonts/GothamPro-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-LightItalic.woff2') format('woff2'),
       url('fonts/GothamPro-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro.woff2') format('woff2'),
       url('fonts/GothamPro.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-Italic.woff2') format('woff2'),
       url('fonts/GothamPro-Italic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-Medium.woff2') format('woff2'),
       url('fonts/GothamPro-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-Bold.woff2') format('woff2'),
       url('fonts/GothamPro-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-BoldItalic.woff2') format('woff2'),
       url('fonts/GothamPro-BoldItalic.woff') format('woff');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Gotham Pro';
  src: url('fonts/GothamPro-BlackItalic.woff2') format('woff2'),
       url('fonts/GothamPro-BlackItalic.woff') format('woff');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-BlackItalic.ttf') format('truetype');
    font-weight: 900;
    font-style: italic;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-Italic.ttf') format('truetype');
    font-weight: 400;
    font-style: italic;
}


@font-face {
    font-family: 'Lato';
    src: url('fonts/Lato/Lato-LightItalic.ttf') format('truetype');
    font-weight: 300;
} */


/* === Gotham Condensed === */
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_blackitalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_bolditalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
/* book, bookitalic, light, lightitalic, medium, mediumitalic, thin, thinitalic, ultra, ultraitalic, xblack, xblackitalic, xlight, xlightitalic */
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_book.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_bookitalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_lightitalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_mediumitalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_thin.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_thinitalic.otf') format('opentype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_ultra.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_ultraitalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_xblack.otf') format('opentype');
    font-weight: 950;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_xblackitalic.otf') format('opentype');
    font-weight: 950;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_xlight.otf') format('opentype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Cond';
    src: url('/fonts/new/gothamcond_xlightitalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

/* === Gotham Narrow === */
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_blackitalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_bolditalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_bookitalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
/* thin, thinitalic, ultra, ultraitalic, xlightitalic */
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_thin.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_thinitalic.otf') format('opentype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_ultra.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_ultraitalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Narrow';
    src: url('/fonts/new/gothamnarrow_xlightitalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

/* === Gotham Pro === */
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_blackitalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_bold.otf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_bolditalic.otf') format('opentype');
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_book.otf') format('opentype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_bookitalic.otf') format('opentype');
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_lightitalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_mediumitalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_thin.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_thinitalic.otf') format('opentype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_ultra.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_ultraitalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_xlight.otf') format('opentype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Pro';
    src: url('/fonts/new/gotham_xlightitalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

/* Общие параметры макета */
body {
  font-family: 'Gotham Pro', sans-serif;
  /* max-width: 1920px; */
  margin: 0 auto;
}

.custom-container {
    padding-left: 130px;
    padding-right: 130px;
}

/* ====== Навбар поверх баннера ====== */
.navbar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) -82.96%,
        rgba(0, 0, 0, 0.5) -11.05%,
        rgba(0, 0, 0, 0) 100%
    ) !important;
    z-index: 10;
}

/* ====== Логотип ====== */
/* Логотип и navbar контейнер */
.navbar .container {
    padding-left: 130px;   /* отступ слева */
    padding-right: 130px;  /* симметрично справа */
    max-width: 1920px;     /* оставляем ограничение макета */
}

/* Логотип */
.navbar-brand img {
    width: 166px;
    height: 30px;
    display: block;
}

/* Адаптив: уменьшаем отступы на маленьких экранах */
@media (max-width: 1200px) {
    .navbar .container {
        padding-left: 5%;
        padding-right: 5%;
    }
    .navbar-brand img {
        width: 130px;
        height: auto;
    }
}

@media (max-width: 768px) {
    .navbar-brand img {
        margin-top: -50px; /* подними выше, подбери значение */
    }
}

/* Ссылки меню */
.navbar-nav .nav-link {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;
    font-size: 18px;
    text-transform: uppercase;
    color: white; /* обычные пункты белые */
    position: relative;
    padding-bottom: 5px;
    margin-left: 25px;
    transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.338);
}

/* Активный пункт меню */
.navbar-nav .nav-link.active {
    color: #E2072E; /* красный текст */
    position: relative; /* для ::after */
    padding-left: 0;
    padding-right: 0; /* убрали боковые отступы для линии */
    display: inline-block; /* ширина = ширина текста */
}

/* Красная линия под активным текстом */
.navbar-nav .nav-link.active::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 100%; /* теперь ровно под текстом */
    height: 3px;
    background-color: #E2072E;
}

/* ====== Подменю (появляется по наведению) ====== */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
}

/* Подложка подменю */
.dropdown-menu {
    display: none; /* по умолчанию скрыто */
    width: 255px !important;
    height: 168px !important;
    border-radius: 10px !important;
    background: #FFFFFF59 !important;
    backdrop-filter: blur(34.5px) !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

/* Показ при наведении */
.nav-item.dropdown:hover > .dropdown-menu {
    display: block;
}

/* Родитель */
.has-submenu {
    position: relative;
}

.submenu {
  padding-top: 20px;
}

/* Подложка */
.submenu-box {
  position: absolute;
  top: 100%;
  left: 0;
  width: 255px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.35);
  backdrop-filter: blur(34.5px);
  padding: 26px 0;
  margin: 0;
  list-style: none;
  z-index: 999;
  overflow: hidden;

  opacity: 0;                   /* изначально невидимо */
  transform: translateY(-10px); /* чуть выше */
  pointer-events: none;         /* не кликается */
  transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Показ при наведении */
.has-submenu:hover .submenu-box {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Элементы подменю */
.submenu-link {
    display: block;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    text-transform: uppercase;
    background: transparent; /* убрали заливку */
    color: #373E3E;
    padding: 12px 20px;
    text-decoration: none;
    transition: all 0.25s ease;
}

/* Ховер для ссылок подменю, кроме активной */
.submenu-link:hover:not(.active-submenu) {
    background: rgba(255, 255, 255, 0.5); /* полупрозрачный белый фон */
    color: #E2072E !important;           /* красный текст */
    z-index: 10000;
	text-decoration: underline;
}


/* Подменю — посещённые ссылки не меняем */
.submenu-link:visited {
    color: inherit; /* цвет как у обычного текста */
    background: none;
}

/* Активный элемент */
.submenu-link.active-submenu {
    background: #FFFFFF80;
    color: #E2072E;
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* Видео-баннер */
.video-banner {
  background-color: #cccccc; /* Серый фон */
  width: 1920px;
  height: 725px;
  opacity: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer {
  background-color: #2C2C2C;
  padding: 20px 0;
}

.footer, 
.footer p, 
.footer a, 
.footer span, 
.footer li {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 400;
  font-style: normal;       /* "Regular" соответствует normal */
  font-size: 16px;
  line-height: 22.32px;
  letter-spacing: 0;
  color: #FFFFFF;           /* чтобы цвет наследовался от родителя */
}

/* Основной контейнер блоков - flex */
.footer-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-start; /* верхний край */
  margin-top: 0; /* убираем старый отступ */
  padding-top: 20px; /* общий внутренний отступ сверху */
}

.footer .logo {
  margin-top: 0; /* логотип на верхнем краю */
}
.footer .col-12.col-md-5 h5.phone-number {
  margin-top: 0; /* номер телефона на верхнем краю колонки */
}


.footer .logo {
  width: 157px;
  height: 29px;
  opacity: 1;
  object-fit: contain;
  margin-top: 0; /* убираем сдвиг сверху */
}

.footer .col-12.col-md-3 p {
  margin-top: 10px; /* регулируем расстояние под логотипом */
}

.footer .col-12.col-md-5 p {
  margin-top: 4px; /* выравниваем с текстом под логотипом */
}

.footer-links ul {
  list-style: none; /* убираем стандартные точки */
  padding: 0;
  margin: 0;
}

.footer-links li {
  margin-bottom: 5px;
}

.footer-links a {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 30.63px;
  letter-spacing: 0;
  color: #777777!important; /* основной серый */
  text-decoration: none;
  transition: color 0.3s ease, padding-left 0.3s ease;
}

.footer-links a:hover {
  color: #E2072E!important; /* красный при наведении */
  padding-left: 0px!important;
}

.footer h5.phone-number {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 700;
  font-style: normal;
  font-size: 25.13px;
  line-height: 38.67px;
  letter-spacing: 0;
  color: inherit; /* чтобы цвет наследовался от футера */
}

.footer h5.phone-number {
  margin-top: -3px; /* сдвигаем вверх на несколько пикселей */
  line-height: 29px; /* примерно равная высота строки с логотипом */
}

.footer .col-12.col-md-5 p {
  margin-top: 20px;  /* отступ сверху под номером телефона */
  line-height: 1.4;  /* удобный межстрочный интервал */
}

.email-footer {
  width: 145px;
  height: 26px;
  opacity: 0.6;
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 400;
  font-style: normal; /* Regular = normal */
  font-size: 16px;
  line-height: 160%;
  letter-spacing: 0;
  color: #FFFFFF; /* белый фон */
  display: inline-block; /* чтобы ширина и высота работали */
  padding: 2px 5px; /* можно подкорректировать по высоте */
  color: inherit; /* цвет текста наследуется */
}

.email-footer-mobile {
  display: none;
}

.footer-links a {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 16px;
  line-height: 30.63px;
  letter-spacing: 0;
  color: #777777; /* цвет ссылок */
  text-decoration: none; /* убираем подчёркивание */
  transition: color 0.3s ease, padding-left 0.3s ease;
}

.footer-links a:hover {
  color: #ffd700; /* золотой при наведении */
  padding-left: 5px; /* лёгкий сдвиг при наведении */
}

.footer-bottom {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 13.39px;
  line-height: 22.32px;
  letter-spacing: 0;
  text-align: center;

  width: 232px;
  height: 23px;
  color: #797979;
  margin: 20px auto 0;
  opacity: 1;
}

@media (max-width: 767.98px) {
  .footer-content {
    display: flex;
    flex-direction: column; /* вертикальное расположение */
    align-items: center;    /* центрируем по горизонтали */
    flex-wrap: nowrap;      /* не нужно переносить, т.к. колонка */
    margin-top: 10px;
  }

  /* Первый блок - фиксированная ширина и центрирование */
  .footer-content > .col-md-3 {
    max-width: 315px;
    width: 100%;
    margin: 0 auto 20px auto;
  }

  /* Второй и третий блоки - ширина 100% + padding */
  .footer-content > .col-md-5,
  .footer-content > div.col-md-2 {
    width: 100% !important;
    padding: 0 16px;
    box-sizing: border-box;
    margin-bottom: 20px;
  }

  /* Второй блок прижат влево */
  .footer-content > .col-md-5 {
    text-align: left;
  }


  /* Стили для телефона в футере */
  .footer h5.phone-number {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 700;      /* Bold */
    font-style: normal;
    font-size: 25.13px;
    line-height: 38.67px;
    letter-spacing: 0;
    color: inherit;
  }

  /* Горизонтальный список в третьем блоке */
  .footer-links {
    width: 100% !important; /* растягиваем на всю ширину */
  }

  .footer-links ul {
	  display: flex !important;
	  flex-wrap: nowrap;        /* не переносить */
	  justify-content: space-between; /* равномерно распределить */
	  padding: 0;
	  margin: 0;
	  list-style: none;
	  width: 100%;
	}

	.footer-links li {
	  flex: 1 1 auto;           /* элементы сжимаются равномерно */
	  text-align: center;       /* выравниваем текст по центру */
	  margin: 0;                /* убираем отступы, чтобы не ломали сетку */
	}

  .footer-links li::marker {
    content: none;
  }

  .footer-bottom {
    margin-top: 2px;
    margin-bottom: 15px;
  }
  /* Если используются разные email для моб и десктопа */
  .email-footer-mobile {
    display: block;
  }

  .email-footer-desktop {
    display: none;
  }
}


/* CONTENT */

.banner {
    position: relative;
    width: 100%;
    height: 725px; /* фиксированная высота баннера */
    overflow: hidden;
}

.banner-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* без искажений */
    z-index: 1;
    opacity: 1; /* твое значение */
}

.banner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
}

.banner-content {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    color: white;
    padding-left: 130px;
}

.left {
    max-width: 500px;
}

/* USA LOGO */
.left-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    position: relative; /* для абсолютного позиционирования флага */
}

/* Подложка */
.left-overlay {
    width: 326px;
    height: 157px;
    border-radius: 10px;
    border: 1px solid #FFFFFF;
    backdrop-filter: blur(20px);
    background: rgba(255, 255, 255, 0.1);
    padding: 20px; /* оставляем как есть */
    color: white;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

/* Флаг */
.left-column .usa-flag {
    position: absolute;
    top: -75px;                /* поднимаем флаг сверху на 10px внутрь подложки */
    left: 38px;               /* сдвигаем немного вправо */
    width: auto;
    height: 89px;
    z-index: 2;               /* выше подложки */
}

.highlight-text {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 500;             /* Medium */
    font-style: normal;
    font-size: 28.08px;
    line-height: 31.82px;
    letter-spacing: 0;
    vertical-align: middle;
    color: #ffffff;                  /* можно поменять на белый или другой */
    padding: 10px 15px;           /* отступы внутри подложки */
    display: inline-block;         /* чтобы фон обтекал текст */
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.338); /* тень текста */
  }

/* AMAZON BTN */
.amazon-btn {
    display: inline-flex;
    align-items: center;       /* Вертикальное выравнивание по центру */
    justify-content: center;   /* Горизонтальное выравнивание по центру */
    gap: 8px;
    width: 260px;
    height: 50px;
    border-radius: 100px;
    background: linear-gradient(270deg, #E2072E 0%, #BA0021 99.06%);
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 700;
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    color: #FFFFFF;
    text-decoration: none;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.63);

    line-height: normal;       /* <-- изменить на normal */
    padding: 0 20px;           /* <-- добавляет горизонтальные отступы, если нужно */
}

.amazon-btn img {
    height: 20px;
    width: auto;
}

.amazon-btn:hover {
    background: linear-gradient(270deg, #ad0625 0%, #BA0021 99.06%);
	color: #FFFFFF;

}



.prime-btn {
    width: 80px;
    height: 29px;
    border-radius: 15px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.prime-logo-banner {
    width: 51px !important;
    height: auto !important;
    display: block;
}

@media (max-width: 768px) {
    /* Скрываем десктопный блок и видео */
    .left-column {
        display: none;
    }
}

/* Скрываем блок на больших экранах */
.main-page-mobile-title-container-mobile {
    display: none;
}

/* Мобильные стили */
@media (max-width: 768px) {
    .main-page-mobile-title-container-mobile {
        position: relative;
		display: flex;
        flex-direction: column;
        align-items: center;
        padding: 20px;
        position: relative; 
        margin-top: -55px; /* блок “заходит” на контейнер выше */
        z-index: 10; /* выше предыдущего контейнера */
    }

    .main-page-usa-flag-mobile {
		width: 134.52px;
		height: 89px;
		position: absolute;
		top: -50px;   /* поправить под дизайн */
		left: 45px;  /* поправить под дизайн */
		border-radius: 10px;
		opacity: 1;
		transform: rotate(0deg);
		z-index: 1000;
	}

    .main-page-header-title-block-mobile {
		width: 344px;
		height: 158px;
		position: relative; 
		border-radius: 10px;
		border: 1px solid #FFFFFF;
		backdrop-filter: blur(20px);
		opacity: 1;
		display: flex;
		align-items: center;          /* центрируем по вертикали */
		justify-content: center;      /* сам текстовый блок будет по центру */
		text-align: left;             /* а сам текст внутри по левому краю */
		padding: 0 20px;              /* одинаковый отступ слева и справа */
		background-color: rgba(0,0,0,0.1);
		z-index: 999; 
		font-family: 'Gotham Pro', sans-serif;
		font-weight: 600;
		font-style: normal;
		font-size: 31.01px;
		line-height: 35.14px;
		letter-spacing: 0;
		margin-bottom: 10px;
	}

	.main-page-highlight-text {
		margin: 0;
		color: #333;
		text-align: left; /* текст всегда по левому краю */
		width: 100%;      /* растягиваем текст на всю ширину блока */
	}

    .main-page-amazon-btn-mobile {
        width: 341px;
        height: 50px;
        border-radius: 100px;
        background: linear-gradient(270deg, #E2072E 0%, #BA0021 99.06%);
        opacity: 1;
        transform: rotate(0deg);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        position: relative;
        z-index: 10;
        padding: 0 20px;
        
        /* Новый стиль текста */
        font-family: 'Gotham Pro', sans-serif;
        font-weight: 700; /* Bold */
        font-style: normal; /* Bold в CSS контролируется font-weight */
        font-size: 19.21px;
        line-height: 100%;
        letter-spacing: 0;
        text-align: center;
        text-transform: uppercase;
        color: #FFFFFF;
    }

    .main-page-prime-btn-mobile {
        margin-left: 15px;
		padding: 10px 20px;
		background: #ffffff;
		border-radius: 25px;
        display: flex;
        align-items: center;
    }

    .main-page-prime-logo-banner-mobile {
        width: 63px;
        height: auto;
    }
}

/* MAIN BANNER CONTENT FLAG */
.banner-content-mobile {
	display:none;
}
/* PRODUCT CATEGORIES */
.product-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: -130px;   /* поднимаем блок */
    position: relative;
    z-index: 1;

    /* адаптивные отступы слева и справа */
    padding: 0 min(130px, 5%);
    box-sizing: border-box;
    justify-content: center;
}

/* Элемент категории */
.category-item {
    flex: 1 1 250px;   /* минимальная ширина 250px, растет по контейнеру */
    max-width: 389px;  /* максимальная ширина */
    height: 454px;     /* фиксированная высота для макета */
    border-radius: 14.59px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    position: relative;
    z-index: 1;
    margin-bottom: 25px;
    /* Адаптивный масштаб */
    font-size: clamp(16px, 2vw, 30px); /* текст уменьшается пропорционально */
}

/* Верхняя часть с картинкой и фоном */
.category-image-wrapper {
  background-color: #F2F2F2;  
  flex: 0 0 75%;        /* 75% высоты блока */
  width: 100%;           /* всегда растягивается по ширине блока */
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;      /* обрезаем лишнее у картинки */
}

.category-image {
  width: 100%;           /* растягиваем по ширине блока */
  height: 100%;          /* растягиваем по высоте wrapper */
  object-fit: cover;     /* сохраняем пропорции и обрезаем лишнее */
  transition: transform 0.35s ease;
}

.category-image-wrapper:hover .category-image {
    transform: scale(1.09); /* немного увеличиваем изображение */
}
/* Нижняя часть с текстом */
.category-text {
  flex: 0 0 25%;
  width: 100%;
  background-color: #fff;
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1; /* ещё меньше межстрочный интервал */
}

/* Убираем подчеркивание и цвет посещённой ссылки */
.category-item-link {
  text-decoration: none; /* убирает подчеркивание */
  color: inherit;        /* цвет текста наследуется от родителя */
}

.category-item-link:visited {
  color: inherit;        /* убираем изменение цвета после посещения */
}

/* TITLE BLOCK FOR PRODUCTS */
.header-title-block {
    width: 90%;              /* занимает до 90% ширины экрана */
    max-width: 820px;        /* не больше 820px */
    height: auto;            /* подстраивается под контент */
    padding: 20px 0;         /* вертикальные отступы */
    position: relative;      
    top: -50px;              
    margin: 0 auto;          
    border-radius: 15px;
    background-color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 10;
    text-align: center;
}

.header-title-block-title {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: clamp(24px, 6vw, 50px); /* адаптивный размер текста: минимум 24px, максимум 50px */
    line-height: 1.6;                  /* высота строки в относительных единицах */
    letter-spacing: 0;
    color: #2C2C2C;
    text-transform: uppercase;
    margin: 0;
}

.mobile-title-container-mobile {
  display: none;
}
/* Скрываем мобильный на больших экранах */
@media (min-width: 769px) {
    .mobile-title-wrapper-mobile {
        display: none;
    }
}

@media (max-width: 768px) {
    .mobile-title-container-mobile {
		position: relative;       /* оставляем для других позиций, если нужно */
		margin-top: -130px;       /* сдвигаем вверх без пустого пространства */
		margin-bottom: 10px!important;      /* отступ до следующего блока */
		max-width: 400px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		z-index: 10;
		display: block;
	}

    .usa-flag-mobile {
        left: 58px;
        /* top: -150px; */
        position: relative;
        /* z-index: 10; */
        display: block;
        text-align: left;
        padding-bottom: 10px;
    }
    /* Подложка тайтла */
    .mobile-title-container-mobile .header-title-block-mobile {
        width: 284px;
        height: 100px;
        margin: 0 auto;
        background-color: #FFFFFF;
        border-radius: 6.24px 6.24px 0 0;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
        display: flex;
        justify-content: center; /* горизонтальное центрирование */
        align-items: center;     /* вертикальное центрирование */
        text-align: center;
    }

    /* H1 внутри подложки */
    .mobile-title-container-mobile h1 {
        font-family: 'Gotham Pro', sans-serif;
        font-size: 30px;
        font-weight: 600;
        margin: 0;
        padding: 0;
        width: 227px;
/*         height: 65px; */
        opacity: 1;
        text-transform: uppercase; /* заглавные буквы */
    }
    /* AMAZON BTN MOBILE */
    .mobile-title-container-mobile .amazon-btn-mobile {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 326px;
        height: 55px;
        margin: 1px auto 80px; /* 30px сверху, авто по бокам, 80px снизу */
        border-radius: 100px 100px 100px 100px; /* или убираем нижний радиус, если нужно */
        background: linear-gradient(270deg, #E2072E 0%, #BA0021 99.06%);
        font-family: 'Gotham Pro', sans-serif;
        font-weight: 700;
        font-size: 22px;
        line-height: 100%;
        text-align: center;
        text-transform: uppercase;
        color: #FFFFFF;
        text-decoration: none;
        opacity: 1;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.63);
    }

    .mobile-title-container-mobile .amazon-btn-mobile img {
        height: 20px;
        width: auto;
    }

    .mobile-title-container-mobile .amazon-btn-mobile:hover {
        opacity: 0.85;
    }

    /* Prime внутри кнопки */
    .mobile-title-container-mobile .prime-btn-mobile {
        width: 80px;
        height: 29px;
        border-radius: 15px;
        background-color: white;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .mobile-title-container-mobile .prime-logo-banner-mobile {
        width: 51px;
        height: auto;
        display: block;
    }
	.category-text {
		margin-top: 0px;
		margin-bottom: 15px;
		font-family: 'Gotham Pro', sans-serif;
		font-weight: 700;
		font-style: normal;
		font-size: 15px !important;
		text-align: center;
		text-transform: uppercase;

	}
}


/* Скрываем десктопный на маленьких экранах */
@media (max-width: 768px) {
    .desktop-title {
        display: none;
    }
    .mobile-title {
        position: absolute;        /* для top и left */
        width: 227px;
        height: 31px;
        top: 31px;
        left: 28.26px;
        display: flex;             /* центрируем текст по вертикали и горизонтали */
        justify-content: center;
        align-items: center;
        font-size: 24px;           /* размер текста */
        text-align: center;
        padding: 0;                /* убираем лишние отступы */
        opacity: 1;
    }
}

@media (max-width: 768px) {
    .product-categories {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: flex-start;
        padding: 0 5px;
        margin-top: 10px;
		margin-left: 18px;
		margin-right: 18px;
		
    }

    /* Ссылка теперь блочная и флекс */
    .category-item-link {
        display: flex;           /* превращаем в флекс */
        flex: 0 0 calc(50% - 5px); /* две карточки в ряд */
        max-width: calc(50% - 5px);
        text-decoration: none;
        color: inherit;
        margin-bottom: 10px;
    }

    .category-item {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;          /* адаптивная высота */
        border-radius: 12px;
        overflow: hidden;
        font-size: clamp(12px, 3vw, 16px);
    }

    .category-image-wrapper {
        flex: 0 0 auto;
    }

    .category-text {
        flex: 0 0 auto;
        font-size: clamp(10px, 2.5vw, 14px);
        line-height: 1.1;
        text-align: center;
        padding: 4px 2px;
    }

    .category-image {
        width: 100%;
        height: auto;
        object-fit: cover;
    }
}

/* <!-- PRODUCTS --> */
.product-items {
    display: flex;
    flex-wrap: wrap;       /* чтобы переносились на новую строку при нехватке места */
    gap: 20px;
    justify-content: center; /* центруем элементы */
    padding: 0 min(130px, 5%);
    box-sizing: border-box;
    /* margin-top: 25px; */
    
}

.product-item {
    width: 389px;
    /* min-height: 533px;  убираем фиксированную минимальную высоту */
    border-radius: 14.59px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    margin-bottom: 25px;
    height: auto; /* позволяет блоку подстраиваться под содержимое */
}

.product-image-wrapper {
    width: 100%;            /* занимает всю ширину контейнера */
    max-width: 389px;       /* но не больше 389px */
    aspect-ratio: 389 / 343; /* сохраняем пропорции */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #F2F2F2;
    border-top-left-radius: 14.59px;
    border-top-right-radius: 14.59px;
    overflow: hidden;
    transform: rotate(0deg);
    opacity: 1;
}

.product-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transition: transform 0.35s ease;
}

/* Эффект при наведении */
.product-image-wrapper:hover .product-image {
    transform: scale(1.09); /* немного увеличиваем изображение */
}

.product-text {
    width: 100%;
    background-color: #fff;
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 700;
    font-size: clamp(16px, 2.5vw, 37px);
    line-height: 1.2em;
    letter-spacing: 0;
    text-transform: capitalize;
    padding: 10px 10px 1px 10px;
    display: block;        /* обычный поток */
    text-align: left;      /* по левому краю, если нужно */
    word-break: break-word;/* перенос слов */
}

.product-text {
    min-height: 3.6em; /* примерно 2 строки при line-height 1.2 */
}

.product-action {
    display: flex;
    justify-content: flex-start; /* по левому краю */
    align-items: center;          /* по вертикали */
    gap: 10px;                     /* отступ между кнопкой и логотипом */
    padding: 1px 1px 20px 10px;
    flex-wrap: nowrap;            /* всегда в одну строку */
}

.buy-button {
    flex: 1 1 70%;
    min-width: 120px;
    max-width: 70%;
    height: auto;
    padding: 7px 0;
    background-color: #FED60C;
    border-radius: 23px;
    border: none;
    font-family: 'Gotham Pro', sans-serif !important;
    font-weight: 600 !important;
    font-size: clamp(12px, 2vw, 18px); /* адаптивный шрифт */
    line-height: 1.8;
    text-align: center;
    color: #2C2C2C;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    box-sizing: border-box;
    text-decoration: none;
}

.prime-logo {
    flex: 0 0 25%;                /* ширина 25% контейнера */
    min-width: 40px;               /* минимальная ширина на мобилках */
    height: auto;                  /* адаптивная высота */
    max-height: 49px;              /* не выше кнопки */
    object-fit: contain;
    background-color: white;
    border-radius: 15px;
    padding: 0;
}


@media (max-width: 768px) {
    .product-item {
        width: calc(50% - 20px); /* 2 колонки с учетом gap */
    }
}

/* Медиазапрос для мобильных */
@media (max-width: 480px) {
	.product-items {
		position: relative;
        top: -50px;

	}
	
	.product-item{
		border-radius:5px;
		margin-bottom: 5px;
	}
	
	.product-image-wrapper {
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
	}
	.product-action {
        flex-wrap: nowrap;
        gap: 10px;
        padding: 1px 5px 5px 5px;
    }

    .buy-button {
		font-size: 8px;       /* уменьшенный шрифт */
		max-width: 60%;        
		min-width: 20px;
		border-radius: 15px;
		line-height: 1.2;      /* чуть увеличил, чтобы текст не был прижат по вертикали */
		padding: 6px 6px;     /* верх/низ 6px, слева/справа 12px */
	}

    .prime-logo {
        max-height: 36px;      /* уменьшаем лого для выравнивания по кнопке */
    }
}
/* PRODUCT INFO */
.info-block {
    width: 100%;               /* теперь занимает всю доступную ширину */
    max-width: 1640px;         /* но не больше 1640px на больших экранах */
    height: auto;              /* подстраивается под контент */
    margin: 50px auto;
    padding: 40px 60px;
    border-radius: 15px;
    background: linear-gradient(180deg, #DEDEDE 0%, #FFFFFF 100%);
    opacity: 1;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.info-title {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 400;
    font-size: 30px;
    line-height: 36px;
    color: #555555;
    margin-bottom: 50px;
    text-align: center;
}

.info-columns {
    display: flex;
    flex-wrap: wrap;           /* чтобы колонки переносились на новую строку */
    gap: 60px;
}

.info-column {
    flex: 1 1 45%;             /* минимум 45%, гибкая ширина */
    display: flex;
    flex-direction: column;
    gap: 15px;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}



.info-subtitle {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #000;
    margin: 0;
    padding: 0;
}

.info-text {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 300;
    font-size: 16px;
    line-height: 24px;
    color: #000;
    margin: 0;
    padding: 0;
}

.info-texts, .info-short b {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 400;
    font-style: normal; /* Regular */
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
    color: #1C1A1A;
    margin: 0;
    padding: 0;
}


.info-texts, .info-short p {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 300; /* Light */
    font-style: normal;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0;
    margin: 0;
    padding: 0;
}
/* Скрываем сокращённый блок на десктопе, показываем колонки */
@media (min-width: 769px) {
    .info-short { display: none; }
}

/* На мобильном наоборот: показываем сокращённый блок, скрываем колонки */
@media (max-width: 768px) {
    .info-columns { display: none; }
}


.show-full-btn {
    width: 165px; /* округлил до ближайшего пикселя */
    height: 34px;
    background: #E9E9E9;
    border: none;
    border-radius: 16px; /* округлил до ближайшего пикселя */
    box-shadow: 0px 1.14px 4.58px 0px #00000026;
    cursor: pointer;
    display: inline-block; /* чтобы центрирование сработало */
    opacity: 1;
    margin-top: 55px;

    /* Текст кнопки */
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 400;
    font-style: medium; /* если Medium не поддерживается, можно использовать font-weight: 500 */
    font-size: 12.61px;
    line-height: 22.96px;
    text-align: center;
    text-transform: capitalize;
    letter-spacing: 0%;
    color: #2C2C2C;
}
.btn-wrapper {
    text-align: center; /* центрирование кнопки */
    margin-top: 10px;
}

/* Адаптивность для планшетов */
@media (max-width: 1024px) {
    .info-block {
        padding: 20px 15px;
    }
    .info-columns {
        flex-direction: column; /* колонки в столбик */
        gap: 20px;
    }
    .info-column {
        flex: 1 1 100%;         /* каждая колонка занимает всю ширину */
    }
    .info-title {
        text-align: left;
        font-size: 24px;
        margin-bottom: 30px;
    }
}

/* Адаптивность для мобильных экранов */
@media (max-width: 480px) {
    .info-block {
        padding: 15px 10px;
    }
    .info-title {
        font-size: 20px;
        margin-bottom: 20px;
    }
    .info-subtitle {
        font-size: 14px;
    }
    .info-text {
        font-size: 14px;
    }
}

@media (max-width: 768px) {
    .banner {
        height: 440px; /* фиксированная высота баннера */
        overflow: hidden; /* скрываем лишнее */
        position: relative;
    }

    .banner-img {
        height: 100%;
        width: 100%;
        object-fit: cover; /* чтобы картинка заполняла и обрезалась без искажений */
        display: block;
    }
}

/* ABOUT US */
.features-block {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 0;
    margin-top: 60px;    /* отступ сверху */
    margin-bottom: 100px; /* отступ снизу */
    margin-left: auto;
    margin-right: auto;
    max-width: 1920px;   /* стало шире */
    width: 90%;          /* почти весь экран */
}

.feature-item {
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
/*     justify-content: center; */
    padding: 10px;
    box-sizing: border-box;
}

.feature-icon {
    width: 90px;
    height: 90px;
    background-color: #F4F4F4;
    border-radius: 50%;
    margin-bottom: 20px;

    display: flex;
    justify-content: center; /* горизонтальный центр */
    align-items: center;     /* вертикальный центр */
    overflow: hidden;        /* чтобы изображение не вылазило за круг */
}

.feature-icon img {
    width: 65px;  /* размер иконки внутри круга */
    height: 65px;
    object-fit: contain; /* сохраняем пропорции */
}

.feature-title {
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 26.67px;
    line-height: 150%;
    color: #1E212C;
    margin: 0 0 10px;
}

.feature-text {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 21.33px;
    line-height: 160%;
    color: #787A80;
    margin: 0;
}
.divider {
    width: 1.33px;
    background: linear-gradient(
        180deg,
        rgba(218, 219, 221, 0) 0%,
        rgba(218, 219, 221, 0.5) 12.33%,
        #DADBDD 51.91%,
        rgba(218, 219, 221, 0.5) 87.85%,
        rgba(218, 219, 221, 0) 100%
    );
    margin: 0 10px;
    align-self: stretch; /* растягиваем по высоте родителя */
}


/* Адаптив для мобильных */
@media (max-width: 768px) {
    .features-block {
        flex-direction: column;
        align-items: center;
        margin-top: 5px;    /* отступ сверху */
        margin-bottom: 100px; /* отступ снизу */
    }
    .divider {
        display: none;
    }

   
}

/* ABOUT US CONTENT */
.about-us-content {
    width: 100%; /* фон на всю ширину экрана */
    background: linear-gradient(
	  180deg,
	  #e9e9e9 0%,      /* полностью серый сверху */
	  #f5f5f5 20%,     /* серый держится до 30% высоты */
	  #ffffff 100%     /* белый внизу */
	);
    padding: 100px 0 150px 0; /* сверху/снизу пространство */
    box-sizing: border-box;
    border-radius: 15px 15px 0 0; /* скругляем только верхние углы */
	
}

.about-us-inner {
    max-width: 1640px; /* контент ограничен */
    margin: 0 auto;    /* центрирование */
    display: flex;
    gap: 40px;         /* расстояние между текстом и изображением */
    align-items: center;
    flex-wrap: wrap;   /* на мобильных блоки могут переходить вниз */
    padding: 0 20px;   /* внутренние отступы слева/справа */
}

.about-us-text {
    flex: 1 1 500px;   /* текст занимает половину, но минимально 500px */
}

.about-us-text p {
    font-family: 'Gotham Pro', sans-serif;
    font-weight: 400;
    font-style: normal;       /* заменили "Regular" на normal */
    font-size: 28.08px;
    line-height: 31.82px;
    letter-spacing: 0%;
    color: #2C2C2C;
    margin-bottom: 15px;
    padding: 0 100px;         /* отступ слева и справа */
}

.about-us-image {
    flex: 1 1 500px;   /* изображение занимает половину */
    display: flex;
    justify-content: center;
}

.about-us-image img {
    max-width: 100%;
    height: auto;
    border-radius: 15px;
}

/* Адаптив для мобильных */
@media (max-width: 1024px) {
    .about-us-inner {
        flex-direction: column-reverse;
        gap: 10px;
    }

	.about-us-text,
	.about-us-image {
		padding: 0 15px 0 0 !important; /* сверху 0, справа 10px, снизу 0, слева 0 */
		box-sizing: border-box;
	}

	.about-us-text p {
		margin: 0;
		text-align: left; /* или center */
	}
}

.about-page .banner-center {
    position: absolute;
    top: 30%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    color: white;
    text-align: left;
}

.about-page .banner-highlight {
    width: 326px;
    height: 172px;
    border-radius: 10px;
    border: 1px solid #FFFFFF;
    backdrop-filter: blur(20px);
    background: rgba(255, 255, 255, 0.1);
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.about-page .amazon-btn {
    position: absolute;
    z-index: 3;
    top: 145px;
}

@media (max-width: 768px) {
    .about-page .banner-center {
        display: none;
    }
}

@media (max-width: 768px) {
    .about-us-content {
        width: 100%;
        padding: 0;            /* убираем глобальные отступы */
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .about-us-inner {
        display: flex;
        flex-direction: column; /* текст под картинкой */
        gap: 10px;              /* расстояние между текстом и картинкой */
        width: 100%;
        box-sizing: border-box;
		padding: 0 10px!important;
    }

    .about-us-image {
        width: 100%;
        flex: 1 1 auto;
    }

    .about-us-image img {
        width: 100%;            /* картинка растягивается на всю ширину */
        height: auto;
        display: block;
    }

    .about-us-text {
        width: 100%;
        padding: 0;         /* отступы слева и справа для текста */
        box-sizing: border-box;
    }

    .about-us-text p {
        margin: 0;
        padding: 0;
        text-align: left;
        word-wrap: break-word;
        overflow-wrap: break-word;
        max-width: 100%;
		color: #2C2C2C;
		font-family: 'Gotham Pro', sans-serif;
		font-weight: 400;
		font-style: normal;       /* заменили "Regular" на normal */
		font-size: 22px;
    }
}

/* Partnership */
.contact-block {
    max-width: 1639px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    /* padding: 0 20px; */
    box-sizing: border-box;
    padding: 50px 0;

}

.contact-columns {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

/* Две колонки на больших экранах */
.contact-column {
    flex: 1 1 calc(50% - 10px);
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 300px;
}

.contact-text {
    font-family: "Gotham Pro", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 0;
    font-style: normal;
    vertical-align: middle;
    color: #1E212C;
}

.contact-info {
    padding: 40px 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.contact-item {
    display: flex;
    align-items: center; /* Центрирование по вертикали */
    gap: 15px;           /* Расстояние между иконкой и текстом */
    margin-bottom: 15px; /* Отступ между строками */
}

.contact-icon {
    width: 40px;
    height: 40px;
    object-fit: contain;
    flex-shrink: 0;
    display: block;
    margin: 0; /* убираем нижний отступ */
}

.contact-item span {
    font-family: "Gotham Pro", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 150%;
    margin: 0; /* убираем левый отступ, gap уже регулирует расстояние */
}

.contact-item {
    font-weight: 700;
}
/* Одна колонка на мобильных */
@media (max-width: 767px) {
    .contact-column {
        flex: 1 1 100%;
    }
}

form {
    padding: 40px 0;
}

.form-title {
    font-family: "Gotham Pro", sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 150%;
    letter-spacing: 0;
    margin-bottom: 20px;
}

.contact-form form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

/* Строки с полями */
.form-row {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

/* Обертка для поля с label */
.form-field {
    display: flex;
    flex-direction: column; /* label сверху поля */
    gap: 5px;
    width: 100%;
}

/* Лейблы */
.form-field label {
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: 0;
    color: #333;
}

/* Двухколоночные поля (Строки 1 и 2) */
.form-row .form-field {
    flex: 1 1 calc(50% - 7.5px);
}

/* Инпуты и textarea */
.contact-form input,
.contact-form textarea {
    font-family: "Gotham Pro", sans-serif;
    font-size: 16px;
    padding: 10px;
    border: 1px solid #D7DADD;
    border-radius: 6px;
    box-sizing: border-box;
    width: 100%;
}

/* Placeholder стиль */
.contact-form input::placeholder,
.contact-form textarea::placeholder {
    font-family: "Lato", sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 160%;
    letter-spacing: 0;
    color: #999;
}
/* Textarea на всю ширину */
.contact-form textarea {
    min-height: 120px;
    resize: vertical;
}

/* Кнопка */
.contact-form button {
    width: 260px;
    height: 50px;
    border-radius: 100px;
    background: linear-gradient(270deg, #E2072E 0%, #BA0021 99.06%);
    color: #fff;
    border: none;
    cursor: pointer;
    font-family: "Lato", sans-serif; /* обновлено */
    font-weight: 700;
    font-style: bold;
    font-size: 16px;
    letter-spacing: 0.5px; /* обновлено */
    text-align: center; /* обновлено */
    align-self: flex-start; /* кнопка не растягивается на всю ширину */
}

.contact-form button:hover {
    opacity: 0.9; /* лёгкий эффект при наведении */
}

/* Адаптив */
@media (max-width: 768px) {
    .form-row {
        flex-direction: column;
    }
    .form-row .form-field {
        flex: 1 1 100%;
    }
    .contact-form button {
        width: 100%;
    }
}


.map-container {
    width: 100%;       /* на всю ширину */
    max-width: 100%;
    height: 643px;     /* новая высота */
    overflow: hidden;
}

.map-container iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

@media (max-width: 768px) {
    .contact-block {
        padding-top: 0;
        padding-bottom: 5px;
    }

    .contact-column {
        width: 100%;
        padding: 0; /* убираем внутренние отступы, чтобы фон мог тянуться */
    }

    /* Оставляем контактный текст без изменений */
    .contact-text {
        padding: 0 15px 20px 15px; /* сохраняем стандартные отступы */
    }

    .contact-info {
        position: relative;
        padding: 20px; /* внутренние отступы для текста и иконок */
        border-radius: 15px;
        z-index: 1;
        overflow: hidden; /* чтобы ::before не вылезал за границы радиуса */
    }

    .contact-info::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100vw; /* фон на всю ширину экрана */
        height: 345px;
        background: linear-gradient(180deg, #FFFFFF 25.79%, #C8C8C8 155.81%);
        opacity: 0.7;
        border-radius: 0; /* радиус оставляем только у .contact-info */
        z-index: -1;
        transform: rotate(180deg);
    }

        /* Правая колонка с формой */
    .contact-column .contact-form {
        padding: 0 15px 20px 15px; /* такие же отступы, как у contact-text */
        box-sizing: border-box;
    }

    /* Чтобы форма растягивалась на всю ширину колонки */
    .contact-column form {
        width: 100%;
    }
    .contact-column .contact-form button {
        width: 231px; /* ширина как в макете */
        height: 49.5px; /* высота как в макете */
        margin: 0; /* без отступов */
        display: block;
        box-sizing: border-box;
    }
}

/* CONTACT US */

p.highlight-text.countact-us-banner-text {
    color: #2C2C2C;
    text-shadow: none; /* убирает тень текста */
    box-shadow: none;  /* если была тень блока */
}

/* Контейнер FAQ */
.faq-block {
    max-width: 1639px;
    width: 100%;
    margin: 0 auto;
    padding: 50px 0; /* как у contact-block */
    box-sizing: border-box;
}

/* Элемент FAQ */
.faq-item {
    width: 792px;
    max-width: 100%;
    background: #F9F9F9;
    border-radius: 16px;
    margin-bottom: 15px;
    overflow: hidden;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Заголовок элемента (вопрос) */
.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    font-family: "Gotham Pro", sans-serif;
    font-weight: 700;
    font-style: medium;
    font-size: 15.6px;
    line-height: 24px;
    letter-spacing: -0.13px;
    color: #2C2C2C;
}

/* Текст элемента (ответ) */
.faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 20px;
    font-family: "Gotham Pro", sans-serif;
    font-weight: 400;
    font-style: regular;
    font-size: 15.9px;
    line-height: 24px;
    letter-spacing: -0.38px;
    color: #747474;
    transition: max-height 0.3s ease, padding 0.3s ease;
}

/* Показ ответа при раскрытии */
.faq-item.active .faq-answer {
    max-height: 500px; /* достаточно для текста */
    padding-bottom: 20px;
}

/* Плюс/крестик */
.faq-toggle {
    font-size: 24px;
    user-select: none;
    transition: transform 0.3s ease;
}

.faq-item.active .faq-toggle {
    transform: rotate(45deg);
}


@media (max-width: 768px) {
    .faq-block {
        padding: 50px 15px; /* как у контактов */
    }

    .faq-item {
        width: 100%;
    }

    .faq-question, .faq-answer {
        padding-left: 0;
        padding-right: 0;
    }
}

/* MAIN PAGE */
.main-category-page-content-block {
  position: relative;
  width: 90%;
  max-width: 1084px;
  height: 249px;
  margin: 100px auto 0;
  border-radius: 15px 15px 0 0; /* только верхние углы */
  overflow: visible; /* чтобы флаг мог выходить за блок */
  display: flex; /* для колонок */
  background: linear-gradient(180deg, #DEDEDE 0%, #FFFFFF 100%); /* сверху серый, снизу белый */
  box-sizing: border-box;
  padding: 20px;
}

.main-category-page-content-block .left-column {
  flex: 0 0 70%;
  padding: 20px 30px 0 100px; /* top right bottom left */
  box-sizing: border-box;
  display: flex;
  align-items: center; /* вертикальное центрирование текста */
}

.main-category-page-content-block .left-column p {
  margin: 0 auto;
  font-family: 'Gotham Pro', sans-serif; /* запасной шрифт на случай отсутствия */
  font-weight: 500;
  font-style: normal; /* в CSS нет "Medium" как значение font-style, Medium — это вес */
  font-size: 28.08px;
  line-height: 31.82px;
  letter-spacing: 0;
  margin: 0; /* убираем стандартный отступ p */
  color: #2C2C2C;
}

.main-category-page-content-block .right-column {
  flex: 0 0 30%;
  position: relative; /* для абсолютного позиционирования флага */
  padding-left: 20px;
  box-sizing: border-box;
}

.main-category-page-content-block .right-column .main-usa-flag {
  width: 284px;
  height: 188px;
  position: absolute;
  top: -100px; /* поднимаем флаг выше блока */
  right: 0;
  border-radius: 15px;
  opacity: 1;
}

.usa-map-block {
  width: 95%;
  margin: 0 auto;
  position: relative;
  top: -150px;       /* поднимаем блок поверх предыдущего на 50px */
  z-index: 10;      /* выше предыдущего блока */
  overflow: visible; /* чтобы картинка не обрезалась */
}

.usa-map-block .main-usa-map {
  width: 100%;
  max-width: 100%;
  height: auto;
  display: block;
  z-index: 10;
}
/* Footer Products */
.main-page-footer-products {
  width: 100%;
  margin: 0;
  position: relative;
  z-index: 20;         /* выше карты */
  overflow: visible;
}

.main-page-footer-products .footer-products-img {
  width: 100%;          
  max-width: 100%;
  height: auto;
  display: block;
  border-radius: 15px 15px 0 0;
  margin-top: -400px;   /* поднимаем футер над картой */
  z-index: 30;          /* убедимся, что футер перекрывает карту */
  position: relative;
}

@media (max-width: 768px) {

  /* CONTENT BLOCK */
  .main-category-page-content-block {
    flex-direction: column; /* колонки друг под другом */
    height: auto;           /* авто-высота */
    padding: 20px 15px;
    margin: 40px auto 0;    /* сброс десктопных отступов */
  }

  .main-category-page-content-block .left-column,
  .main-category-page-content-block .right-column {
    flex: 0 0 100%;
    padding: 10px 15px;
    position: static;       /* убираем абсолютное позиционирование */
    text-align: center;     /* выравнивание текста и картинки по центру */
  }

  .main-category-page-content-block .right-column .main-usa-flag {
    width: 70%;     /* адаптивная ширина флага */
    max-width: 108px;
    height: auto;
    top: auto;      /* сброс */
    right: auto;    /* сброс */
    border-radius: 15px;
    margin-left: 50px;
  }

  /* USA MAP BLOCK */
  .usa-map-block {
    top: 0;         /* сброс заезда */
    margin: 20px auto 0;
  }

  .usa-map-block .main-usa-map {
    width: 100%;
    height: auto;
  }

  .main-page-footer-products {
    margin: -90px 0 0 0;  /* наезд на предыдущий блок */
    overflow: hidden;    
    width: 100%;
    height: 400px;       
    position: relative;
  }

  .main-page-footer-products .footer-products-img {
    position: absolute;
    top: 0;
    left: 50%;
    width: 150%;         
    height: 100%;        
    transform: translateX(-50%);
    object-fit: cover;
  }
}

@media (max-width: 480px) {
  .main-page-footer-products {
    overflow: hidden; /* чтобы не появлялся горизонтальный скролл */
    position: relative;
	height:auto;
  }

  .main-page-footer-products .footer-products-img {
    width: 160%!important;             
    max-width: none;
    height: auto;
    position: relative;
    left: 50%;               /* сдвигаем середину картинки к центру экрана */
    transform: translateX(-50%); /* центрируем картинку */
    margin-top:0;
    border-radius: 10px 10px 0 0;
  }
}

/* Мобильное меню — скрыто по умолчанию */
.mobile-menu {
  display: none; /* скрыто всегда */
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #111;
  color: #fff;
  z-index: 10000;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translateX(-100%);
  transition: transform 0.3s ease;
}

/* MOBILE MENU */

/* Контейнер бургера - мобильная версия */
.custom-burger-mobile {
  position: fixed;
  top: 10px;
  right: 10px;
  width: 39px;
  height: 34px;
  background: rgba(0,0,0,0.1);
  border-radius: 4px;
  cursor: pointer;
  z-index: 999;
  display: none; /* скрываем по умолчанию для десктопа */
}

/* Линии бургера - мобильная версия */
.custom-burger-mobile span {
  position: absolute;
  left: 50%;
  width: 27px;
  height: 1.35px;
  border-radius: 13.5px;
  background: transparent;
  border: 1px solid transparent;
  border-image-source: linear-gradient(270deg, #E2072E 0%, #BA0021 99.06%);
  border-image-slice: 1;
  transform: translateX(-50%);
}

.custom-burger-mobile span:nth-child(1) { top: 8px; }
.custom-burger-mobile span:nth-child(2) { top: 50%; transform: translate(-50%, -50%); }
.custom-burger-mobile span:nth-child(3) { bottom: 8px; }

/* Закрывающий бургер - мобильная версия */
.close-burger-mobile {
  position: fixed;
  top: 10px;
  right: 10px;
  width: 39px;
  height: 34px;
  background: rgba(0,0,0,0.1);
  border-radius: 4px;
  cursor: pointer;
  z-index: 100002;
  display: none;
}

/* Мобильное меню */
.mobile-menu-mobile {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;

  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(20px);

  color: #fff;
  z-index: 100001;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding-top: 100px;

  /* плавное появление */
  opacity: 0;
  transform: translateY(-20px);
  pointer-events: none;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.mobile-menu-mobile.active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Контейнер мобильного меню */
.mobile-nav-mobile {
  list-style: none;
  margin: 0 auto; /* центрирование блока меню */
  width: 100%;
  max-width: 300px; /* или другая ширина по желанию */
  display: flex;
  flex-direction: column;
  align-items: center; /* центрируем элементы по горизонтали */
}


/* Пункты меню */
.mobile-nav-mobile li {
  width: 100%; /* чтобы ссылки занимали всю ширину элемента */
  margin: 30px 0;
  padding: 7px 0;
}

/* Стили ссылок - мобильная версия */
.mobile-nav-mobile a {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 500;
  font-style: medium; /* для основного меню */
  font-size: 35.54px;
  line-height: 15.88px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: color 0.3s ease;
  text-align: left;
}

/* Стили ссылок - мобильная версия */
.submenu-box-mobile a {
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 400;
  font-style: medium; /* для основного меню */
  font-size: 19.54px !important;
  line-height: 25.88px;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  transition: color 0.3s ease;
  margin-left: 53px;
}



.submenu-box-mobile {
  display: none;
  position: relative;      /* теперь привязано к родителю */
  width: 110vw;            /* фон на всю ширину экрана */
  background: #000;
  margin: 0;
  padding: 5px 5px 10px 20px; /* сверху/снизу 10px, по бокам 20px */
  box-sizing: border-box;
  text-align: left; 

}


.submenu-box-mobile::before {
    content: "";
    position: absolute;
    top: -120px;          /* поднимаем фон выше текста */
    left: 0;              /* прижимаем к левому краю */
    width: 100vw;         /* на всю ширину экрана */
    height: 150px;        /* высота поднятой части фона */
    background: #000;
    z-index: -1;
	pointer-events: none;
}

.submenu-box-mobile ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.submenu-box-mobile li {
  margin: 2px 0;
}

.submenu-box-mobile li a {
  font-size: 1.6rem;
  color: #fff;
  text-decoration: none;
  text-align: left;
  margin-left: 53px;
}


.nav-sub-link-mobile {
  display: block;
  font-family: 'Gotham Pro', sans-serif;
  font-weight: 300;
  font-size: 19.83px;
  line-height: 25.5px;
  letter-spacing: 0%;
  text-transform: uppercase;
  color: #fff;
  text-decoration: none;
  padding: 5px 0;
}

/* Показываем субменю при активном состоянии */
.has-submenu-mobile.active .submenu-box-mobile {
  max-height: 500px; /* регулируется под контент */
}


/* Отключаем hover на мобильных */
@media (max-width: 991px) {
  .has-submenu-mobile:hover .submenu-box-mobile {
    max-height: none !important; /* или не писать вообще */
  }
  

  #burgerOpen-mobile { display: block; }
  #navbarNav-mobile { display: none !important; }
}

/* Показываем закрывающий бургер только когда меню открыто */
.mobile-menu-mobile.active + .close-burger-mobile,
.mobile-menu-mobile.active .close-burger-mobile {
  display: block;
}

/* Активный пункт меню - мобильная версия */
.mobile-nav-mobile .nav-link-mobile.active-mobile {
    color: #E2072E; /* красный текст */
    position: relative; /* для ::after */
    padding-left: 0;
    padding-right: 0; /* убрали боковые отступы для линии */
    display: inline-block;
}

/* Красная линия под активным текстом - мобильная версия */
.mobile-nav-mobile .nav-link-mobile.active-mobile::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -30px; /* можно подкорректировать для мобильного */
    width: 100%; /* ровно под текстом */
    height: 3px;
    background-color: #E2072E;
}

.submenu-box-mobile {
    padding-left: 20px;   /* отступ слева совпадает с меню */
    padding-right: 0;     /* убрать лишние отступы справа */
    text-align: left;     /* текст прижат к левому краю */
}

/* На экранах шире 768px скрываем мобильное меню */
@media (min-width: 769px) {
  #mobileMenu-mobile {
    display: none;
  }
}
a:visited {
    color: inherit; /* или тот же цвет, что и у a */
}

a.amazon-btn,
a.amazon-btn:link,
a.amazon-btn:visited,
a.amazon-btn:hover,
a.amazon-btn:active {
  color: #FFFFFF !important;
  text-decoration: none !important;
}

@media (max-width: 768px) {
    .about-us-inner {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .about-us-image {
        order: -1;              /* картинка сверху */
        position: relative;
        width: 100vw;           /* растягиваем на весь экран */
        left: 50%;              /* сдвигаем начало блока к центру */
        transform: translateX(-50%); /* центрируем блок по экрану */
        margin-bottom: 20px;    /* отступ до текста */
    }

    .about-us-image img {
        width: 100%;
        height: auto;
        border-radius: 0; 
        display: block;
}

@media (max-width: 480px) {
    .about-us-image img {
        width: 100%;
        height: auto;
    }
	
	.main-page-footer-products {
	  position: relative;
	  width: 100%;
	  overflow: hidden; /* если нужно обрезать */
	  text-align: center; /* для центрирования inline-элемента */
	}

	.main-page-footer-products .footer-products-img {
	  width: 30%;   /* уменьшаем ширину */
	  height: auto; /* сохраняем пропорции */
	}
}