/* Проблема з опціями типу список, текст опції не поміщався по висоті через height: 40px; */
.form-control {
    font-weight: 500;
    color: #2f2d40;
    padding: 12px 15px;
    background: #fff;
    border-color: #ccc;
    transition: all 250ms ease-in-out;
    width: 100%;
    height: 44px;
}
/* Контейнер для sticky_item та box-prinfo з білим фоном */
.product-main-wrapper {
	background: #fff;
	overflow: hidden;
	border-radius: 8px;
	border: 1px solid #f2f2f5;
}
.box-prinfo {
    border: 0px solid #f2f2f5!important;
}
.pr_box2 {
    border-top: 0px!important;
}
#sticky_item {
    border: 0px solid #f2f2f5!important;
}
@media (min-width: 992px) and (max-width: 1199px) {
    #additional {
        height: 620px;
		margin: 10px;
    }
}
@media (min-width: 1200px) and (max-width: 1599px) {
    #additional {
        height: 500px;
		margin: 10px;
    }
}
@media (min-width: 1600px) {
    #additional {
        height: 610px;
        margin: 10px;
    }
}
@media (min-width: 1200px) {
    #sticky_item {
        position: sticky;
        top: 0px;
        max-width: 100%;
    }
}
.addimg_index {
    z-index: 777;
    padding: 0 7px 0 7px;
	border: 1px solid #ccc;
	border-radius: 8px;
}
.add_img_main.swiper-button-prev {
    opacity: 1 !important;
    left: -10px !important;
    z-index: 1000;
    border: 1px solid #ccc;
}
.add_img_main.swiper-button-next {
    opacity: 1 !important;
    right: -10px !important;
	z-index: 1000;
    border: 1px solid #ccc;
}
.add_img.swiper-button-prev {
    position: relative;
    top: 0px;
    transform: rotate(90deg);
    width: 33px;
    height: 33px;
    margin: 0 auto;
    right: 0;
	border: 1px solid #ccc;
	margin-top: 10px;
}
.add_img.swiper-button-next {
    position: relative;
    margin-top: 0px !important;
    top: 0px !important;
    transform: rotate(90deg);
    width: 33px;
    height: 33px;
    margin: 0 auto;
    margin-top: 0px;
    right: 0;
    border: 1px solid #ccc;
	margin-bottom: 10px;
}
/* Колір цифри кількості товарів у кошику */
@media (min-width: 992px) {
    #cart-total.circle_m {
        margin-left: 22px;
        color: #fff !important;
    }
}
.imgpopcat, .imgpopcatqv{
color: #777;
border: 1px solid #fff;
margin: 0 3px;
border-radius: 15%!important;
}

/* 🟢 Фікс вирівнювання опцій та контенту по лівому краю */
.pr_box2 .form-group {
    display: block !important;
    text-align: left !important;
    align-self: flex-start !important;
    width: 100% !important;
}

.pr_box2 .form-group > div {
    display: inline-block !important;
    text-align: left !important;
}


/* 🔵 Горизонтальна пагінація меню < 1/X > (Через приховування елементів) */
@media (min-width: 992px) {
    #menu2.q-paginated-nav {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
    }

    .q-nav-strip {
        display: flex !important;
        flex-wrap: nowrap !important;
        flex-grow: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .q-nav-strip > li.q-top-li {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }

    /* Прибираємо точки теми */
    .q-nav-strip > li.q-top-li::before, .q-nav-strip > li.q-top-li::after { 
        content: none !important; 
    }

    .q-pagination-controls {
        display: flex !important;
        align-items: center !important;
        padding-left: 15px !important;
        background: transparent !important;
        z-index: 100 !important;
        white-space: nowrap !important;
        user-select: none !important;
        flex-shrink: 0 !important;
    }

    .q-btn-page {
        cursor: pointer !important;
        font-size: 20px !important;
        padding: 0 10px !important;
        color: #333 !important;
        line-height: 1 !important;
        transition: all 0.2s !important;
    }

    .q-btn-page:hover { 
        color: #000 !important; 
        transform: scale(1.1); 
    }
    
    .q-btn-page.disabled { 
        opacity: 0.2 !important; 
        cursor: default !important; 
        transform: none !important;
    }

    .q-page-indicator {
        font-weight: bold !important;
        font-size: 14px !important;
        min-width: 40px !important;
        text-align: center !important;
        color: #444 !important;
    }
}

/* 🟠 Фікс накладання елементів у мега-меню (довгі назви категорій) */
#menu2 .header_menu_column,
.top-menu-spigen .header_menu_column {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important; /* Вирівнювання по верхньому краю */
    margin: 0 -10px !important; /* Компенсація внутрішніх відступів колонок */
}

/* Динамічна кількість колонок (OpenCart category settings) */
#menu2 .header_menu_column[data-cols="1"] .header_menu_item,
.top-menu-spigen .header_menu_column[data-cols="1"] .header_menu_item { flex: 0 0 100% !important; max-width: 100% !important; }
#menu2 .header_menu_column[data-cols="2"] .header_menu_item,
.top-menu-spigen .header_menu_column[data-cols="2"] .header_menu_item { flex: 0 0 50% !important; max-width: 50% !important; }
#menu2 .header_menu_column[data-cols="3"] .header_menu_item,
.top-menu-spigen .header_menu_column[data-cols="3"] .header_menu_item { flex: 0 0 33.333% !important; max-width: 33.333% !important; }
#menu2 .header_menu_column[data-cols="4"] .header_menu_item,
.top-menu-spigen .header_menu_column[data-cols="4"] .header_menu_item { flex: 0 0 25% !important; max-width: 25% !important; }
#menu2 .header_menu_column[data-cols="5"] .header_menu_item,
.top-menu-spigen .header_menu_column[data-cols="5"] .header_menu_item { flex: 0 0 20% !important; max-width: 20% !important; }
#menu2 .header_menu_column[data-cols="6"] .header_menu_item,
.top-menu-spigen .header_menu_column[data-cols="6"] .header_menu_item { flex: 0 0 16.666% !important; max-width: 16.666% !important; }

/* Базова структура колонок */
#menu2 .header_menu_item,
.top-menu-spigen .header_menu_item {
    padding: 0 10px 20px 10px !important; /* Відступи між колонками та рядками */
    box-sizing: border-box !important;
}

/* Адаптивність прибираємо, щоб налаштування адмінки працювали на всіх екранах */

#menu2 .box_header_menu,
.top-menu-spigen .box_header_menu {
    width: 100% !important;
}

