@font-face {
    font-family: "DrukTextWideCyr";
    src: url("../fonts/druktextwidecyr-medium.d41d8cd98f00.eot"); /* IE 9 Compatibility Mode */
    src: url("../fonts/druktextwidecyr-medium.d41d8cd98f00.eot?#iefix") format("embedded-opentype"), /* IE < 9 */ url("../fonts/druktextwidecyr-medium.726388e387d6.woff2") format("woff2"),
        /* Super Modern Browsers */ url("../fonts/druktextwidecyr-medium.d41d8cd98f00.woff") format("woff"),
        /* Firefox >= 3.6, any other modern browser */ url("../fonts/druktextwidecyr-medium.cce0b322e0f5.ttf") format("truetype"),
        /* Safari, Android, iOS */ url("../fonts/druktextwidecyr-medium.123f5b43b533.svg#druktextwidecyr-medium") format("svg"); /* Chrome < 4, Legacy iOS */
}

@font-face {
    font-family: "CoreSansItalic";
    src: url("../fonts/CoreSans/CoreSansC-65BoldIt.a05aab5732b3.eot") format("embedded-opentype"),
    url("../fonts/CoreSans/CoreSansC-65BoldIt.6c7ac41e18ea.woff2") format("woff2"),
    url("../fonts/CoreSans/CoreSansC-65BoldIt.ee1d8f90d751.woff") format("woff"),
    url("../fonts/CoreSans/CoreSansC-65BoldIt.67fcd8b77ce3.ttf") format("truetype");
}

@font-face {
    font-family: "CoreSans";
    src: url("../fonts/CoreSans/CoreSansC-65Bold.2756469a1fc6.eot") format("embedded-opentype"),
    url("../fonts/CoreSans/CoreSansC-65Bold.13df2c3da4ac.woff2") format("woff2"),
    url("../fonts/CoreSans/CoreSansC-65Bold.a8c3ea95513a.woff") format("woff"),
    url("../fonts/CoreSans/CoreSansC-65Bold.e4358410ff63.ttf") format("truetype");
}

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
}

body {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: #f6f6f6;
}

h1,
h2,
h3,
h5,
h6 {
    font-family: "DrukTextWideCyr", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
    /* color: #f6f6f6; */
}

h4 {
    font-family: "CoreSansItalic", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
    /* color: #f6f6f6; */
}

h1 {
    font-size: 60px;
}

h2 {
    font-size: 50px;
}

h4 {
    font-size: 30px;
}

p mark {
    background-color: #ff835a;
}

input::placeholder {
    color: #838383 !important;
}

:root,
[data-bs-theme="dark"] {
    --bs-dark: #0a0908;
    --bs-body-color: #0a0908;
    --bs-body-bg: #f6f6f6;
    --bs-highlight-color: #0a0908;
    --bs-danger: #a74322;
}

.icon-3d {
    height: 200px;
}

.table {
    --bs-table-bg: none;
    --bs-table-color-type: #f6f6f6;
    --bs-table-bg-type: initial;
    --bs-table-color-state: #f6f6f6;
    --bs-table-bg-state: initial;
    --bs-table-color: #f6f6f6;
    --bs-table-border-color: var(--bs-border-color);
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--bs-emphasis-color);
    --bs-table-striped-bg: rgba(var(--bs-emphasis-color-rgb), 0.05);
    --bs-table-active-color: var(--bs-emphasis-color);
    --bs-table-active-bg: rgba(var(--bs-emphasis-color-rgb), 0.1);
    --bs-table-hover-color: var(--bs-emphasis-color);
    --bs-table-hover-bg: rgba(var(--bs-emphasis-color-rgb), 0.075);
    width: 100%;
    margin-bottom: 1rem;
    vertical-align: top;
    border-color: var(--bs-table-border-color);
}

.btn {
    font-size: 18px;
    font-weight: 400;
    font-family: "Montserrat", sans-serif;
    padding: 10px 45px;
    border-radius: 10px;
    border: 0;
}

