* {
    margin: 0; padding: 0;
    box-sizing: border-box;
    font-family: 'Mulish', sans-serif;
}

input[type="text"] {margin: 0; border: none; outline: none;}

a, a:link, a:visited {text-decoration: none; color: inherit;}
a:hover {text-decoration: none;}

button {border: none; cursor: pointer;}

html, body {
    width: 100%;
    min-height: 100vh;
}

body {
    width: 100%; max-width: 1528px; margin: 0 auto; padding: 0 64px;
    background-color: #F5F5F5;
    display: flex;
    flex-direction: column;
}

@media (max-width: 1400px) {
    body {width: 100%; max-width: none; padding: 0 64px;}
}

@media (max-width: 1199px) {
    body {
        width: 100%; max-width: none; margin: 0; padding: 0;
        overflow-x: hidden;
    }
}

.vline {width: 1px; min-width: 1px; height: 100%; background-color: #E9E9E9;}

.header {
    width: 100%; height: auto; min-height: 1px;
    display: flex; flex-direction: column;
}

@media (max-width: 1199px) {
    .header {
        background-color: #FFADC7;
    }
}


/* header_overhead */

.header_overhead {
    width: 100%; height: 40px; min-height: 40px;
    display: flex; flex-direction: row; align-items: center; justify-content: space-between;
    box-shadow: inset 0 -1px 0 0 #E9E9E9;
}

.overhead_Block {
    display: flex; flex-direction: row; align-items: center; gap: 16px;
    height: 16px; min-height: 16px;
}

@media (max-width: 1199px) {
    .header_overhead {
        height: auto;
        min-height: env(safe-area-inset-top, 0px);
        padding-top: env(safe-area-inset-top, 0px);
        box-shadow: none;
        margin-bottom: 16px;
    }
    
    .overhead_Block {
        display: none;
    }
}

.overhead_leftBlock {justify-self: start;}
.overhead_rightBlock {justify-self: end;}

.overhead_item {display: flex; align-items: center; gap: 8px;}

.overhead_item span {font-size: 14px; font-weight: 600; color: #555555; line-height: 10px;}
.overhead_rightBlock .overhead_item:hover span {color: #181818;}


/* header_main */

.header_main {
    width: 100%; height: auto; min-height: 1px; padding: 16px 0;
    display: flex; flex-direction: row; align-items: center; gap: 64px;
    box-shadow: inset 0 -1px 0 0 #E9E9E9;
}

@media (max-width: 1399px) {
    .header_main {gap: 32px;}
}

@media (max-width: 1199px) {
    .header_main {display: none;}
}

.main_Block {display: flex; flex-direction: row; align-items: center;}

.main_exploreBlock {flex-grow: 1; display: flex; flex-direction: row; align-items: center; gap: 6px;}

.explore_item {
    height: 56px; min-width: 56px; min-height: 56px; padding: 0 24px;
    display: flex; flex-direction: row; align-items: center; gap: 16px; flex-shrink: 0;
    border-radius: 24px 12px 12px 24px;
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    transition: box-shadow 0.2s ease, border-radius 0.3s ease;
}
.explore_item:hover {border-radius: 24px; box-shadow: inset 0 0 0 1px #FFADC7;}

.explore_item span {
    font-size: 16px; font-weight: 700; color: #181818; line-height: 12px;
    display: inline-block; white-space: nowrap;
}

.explore_itemShowcase {
    border-radius: 12px;
}

.explore_itemSearch {
    min-width: 160px;
    flex-grow: 1; flex-shrink: 1;
    border-radius: 12px 24px 24px 12px;
}

.explore_itemSearch input[type="text"] {
    width: 100%; height: 100%;
    font-size: 16px; font-weight: 700; color: #181818; line-height: 12px;
    background: transparent;
}

.explore_itemSearch input[type="text"]::placeholder {color: #AAAAAA;}
.explore_itemSearch:focus-within {box-shadow: inset 0 0 0 1px #FFADC7;}

.main_userBlock {display: flex; flex-direction: row; align-items: center; gap: 24px;}

.user_item {
    height: 56px; min-height: 56px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
    transition: box-shadow 0.2s ease;
}
.user_item:hover {box-shadow: inset 0 -1px 0 0 #FFADC7;}

.user_item span {font-size: 14px; font-weight: 600; color: #555555; line-height: 10px; transition: color 0.2s ease;}
.user_item:hover span {color: #181818;}

.cart-icon-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cart-badge {
    position: absolute; top: 0; right: 0; transform: translate(50%, -50%);
    min-width: 24px; height: 24px; padding: 0 6px;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #F5F5F5; border-radius: 12px;
    background-color: #FF0050;
}

.cart-badge span {
    color: #FFFFFF !important; font-size: 14px; font-weight: 800; line-height: 10px;
    pointer-events: none;
}

/* Скрыть бейдж если 0 товаров */
.cart-badge:empty {
    display: none;
}


/* header_main_mobile */

.header_overhead_mobile {
    width: 100%; height: fit-content; min-height: 1px; margin-bottom: 16px; padding: 0 12px;
    display: flex; flex-direction: row; align-items: center; justify-content: space-between;
}

@media (min-width: 1200px) {
    .header_overhead_mobile {display: none;}
}

.overhead_mobile_Block {display: flex; flex-direction: row; align-items: center; gap: 16px;}

.overhead_mobile_item {display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;}


.header_main_mobile {
    width: 100%; height: fit-content; min-height: 1px; margin-bottom: 16px; padding: 0 12px;
}

@media (min-width: 1200px) {
    .header_main_mobile {display: none;}
}

.main_mobile_searchBlock {
    width: 100%; height: 64px; min-height: 64px; padding: 0 16px;
    display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 12px;
    border-radius: 24px;
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px transparent;
    transition: box-shadow 0.3s ease;
}

.mobile_searchBlock_item {display: flex; align-items: center; justify-content: center; width: 32px; height: 32px;}

.mobile_search-inputBlock {
    height: 100%;
    display: flex; flex-grow: 1; flex-shrink: 1; align-items: center;
}

.mobile_search-inputBlock input[type="text"] {
    width: 100%; height: 100%;
    color: #181818; font-size: 24px; font-weight: 600; line-height: 17px;
    background: transparent;
}

.mobile_search-inputBlock input[type="text"]::placeholder {
    color: #F98EB0;
}

.main_mobile_searchBlock:focus-within {box-shadow: inset 0 0 0 1px #FF5C8F;}


/* Hero Section */

.hero {
    width: 100%; padding: 32px 0;
    box-shadow: inset 0 -1px 0 0 #E9E9E9;
}

@media (max-width: 1199px) {
    .hero {
        padding: 16px 12px 32px 12px;
        border-radius: 0 0 24px 24px;
        background-color: #FFADC7;
    }
}

.hero_content {
    width: 100%;
    display: flex; flex-direction: row; gap: 32px;
}

@media (max-width: 1199px) {
    .hero_content {
        gap: 0;
    }
}

/* Hero Text Card */

.hero_textCard {
    min-width: 0;
    flex: 1; display: flex; flex-direction: row; gap: 16px;
    border-radius: 24px;
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    overflow: hidden;
}

@media (max-width: 1199px) {
    .hero_textCard {
        display: none;
    }
}

.hero_textCard_content {
    padding: 32px 0 32px 32px;
    display: flex; flex-direction: column; gap: 32px;
}

.hero_textBlock {display: flex; flex-direction: column; gap: 16px;}

.hero_title {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 18px; color: #181818;}

.hero_description {font-size: 16px; font-weight: 600; line-height: 17px; color: #555555;}

.hero_buttons {display: flex; flex-direction: row; gap: 6px;}

.hero_btn {
    height: 48px; padding: 0 24px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 700; line-height: 12px;
    transition: background-color 0.25s ease, border-radius 0.25s ease;
}

.hero_btn_primary {
    background-color: #FF2469;
    color: #FFFFFF !important; 
    border-radius: 24px 8px 8px 24px;
}

.hero_btn_primary:hover {
    background-color: #FF0050;
    border-radius: 24px;
}

.hero_btn_secondary {
    background-color: #F8F8F8;
    border-radius: 8px 24px 24px 8px;
    color: #181818;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    transition: box-shadow 0.25s ease, border-radius 0.25s ease;
}

.hero_btn_secondary:hover {
    border-radius: 24px;
    box-shadow: inset 0 0 0 1px #FFADC7;
}

.hero_stats {display: flex; flex-direction: row; gap: 32px;}

.hero_stat {display: flex; flex-direction: column; gap: 8px;}

.hero_stat_value {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 18px; color: #181818;}

.hero_stat_label {font-size: 14px; font-weight: 600; line-height: 10px; color: #555555;}

.hero_textCard_image {
    height: 100%;
    flex: 1;
    background-image: url("../icons/hero-img.984befa536a1.png"); background-size: cover; background-position: left; background-repeat: no-repeat;
}


/* Hero Slider */

.hero_slider {
    min-width: 0; height: 280px;
    flex: 1;
    border-radius: 24px;
    overflow: hidden;
}

@media (max-width: 1199px) {
    .hero_slider {
        height: 140px;
    }
}

.hero_slider_container {
    position: relative;
    width: 100%; height: 100%;
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    overflow: hidden;
}

.hero_slider_wrapper {
    display: flex;
    height: 100%;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero_slider_wrapper.no-transition {
    transition: none;
}

.hero_slide {
    position: relative;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.hero_slide_content {
    position: relative;
    width: 100%; height: 100%; padding: 32px;
    display: flex; flex-direction: column;
    z-index: 1;
}

@media (max-width: 1199px) {
    .hero_slide_content {
        padding: 16px;
    }
}

.hero_slide_text {
    position: relative;
    height: 100%;
    display: flex; flex-direction: column; gap: 16px;
    z-index: 1;
}

@media (max-width: 1199px) {
    .hero_slide_text {
        justify-content: space-between; gap: 0;
    }
}

.hero_slide_title {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 18px; color: #FFFFFF; text-shadow: 0px 2px 16px rgba(0, 0, 0, 0.32);}

.hero_slide_subtitle {
    height: 34px; min-height: 34px;
    font-size: 16px; font-weight: 600; line-height: 17px; color: #FFFFFF; text-shadow: 0px 2px 16px rgba(0, 0, 0, 0.32);
}

.hero_slide_btn {
    width: fit-content; height: 48px; min-height: 48px; margin-top: 16px; padding: 0 24px;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    border-radius: 12px;
    background-color: #F8F8F8;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    transition: background-color 0.25s ease, border-radius 0.25s ease;
}

@media (max-width: 1199px) {
    .hero_slide_btn {margin-top: 0;}
}

.hero_slide_btn:hover {
    border-radius: 24px;
    background-color: #FFFFFF;
}

.hero_slide_btn span {font-size: 16px; font-weight: 700; line-height: 12px; color: #181818;}

.hero_slide_btn img {width: 16px; height: 16px;}

.hero_slide_image {
    position: absolute; top: 0; right: 0; bottom: 0;
    width: auto; height: 100%;
    pointer-events: none;
    z-index: 0;
}

@media (max-width: 1199px) {
    .hero_slide_image {
        left: 0; right: 0;
        width: 100%; height: 100%;
    }
}

.hero_slide_image img {
    width: auto; height: 100%;
    display: block;
    object-fit: cover; object-position: right center;
}

@media (max-width: 1199px) {
    .hero_slide_image img {
        width: 100%; height: auto; min-height: 100%;
        object-position: right center;
    }
}

/* Slider Navigation */

.hero_slider_nav {
    position: absolute; bottom: 32px;
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    border: none; border-radius: 12px; background-color: #F8F8F8; box-shadow: inset 0 0 0 1px #EFEFEF;
    cursor: pointer; transition: background-color 0.25s ease, opacity 0.25s ease; z-index: 2; opacity: 0;
}

.hero_slider_nav_prev {left: 32px;}
.hero_slider_nav_next {right: 32px;}

@media (max-width: 1199px) {
    .hero_slider_nav {
        display: none;
    }
}

.hero_slider_container:hover .hero_slider_nav {opacity: 1;}

.hero_slider_nav:hover {background-color: #FFFFFF;}

.hero_slider_nav svg {
    color: #181818;
}

/* Slider Pagination */

.hero_slider_pagination {
    position: absolute; bottom: 32px; left: 32px; right: 32px;
    display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 8px;
    z-index: 2;
}

@media (max-width: 1199px) {
    .hero_slider_pagination {
        bottom: 16px; left: auto; right: 16px;
        justify-content: flex-end;
    }
}

.hero_slider_dot {
    width: 8px; height: 8px; padding: 0;
    background-color: #EFEFEF;
    border: none; border-radius: 4px; cursor: pointer; transition: background-color 0.25s ease;
}

.hero_slider_dot:hover {background-color: #FFFFFF;}
.hero_slider_dot.active {background-color: #FF0050;}


/* Categories Section */

.categories {
    width: 100%; padding: 32px 0;
    display: flex; flex-direction: column; gap: 32px;
    box-shadow: inset 0 -1px 0 0 #E9E9E9;
}

@media (max-width: 1199px) {
    .categories {
        gap: 16px;
        padding: 32px 12px 0 12px;
        box-shadow: none;
    }
}

.categories_title_text {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 18px; color: #181818;}

@media (max-width: 1199px) {
    .categories_title_text {font-size: 18px; line-height: 14px;}
}

.categories_container {
    width: 100%;
    display: flex; flex-direction: row; gap: 16px;
}

@media (max-width: 1069px) {
    .categories_container {
        justify-content: space-between; gap: 0;
    }
}

.categories_item {
    height: 64px; min-height: 64px; padding: 0 8px;
    flex: 1; display: flex; flex-direction: row; align-items: center; gap: 8px; flex-shrink: 0;
    border-radius: 12px;
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    transition: box-shadow 0.25s ease, border-radius 0.25s ease;
}

/* Скрыть кнопку "Смотреть все" по умолчанию */
.categories_item_all {
    display: none;
}

/* Desktop: >= 1400px - показать все кроме Бабушке */
@media (min-width: 1400px) {
    .categories_item_babushka {
        display: none !important;
    }
    .categories_item_all {
        display: flex !important;
    }
}

/* Desktop: 1070-1399px - скрыть Подруге и Бабушке, показать кнопку "Смотреть все" */
@media (min-width: 1070px) and (max-width: 1399px) {
    .categories_item_podruge,
    .categories_item_babushka {
        display: none !important;
    }
    .categories_item_all {
        display: flex !important;
    }
}

/* Mobile: < 1070px - скрыть "День рождения", показать кнопку "Смотреть все", применить мобильные стили */
@media (max-width: 1069px) {
    .categories_item_den_rozhdeniya {
        display: none !important;
    }
    
    .categories_item_all {
        display: flex !important;
    }

    .categories_item {
        height: auto; min-height: auto; padding: 0;
        flex: none; flex-direction: column; gap: 8px; align-items: center; justify-content: center;
        background-color: transparent; box-shadow: none;
    }
}

/* Very small mobile: < 480px - скрыть "Бабушке", оставить только 3 категории */
@media (max-width: 479px) {
    .categories_item_babushka {
        display: none !important;
    }
}

.categories_item:hover {border-radius: 24px; box-shadow: inset 0 0 0 1px #FFADC7;}

.categories_item_image {
    width: 48px; height: 48px;
    border-radius: 50%;
    object-fit: cover; object-position: center;
    overflow: hidden;
}

@media (max-width: 1069px) {
    .categories_item_image {
        width: 80px; height: 80px;
        border: 2px solid #FFFFFF;
        box-shadow: none;
    }
}

.categories_item_image img {
    width: 100%; height: 100%;
    display: block;
    object-fit: cover; object-position: center;
}

.categories_item_text {flex: 1; display: flex; flex-direction: column; gap: 8px;}

.categories_item_text span {font-size: 16px; font-weight: 600; line-height: 10px; color: #555555;}

.category_title {font-weight: 700 !important; color: #181818 !important;}

@media (max-width: 1310px) {
    .category_title {
        font-size: 16px !important; 
        font-weight: 600 !important; 
        line-height: 13px !important;
        white-space: nowrap !important;
    }
}

.categoriy_arrow {width: 16px; height: 16px; transition: transform 0.25s ease;}

.categories_item:hover .categoriy_arrow {transform: translateX(-4px);}

@media (max-width: 1069px) {
    .categoriy_arrow {display: none;}
    .category_count {display: none;}
}


/* Products Section */

.products {
    width: 100%; padding: 32px 0;
    display: flex; flex-direction: column; gap: 32px;
    box-shadow: inset 0 -1px 0 0 #E9E9E9;
}

@media (max-width: 1199px) {
    .products {
        gap: 16px;
        padding: 32px 12px 16px 12px;
    }
}

.products_title_text {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 18px; color: #181818;}

@media (max-width: 1199px) {
    .products_title_text {font-size: 18px; line-height: 14px;}
}

.products_container {
    width: 100%;
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px;
}

@media (max-width: 1399px) {
    .products_container {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width: 1069px) {
    .products_container {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
}

@media (max-width: 799px) {
    .products_container {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Карточка товара */
.products_item {
    display: flex; flex-direction: column;
    border-radius: 12px;
    background-color: #FFFFFF;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.products_item:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.products_item:hover .products_item_imageBlock img {transform: scale(1.05);}

/* Блок 1: Изображение */
.products_item_imageBlock {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.products_item_imageBlock img {
    width: 100%; height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.2s ease;
}

.product_badge {
    position: absolute;
    bottom: 8px; left: 8px;
    padding: 12px;
    background-color: #FFD64D;
    border-radius: 12px;
    font-size: 16px; font-weight: 800; line-height: 12px; color: #FFFFFF;
}

@media (max-width: 1199px) {
    .product_badge {padding: 8px; border-radius: 8px; font-size: 14px; font-weight: 800; line-height: 10px;}
}

/* Блок 2: Контент */
.products_item_contentBlock {
    padding: 16px;
    display: flex; flex-direction: column; gap: 16px;
}

@media (max-width: 1199px) {
    .products_item_contentBlock {gap: 12px; padding: 8px;}
}

/* Контейнер информации */
.product_info {
    height: 56px;
    display: flex; flex-direction: column; gap: 8px;
    overflow: hidden;
}

.product_name {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    color: #181818;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product_description {
    font-size: 14px; font-weight: 400; line-height: 14px; color: #555555;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 1199px) {
    .product_description {font-size: 12px; line-height: 12px;}
}

/* Контейнер цен и кнопки */
.product_footer {display: flex; flex-direction: column; gap: 16px;}

@media (max-width: 1199px) {
    .product_footer {flex-direction: row; align-items: center; gap: 8px;}
}

/* Контейнер цен */
.product_prices {display: flex; flex-direction: row; align-items: flex-end; gap: 8px;}

@media (max-width: 1199px) {
    .product_prices {
        flex: 1; flex-direction: column; align-items: flex-start; gap: 6px;
    }
}

.product_price {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 18px; color: #181818;}

@media (max-width: 1199px) {
    .product_price {font-size: 18px; line-height: 14px;}
}

.product_price_old {
    font-size: 16px;
    font-weight: 600;
    line-height: 12px;
    color: #AAAAAA;
    text-decoration: line-through;
}

/* Кнопка */
.product_btn {
    height: 48px; padding: 0 24px;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    border-radius: 12px;
    background-color: #FF2469;
    color: #FFFFFF !important;
    transition: background-color 0.25s ease, border-radius 0.25s ease;
}

@media (max-width: 1199px) {
    .product_btn {
        width: 56px; height: 36px; padding: 0;
        flex-shrink: 0;
        border-radius: 8px;
    }
}

.product_btn:hover {
    background-color: #FF0050;
    border-radius: 24px;
}

.product_btn img {
    width: 24px;
    height: 24px;
    filter: brightness(0) invert(1);
}

.product_btn_text {font-size: 16px; font-weight: 700; line-height: 12px; color: #FFFFFF;}

@media (max-width: 1199px) {
    .product_btn_text {
        display: none;
    }
}

.product_btn_success {
    background-color: #68D540 !important;
    color: #FFFFFF !important;
}

.product_btn_success img {
    filter: brightness(0) invert(1);
}

/* Кнопка "Показать еще" в секции Products */
.products_more-container {
    width: 100%;
    display: flex; justify-content: center; align-items: center;
}

.products_more-btn {
    height: 48px; padding: 0 24px;
    display: flex; align-items: center; justify-content: center;
    font-size: 16px; font-weight: 700; line-height: 12px; color: #181818;
    border-radius: 12px;
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #EFEFEF; transition: box-shadow 0.25s ease, border-radius 0.25s ease;
}

.products_more-btn:hover {
    box-shadow: inset 0 0 0 1px #FFADC7;
    border-radius: 24px;
}

@media (max-width: 1199px) {
    .products_more-btn {
        height: 40px; padding: 0 20px;
        font-size: 14px;
    }
}


/* Custom Order Section */

.custom-order {
    width: 100%;
    padding: 32px 0;
}

@media (max-width: 1199px) {
    .custom-order {
        padding: 32px 16px 16px 16px;
        box-shadow: none;
    }
}

.custom-order__wrapper {
    position: relative;
}

.custom-order__content {
    display: flex;
    gap: 32px;
}

@media (max-width: 1199px) {
    .custom-order__content {
        flex-direction: column;
        gap: 0;
    }
}

.custom-order__info {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: calc(50% - 16px);
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (max-width: 1199px) {
    .custom-order__info {
        position: static;
        width: 100%;
        gap: 8px;
    }
}

.custom-order__heading {font-family: 'Unbounded', sans-serif; font-size: 24px; font-weight: 500; line-height: 24px; color: #181818;}

@media (max-width: 1199px) {
    .custom-order__heading {font-size: 18px; line-height: 18px;}
}

.custom-order__description {font-size: 16px; font-weight: 600; line-height: 17px; color: #555555;}

@media (max-width: 1199px) {
    .custom-order__description {font-size: 14px; line-height: 14px; margin-bottom: 16px;}
}

.custom-order__decoration {
    min-height: 0;
    flex: 1;
    overflow: hidden;
}

@media (max-width: 1199px) {
    .custom-order__decoration {
        display: none;
    }
}

.custom-order__decoration img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left;
}

.custom-order__form-card {
    width: 50%;
    margin-left: 50%;
    padding: 32px;
    background-color: #FFFFFF;
    border-radius: 32px;
    box-shadow: inset 0 0 0 1px #EFEFEF;
}

@media (max-width: 1199px) {
    .custom-order__form-card {
        width: 100%;
        margin-left: 0;
        padding: 24px;
        border-radius: 24px;
    }
}

.custom-order__form-title {
    font-family: 'Unbounded', sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 18px;
    color: #181818;
    text-align: center;
}

@media (max-width: 1199px) {
    .custom-order__form-title {
        font-size: 18px;
    }
}

.custom-order__divider {
    width: 100%;
    height: 1px;
    margin: 32px 0;
    background-color: #E9E9E9;
}

@media (max-width: 1199px) {
    .custom-order__divider {
        margin: 24px 0;
    }
}

/* Form */

.custom-order__form {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

@media (max-width: 1199px) {
    .custom-order__form {
        gap: 24px;
    }
}

.custom-order__row {
    display: flex;
    gap: 32px;
}

@media (max-width: 1199px) {
    .custom-order__row {
        flex-direction: column;
        gap: 24px;
    }
}

.custom-order__field {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.custom-order__label {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25em;
    color: #181818;
}

@media (max-width: 1199px) {
    .custom-order__label {
        font-size: 14px;
    }
}

.custom-order__input {
    width: 100%; height: 56px; padding: 0 16px;
    font-size: 16px; font-weight: 600; line-height: 12px; color: #181818;
    border: none; outline: none; border-radius: 12px; 
    background-color: #F8F8F8;
    box-shadow: inset 0 0 0 1px #EFEFEF;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, border-radius 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 1199px) {
    .custom-order__input {
        height: 48px;
        font-size: 14px;
    }
}

.custom-order__input::placeholder {
    color: #AAAAAA;
}

.custom-order__input:hover {
    border-radius: 24px;
    box-shadow: inset 0 0 0 1px #FFADC7;
}

.custom-order__input:focus {
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #FFADC7;
}

/* Custom Select Component */

.custom-select {
    position: relative;
    width: 100%;
    min-width: 0;
}

.custom-select__trigger {
    width: 100%; height: 56px; padding: 0 16px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background-color: #F8F8F8;
    border: none; border-radius: 12px;
    cursor: pointer;
    transition: background-color 0.2s ease, 
                box-shadow 0.2s ease, 
                border-radius 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
}

@media (max-width: 1199px) {
    .custom-select__trigger {
        height: 48px;
    }
}

.custom-select__trigger:hover {
    background-color: #EFEFEF;
}

.custom-select.is-open .custom-select__trigger {
    background-color: #FFFFFF;
    box-shadow: inset 0 0 0 1px #FFADC7;
    border-radius: 12px 12px 0 0;
}

.custom-select__value {
    flex: 1;
    font-size: 16px; font-weight: 600; line-height: 1.25em;
    color: #AAAAAA;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1199px) {
    .custom-select__value {
        font-size: 14px;
    }
}

.custom-select__value.is-selected {
    color: #181818;
}

.custom-select__arrow {
    flex-shrink: 0;
    width: 14px; height: 14px;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.custom-select__arrow path {
    transition: stroke 0.2s ease;
}

.custom-select.is-open .custom-select__arrow path {
    stroke: #FF2469;
}

/* Dropdown */

.custom-select__dropdown {
    position: absolute;
    top: 100%; left: 0; right: 0;
    background-color: #FFFFFF;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s ease, visibility 0.15s;
}

.custom-select.is-open .custom-select__dropdown {
    opacity: 1;
    visibility: visible;
}

/* Option */

.custom-select__option {
    padding: 16px;
    font-size: 16px; font-weight: 600; line-height: 1.25em;
    color: #555555;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
    user-select: none;
}

@media (max-width: 1199px) {
    .custom-select__option {
        padding: 14px 16px;
        font-size: 14px;
    }
}

.custom-select__option:hover {
    background-color: #FFF5F8;
    color: #181818;
}

.custom-select__option.is-active {
    background-color: #FFADC7;
    color: #FFFFFF;
    font-weight: 700;
}

.custom-select__option.is-active:hover {
    background-color: #FF9EBF;
}

.custom-select__option:last-child {
    border-radius: 0 0 12px 12px;
}

/* Hidden Input */

.custom-select__input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.custom-order__submit {
    width: 100%; height: 56px; padding: 0 32px;
    font-size: 16px; font-weight: 800; line-height: 1.25em; color: #FFFFFF;
    border-radius: 12px;
    background-color: #FF2469;
    cursor: pointer;
    transition: background-color 0.25s ease, border-radius 0.25s ease;
}

@media (max-width: 1199px) {
    .custom-order__submit {
        height: 48px;
        font-size: 14px;
    }
}

.custom-order__submit:hover {
    background-color: #FF0050;
    border-radius: 24px;
}

.custom-order__submit:active {
    transform: scale(0.98);
}


/* Footer */

.footer {
    width: 100%;
    background-color: #181818;
    border-radius: 24px 24px 0 0;
    border-top: 1px solid #282828;
    margin-top: auto;
}

.footer__container {
    padding: 32px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 32px;
}

@media (max-width: 1199px) {
    .footer__container {
        flex-direction: column; gap: 24px;
    }
}

/* Top Section */

.footer__top {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.footer__logo-img {
    height: 24px;
    width: auto;
    filter: brightness(0) invert(1);
}

.footer__slogan {
    margin-top: 8px;
    font-size: 14px;
    font-weight: 500;
    line-height: 10px;
    color: #FFFFFF;
}

.footer__social {
    display: flex;
    gap: 8px;
}

.footer__social-link {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease;
}

.footer__social-link:hover {
    opacity: 0.7;
}

.footer__social-link img {
    width: 100%;
    height: 100%;
    display: block;
}

/* Navigation */

.footer__nav {
    display: flex;
    gap: 64px;
}

@media (max-width: 1199px) {
    .footer__nav {
        flex-direction: column;
        gap: 24px;
    }
}

.footer__nav-column {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (max-width: 1199px) {
    .footer__nav-column {
        gap: 12px;
    }
}

.footer__nav-title {
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25em;
    color: #FFFFFF;
}

@media (max-width: 1199px) {
    .footer__nav-title {
        font-size: 14px;
    }
}

.footer__nav-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    list-style: none;
    color: #FFFFFF;
}

@media (max-width: 1199px) {
    .footer__nav-list {
        gap: 8px;
    }
}

.footer__nav-link {
    font-size: 14px;
    font-weight: 600;
    line-height: 10px;
    color: #FFFFFF !important;
    transition: color 0.2s ease;
}

.footer__nav-link:hover {
    color: #FF2469 !important;
}

@media (max-width: 1199px) {
    .footer__nav-link {
        font-size: 12px;
    }
}

.footer__nav-text {
    font-size: 14px;
    font-weight: 600;
    line-height: 10px;
    color: #FFFFFF;
}

@media (max-width: 1199px) {
    .footer__nav-text {
        font-size: 12px;
    }
}

/* ==========================================
   MOBILE NAVIGATION
   ========================================== */
/* Стили мобильной навигации вынесены в mobile-fixes.css для централизованного управления */

/* ==========================================
   INDEX PAGE MOBILE FILTERS
   ========================================== */

/* ========================================
   INDEX FILTERS OVERLAY - ГЛАВНАЯ СТРАНИЦА
   Фильтры скрыты на десктопе, показываются только
   в мобильном overlay при нажатии на кнопку
   ========================================== */

.index-filters-overlay {
    display: none !important;  /* ✅ СКРЫТО на десктопе по умолчанию */
}

/* ✅ ВАЖНО: Переопределяем .catalog_sidebar для главной страницы на десктопе */
.index-filters-overlay.catalog_sidebar {
    display: none !important;  /* ✅ СКРЫТО на десктопе, даже с классом catalog_sidebar */
}

@media (max-width: 1199px) {
    .index-filters-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;
        max-height: -webkit-fill-available;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 999;
        display: none !important;  /* ✅ СКРЫТО по умолчанию */
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease;
        overflow: hidden;
    }

    .index-filters-overlay.is-open {
        display: flex !important;  /* ✅ ПОКАЗАТЬ при открытии */
        align-items: center;
        justify-content: center;
        opacity: 1;
        pointer-events: all;
    }
}