/* Дозволяємо перенесення слів для довгих назв */
#menu2 .box_header_menu .hmenu,
#menu2 .box_header_menu .submenu_main,
.top-menu-spigen .box_header_menu .hmenu,
.top-menu-spigen .box_header_menu .submenu_main {
    white-space: normal !important;
    word-break: break-word !important; 
    line-height: 1.4 !important;
    display: block !important;
}

/* Прибираємо можливий примусовий nowrap, який ламає верстку */
#menu2 .header_menu_item *,
.top-menu-spigen .header_menu_item * {
    white-space: normal !important;
}

/* Прибираємо відступ у горизонтального меню*/
@media (min-width: 992px) {
    .t_m2 {
        margin-top: 0px;
    }
}

/* Spigen-style megamenu */
@media (min-width: 992px) {
    html,
    body {
        overflow-x: hidden;
    }

    .mega-nav--spigen {
        position: relative;
    }

    .top-menu-spigen,
    .top-menu-spigen .container,
    .mega-nav--spigen {
        overflow: visible !important;
    }

    .mega-top-toggle {
        display: none;
    }

    .mega-top-list {
        display: flex;
        align-items: center;
        justify-content: var(--spigen-top-align, flex-start);
        gap: 22px;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .mega-top-item {
        position: static;
    }

    .mega-top-link {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 48px;
        color: var(--spigen-link-color, #1c1c1c);
        font-size: var(--spigen-top-font-size, 14px);
        font-weight: var(--spigen-top-font-weight, 600);
        text-transform: var(--spigen-top-text-transform, uppercase);
        letter-spacing: .02em;
    }

    .mega-top-item:hover > .mega-top-header .mega-top-link,
    .mega-top-item:focus-within > .mega-top-header .mega-top-link,
    .mega-top-item.is-open > .mega-top-header .mega-top-link {
        color: var(--spigen-link-hover-color, #111111);
    }

    .mega-top-item:hover .mega-dropdown,
    .mega-top-item:focus-within .mega-dropdown {
        display: block;
    }

    .mega-dropdown {
        display: none;
        position: absolute;
        top: 100%;
        left: 50%;
        right: auto;
        width: calc(100vw - 64px);
        max-width: calc(100vw - 64px);
        margin-left: calc(-50vw + 32px);
        box-sizing: border-box;
        z-index: 90;
        background: #fff;
        border-top: none;
        border-radius: 0 0 14px 14px;
        box-shadow: 0 24px 60px rgba(0, 0, 0, 0.08);
    }

    .mega-shell {
        display: grid;
        grid-template-columns: 240px minmax(0, 1fr) minmax(180px, var(--spigen-promo-width, 280px));
        gap: 32px;
        width: 100%;
        box-sizing: border-box;
        padding: 28px 32px 32px;
    }

    .mega-shell--direct {
        display: block;
    }

    .mega-shell--direct-has-promo {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(180px, var(--spigen-promo-width, 280px));
        align-items: start;
        justify-content: start;
    }

    .mega-direct {
        width: 100%;
        min-width: 0;
    }

    @media (max-width: 1400px) {
        .mega-shell {
            grid-template-columns: 240px minmax(0, 1fr) minmax(180px, var(--spigen-promo-width-md, 240px));
        }

        .mega-shell--direct-has-promo {
            grid-template-columns: minmax(0, 1fr) minmax(180px, var(--spigen-promo-width-md, 240px));
        }
    }

    @media (max-width: 1200px) {
        .mega-shell {
            grid-template-columns: 240px minmax(0, 1fr) var(--spigen-promo-current-width-sm, 210px);
            --spigen-promo-current-width-sm: var(--spigen-promo-width-sm, 210px);
            gap: 20px;
            padding: 20px 24px 24px;
        }

        .mega-shell--direct-has-promo {
            grid-template-columns: minmax(0, 1fr) var(--spigen-promo-current-width-sm, 210px);
        }

        /* Logic to hide the promo column based on user toggle */
        @supports (display: var(--spigen-promo-display-sm)) {
            .mega-shell:has(.mega-promo[style*="display: none"]),
            .mega-nav--spigen[style*="--spigen-promo-display-sm: none"] .mega-shell {
                grid-template-columns: 240px minmax(0, 1fr);
            }

            .mega-nav--spigen[style*="--spigen-promo-display-sm: none"] .mega-shell--direct {
                grid-template-columns: minmax(0, 1fr);
            }
        }
        
        .mega-promo {
            display: var(--spigen-promo-display-sm, block);
        }
        
        /* Fallback if :has is not supported, still hide content */
        .mega-nav--spigen[style*="--spigen-promo-display-sm: none"] .mega-promo {
            display: none;
        }
        .mega-nav--spigen[style*="--spigen-promo-display-sm: none"] .mega-shell {
             grid-template-columns: 240px minmax(0, 1fr);
        }
        .mega-nav--spigen[style*="--spigen-promo-display-sm: none"] .mega-shell--direct {
             grid-template-columns: minmax(0, 1fr);
        }
    }

    .mega-sections {
        border-right: 1.5px solid #d6d6d6;
        padding-right: 24px;
    }

    .mega-sections-list,
    .mega-group-links {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .mega-sections-item + .mega-sections-item {
        margin-top: 6px;
    }

    .mega-section-trigger {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 10px 0;
        border: 0;
        background: transparent;
        color: #444;
        text-align: left;
        font-size: var(--spigen-section-font-size, 14px);
        font-weight: var(--spigen-section-font-weight, 600);
        text-transform: var(--spigen-section-text-transform, none);
    }

    .mega-sections-item:first-child .mega-section-trigger {
        padding-top: 0;
    }

    .mega-section-trigger.is-active,
    .mega-section-trigger:hover,
    .mega-section-trigger:focus {
        color: var(--spigen-accent, #14c267);
    }

    .mega-section-trigger.is-active {
        font-weight: 700;
    }

    .mega-section-type {
        margin-left: auto;
        color: #7b7b7b;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .06em;
    }


    .mega-panels {
        min-width: 0;
    }

    .mega-panel {
        display: none;
        width: 100%;
    }

    .mega-panel.is-active {
        display: block;
    }

    .mega-group-collection-title,
    .catalog-group-collection-title {
        display: block;
        margin-bottom: 8px;
        color: var(--spigen-item-color, #111);
        font-size: 15px;
        font-weight: var(--spigen-collection-title-font-weight, 700);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .mega-group-collection-title a,
    .catalog-group-collection-title a {
        display: inline-block;
        font-size: inherit;
        font-weight: inherit;
        color: inherit;
        text-transform: inherit;
        text-decoration: none;
    }

    .mega-group-collection-title:hover,
    .mega-group-collection-title:hover a,
    .mega-group-collection-title a:hover,
    .catalog-group-collection-title:hover,
    .catalog-group-collection-title:hover a,
    .catalog-group-collection-title a:hover {
        color: var(--spigen-accent, #14c267) !important;
        text-decoration: none !important;
    }

    /* Column-based mixed layout */
    .mega-columns {
        display: grid;
        gap: 16px;
        width: 100%;
        justify-content: start;
    }

    .mega-columns--direct {
        justify-content: start;
        gap: var(--spigen-direct-gap, 24px);
    }

    .mega-columns--direct .mega-column {
        gap: var(--spigen-direct-block-spacing, 7px);
    }

    .mega-columns--direct .mega-col-link + .mega-col-link,
    .mega-columns--direct .mega-col-link + .mega-col-promo,
    .mega-columns--direct .mega-col-promo + .mega-col-link,
    .mega-columns--direct .mega-col-promo + .mega-col-promo {
        margin-top: var(--spigen-direct-link-spacing, 6px);
    }

    .mega-columns--direct .mega-col-link,
    .mega-columns--direct .mega-col-promo {
        display: flex;
        align-items: flex-start;
        min-height: var(--spigen-direct-link-min-height, 36px);
    }

    .mega-columns--direct .mega-col-link a {
        display: flex;
        align-items: flex-start;
        width: 100%;
    }

    .mega-columns--direct .mega-col-collection .mega-group-links li + li {
        margin-top: var(--spigen-direct-collection-link-spacing, 6px);
    }

    .mega-columns--direct .mega-col-collection .mega-group-links li {
        min-height: var(--spigen-direct-collection-link-min-height, 36px);
    }

    .mega-columns--direct .mega-col-collection .mega-group-links a {
        display: flex;
        align-items: flex-start;
        width: 100%;
    }

    .mega-columns--direct .mega-col-promo .mega-feature-card--promo {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 100%;
        text-decoration: none;
    }

    .mega-columns[data-cols="1"] {
        grid-template-columns: minmax(0, 1fr);
    }

    .mega-columns[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(min(180px, 100%), 220px));
    }

    .mega-columns--direct[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(min(180px, 100%), 240px));
    }

    .mega-columns[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(min(160px, 100%), 220px));
    }

    .mega-columns--direct[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(min(160px, 100%), 240px));
    }

    .mega-columns[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(min(140px, 100%), 220px));
    }

    .mega-columns--direct[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(min(140px, 100%), 240px));
    }

    .mega-column {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: var(--spigen-lv3-block-spacing, 7px);
    }

    .mega-col-promo .mega-feature-card--promo,
    .mega-col-promo .catalog-feature-card--promo {
        display: block;
        grid-template-columns: none;
        width: 180px;
        max-width: 100%;
        margin: 0;
    }

    .mega-col-promo .mega-feature-copy,
    .mega-col-promo .catalog-feature-copy {
        display: block;
        width: 100%;
        max-width: none;
        text-align: center;
        margin: 0;
        padding: 0;
    }

    .mega-col-promo .mega-feature-title,
    .mega-col-promo .catalog-feature-title {
        display: block;
        text-align: center;
        margin-left: 0;
        margin-right: 0;
    }

    .mega-col-promo .mega-feature-image,
    .mega-col-promo .catalog-feature-image {
        width: 100%;
        max-width: none;
        max-height: 150px;
        object-fit: contain;
        object-position: center top;
        margin: 0 0 8px;
        border-radius: var(--spigen-promo-card-radius, 8px);
    }

    .mega-col-collection {
        margin-bottom: 0;
    }

    .mega-col-collection .mega-group-links,
    .mega-col-collection .catalog-spigen-group-links {
        margin: 0;
        padding: 0;
        list-style: none;
        margin-top: var(--spigen-lv3-spacing, 6px);
    }

    .mega-col-collection .mega-group-links li + li,
    .mega-col-collection .catalog-spigen-group-links li + li {
        margin-top: var(--spigen-lv3-spacing, 4px);
    }

    .mega-col-collection .mega-group-links a,
    .mega-col-collection .catalog-spigen-group-links a {
        color: var(--spigen-collection-link-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-collection-link-font-weight, 600);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }


    .mega-col-collection .mega-group-links a:hover,
    .mega-col-collection .catalog-spigen-group-links a:hover {
        color: var(--spigen-link-hover-color, #111);
    }

    .mega-col-link a {
        display: block;
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-link-font-weight, 400);
        text-transform: var(--spigen-link-text-transform, none);
        color: var(--spigen-item-color, #5d5d5d);
        padding: 0;
        text-decoration: none;
        line-height: 1.45;
        transition: color 0.15s;
    }

    .mega-col-link a:hover {
        color: var(--spigen-link-hover-color, #111);
    }

    .mega-panel-header {
        display: block;
        margin-bottom: 14px;
        padding-bottom: 10px;
        border-bottom: 1.5px solid #d6d6d6;
        font-size: var(--spigen-section-font-size, 14px);
        font-weight: var(--spigen-section-font-weight, 600);
        text-transform: var(--spigen-section-text-transform, none);
        color: #111;
    }

    .mega-group-title {
        display: block;
        margin-bottom: 10px;
        color: #111;
        font-size: 15px;
        font-weight: 700;
    }

    .mega-group--section .mega-group-title {
        padding-bottom: 6px;
        border-bottom: 1.5px solid #d6d6d6;
    }

    .mega-group-links li + li {
        margin-top: 7px;
    }

    .mega-group-links:not(.mega-group-links--collection) a {
        color: var(--spigen-item-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-link-font-weight, 400);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .mega-group-links--collection a {
        color: var(--spigen-collection-link-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-collection-link-font-weight, 600);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .mega-group-links[data-cols] {
        display: grid;
        gap: 8px 18px;
    }

    .mega-group-links[data-cols] li + li,
    .mega-group-links-grid .mega-group-links li + li {
        margin-top: 0;
    }

    .mega-group-links[data-cols="1"] {
        grid-template-columns: minmax(0, 1fr);
    }

    .mega-group-links[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mega-group-links[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mega-group-links[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .mega-group-links-grid[data-cols] {
        display: grid;
        gap: 24px;
    }

    .mega-group-links-grid[data-cols="1"] {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .mega-group-links-grid[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .mega-group-links-grid[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mega-group-links-grid[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .mega-group-links--column {
        display: block;
    }

    .mega-group-links a:hover {
        color: var(--spigen-link-hover-color, #111);
    }

    .mega-promo-card {
        display: block;
        color: #111;
    }

    .mega-promo-image {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 14px;
    }

    .mega-promo-caption {
        display: block;
        margin-top: 14px;
    }

    .mega-promo-title {
        display: block;
        font-size: 16px;
        line-height: 1.3;
    }

    .mega-promo-subtitle {
        display: block;
        margin-top: 6px;
        color: #666;
        font-size: 13px;
        line-height: 1.4;
    }

    .mega-promo-link {
        display: inline-block;
        margin-top: 8px;
        color: #5d5d5d;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: .04em;
    }

    .mega-feature-card {
        display: grid;
        grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
        gap: 24px;
        padding: 20px;
        border: 1px solid #ececec;
        border-radius: 18px;
        background: linear-gradient(135deg, #fafafa, #f2f4f7);
    }

    .mega-feature-card--collection {
        grid-template-columns: 1fr;
        background: transparent;
        border: none;
        padding: 0;
    }

    .mega-feature-card--promo {
        display: block;
        width: fit-content;
        max-width: 200px;
        margin: 0 auto;
        background: transparent;
        border: none;
        padding: 0;
    }

    .mega-feature-card--promo .mega-feature-image {
        width: 100%;
        margin-bottom: 8px;
    }

    .mega-feature-card--promo .mega-feature-copy {
        text-align: center;
    }

    .mega-feature-image {
        display: block;
        width: 100%;
        border-radius: 14px;
    }

    .mega-feature-kicker {
        display: inline-block;
        margin-bottom: 10px;
        color: #7b7b7b;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .08em;
    }

    .mega-feature-title {
        display: block;
        margin-bottom: 8px;
        color: var(--spigen-item-color, #111);
        font-size: 15px;
        font-weight: 700;
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
        transition: color 0.15s ease;
    }

    .mega-feature-title:hover {
        color: var(--spigen-accent, #14c267) !important;
        text-decoration: none !important;
    }

    .mega-feature-card--collection .mega-feature-title {
        font-size: 15px;
        margin-bottom: 8px;
    }

    .mega-feature-text {
        margin: 12px 0 0;
        color: #555;
        font-size: 14px;
        line-height: 1.5;
    }

    .mega-feature-cta {
        display: inline-block;
        margin-top: 16px;
        color: #111;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .06em;
    }

    .mega-collection-links {
        margin-top: 14px;
    }
}

@media (max-width: 991px) {
    .mega-nav--spigen {
        border-top: none;
    }

    .mega-top-list {
        display: block;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .mega-top-item {
        border-bottom: 1px solid #ececec;
    }

    .mega-top-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .mega-top-link {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 1 1 auto;
        min-height: 48px;
        padding: 12px 0;
        color: var(--spigen-link-color, #1c1c1c);
        font-size: var(--spigen-top-font-size, 14px);
        font-weight: var(--spigen-top-font-weight, 600);
        text-transform: var(--spigen-top-text-transform, uppercase);
    }

    .mega-top-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border: 0;
        background: transparent;
        color: #1c1c1c;
        font-size: 18px;
    }

    .mega-top-item.is-open .mega-top-toggle .fa {
        transform: rotate(180deg);
    }

    .mega-dropdown {
        display: none;
        padding: 0 0 14px;
    }

    .mega-top-item.is-open .mega-dropdown {
        display: block;
    }

    .mega-shell {
        display: block;
    }

    .mega-sections {
        padding-top: 6px;
    }

    .mega-sections-list,
    .mega-group-links {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .mega-sections-item + .mega-sections-item {
        margin-top: 4px;
    }

    .mega-section-trigger {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        padding: 12px 0;
        border: 0;
        background: transparent;
        color: #111;
        text-align: left;
        font-size: var(--spigen-section-font-size, 14px);
        font-weight: var(--spigen-section-font-weight, 600);
        text-transform: var(--spigen-section-text-transform, none);
    }

    .mega-section-type {
        margin-left: auto;
        color: #7b7b7b;
        font-size: 10px;
        text-transform: uppercase;
    }

    .mega-panels {
        padding-top: 8px;
    }

    .mega-panel {
        display: none;
        padding: 10px 0 0;
    }

    .mega-panel.is-active {
        display: block;
    }

    .mega-group + .mega-group {
        margin-top: 16px;
    }

    .mega-group-title {
        display: inline-block;
        margin-bottom: 8px;
        color: #111;
        font-size: 14px;
        font-weight: 700;
    }

    .mega-group--section .mega-group-title {
        padding-bottom: 6px;
        border-bottom: 1px solid #ececec;
    }

    .mega-group-links li + li {
        margin-top: var(--spigen-lv3-spacing, 6px);
    }

    .mega-group-links:not(.mega-group-links--collection) a {
        color: var(--spigen-item-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-link-font-weight, 400);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .mega-group-links--collection a {
        color: var(--spigen-collection-link-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-collection-link-font-weight, 600);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .mega-promo {
        padding-top: 16px;
    }

    .mega-promo-card {
        display: block;
        color: #111;
    }

    .mega-promo-image {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 12px;
    }

    .mega-promo-caption {
        display: block;
        margin-top: 10px;
    }

    .mega-promo-title {
        display: block;
        font-size: 15px;
        line-height: 1.3;
    }

    .mega-promo-subtitle {
        display: block;
        margin-top: var(--spigen-lv3-spacing, 6px);
        color: #666;
        font-size: 13px;
        line-height: 1.4;
    }

    .mega-promo-link {
        display: inline-block;
        margin-top: var(--spigen-lv3-spacing, 6px);
        font-size: 12px;
        color: #5d5d5d;
        text-transform: uppercase;
    }

    .mega-feature-card {
        display: block;
        padding: 16px;
        border: 1px solid #ececec;
        border-radius: 16px;
        background: #f8f9fb;
    }

    .mega-feature-image {
        display: block;
        width: 100%;
        margin-bottom: 12px;
        border-radius: 12px;
    }

    .mega-feature-kicker {
        display: inline-block;
        margin-bottom: 8px;
        color: #7b7b7b;
        font-size: 10px;
        text-transform: uppercase;
    }

    .mega-feature-title {
        display: block;
        color: var(--spigen-item-color, #111);
        font-size: 15px;
        font-weight: 700;
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
        transition: color 0.15s ease;
    }

    .mega-feature-title:hover {
        color: var(--spigen-accent, #14c267) !important;
        text-decoration: none !important;
    }

    .mega-feature-text {
        margin: 10px 0 0;
        color: #555;
        font-size: 13px;
        line-height: 1.45;
    }

    .mega-feature-cta {
        display: inline-block;
        margin-top: 12px;
        color: #111;
        font-size: 12px;
        text-transform: uppercase;
    }
}

/* Spigen-style catalog menu */
@media (min-width: 992px) {
    .catalog-spigen-menu .mega-catalog-shell,
    .catalog-spigen-menu .scroll_menu,
    .catalog-spigen-menu .container.nobackground {
        overflow: visible !important;
    }

    .catalog-spigen-menu .mega-catalog-shell {
        width: calc(100vw - 64px) !important;
        max-width: calc(100vw - 64px) !important;
        margin-left: calc(50% - 50vw + 32px) !important;
        padding: 0;
        border: 0 !important;
        box-sizing: border-box;
        box-shadow: none;
        background: transparent;
    }

    .catalog-spigen-menu .container.nobackground {
        width: 100% !important;
        max-width: none !important;
        padding-left: 0;
        padding-right: 0;
    }

    .catalog-spigen-menu .scroll_menu,
    .catalog-spigen-menu .container.nobackground {
        position: relative;
        width: 100%;
        box-sizing: border-box;
    }

    .catalog-spigen-list,
    .catalog-spigen-sections-list,
    .catalog-spigen-group-links {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .catalog-spigen-list {
        position: static;
        display: flex;
        align-items: center;
        justify-content: var(--spigen-catalog-top-align, center);
        flex-wrap: wrap;
        gap: 0 22px;
        width: 100%;
        box-sizing: border-box;
        min-height: 52px;
        background: var(--spigen-horizontal-bg, #fff);
        border-radius: 14px;
        overflow: hidden;
    }

    .catalog-spigen-head {
        display: flex;
        align-items: center;
    }

    .catalog-spigen-link {
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 52px;
        color: var(--spigen-link-color, #1c1c1c);
        font-size: var(--spigen-top-font-size, 14px);
        font-weight: var(--spigen-top-font-weight, 600);
        text-transform: var(--spigen-top-text-transform, uppercase);
        white-space: nowrap;
    }

    .catalog-spigen-item:hover > .catalog-spigen-head .catalog-spigen-link,
    .catalog-spigen-item:focus-within > .catalog-spigen-head .catalog-spigen-link,
    .catalog-spigen-item.is-active > .catalog-spigen-head .catalog-spigen-link {
        color: var(--spigen-link-hover-color, #111111);
    }

    .catalog-spigen-toggle {
        display: none;
    }

    .catalog-spigen-item {
        position: static !important;
    }

    .catalog-spigen-item:hover .catalog-spigen-dropdown,
    .catalog-spigen-item:focus-within .catalog-spigen-dropdown,
    .catalog-spigen-item.is-active .catalog-spigen-dropdown {
        display: block;
    }

    .catalog-spigen-dropdown {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        border: 0;
        background: #fff;
        border-radius: 0 0 14px 14px;
        box-shadow: 0 22px 50px rgba(0, 0, 0, 0.12);
        z-index: 95;
    }

    .catalog-spigen-dropdown-inner {
        display: grid;
        grid-template-columns: 240px minmax(0, 1fr) minmax(180px, var(--spigen-promo-width, 280px));
        gap: 32px;
        width: 100%;
        box-sizing: border-box;
        padding: 28px 32px 32px;
    }

    .catalog-spigen-dropdown-inner--direct {
        display: block;
    }

    .catalog-spigen-dropdown-inner--direct-has-promo {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(180px, var(--spigen-promo-width, 280px));
        align-items: start;
        justify-content: start;
    }

    .catalog-spigen-direct {
        width: 100%;
        min-width: 0;
    }

    @media (max-width: 1400px) {
        .catalog-spigen-dropdown-inner {
            grid-template-columns: 240px minmax(0, 1fr) minmax(180px, var(--spigen-promo-width-md, 240px));
        }

        .catalog-spigen-dropdown-inner--direct-has-promo {
            grid-template-columns: minmax(0, 1fr) minmax(180px, var(--spigen-promo-width-md, 240px));
        }
    }

    @media (max-width: 1200px) {
        .catalog-spigen-dropdown-inner {
            grid-template-columns: 240px minmax(0, 1fr) var(--spigen-promo-width-sm, 210px);
            gap: 20px;
            padding: 20px 24px 24px;
        }

        .catalog-spigen-dropdown-inner--direct-has-promo {
            grid-template-columns: minmax(0, 1fr) var(--spigen-promo-width-sm, 210px);
        }

        .catalog-spigen-promo {
            display: var(--spigen-promo-display-sm, block);
        }

        .catalog-spigen-menu[style*="--spigen-promo-display-sm: none"] .catalog-spigen-promo {
            display: none;
        }

        .catalog-spigen-menu[style*="--spigen-promo-display-sm: none"] .catalog-spigen-dropdown-inner {
            grid-template-columns: 240px minmax(0, 1fr);
        }

        .catalog-spigen-menu[style*="--spigen-promo-display-sm: none"] .catalog-spigen-dropdown-inner--direct {
            grid-template-columns: minmax(0, 1fr);
        }
    }

    .catalog-spigen-sections {
        border-right: 1.5px solid #d6d6d6;
        padding-right: 24px;
        max-height: none !important;
        overflow: visible !important;
    }

    .catalog-spigen-sections-list,
    .catalog-spigen-sections-item {
        display: block !important;
        max-height: none !important;
        overflow: visible !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .catalog-spigen-sections-item + .catalog-spigen-sections-item {
        margin-top: 6px;
    }

    .catalog-spigen-section-trigger {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        padding: 10px 0;
        border: 0;
        background: transparent;
        color: #444;
        text-align: left;
        font-size: var(--spigen-section-font-size, 14px);
        font-weight: var(--spigen-section-font-weight, 600);
        text-transform: var(--spigen-section-text-transform, none);
    }

    .catalog-spigen-sections-item:first-child .catalog-spigen-section-trigger {
        padding-top: 0;
    }

    .catalog-spigen-section-trigger.is-active,
    .catalog-spigen-section-trigger:hover,
    .catalog-spigen-section-trigger:focus {
        color: var(--spigen-accent, #14c267);
    }

    .catalog-spigen-section-trigger.is-active {
        font-weight: 700;
    }

    .catalog-spigen-section-type {
        margin-left: auto;
        color: #7b7b7b;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .06em;
    }


    .catalog-spigen-panel {
        display: none;
        width: 100%;
        min-width: 0;
    }

    .catalog-spigen-panel.is-active {
        display: block;
    }

    .catalog-spigen-panels {
        width: 100%;
        min-width: 0;
    }

    .catalog-group-collection-title {
        margin-bottom: 8px;
        font-size: 15px;
        font-weight: var(--spigen-collection-title-font-weight, 700);
        color: var(--spigen-item-color, #111);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .catalog-group-collection-title a {
        display: inline-block;
        font-size: inherit;
        font-weight: inherit;
        color: inherit;
        text-transform: inherit;
        text-decoration: none;
    }

    .catalog-group-collection-title:hover,
    .catalog-group-collection-title:hover a,
    .catalog-group-collection-title a:hover {
        color: var(--spigen-accent, #14c267) !important;
        text-decoration: none !important;
    }

    .catalog-panel-header {
        display: block;
        margin-bottom: 14px;
        padding-bottom: 10px;
        border-bottom: 1.5px solid #d6d6d6;
        font-size: var(--spigen-section-font-size, 14px);
        font-weight: var(--spigen-section-font-weight, 600);
        text-transform: var(--spigen-section-text-transform, none);
        color: #111;
    }

    .catalog-spigen-group-title {
        display: block;
        margin-bottom: 10px;
        color: #111;
        font-size: 15px;
        font-weight: 700;
    }

    .catalog-spigen-group--section .catalog-spigen-group-title {
        padding-bottom: 6px;
        border-bottom: 1.5px solid #d6d6d6;
    }

    .catalog-spigen-groups {
        display: flex;
        flex-direction: column;
        gap: var(--spigen-lv3-block-spacing, 7px);
        width: 100%;
        min-width: 0;
    }

    .catalog-spigen-group-links li + li {
        margin-top: var(--spigen-lv3-spacing, 6px);
    }

    .catalog-spigen-group-links:not(.catalog-spigen-group-links--collection) a {
        color: var(--spigen-item-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-link-font-weight, 400);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .catalog-spigen-group-links--collection a {
        color: var(--spigen-collection-link-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-collection-link-font-weight, 600);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .catalog-spigen-group-links a:hover {
        color: var(--spigen-link-hover-color, #111111);
    }

    .catalog-spigen-columns {
        display: grid;
        gap: 16px;
        width: 100%;
        justify-content: start;
    }

    .catalog-spigen-columns--direct {
        justify-content: start;
        gap: var(--spigen-direct-gap, 24px);
    }

    .catalog-spigen-columns--direct .catalog-spigen-column {
        gap: var(--spigen-direct-block-spacing, 7px);
    }

    .catalog-spigen-columns--direct .mega-col-link + .mega-col-link,
    .catalog-spigen-columns--direct .mega-col-link + .mega-col-promo,
    .catalog-spigen-columns--direct .mega-col-promo + .mega-col-link,
    .catalog-spigen-columns--direct .mega-col-promo + .mega-col-promo {
        margin-top: var(--spigen-direct-link-spacing, 6px);
    }

    .catalog-spigen-columns--direct .mega-col-link,
    .catalog-spigen-columns--direct .mega-col-promo {
        display: flex;
        align-items: flex-start;
        min-height: var(--spigen-direct-link-min-height, 36px);
    }

    .catalog-spigen-columns--direct .mega-col-link a {
        display: flex;
        align-items: flex-start;
        width: 100%;
    }

    .catalog-spigen-columns--direct .mega-col-collection .catalog-spigen-group-links li + li {
        margin-top: var(--spigen-direct-collection-link-spacing, 6px);
    }

    .catalog-spigen-columns--direct .mega-col-collection .catalog-spigen-group-links li {
        min-height: var(--spigen-direct-collection-link-min-height, 36px);
    }

    .catalog-spigen-columns--direct .mega-col-collection .catalog-spigen-group-links a {
        display: flex;
        align-items: flex-start;
        width: 100%;
    }

    .catalog-spigen-columns--direct .mega-col-promo .catalog-feature-card--promo {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        width: 100%;
        text-decoration: none;
    }

    .catalog-spigen-columns[data-cols="1"] {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-spigen-columns[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(min(180px, 100%), 220px));
    }

    .catalog-spigen-columns--direct[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(min(180px, 100%), 240px));
    }

    .catalog-spigen-columns[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(min(160px, 100%), 220px));
    }

    .catalog-spigen-columns--direct[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(min(160px, 100%), 240px));
    }

    .catalog-spigen-columns[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(min(140px, 100%), 220px));
    }

    .catalog-spigen-columns--direct[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(min(140px, 100%), 240px));
    }

    .catalog-spigen-column {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: var(--spigen-lv3-block-spacing, 7px);
    }


    .catalog-spigen-group-links[data-cols] {
        display: grid;
        gap: 8px 18px;
    }

    .catalog-spigen-group-links[data-cols] li + li,
    .catalog-spigen-group-links-grid .catalog-spigen-group-links li + li {
        margin-top: 0;
    }

    .catalog-spigen-group-links[data-cols="1"] {
        grid-template-columns: minmax(0, 1fr);
    }

    .catalog-spigen-group-links[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalog-spigen-group-links[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .catalog-spigen-group-links[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .catalog-spigen-group-links-grid[data-cols] {
        display: grid;
        gap: 24px;
    }

    .catalog-spigen-group-links-grid[data-cols="1"] {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .catalog-spigen-group-links-grid[data-cols="2"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .catalog-spigen-group-links-grid[data-cols="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .catalog-spigen-group-links-grid[data-cols="4"] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .catalog-spigen-group-links--column {
        display: block;
    }

    .catalog-spigen-promo-card {
        display: block;
        color: #111;
    }

    .catalog-spigen-promo-image {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 14px;
    }

    .catalog-spigen-promo-caption {
        display: block;
        margin-top: 12px;
    }

    .catalog-spigen-promo-title {
        display: block;
        font-size: 15px;
        line-height: 1.3;
    }

    .catalog-spigen-promo-subtitle {
        display: block;
        margin-top: 6px;
        color: #666;
        font-size: 13px;
        line-height: 1.4;
    }

    .catalog-spigen-promo-link {
        display: inline-block;
        margin-top: 8px;
        color: #5d5d5d;
        font-size: 12px;
        text-transform: uppercase;
    }

    .catalog-feature-card {
        display: grid;
        grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
        gap: 22px;
        padding: 20px;
        border: 1px solid #ececec;
        border-radius: 18px;
        background: linear-gradient(135deg, #fafafa, #f2f4f7);
    }

    .catalog-feature-card--collection {
        grid-template-columns: 1fr;
        background: transparent;
        border: none;
        padding: 0;
    }

    .catalog-feature-image {
        display: block;
        width: 100%;
        border-radius: 14px;
    }

    .catalog-feature-kicker {
        display: inline-block;
        margin-bottom: 10px;
        color: #7b7b7b;
        font-size: 11px;
        text-transform: uppercase;
        letter-spacing: .08em;
    }

    .catalog-feature-title {
        display: block;
        color: var(--spigen-item-color, #111);
        font-size: 15px;
        font-weight: 700;
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
        transition: color 0.15s ease;
    }

    .catalog-feature-title:hover {
        color: var(--spigen-accent, #14c267) !important;
        text-decoration: none !important;
    }

    .catalog-feature-text {
        margin: 12px 0 0;
        color: #555;
        font-size: 14px;
        line-height: 1.5;
    }

    .catalog-feature-cta {
        display: inline-block;
        margin-top: 16px;
        color: #111;
        font-size: 12px;
        font-weight: 700;
        text-transform: uppercase;
    }
}

@media (max-width: 991px) {
    .catalog-spigen-list,
    .catalog-spigen-sections-list,
    .catalog-spigen-group-links {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .catalog-spigen-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .catalog-spigen-link {
        display: flex;
        align-items: center;
        gap: 8px;
        flex: 1 1 auto;
        min-height: 44px;
        color: var(--spigen-link-color, #1c1c1c);
        font-size: var(--spigen-top-font-size, 14px);
        font-weight: var(--spigen-top-font-weight, 600);
        text-transform: var(--spigen-top-text-transform, uppercase);
    }

    .catalog-spigen-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border: 0;
        background: transparent;
        color: #1c1c1c;
        font-size: 18px;
    }

    .catalog-spigen-item.is-open .catalog-spigen-toggle .fa {
        transform: rotate(90deg);
    }

    .catalog-spigen-dropdown {
        display: none;
        padding: 8px 0 12px 12px;
    }

    .catalog-spigen-item.is-open .catalog-spigen-dropdown {
        display: block;
    }

    .catalog-spigen-sections-item + .catalog-spigen-sections-item {
        margin-top: 4px;
    }

    .catalog-spigen-section-trigger {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        padding: 10px 0;
        border: 0;
        background: transparent;
        color: #111;
        text-align: left;
        font-size: var(--spigen-section-font-size, 14px);
        font-weight: var(--spigen-section-font-weight, 600);
        text-transform: var(--spigen-section-text-transform, none);
    }

    .catalog-spigen-section-type {
        margin-left: auto;
        color: #7b7b7b;
        font-size: 10px;
        text-transform: uppercase;
    }

    .catalog-spigen-panel {
        display: none;
        padding: 10px 0 0 10px;
    }

    .catalog-spigen-panel.is-active {
        display: block;
    }

    .catalog-spigen-group + .catalog-spigen-group {
        margin-top: 14px;
    }

    .catalog-spigen-group-title {
        display: inline-block;
        margin-bottom: 8px;
        color: #111;
        font-size: 14px;
        font-weight: 700;
    }

    .catalog-spigen-group--section .catalog-spigen-group-title {
        padding-bottom: 6px;
        border-bottom: 1.5px solid #d6d6d6;
    }

    .catalog-spigen-group-links li + li {
        margin-top: 6px;
    }

    .catalog-spigen-group-links:not(.catalog-spigen-group-links--collection) a {
        color: var(--spigen-item-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-link-font-weight, 400);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .catalog-spigen-group-links--collection a {
        color: var(--spigen-collection-link-color, #5d5d5d);
        font-size: var(--spigen-link-font-size, 13px);
        font-weight: var(--spigen-collection-link-font-weight, 600);
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
    }

    .catalog-spigen-promo {
        padding-top: 14px;
    }

    .catalog-spigen-promo-card {
        display: block;
        color: #111;
    }

    .catalog-spigen-promo-image {
        display: block;
        width: 100%;
        height: auto;
        border-radius: 12px;
    }

    .catalog-spigen-promo-caption {
        display: block;
        margin-top: 10px;
    }

    .catalog-spigen-promo-title {
        display: block;
        font-size: 15px;
        line-height: 1.3;
    }

    .catalog-spigen-promo-subtitle {
        display: block;
        margin-top: 6px;
        color: #666;
        font-size: 13px;
        line-height: 1.4;
    }

    .catalog-spigen-promo-link {
        display: inline-block;
        margin-top: 6px;
        font-size: 12px;
        color: #5d5d5d;
        text-transform: uppercase;
    }

    .catalog-feature-card {
        display: block;
        padding: 16px;
        border: 1.5px solid #d6d6d6;
        border-radius: 16px;
        background: #f8f9fb;
    }

    .catalog-feature-card--collection {
        border: none;
        background: transparent;
        padding: 0;
    }

    .catalog-feature-image {
        display: block;
        width: 100%;
        margin-bottom: 12px;
        border-radius: 12px;
    }

    .catalog-feature-kicker {
        display: inline-block;
        margin-bottom: 8px;
        color: #7b7b7b;
        font-size: 10px;
        text-transform: uppercase;
    }

    .catalog-feature-title {
        display: block;
        color: var(--spigen-item-color, #111);
        font-size: 15px;
        font-weight: 700;
        text-transform: var(--spigen-link-text-transform, none);
        line-height: 1.45;
        transition: color 0.15s ease;
    }

    .catalog-feature-title:hover {
        color: var(--spigen-accent, #14c267) !important;
        text-decoration: none !important;
    }

    .catalog-feature-text {
        margin: 10px 0 0;
        color: #555;
        font-size: 13px;
        line-height: 1.45;
    }

    .catalog-feature-cta {
        display: inline-block;
        margin-top: 12px;
        color: #111;
        font-size: 12px;
        text-transform: uppercase;
    }

    /* Small Promo Variants for level 3 / columns */
    .mega-feature-card--small,
    .catalog-feature-card--small {
        padding: 10px;
        border-width: 1px;
        border-color: #e5e7eb;
        background: #ffffff;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .mega-feature-card--small:hover,
    .catalog-feature-card--small:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    }

    .mega-feature-card--small .mega-feature-title,
    .catalog-feature-card--small .catalog-feature-title {
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 6px;
    }

    .mega-feature-card--small .mega-feature-text,
    .catalog-feature-card--small .catalog-feature-text {
        font-size: 12px;
        margin-top: 4px;
    }

    .mega-feature-card--small img,
    .catalog-feature-card--small img {
        margin-bottom: 8px;
        border-radius: 8px;
    }
}

/* Final typography overrides for right-side megamenu links/cards. */
.mega-panels .mega-feature-title,
.catalog-spigen-panels .catalog-feature-title,
.mega-feature-card--small .mega-feature-title,
.catalog-feature-card--small .catalog-feature-title {
    font-weight: var(--spigen-link-font-weight, 400);
}

.mega-panels .mega-feature-card--collection .mega-feature-title,
.catalog-spigen-panels .catalog-feature-card--collection .catalog-feature-title,
.mega-col-collection .mega-group-collection-title,
.mega-col-collection .catalog-group-collection-title {
    font-weight: var(--spigen-collection-title-font-weight, 700);
}

.mega-col-collection .mega-group-links--collection a,
.mega-col-collection .catalog-spigen-group-links--collection a {
    font-weight: var(--spigen-collection-link-font-weight, 600);
}

/* Collection/column images should stay clean, without card frames. */
.mega-col-promo .mega-feature-card--small,
.mega-col-promo .catalog-feature-card--small,
.mega-col-promo .mega-feature-card--promo,
.mega-col-promo .catalog-feature-card--promo {
    padding: 0;
    border: 0;
    box-shadow: none;
    background: transparent;
}

.mega-col-promo .mega-feature-card--small:hover,
.mega-col-promo .catalog-feature-card--small:hover {
    transform: none;
    box-shadow: none;
}

.mega-col-promo .mega-feature-image,
.mega-col-promo .catalog-feature-image {
    border: 0;
    box-shadow: none;
    border-radius: var(--spigen-promo-card-radius, 8px);
}

/* Right-side collection images should not inherit any card/image frame. */
.mega-promo-card,
.catalog-spigen-promo-card {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.mega-promo-card--static,
.catalog-spigen-promo-card--static {
    cursor: default;
}

.mega-promo-image,
.catalog-spigen-promo-image {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    background: transparent !important;
}

@media (min-width: 992px) {
    .mega-promo,
    .catalog-spigen-promo,
    .mega-promo-card,
    .catalog-spigen-promo-card,
    .mega-promo-card img,
    .catalog-spigen-promo-card img,
    .mega-promo-image,
    .catalog-spigen-promo-image {
        border: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        -webkit-box-shadow: none !important;
        background: transparent !important;
        filter: none !important;
    }

    .mega-promo-card,
    .catalog-spigen-promo-card {
        border-radius: 14px !important;
        overflow: hidden !important;
    }

    .mega-promo-image,
    .catalog-spigen-promo-image {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        border-radius: 14px !important;
        transform: none !important;
    }
}

/* Final radius for promo images inside menu columns. Keep it smaller than right-side section images. */
.mega-col-promo .mega-feature-card--promo,
.mega-col-promo .catalog-feature-card--promo,
.mega-feature-card--promo.mega-feature-card--small,
.catalog-feature-card--promo.catalog-feature-card--small {
    overflow: hidden !important;
}

.mega-feature-card--promo.mega-feature-card--small .mega-feature-image-wrap,
.catalog-feature-card--promo.catalog-feature-card--small .catalog-feature-image-wrap {
    display: block !important;
    width: 100% !important;
    margin-bottom: 8px !important;
    border-radius: var(--spigen-promo-card-radius, 8px) !important;
    overflow: hidden !important;
    clip-path: inset(0 round var(--spigen-promo-card-radius, 8px)) !important;
}

.mega-col-promo .mega-feature-card--promo .mega-feature-image,
.mega-col-promo .catalog-feature-card--promo .catalog-feature-image,
.mega-feature-card--promo.mega-feature-card--small .mega-feature-image,
.catalog-feature-card--promo.catalog-feature-card--small .catalog-feature-image,
.mega-group--promo .mega-feature-image,
.catalog-spigen-group .catalog-feature-card--promo .catalog-feature-image {
    display: block !important;
    width: 100% !important;
    border-radius: var(--spigen-promo-card-radius, 8px) !important;
    clip-path: inset(0 round var(--spigen-promo-card-radius, 8px)) !important;
}

.mega-promo-image-frame,
.catalog-promo-image-frame {
    display: block !important;
    width: 100% !important;
    margin-bottom: 8px !important;
    overflow: hidden !important;
    border-radius: var(--spigen-promo-card-radius, 8px) !important;
    clip-path: inset(0 round var(--spigen-promo-card-radius, 8px)) !important;
    -webkit-clip-path: inset(0 round var(--spigen-promo-card-radius, 8px)) !important;
    line-height: 0 !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.mega-promo-image-frame img,
.catalog-promo-image-frame img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: inherit !important;
    box-shadow: none !important;
    clip-path: inherit !important;
    -webkit-clip-path: inherit !important;
    opacity: 0 !important;
}

.mega-feature-card--small .mega-promo-image-frame,
.catalog-feature-card--small .catalog-promo-image-frame {
    position: relative !important;
    max-width: var(--spigen-promo-card-size, 160px) !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 8px !important;
    -webkit-border-radius: 8px !important;
    overflow: hidden !important;
    clip-path: inset(0 round 8px) !important;
    -webkit-clip-path: inset(0 round 8px) !important;
    background-clip: padding-box !important;
}

.mega-feature-card--small .mega-promo-image-frame img,
.catalog-feature-card--small .catalog-promo-image-frame img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* Fallback for the original Topshop menu image class when the old template branch renders column promos. */
.mega-nav img.vopmen,
.catalog-spigen-menu img.vopmen,
#menu img.vopmen,
#menu2 img.vopmen,
#menu2-spigen img.vopmen {
    display: block !important;
    overflow: hidden !important;
    border-radius: var(--spigen-promo-card-radius, 8px) !important;
    clip-path: inset(0 round var(--spigen-promo-card-radius, 8px)) !important;
    -webkit-clip-path: inset(0 round var(--spigen-promo-card-radius, 8px)) !important;
}

/* Hard fallback for promo cards rendered with .mega-feature-image. */
.mega-feature-card--promo .mega-feature-image,
.mega-col-promo .mega-feature-image,
.mega-group--promo .mega-feature-image {
    display: block !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    -webkit-border-radius: 8px !important;
}

.mega-feature-card--promo.mega-feature-card--small,
.catalog-feature-card--promo.catalog-feature-card--small {
    width: 100% !important;
    max-width: var(--spigen-promo-card-size, 160px) !important;
    overflow: visible !important;
    border-radius: 0 !important;
}