.btn-outline-danger {
    border: 1px solid #e15a2b;
    font-size: 12px;
    padding: 5px 15px;
    border-radius: 10px;
    color: #e15a2b;
    --bs-btn-color: #f6f6f6;
    --bs-btn-hover-bg: var(--bs-danger);
    --bs-btn-hover-border-color: #89391e;
}

.btn-outline-success {
    border: 1px solid #1a8754;
    font-size: 12px;
    padding: 5px 15px;
    border-radius: 10px;
    --bs-btn-color: #f6f6f6;
}

.btn-outline-secondary {
    border: 1px solid #f6f6f6;
    font-size: 12px;
    padding: 5px 15px;
    border-radius: 10px;
    --bs-btn-color: #f6f6f6;
}

.btn-danger {
    --bs-btn-color: #f6f6f6;
    --bs-btn-bg: #e15a2b;
    --bs-btn-border-color: var(--bs-danger);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: var(--bs-danger);
    --bs-btn-hover-border-color: #89391e;
    --bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);
    --bs-btn-active-bg: #89391e;
    --bs-btn-active-border-color: #89391e;
    --bs-btn-disabled-bg: #89391e;
    --bs-btn-disabled-border-color: #89391e;
}

.btn-secondary {
    --bs-btn-color: #f6f6f6;
    --bs-btn-bg: #1d1d1d;
    --bs-btn-hover-color: #f6f6f6;
    --bs-btn-hover-bg: #343434;
}

.pagination {
    --bs-pagination-padding-x: 0.75rem;
    --bs-pagination-padding-y: 0.375rem;
    --bs-pagination-font-size: 1rem;
    --bs-pagination-color: #000;
    --bs-pagination-bg: #e15a2b;
    --bs-pagination-border-width: var(--bs-border-width);
    --bs-pagination-border-color: #000;
    --bs-pagination-border-radius: var(--bs-border-radius);
    --bs-pagination-hover-color: #f6f6f6;
    --bs-pagination-hover-bg: var(--bs-tertiary-bg);
    --bs-pagination-hover-border-color: var(--bs-border-color);
    --bs-pagination-focus-color: var(--bs-link-hover-color);
    --bs-pagination-focus-bg: var(--bs-secondary-bg);
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
    --bs-pagination-active-color: #fff;
    --bs-pagination-active-bg: #262628;
    --bs-pagination-active-border-color: #262628;
    --bs-pagination-disabled-color: var(--bs-secondary-color);
    --bs-pagination-disabled-bg: var(--bs-secondary-bg);
    --bs-pagination-disabled-border-color: var(--bs-border-color);
    display: flex;
    padding-left: 0;
    list-style: none;
}

.navbar {
    position: relative;
    min-height: 100px;
}

header .logo {
    width: 130px;
}

.navbar {
    position: absolute; /* Абсолютное позиционирование */
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000; /* Убедитесь, что навигация поверх hero */
    width: 100%;
    background: transparent !important; /* Прозрачный фон */
    transition: all 0.5s ease; /* Плавные переходы */
}

.navbar .logo {
    font-family: "DrukTextWideCyr", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
    font-size: 22px;
    color: #f6f6f6;
    text-decoration: none;
}

.nav-link {
    font-size: 16px;
    color: #f6f6f6;
}

.nav-link:hover {
    color: #e15a2b;
}

.navbar .active {
    border-bottom: 2px solid #e15a2b;
}

.navbar.scrolled {
    position: fixed;
    background: rgba(29, 29, 29, 0.9) !important;
    box-shadow: 0 2px 10px rgba(29, 29, 29, 0.1);
}

.navbar .d-flex {
    gap: 5px;
}

/* .hero {
    position: relative;
    height: 80vh;
    overflow: hidden;
    filter: brightness(0.5);
}

.hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
} */

.navbar::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    background: linear-gradient(to bottom, rgba(29, 29, 29, 0.7) 0%, transparent 100%);
    z-index: -1;
}

.navbar i {
    color: #f6f6f6;
    font-size: 22px;
}

.navbar i:hover {
    color: #e15a2b;
}

.social-icon {
    width: 22px;
    height: 22px;
}

footer i {
    color: #f6f6f6;
    font-size: 22px;
}

footer i:hover {
    color: #e15a2b;
}

.navbar-nav {
    gap: 5px; /* Расстояние между пунктами меню */
}

header .dropdown-menu {
    background-color: rgb(0, 0, 0, 0.5);
    backdrop-filter: blur(5px); /* Размытие фона за элементом */
    -webkit-backdrop-filter: blur(5px); /* Для поддержки в Safari */
    border: 0;
}

header .dropdown-menu .dropdown-item {
    color: #f6f6f6;
}

.carousel {
    height: 600px;
}

.carousel-item {
    height: 100%;
    overflow: hidden;
}

.carousel-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.5);
}

.carousel-caption {
    bottom: 2.25rem;
    left: 5%;
    right: 5%;
    color: #f6f6f6;
}

.catalog .carousel-caption {
    top: 6rem;
    bottom: 0;
}

.carousel-caption .btn {
    /* margin-left: 60px; */
    margin-top: 13px;
    font-size: 16px;
}

.top-form {
    background: rgba(0, 0, 0, 0.2) !important;
    box-shadow: 0 2px 10px rgba(29, 29, 29, 0.1);
    padding: 20px;
    border-radius: 10px;
}

.top-form form {
    font-size: 11px;
}

.top-form input {
    background-color: #1d1d1d;
    color: #838383;
    border: 1px solid #1d1d1d;
    height: 45px;
    border-radius: 10px;
}

.top-form p {
    color: #959595;
    margin-bottom: 0;
}

.top-form a {
    color: #959595 !important;
}

.breadcrumb a {
    color: #f6f6f6;
    text-decoration: none;
}

/* .text-cap {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: normal;
    font-style: normal;
    color: #f6f6f6;
} */

.statistic {
    background-color: #e15a2b;
    color: #f6f6f6;
    padding: 30px 0;
}

section {
    padding: 100px 0;
}

section svg {
    width: 45px;
    border-radius: 5px;
}

.bg-dark {
    background-color: #1d1d1d !important;
    color: #f6f6f6;
}

.bg-dark-outline {
    background-color: transparent !important;
    color: #000;
    border: 1px solid #000 !important;
}

.bg-grey {
    background-color: #333332 !important;
    color: #f6f6f6;
    box-shadow: 0 15px 25px rgba(29, 29, 29, 0.9);
}

.bg-orange {
    background-color: #e15a2b !important;
    color: #f6f6f6;
}

.bg-orange-outline {
    background-color: transparent !important;
    color: #000;
    border: 1px solid #e15a2b !important;
}

.bg-light {
    background-color: #f6f6f6 !important;
    color: #000;
}

.card {
    border-radius: 15px;
}

#about .card {
    border: 0;
}

#advantages .card {
    background-color: none;
    border: 1px solid #000;
}

#catalogs .card {
    border: 0;
}

#steps .card {
    background-color: none;
    border: 1px solid #000;
}

#socials .card {
    border: 1px solid transparent;
    transition: border-color 0.3s ease;
}

#socials .card a {
    color: #e15a2b;
    text-decoration: none;
}

#socials .card:hover {
    border-color: #e15a2b;
    cursor: pointer;
}

#socials .card hr {
    transition: width 0.3s ease;
    width: 100%;
    margin: 20px auto;
    transform-origin: center;
}

#socials .card:hover hr {
    width: 80%;
}

#reviews .card {
    background-color: none;
    border: 1px solid #000;
}

#reviews .card i {
    color: gold;
}

#places .card {
    border: 1px solid transparent;
    transition: border-color 0.3s ease;
}

#places .card a {
    color: #e15a2b;
    text-decoration: none;
}

#places .card:hover {
    border-color: #e15a2b;
    cursor: pointer;
}

#places .card hr {
    transition: width 0.3s ease;
    width: 100%;
    margin: 20px auto;
    transform-origin: center;
}

#places .card:hover hr {
    width: 80%;
}

#catalog {
    padding: 30px 0px;
}

.pt-6 {
    padding-top: 80px !important;
}

#catalog .card {
    background-color: none;
    border: 1px solid #000;
}

#catalog .card {
    border: 0;
}

#catalog select {
    background-color: #1d1d1d;
    color: #838383;
    border: 1px solid #303030;
}

#catalog input {
    background-color: #1d1d1d;
    color: #838383;
    border: 1px solid #303030;
}

#catalog .dropdown-menu {
    background-color: rgb(0, 0, 0, 0.1);
    backdrop-filter: blur(5px); /* Размытие фона за элементом */
    -webkit-backdrop-filter: blur(5px); /* Для поддержки в Safari */
}

#catalog .dropdown-menu .dropdown-item {
    color: #f6f6f6;
}

#catalog .dropdown-menu {
    max-height: 300px !important;
    margin-bottom: 10px;
    padding: 0;
}

#catalog .dropdown-menu .inner {
    max-height: 230px !important;
}

#catalog .dropdown-menu {
    max-width: 300px !important;
    overflow-x: auto !important;
}

#catalog ul.dropdown-menu {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

#catalog .d-flex {
    gap: 10px;
}

#catalog td {
    padding: 0.5rem 0;
}

.input-group-text {
    background-color: #1d1d1d;
    color: #838383;
    border: 1px solid #303030;
}

/* Десктопная версия (≥992px) */
@media (min-width: 992px) {
    .navbar-collapse {
        flex-grow: 0; /* Отключаем растягивание */
        width: auto;
    }

    .navbar-nav {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }

    .navbar .logo {
        margin-right: 0;
    }
}

@media (max-width: 991px) {
    .desktop {
        display: none;
    }

    .navbar {
        position: fixed;
        background: rgba(0, 0, 0, 0.9) !important;
    }

    .carousel {
        height: 500px;
    }

    .carousel-caption {
        top: 9.25rem;
    }

    .carousel-caption .btn {
        margin-left: 0;
        margin-top: 20px;
    }

    section {
        padding: 50px 0;
    }

    h1 {
        font-size: 32px;
    }

    h2 {
        font-size: 28px;
    }
}

/* Улучшение вида крестика */
.modal-header .btn-close {
    filter: invert(0) brightness(100%);
    transition: opacity 0.3s ease;
    margin: -0.5rem -0.5rem -0.5rem auto; /* Позиционирование */
}

.modal-header .btn-close:hover {
    opacity: 0.75;
}

/* Убираем стандартный крестик Bootstrap */
.modal-header .btn-close::after {
    display: none;
}

/* Альтернативный вариант с Font Awesome */
.modal-header .btn-close.fa-times {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 1.25rem;
    background: none;
    opacity: 1;
}

.pagination .page-item .page-link {
    height: 40px; /* Фиксированная высота */
    min-width: 40px; /* Минимальная ширина (для цифр) */
    display: flex;
    align-items: center; /* Вертикальное выравнивание содержимого */
    justify-content: center; /* Горизонтальное выравнивание */
}

/* Иконки Font Awesome */
.pagination .page-link i {
    line-height: 1; /* Убирает лишний отступ у иконок */
}

.form-select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23333' d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 16px;
    padding-right: 2.5rem !important;
}

.bootstrap-select .dropdown-toggle::after {
    content: "" !important;
    border: none !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23333' d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    width: 16px;
    height: 16px;
    margin-right: 0.5rem;
}

/* Стили для иконки доставки */
.delivery-icon {
    transition: width 0.3s ease;
}

/* Мобильная версия (≤768px) */
@media (max-width: 768px) {
    .delivery-icon {
        width: 150px !important;
    }
    
    /* Иконки машин в карточках каталогов */
    .car-icon {
        margin-top: 80px !important;
    }

    .car-icon .position-absolute  {
        top: -50px !important; 
    }
    
    .car-icon img {
        width: 60% !important;
    }
}