.category_div {
    background: #fcfcfc no-repeat padding-box;
    border: 1px solid #e2f0ff;
    border-radius: 5px;
    opacity: 1;
    padding: 5px;
}

.seller-header-image {
    margin-top: 9px;
    border-radius: 4px;
    height: 220px;
    background: url("./img/seller.png") no-repeat center;
    background-size: cover;
}

.for-discount-value {
    color: white;
    border-radius: 5px 0;
    font-size: small;
}

html[dir="ltr"] .for-discount-value {
    padding: 3px 4px 2px 5px;
}

html[dir="rtl"] .for-discount-value {
    padding: 3px 5px 2px 4px;
}

.for-discount-value-null {
    color: white;
    border-radius: 0 5px;
    font-size: small;
    display: none !important;
}

html[dir="ltr"] .for-discount-value-null {
    padding: 3px 4px 2px 5px;
}

html[dir="rtl"] .for-discount-value-null {
    padding: 3px 5px 2px 4px;
}

.for-discount-div {
    margin-top: -6%;
    margin-bottom: 6%;
}

html[dir="ltr"] .for-discount-div {
    margin-right: -9%;
}

html[dir="rtl"] .for-discount-div {
    margin-left: -9%;
}

@media (max-width: 375px) {
    .discount-hed {
        margin-top: -5%;
        margin-right: -5%;
        margin-bottom: 6%;
    }
}

.for-count-value {
    position: absolute;
    right: 0.6875rem;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    color: black;
    font-size: 0.75rem;
    font-weight: 500;
    text-align: center;
    line-height: 1.25rem;
}

@media (max-width: 600px) {
    .seller-header-image {
        height: 86px;
    }
}

.chat {
    float: right;
    margin-right: 5px;
    width: 100px;
}

.flower {
    float: right;
    width: 114px;
}

.cz-carousel [data-nav].tns-nav-active {
    background-color: #92c6ff !important;
}

.cz-carousel [data-nav] {
    background-color: #fff !important;
}

.cz-carousel .tns-nav {
    position: relative;
    padding-top: 0;
    padding-bottom: 0;
    text-align: center;
    bottom: 25px;
}

.tns-outer {
    padding: 0 !important;
    margin-bottom: -20px;
}

.banner_card {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1019607843);
    border: 1px solid #e2f0ff;
    border-radius: 3px;
}

[data-simplebar] {
    overflow-y: auto;
    padding-right: 0 !important;
}

.simplebar-content {
    padding: 0 !important;
}

.footer_banner {
    padding-right: 4px;
    padding-left: 4px;
    margin-top: 5px;
}

.footer_banner:first-child {
    padding-right: unset;
    padding-left: 0;
}

html[dir="rtl"] .footer_banner:first-child {
    padding-right: 0;
}

.footer_banner:nth-child(5) {
    padding-left: unset;
    padding-right: 0;
}

html[dir="rtl"] .footer_banner:nth-child(5) {
    padding-left: 0;
}

.widget-product-title .ptr {
    position: relative;
    display: inline-block;
    word-wrap: break-word;
    overflow: hidden;
    max-height: 1.2em;
    line-height: 1.2em;
    font-weight: 600;
    font-size: 14px;
}

.widget .btn > i {
    margin-top: -1px;
    vertical-align: middle;
    font-size: 10px;
}

.widget .btn-outline-accent {
    border-radius: 3px;
    width: 80px;
    padding: 2px;
}

.widget-product-title {
    position: relative;
}

.text-accent {
    font-weight: 700;
    font-size: 17px;
}

.category_title {
    color: black !important;
    font-size: 16px;
    font-weight: 600;
}

.featured_deal_title {
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
    color: white;
}

.featured_deal_product {
    cursor: pointer;
    height: 97px;
}

.featured_product_details {
    padding: 5px;
}

.featured_product_pic .image_center img {
    vertical-align: middle;
}

.featured_deal_title {
    position: relative;
}

.featured_product-title .ptr {
    font-weight: 400;
    font-size: 19px !important;
    color: #000000 !important;
    position: relative;
    display: inline-block;
    word-wrap: break-word;
    overflow: hidden;
    max-height: 2.4em;
    line-height: 1.2em;
}

.featured_product-price {
    margin-top: -10px;
}

.featured_product-price .ptp {
    font-weight: 700;
    font-size: 19px !important;
}

.flash_deal {
    border-radius: 3px;
}

.flash_deal_title {
    color: black;
    font-weight: 700;
    font-size: 25px;
    text-transform: uppercase;
}

.cz-countdown .cz-countdown-value {
    font-size: 16px !important;
    font-weight: 700 !important;
}

.cz-countdown {
    flex-wrap: wrap;
    font-weight: normal;
    display: flex;
    justify-content: center;
    flex-direction: row;
}

.flash_deal_product {
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.0509803922);
    background: white;
    border-radius: 5px;
}

.flash_deal_product_pic {
    height: 175px;
    background: #f9f9f9;
    border-radius: 3px;
    padding: 0 10px;
}

.flash_deal_product_pic img {
    height: 149px;
}

.flash_deal_product_details {
    position: relative;
}

.flash_deal_product_details .flash-product-title {
    position: relative;
    display: inline-block;
    word-wrap: break-word;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    line-height: 1.2em;
}

.flash_deal_product_details .flash-product-title a {
    font-weight: 600;
    font-size: 16px;
    color: black !important;
}

.flash_deal_product_details .flash-product-review {
    font-weight: 400;
    font-size: 11px;
}

.flash_deal_product_details .flash-product-review .review-count {
    color: #fea96e !important;
}

.flash_deal_product_details .flash-product-review .star-rating i {
    font-size: 16px !important;
}

.deal_of_the_day h1 {
    font-weight: 700;
    font-size: 29px;
    padding-top: 40px;
    text-align: center;
    text-transform: uppercase;
}

.buy_btn {
    font-weight: 700;
    font-size: 22px;
    width: 198px;
    height: 46px;
    background-color: white;
    border-radius: 3px;
    border: 1px solid white;
}

.deal_latest_product .product-card {
    box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.0784313725);
    border-radius: 5px;
    height: 284px;
}

.deal_latest_product .product-card .card-header {
    height: 200px;
    text-align: center;
    background: #f9f9f9 0 0 no-repeat padding-box;
    border-radius: 5px 5px 0 0;
}

.product-title1 {
    font-weight: 400 !important;
    font-size: 16px !important;
    color: #000000 !important;
    position: relative;
    display: inline-block;
    word-wrap: break-word;
    overflow: hidden;
    max-height: 2.4em;
    line-height: 1.2em;
}

.deal_latest_product .product-title {
    font-weight: 400 !important;
    font-size: 16px !important;
    color: #000000 !important;
}

.deal-title {
    font-weight: 400;
    font-size: 14px;
    text-align: center;
}

.order-summery-footer-image {
    width: auto;
}

.view_all {
    display: flex;
    justify-content: flex-end !important;
}

.view_border {
    margin-top: -53px;
    border-top: 2px solid #e3e9ef;
    margin-bottom: 53px;
}

@media (min-width: 1024px) {
    .main_banner_img {
        margin: 0;
    }

    .footer_banner_img {
        height: 165px;
    }

    .banner_product {
        height: 490px !important;
    }
}

@media (min-width: 992px) {
    .main_banner_img {
        margin: 0;
        height: 378px !important;
    }

    .footer_banner_img {
        height: 165px !important;
    }

    .banner_product {
        background: white;
        height: 526px !important;
    }
}

@media (max-width: 375px) {
    .for-discount-div {
        margin-top: -5%;
        margin-bottom: 6%;
    }

    html[dir="ltr"] .for-discount-div {
        margin-right: -5%;
    }

    html[dir="rtl"] .for-discount-div {
        margin-left: -5%;
    }
}

@media (min-width: 768px) {
    .main_banner_img {
        margin: 0;
        height: 260px;
    }

    .banner_product {
        height: 306px;
    }

    .flash_deal {
        height: 258px;
    }
}

@media (max-width: 768px) {
    .banner_card {
        box-shadow: none;
        border: none;
        border-radius: 0;
    }

    .deal-title {
        font-size: 20px !important;
    }

    .btn-sm,
    .btn-group-sm > .btn {
        padding: 5px 10px;
        font-size: 0.8125rem;
        line-height: 1.5;
        border-radius: 0.1875rem;
        margin-top: 3px;
    }

    .carousel-control-prev,
    .carousel-control-next {
        position: absolute;
        top: 0;
        bottom: 0;
        z-index: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 14%;
        color: #fff;
        text-align: center;
        opacity: 0.5;
        transition: opacity 0.15s ease;
    }

    .featured_deal_carosel .carousel-inner {
        padding: 0;
    }

    .view_all {
        display: flex;
        justify-content: flex-start !important;
    }

    .flash_deal {
        box-shadow: none;
        border: none;
        border-radius: 0;
    }

    .fd {
        padding-bottom: 10px;
        border-bottom: 2px solid #e2f0ff !important;
    }

    .feature_header {
        margin-top: 0;
    }

    .feature_header span {
        padding-right: 0;
        padding-left: 0;
        font-weight: 700;
        font-size: 25px;
        text-transform: uppercase;
    }

    .view_border {
        margin: 16px 0;
        border-top: 2px solid #e2f0ff !important;
    }

    .flash-product-price,
    .text-accent {
        font-size: 14px !important;
    }
}

.featured_deal {
    min-height: 108px;
}

.btn-outline--info {
    border: 1px solid #1b7fed;
    color: #1b7fed !important;
}

.btn-outline--info:hover {
    border-color: #1b7fed;
    color: #fff !important;
    background-color: #1b7fed;
}

.qty_input {
    width: 50px;
    background-color: rgba(var(--web-primary-rgb), 0.1);
    border: 1px solid var(--web-primary);
    border-radius: 5px;
    text-align: center;
    height: 40px;
}

.qty_minus,
.qty_plus {
    display: flex;
    align-items: center;
    color: var(--web-primary);
    cursor: pointer;
}

.__img-62 {
    min-width: 60px;
}

.fs-10 {
    font-size: 10px !important;
}

.outline-0 {
    outline: 0 !important;
}

.steps {
    max-width: 500px;
}

.steps .step-item:first-child .step-count {
    left: 12px;
}

[dir="rtl"] .steps .step-item:first-child .step-count {
    left: auto;
    right: 12px;
    margin-right: -0.8125rem;
}

.steps .step-item:first-child .step-label {
    text-align: start;
}

.steps .step-item:last-child .step-count {
    left: auto;
    right: 0;
}

[dir="rtl"] .steps .step-item:last-child .step-count {
    left: 0;
    right: auto;
    margin-left: 0;
}

.steps .step-item:last-child .step-label {
    text-align: end;
}

.saved-address-dropdown .dropdown-item {
    margin-inline: 10px;
    width: auto;
}

.saved-address-dropdown .dropdown-item.active {
    border-radius: 8px;
    border: 1px solid rgba(20, 85, 172, 0.3);
    background: rgba(20, 85, 172, 0.02);
    padding: 10px 14px;
}

.progress {
    height: 0.25rem;
    background-color: #dfedff;
    border-radius: 50rem;
}

.progress-bar {
    background-color: var(--primary-clr);
}

.border-primary-light {
    border: 1px solid rgba(27, 127, 237, 0.2) !important;
}

@media (max-width: 991px) {
    #shop-sidebar {
        position: fixed;
        right: 0;
        left: auto;
        top: 0;
        width: 320px;
        max-width: 100%;
        height: 100lvh;
        z-index: 9999;
        border-radius: 0.5rem 0 0 0.5rem;
        transform: translateX(100%);
        transition: transform 200ms ease;
        background-color: #fff !important;
    }

    #shop-sidebar.active {
        transform: translateX(0);
    }

    .profile-aside-overlay {
        position: fixed;
        left: 0;
        top: 0;
        width: calc(100vw - 320px);
        height: 100%;
        z-index: 9998;
        transform: translateX(2000%);
        transition: transform 200ms ease;
        background-color: rgba(0, 0, 0, 0.158) !important;
    }

    .profile-aside-overlay.active {
        transform: translateX(0);
    }

    #shop-sidebar .shop-sidebar-scroll {
        max-height: 90vh;
        overflow: auto;
    }

    #shop-sidebar .shop-sidebar-scroll::-webkit-scrollbar {
        width: 0;
    }
}

.profile-aside-close-btn {
    font-size: 1.5rem;
}

.flash_deal_product_details a.text-capitalize {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}

.others-store-card .name-area .info h5,
.others-store-card .name-area .info .h5 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
}

.recommended-product-card img {
    border: 1px solid #eef1ff;
}

.cz-countdown-days {
    border: 1px solid var(--web-primary);
}

.btn-scroll-top {
    background: var(--web-primary);
}

.__best-selling:hover .ptr,
.flash_deal_product:hover .flash-product-title {
    color: var(--web-primary);
}

.cz-countdown-hours {
    border: 1px solid var(--web-primary);
}

.cz-countdown-minutes {
    border: 1px solid var(--web-primary);
}

.cz-countdown-seconds {
    border: 1px solid var(--web-primary);
}

.flash_deal_product_details .flash-product-price {
    color: var(--web-primary);
}

.featured_deal_left {
    background: var(--web-primary) 0 0 no-repeat padding-box;
}

.category_div:hover {
    color: var(--web-secondary);
}

.deal_of_the_day {
    background: var(--web-secondary);
}

.best-selling-image {
    background: var(--web-primary-10);
}

.top-rated-image {
    background: var(--web-primary-10);
}

@media (max-width: 800px) {
    [dir="rtl"] .categories-title {
        margin-right: 0;
    }

    [dir="ltr"] .categories-title {
        margin-left: 6px;
    }

    [dir="rtl"] .seller-list-title {
        margin-right: 0;
    }

    [dir="ltr"] .seller-list-title {
        margin-left: 10px;
    }

    [dir="rtl"] .seller-list-view-all {
        margin-left: 20px;
    }

    [dir="ltr"] .seller-list-view-all {
        margin-right: 10px;
    }

    [dir="rtl"] .category-product-view-title {
        margin-right: 16px;
    }

    [dir="ltr"] .category-product-view-title {
        margin-left: -8px;
    }

    [dir="rtl"] .category-product-view-all {
        margin-left: -7px;
    }

    [dir="ltr"] .category-product-view-all {
        margin-right: 5px;
    }
}

@media (min-width: 801px) {
    [dir="rtl"] .categories-title {
        margin-right: 25px;
    }

    [dir="ltr"] .categories-title {
        margin-left: 25px;
    }

    [dir="rtl"] .seller-list-title {
        margin-right: 6px;
    }

    [dir="ltr"] .seller-list-title {
        margin-left: 10px;
    }

    [dir="ltr"] .seller-list-view-all {
        margin-right: 10px;
    }

    [dir="rtl"] .seller-list-view-all {
        margin-left: 12px;
    }

    [dir="rtl"] .seller-card {
        padding-left: 0 !important;
    }

    [dir="ltr"] .seller-card {
        padding-right: 0 !important;
    }

    [dir="ltr"] .category-product-view-title {
        margin-left: -12px;
    }

    [dir="rtl"] .category-product-view-title {
        margin-right: 10px;
    }

    [dir="rtl"] .category-product-view-all {
        margin-left: -20px;
    }

    [dir="ltr"] .category-product-view-all {
        margin-right: 0;
    }
}

.countdown-card {
    background: var(--web-primary-10);
}

.flash-deal-text {
    color: var(--web-primary);
}

.countdown-background {
    background: var(--web-primary);
}

.czi-arrow-left {
    color: var(--web-primary);
    background: var(--web-primary-10);
}

.czi-arrow-right {
    color: var(--web-primary);
    background: var(--web-primary-10);
}

.flash-deals-background-image {
    background: var(--web-primary-10);
}

.feature-product .czi-arrow-left {
    color: var(--web-primary);
    background: var(--web-primary-10);
}

.feature-product .czi-arrow-right {
    color: var(--web-primary);
    background: var(--web-primary-10);
    font-size: 12px;
}

/* =============================================================
   3STORE 2026 — Modern homepage intro
   Hero + benefits + categories + brands
   ============================================================= */
.home-modern-intro {
    --home-green: #24C55B;
    --home-deep-green: #1B9544;
    --home-dark: #050505;
    --home-text: #20262b;
    --home-muted: #6B7280;
    --home-border: #E5E7EB;
    --home-surface: #f7faf8;
    padding: 18px 0 2px;
    overflow: hidden;
}

.home-modern-intro .container {
    max-width: 1380px;
}

.home-modern-hero-card {
    position: relative;
    overflow: hidden;
    border: 1px solid #e7eee9;
    border-radius: 22px;
    background: #f6faf7;
    box-shadow: 0 18px 50px rgba(15, 55, 31, .075);
}

.home-modern-hero-slider,
.home-modern-hero-slider .owl-stage-outer,
.home-modern-hero-slider .owl-stage,
.home-modern-hero-slider .owl-item,
.home-modern-hero-link {
    width: 100%;
}

.home-modern-hero-link {
    display: block;
    overflow: hidden;
}

.home-modern-hero-image {
    display: block;
    width: 100% !important;
    height: 430px !important;
    min-height: 430px !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: 22px;
}

.home-modern-hero-slider .owl-dots {
    position: absolute;
    inset-inline-start: 50%;
    bottom: 17px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 7px;
}

.home-modern-hero-slider .owl-dot span {
    width: 7px !important;
    height: 7px !important;
    margin: 0 !important;
    background: rgba(27, 149, 68, .28) !important;
    transition: width .25s ease, background-color .25s ease;
}

.home-modern-hero-slider .owl-dot.active span {
    width: 28px !important;
    border-radius: 999px !important;
    background: var(--home-deep-green) !important;
}

.home-modern-hero-slider .owl-nav {
    width: 100% !important;
    inset-inline-start: 0 !important;
    left: auto !important;
    right: auto !important;
    top: 50%;
    position: absolute;
    pointer-events: none;
}

.home-modern-hero-slider .owl-nav button {
    position: absolute;
    top: 0;
    transform: translateY(-50%);
    width: 42px !important;
    height: 42px !important;
    border: 1px solid rgba(255,255,255,.8) !important;
    background: rgba(255,255,255,.92) !important;
    color: var(--home-deep-green) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.10);
    pointer-events: auto;
}

.home-modern-hero-slider .owl-prev {
    inset-inline-start: 18px;
}

.home-modern-hero-slider .owl-next {
    inset-inline-end: 18px;
}

.home-modern-benefits-container {
    margin-top: 14px;
}

.home-modern-benefits {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    padding: 8px 10px;
    border: 1px solid #e8efea;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: none !important;
    filter: none !important;
}

.home-modern-benefits-container,
.home-modern-benefits,
.home-modern-benefits *,
.home-modern-benefits-container::before,
.home-modern-benefits-container::after,
.home-modern-benefits::before,
.home-modern-benefits::after {
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}

.home-modern-benefit-item {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 12px 18px;
    color: var(--home-text);
}

.home-modern-benefit-item:not(:last-child) {
    border-inline-end: 1px solid #edf2ee;
}

.home-modern-benefit-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #effaf2;
}

.home-modern-benefit-icon img {
    width: 25px;
    height: 25px;
    object-fit: contain;
}

.home-modern-benefit-content {
    min-width: 0;
    font-size: 14px;
    line-height: 1.55;
    font-weight: 500;
}

.home-modern-categories-container,
.home-modern-brands-container {
    margin-top: 20px;
}

.home-modern-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 13px;
}

.home-modern-section-heading h2 {
    margin: 0;
    color: var(--home-text);
    font-size: 20px;
    line-height: 1.35;
    font-weight: 600;
    letter-spacing: 0;
}

.home-modern-view-all {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--home-deep-green) !important;
    font-size: 13px;
    font-weight: 500;
}

.home-modern-view-all i {
    font-size: 11px;
    transition: transform .2s ease;
}

.home-modern-view-all:hover i {
    transform: translateX(-3px);
}

html[dir="ltr"] .home-modern-view-all:hover i {
    transform: translateX(3px);
}

.home-modern-category-grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 12px;
}

.home-modern-category-card {
    min-width: 0;
    min-height: 138px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 13px 10px 12px;
    overflow: hidden;
    border: 1px solid #e7eee9;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6faf7 100%);
    color: var(--home-text) !important;
    box-shadow: 0 8px 24px rgba(14, 56, 29, .04);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.home-modern-category-card::before {
    content: "";
    position: absolute;
    width: 92px;
    height: 92px;
    inset-inline-end: -50px;
    top: -48px;
    border-radius: 50%;
    background: rgba(36, 197, 91, .08);
}

.home-modern-category-card:hover {
    transform: translateY(-5px);
    border-color: rgba(36, 197, 91, .48);
    box-shadow: 0 16px 34px rgba(27, 149, 68, .11);
}

.home-modern-category-image {
    width: 72px;
    height: 72px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 13px;
    background: #ffffff;
}

.home-modern-category-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 3px;
    transition: transform .3s ease;
}

.home-modern-category-card:hover .home-modern-category-image img {
    transform: scale(1.07);
}

.home-modern-category-title {
    width: 100%;
    min-height: 35px;
    color: var(--home-text);
    text-align: center;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 500;
}

.home-modern-category-arrow {
    position: absolute;
    inset-inline-start: 9px;
    bottom: 9px;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #ecf8f0;
    color: var(--home-deep-green);
    opacity: 0;
    transform: translateX(4px);
    transition: opacity .2s ease, transform .2s ease;
}

.home-modern-category-card:hover .home-modern-category-arrow {
    opacity: 1;
    transform: translateX(0);
}

.home-modern-brands-card {
    padding: 16px 18px 15px;
    border: 1px solid rgba(22, 101, 52, .08);
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .96) 0%,
        rgba(247, 252, 248, .94) 100%);
    box-shadow: 0 2px 10px rgba(22, 101, 52, .035);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow: hidden;
}

.home-modern-brands-heading {
    margin-bottom: 10px;
    padding-inline: 2px;
}

.home-modern-brands-slider {
    padding: 4px 32px;
}

.home-modern-brand-slide {
    display: flex;
    justify-content: center;
    align-items: stretch;
    height: 100%;
    padding: 5px 3px;
}

.home-modern-intro .home-modern-brands-card .home-modern-brand-item {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    max-width: 116px !important;
    height: 58px !important;
    aspect-ratio: auto !important;
    border: 1px solid rgba(22, 101, 52, .08) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .92) !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.home-modern-intro .home-modern-brands-card .home-modern-brand-item:hover {
    border-color: rgba(27, 149, 68, .20) !important;
    box-shadow: 0 2px 8px rgba(22, 101, 52, .04) !important;
    transform: translateY(-2px);
}

.home-modern-intro .home-modern-brands-card .home-modern-brand-item img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    object-position: center;
    aspect-ratio: auto !important;
    border-radius: 13px !important;
    filter: none !important;
    opacity: 1 !important;
    image-rendering: -webkit-optimize-contrast;
    backface-visibility: hidden;
}

.home-modern-brands-slider .owl-nav {
    width: 100% !important;
    inset-inline-start: 0 !important;
    left: auto !important;
    right: auto !important;
    top: 50%;
    position: absolute;
}

.home-modern-brands-slider .owl-nav button {
    top: 0;
    display: block !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    border: 1px solid rgba(22, 101, 52, .12) !important;
    border-radius: 10px !important;
    background-color: rgba(255, 255, 255, .96) !important;
    background-image: var(--brand-nav-icon) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 19px 19px !important;
    box-shadow: 0 5px 14px rgba(22, 101, 52, .08);
    transform: translateY(-50%);
    appearance: none;
    transition: border-color .2s ease, background-color .2s ease,
                box-shadow .2s ease, transform .2s ease;
}

.home-modern-brands-slider .owl-nav button > *,
.home-modern-brands-slider .owl-nav button::before,
.home-modern-brands-slider .owl-nav button::after {
    display: none !important;
    content: none !important;
}

.home-modern-brands-slider .owl-nav button:hover {
    border-color: var(--home-deep-green) !important;
    background-color: var(--home-deep-green) !important;
    background-image: var(--brand-nav-hover-icon) !important;
    box-shadow: 0 7px 18px rgba(22, 101, 52, .18);
    transform: translateY(-50%) scale(1.04);
}

.home-modern-brands-slider .owl-prev {
    --brand-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --brand-nav-hover-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    position: absolute;
    inset-inline-start: 0;
}

.home-modern-brands-slider .owl-next {
    --brand-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --brand-nav-hover-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    position: absolute;
    inset-inline-end: 0;
}

@media (max-width: 1199.98px) {
    .home-modern-hero-image {
        height: 360px !important;
        min-height: 360px !important;
    }

    .home-modern-category-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .home-modern-category-card {
        min-height: 132px;
    }
}

@media (max-width: 991.98px) {
    .home-modern-intro {
        padding-top: 14px;
    }

    .home-modern-hero-card,
    .home-modern-hero-image {
        border-radius: 17px;
    }

    .home-modern-hero-image {
        height: 300px !important;
        min-height: 300px !important;
    }

    .home-modern-benefits {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
    }

    .home-modern-benefit-item:nth-child(2) {
        border-inline-end: 0;
    }

    .home-modern-benefit-item:nth-child(-n/**/+2) {
        border-bottom: 1px solid #edf2ee;
    }

    .home-modern-brands-card {
        padding: 14px 14px 13px;
        border-radius: 19px;
    }

    .home-modern-brands-slider {
        padding-inline: 22px;
    }

    .home-modern-brand-slide {
        padding: 4px 2px;
    }

    .home-modern-intro .home-modern-brands-card .home-modern-brand-item {
        max-width: 108px !important;
        height: 54px !important;
        padding: 0 !important;
    }

    .home-modern-intro .home-modern-brands-card .home-modern-brand-item img {
        max-height: 100% !important;
    }
}

@media (max-width: 767.98px) {
    .home-modern-intro {
        padding-top: 10px;
    }

    .home-modern-intro .container {
        padding-inline: 10px;
    }

    .home-modern-hero-card,
    .home-modern-hero-image {
        border-radius: 13px;
    }

    .home-modern-hero-image {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        background: #f6faf7;
    }

    .home-modern-hero-slider .owl-nav {
        display: none !important;
    }

    .home-modern-hero-slider .owl-dots {
        bottom: 9px;
    }

    .home-modern-benefits-container {
        margin-top: 10px;
    }

    .home-modern-benefits {
        padding: 4px;
        border-radius: 13px;
    }

    .home-modern-benefit-item {
        gap: 8px;
        padding: 10px 8px;
        justify-content: flex-start;
    }

    .home-modern-benefit-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 9px;
    }

    .home-modern-benefit-icon img {
        width: 21px;
        height: 21px;
    }

    .home-modern-benefit-content {
        font-size: 11px;
        line-height: 1.45;
    }

    .home-modern-categories-container,
    .home-modern-brands-container {
        margin-top: 15px;
    }

    .home-modern-section-heading {
        margin-bottom: 9px;
    }

    .home-modern-section-heading h2 {
        font-size: 17px;
    }

    .home-modern-view-all {
        font-size: 12px;
    }

    .home-modern-category-grid {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 2px 1px 10px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        overscroll-behavior-inline: contain;
    }

    .home-modern-category-grid::-webkit-scrollbar {
        display: none;
    }

    .home-modern-category-card {
        flex: 0 0 112px;
        min-height: 124px;
        border-radius: 13px;
        padding: 10px 7px;
        scroll-snap-align: start;
    }

    .home-modern-category-image {
        width: 64px;
        height: 64px;
        border-radius: 11px;
    }

    .home-modern-category-title {
        min-height: 32px;
        font-size: 12px;
    }

    .home-modern-category-arrow {
        display: none;
    }

    .home-modern-brands-card {
        padding: 12px 10px 11px;
        border-radius: 18px;
    }

    .home-modern-brands-slider {
        padding: 3px 0;
    }

    .home-modern-intro .home-modern-brands-card .home-modern-brand-item {
        max-width: 100px !important;
        height: 50px !important;
        border-radius: 14px !important;
        padding: 0 !important;
    }

    .home-modern-intro .home-modern-brands-card .home-modern-brand-item img {
        max-height: 100% !important;
    }

    .home-modern-brands-slider .owl-nav {
        display: none !important;
    }
}

@media (max-width: 399.98px) {
    .home-modern-benefit-item {
        align-items: flex-start;
    }

    .home-modern-benefit-content {
        font-size: 10.5px;
    }

    .home-modern-category-card {
        flex-basis: 104px;
    }
}

/* =============================================================
   FINAL FIX — Brands carousel navigation
   Equal spacing, correct RTL/LTR placement, both arrows visible.
   Keep this block at the END of the stylesheet.
   ============================================================= */

/* Give the carousel the same protected space on both sides */
.home-modern-brands-slider {
    position: relative !important;
    box-sizing: border-box !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
}

/* Navigation layer spans the carousel equally from left to right */
.home-modern-brands-slider .owl-nav,
.home-modern-brands-slider .owl-nav.disabled {
    position: absolute !important;
    z-index: 30 !important;
    top: 50% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

/* Reset Owl/theme positioning completely */
.home-modern-brands-slider .owl-nav .owl-prev,
.home-modern-brands-slider .owl-nav .owl-next {
    position: absolute !important;
    z-index: 31 !important;
    top: 50% !important;
    bottom: auto !important;
    display: grid !important;
    place-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;

    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(22, 101, 52, .13) !important;
    border-radius: 11px !important;
    background-color: rgba(255, 255, 255, .98) !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 19px 19px !important;
    box-shadow: 0 5px 15px rgba(22, 101, 52, .10) !important;

    line-height: 0 !important;
    font-size: 0 !important;
    appearance: none !important;
    transform: translateY(-50%) !important;
    pointer-events: auto !important;
}

/* Physical placement: always exactly equal on both sides */
.home-modern-brands-slider .owl-nav .owl-prev {
    left: 4px !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    --brand-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --brand-nav-hover-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-image: var(--brand-nav-icon) !important;
}

.home-modern-brands-slider .owl-nav .owl-next {
    right: 4px !important;
    left: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    --brand-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --brand-nav-hover-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-image: var(--brand-nav-icon) !important;
}

/* Remove any text/icons injected by Owl or the theme */
.home-modern-brands-slider .owl-nav .owl-prev > *,
.home-modern-brands-slider .owl-nav .owl-next > *,
.home-modern-brands-slider .owl-nav .owl-prev::before,
.home-modern-brands-slider .owl-nav .owl-prev::after,
.home-modern-brands-slider .owl-nav .owl-next::before,
.home-modern-brands-slider .owl-nav .owl-next::after {
    display: none !important;
    content: none !important;
}

/* Keep disabled edge arrows visible, but communicate disabled state subtly */
.home-modern-brands-slider .owl-nav .owl-prev.disabled,
.home-modern-brands-slider .owl-nav .owl-next.disabled {
    display: grid !important;
    visibility: visible !important;
    opacity: .42 !important;
    cursor: default !important;
}

/* Hover only on an enabled arrow */
.home-modern-brands-slider .owl-nav .owl-prev:not(.disabled):hover,
.home-modern-brands-slider .owl-nav .owl-next:not(.disabled):hover {
    border-color: var(--home-deep-green) !important;
    background-color: var(--home-deep-green) !important;
    background-image: var(--brand-nav-hover-icon) !important;
    box-shadow: 0 8px 20px rgba(22, 101, 52, .19) !important;
    transform: translateY(-50%) scale(1.04) !important;
}

/* The logos may not overlap the arrow area */
.home-modern-brands-slider .owl-stage-outer {
    position: relative !important;
    z-index: 1 !important;
    overflow: hidden !important;
}

/* Tablet */
@media (max-width: 991.98px) {
    .home-modern-brands-slider {
        padding-left: 44px !important;
        padding-right: 44px !important;
    }

    .home-modern-brands-slider .owl-nav .owl-prev {
        left: 3px !important;
    }

    .home-modern-brands-slider .owl-nav .owl-next {
        right: 3px !important;
    }
}

/* Mobile: keep existing swipe behavior and hide arrows */
@media (max-width: 767.98px) {
    .home-modern-brands-slider {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .home-modern-brands-slider .owl-nav,
    .home-modern-brands-slider .owl-nav.disabled {
        display: none !important;
    }
}

/* Categories container uses the same visual system as the brands section. */
.home-modern-categories-card {
    padding: 16px 18px 17px;
    border: 1px solid rgba(22, 101, 52, .08);
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .96) 0%, rgba(247, 252, 248, .94) 100%);
    box-shadow: 0 8px 28px rgba(22, 101, 52, .07);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow: hidden;
}

.home-modern-categories-heading {
    margin-bottom: 12px;
    padding-inline: 2px;
}

.home-modern-categories-card .home-modern-category-grid {
    gap: 12px;
}

.home-modern-categories-card .home-modern-category-card {
    min-height: 142px;
    border-color: rgba(22, 101, 52, .08);
    background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(248,252,249,.96) 100%);
    box-shadow: 0 4px 14px rgba(22, 101, 52, .05);
}

.home-modern-categories-card .home-modern-category-card:hover {
    border-color: rgba(27, 149, 68, .28);
    box-shadow: 0 10px 24px rgba(22, 101, 52, .10);
}

@media (max-width: 991.98px) {
    .home-modern-categories-card {
        padding: 14px 14px 15px;
        border-radius: 19px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-categories-card {
        padding: 12px 10px 12px;
        border-radius: 18px;
    }

    .home-modern-categories-heading {
        margin-bottom: 10px;
    }

    .home-modern-categories-card .home-modern-category-grid {
        margin-inline: -2px;
        padding-inline: 2px;
    }
}

/* =============================================================
   FINAL — Categories showcase carousel
   Added on top of the latest home.css without removing prior work.
   ============================================================= */

.home-modern-categories-card {
    padding: 16px 18px 17px;
    border: 1px solid rgba(22, 101, 52, .08);
    border-radius: 20px;
    background:
        linear-gradient(
            135deg,
            rgba(255, 255, 255, .96) 0%,
            rgba(247, 252, 248, .94) 100%
        );
    box-shadow: 0 8px 28px rgba(22, 101, 52, .07);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    overflow: hidden;
}

.home-modern-categories-heading {
    margin-bottom: 14px;
    padding-inline: 2px;
}

.home-modern-category-card--showcase {
    width: 100%;
    min-width: 0;
    height: 100%;
    min-height: 292px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .09);
    border-radius: 18px;
    background: #ffffff;
    color: var(--home-text) !important;
    box-shadow: 0 6px 20px rgba(22, 101, 52, .05);
    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease;
}

.home-modern-category-card--showcase::before {
    display: none !important;
    content: none !important;
}

.home-modern-category-visual {
    position: relative;
    display: block;
    width: 100%;
    min-height: 226px;
    padding: 14px;
    overflow: hidden;
    border-radius: 18px 18px 0 0;
    background:
        radial-gradient(
            circle at 8% 11%,
            rgba(43, 174, 96, .10) 0,
            rgba(43, 174, 96, .10) 23%,
            transparent 24%
        ),
        radial-gradient(
            circle at 87% 18%,
            rgba(43, 174, 96, .10) 0,
            rgba(43, 174, 96, .10) 7%,
            transparent 8%
        ),
        linear-gradient(180deg, #ffffff 0%, #fbfdfb 100%);
}

.home-modern-category-orb {
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    background: rgba(42, 185, 90, .10);
}

.home-modern-category-orb--one {
    width: 104px;
    height: 104px;
    inset-inline-start: -44px;
    top: -35px;
}

.home-modern-category-orb--two {
    width: 27px;
    height: 27px;
    inset-inline-end: 28px;
    top: 28px;
}

.home-modern-category-dots {
    position: absolute;
    z-index: 0;
    top: 16px;
    inset-inline-end: 18px;
    width: 66px;
    height: 42px;
    opacity: .30;
    background-image:
        radial-gradient(rgba(45, 126, 76, .38) 1px, transparent 1px);
    background-size: 8px 8px;
}

.home-modern-category-curve {
    position: absolute;
    z-index: 0;
    inset-inline: 16px;
    top: 45px;
    height: 130px;
    border-radius: 50%;
    border: 1.4px solid transparent;
    border-top-color: rgba(60, 180, 104, .52);
    border-inline-start-color: rgba(60, 180, 104, .25);
    transform: rotate(-10deg);
}

.home-modern-category-card--showcase .home-modern-category-image {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 198px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    border-radius: 0;
    background: transparent;
}

.home-modern-category-card--showcase .home-modern-category-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 0;
    transform: none !important;
    transition: none !important;
}

.home-modern-category-card--showcase:hover
.home-modern-category-image img {
    transform: none !important;
}

.home-modern-category-card--showcase .home-modern-category-title {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 62px;
    margin: 0;
    padding: 9px 14px 17px;
    color: var(--home-text);
    text-align: center;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 600;
}

@media (max-width: 1199.98px) {
    .home-modern-category-card--showcase {
        min-height: 270px;
    }

    .home-modern-category-visual {
        min-height: 207px;
    }

    .home-modern-category-card--showcase .home-modern-category-image {
        height: 180px;
    }
}

@media (max-width: 991.98px) {
    .home-modern-categories-card {
        padding: 14px 14px 15px;
        border-radius: 19px;
    }

    .home-modern-category-card--showcase {
        min-height: 255px;
    }

    .home-modern-category-visual {
        min-height: 192px;
    }

    .home-modern-category-card--showcase .home-modern-category-image {
        height: 165px;
    }

    .home-modern-category-card--showcase .home-modern-category-title {
        font-size: 14px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-categories-card {
        padding: 12px 10px 12px;
        border-radius: 18px;
    }

    .home-modern-categories-heading {
        margin-bottom: 10px;
    }

    .home-modern-category-card--showcase {
        min-height: 220px;
        border-radius: 15px;
    }

    .home-modern-category-visual {
        min-height: 164px;
        padding: 10px;
        border-radius: 15px 15px 0 0;
    }

    .home-modern-category-card--showcase .home-modern-category-image {
        height: 140px;
    }

    .home-modern-category-card--showcase .home-modern-category-title {
        min-height: 52px;
        padding: 8px 9px 13px;
        font-size: 13px;
    }
}

/* =============================================================
   FINAL — Use uploaded category image only
   No generated shapes/background behind the category image.
   ============================================================= */

.home-modern-category-card--showcase {
    width: 100%;
    min-width: 0;
    height: 100%;
    min-height: 290px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .09);
    border-radius: 18px;
    background: #ffffff;
    color: var(--home-text) !important;
    box-shadow: 0 6px 20px rgba(22, 101, 52, .05);
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.home-modern-category-card--showcase:hover {
    transform: translateY(-4px);
    border-color: rgba(27, 149, 68, .26);
    box-shadow: 0 14px 30px rgba(22, 101, 52, .09);
}

.home-modern-category-card--showcase::before,
.home-modern-category-card--showcase::after,
.home-modern-category-visual,
.home-modern-category-orb,
.home-modern-category-dots,
.home-modern-category-curve {
    display: none !important;
    content: none !important;
}

.home-modern-category-image-wrap {
    display: block;
    width: 100%;
    height: 230px;
    padding: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 18px 18px 0 0;
    background: #ffffff;
}

.home-modern-category-full-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    transform: none !important;
    transition: none !important;
}

.home-modern-category-card--showcase:hover .home-modern-category-full-image {
    transform: none !important;
}

.home-modern-category-card--showcase .home-modern-category-title {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 58px;
    margin: 0;
    padding: 10px 14px 16px;
    color: var(--home-text);
    text-align: center;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 600;
}

.home-modern-categories-slider {
    padding: 2px 0 5px !important;
}

.home-modern-categories-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-categories-slider .owl-item {
    float: none;
    display: flex;
    height: auto;
}

.home-modern-category-slide {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 2px 0;
}

.home-modern-categories-slider .owl-nav,
.home-modern-categories-slider .owl-dots {
    display: none !important;
}

@media (max-width: 1199.98px) {
    .home-modern-category-card--showcase {
        min-height: 270px;
    }

    .home-modern-category-image-wrap {
        height: 210px;
    }
}

@media (max-width: 991.98px) {
    .home-modern-category-card--showcase {
        min-height: 250px;
    }

    .home-modern-category-image-wrap {
        height: 190px;
    }

    .home-modern-category-card--showcase .home-modern-category-title {
        font-size: 14px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-category-card--showcase {
        min-height: 215px;
        border-radius: 15px;
    }

    .home-modern-category-image-wrap {
        height: 155px;
        border-radius: 15px 15px 0 0;
    }

    .home-modern-category-card--showcase .home-modern-category-title {
        min-height: 50px;
        padding: 8px 9px 13px;
        font-size: 13px;
    }
}

/* Disable category hover effects completely */
.home-modern-category-card--showcase,
.home-modern-category-card--showcase:hover,
.home-modern-category-card--showcase:focus,
.home-modern-category-card--showcase:active {
    box-shadow: none !important;
    background: #ffffff !important;
    border-color: rgba(22, 101, 52, .09) !important;
}

.home-modern-category-card--showcase:hover .home-modern-category-full-image,
.home-modern-category-card--showcase:hover .home-modern-category-image img {
    filter: none !important;
}

/* =============================================================
   FINAL — Hover-only arrows for hero, categories and brands
   They disappear immediately when the mouse leaves the section.
   ============================================================= */

.home-modern-hero-card,
.home-modern-categories-carousel-wrap,
.home-modern-brands-carousel-wrap {
    position: relative;
}

/* Owl's native controls remain disabled for these custom sliders */
.home-modern-hero-slider .owl-nav,
.home-modern-categories-slider .owl-nav,
.home-modern-brands-slider .owl-nav {
    display: none !important;
}

/* Shared control base */
.home-modern-slider-control,
.home-modern-brand-control {
    position: absolute;
    z-index: 80;
    top: 50%;
    display: grid;
    place-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Visible only while pointer is inside its exact section */
.home-modern-hero-card:hover .home-modern-hero-control,
.home-modern-categories-carousel-wrap:hover .home-modern-category-control,
.home-modern-brands-carousel-wrap:hover .home-modern-brand-control {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Guaranteed hide after mouse leaves, even when a button was clicked */
.home-modern-hero-card:not(:hover) .home-modern-hero-control,
.home-modern-categories-carousel-wrap:not(:hover) .home-modern-category-control,
.home-modern-brands-carousel-wrap:not(:hover) .home-modern-brand-control {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.home-modern-hero-control--left,
.home-modern-category-control--left,
.home-modern-brand-control--left {
    left: 8px;
    right: auto;
}

.home-modern-hero-control--right,
.home-modern-category-control--right,
.home-modern-brand-control--right {
    right: 8px;
    left: auto;
}

.home-modern-hero-control--left {
    left: 18px;
}

.home-modern-hero-control--right {
    right: 18px;
}

@media (max-width: 767.98px) {
    .home-modern-category-control,
    .home-modern-brand-control {
        display: none !important;
    }

    .home-modern-hero-control {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

/* =============================================================
   FINAL — Mobile header icons + category carousel proportions
   Responsive-only overrides; desktop remains unchanged.
   ============================================================= */

@media (max-width: 767.98px) {
    /* Match mobile menu/search icon appearance with desktop icons */
    .modern-store-header .navbar-toggler .store-mobile-menu-icon,
    .modern-store-header .open-search-form-mobile .store-outline-icon {
        width: 22px !important;
        height: 22px !important;
        display: block;
        color: var(--header-ink, #20262b);
    }

    .modern-store-header .navbar-toggler,
    .modern-store-header .open-search-form-mobile .navbar-tool-icon-box {
        display: grid !important;
        place-items: center !important;
    }

    /* Remove old fixed-width rules that made category cards too narrow */
    .home-modern-categories-slider .owl-item {
        min-width: 0 !important;
        padding: 0 !important;
    }

    .home-modern-category-slide {
        width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
    }

    .home-modern-category-card--showcase {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
        margin: 0 !important;
        min-height: 218px !important;
    }

    .home-modern-category-image-wrap {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1 !important;
    }

    .home-modern-category-full-image {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .home-modern-category-card--showcase .home-modern-category-title {
        min-height: 48px !important;
        padding: 8px 7px 11px !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
    }
}

@media (max-width: 399.98px) {
    .home-modern-category-card--showcase {
        min-height: 205px !important;
    }

    .home-modern-category-card--showcase .home-modern-category-title {
        font-size: 11.5px !important;
    }
}

/* =============================================================
   3STORE 2026 — Modern Flash Deals
   ============================================================= */

.home-modern-flash-section {
    margin-top: 20px;
}

.home-modern-flash-section .container {
    max-width: 1380px;
}

.home-modern-flash-card {
    display: grid;
    grid-template-columns: minmax(255px, 29%) minmax(0, 1fr);
    min-height: 390px;
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .08);
    border-radius: 20px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.97) 0%, rgba(247,252,248,.96) 100%);
    box-shadow: 0 8px 28px rgba(22, 101, 52, .07);
}

.home-modern-flash-offer {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 15% 15%, rgba(36,197,91,.28), transparent 34%),
        linear-gradient(145deg, #0e2519 0%, #123d27 52%, #0f2d1e 100%);
}

.home-modern-flash-offer::before,
.home-modern-flash-offer::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 50%;
}

.home-modern-flash-offer::before {
    width: 220px;
    height: 220px;
    inset-inline-end: -95px;
    top: -105px;
}

.home-modern-flash-offer::after {
    width: 150px;
    height: 150px;
    inset-inline-start: -75px;
    bottom: -85px;
}

.home-modern-flash-offer-content {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 34px 28px;
    text-align: start;
}

.home-modern-flash-eyebrow {
    align-self: flex-start;
    display: inline-flex;
    margin-bottom: 12px;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    color: #bdf3cf;
    font-size: 11px;
    font-weight: 600;
}

.home-modern-flash-title {
    margin: 0 0 10px;
    color: #fff;
    font-size: 28px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-flash-description {
    margin: 0 0 22px;
    color: rgba(255,255,255,.72);
    font-size: 13px;
    line-height: 1.75;
}

.home-modern-flash-countdown .cz-countdown {
    display: grid;
    grid-template-columns: repeat(7, auto);
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    flex-wrap: nowrap;
}

.home-modern-flash-time-unit {
    min-width: 52px;
    min-height: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    border: 1px solid rgba(255,255,255,.10) !important;
    border-radius: 11px;
    background: rgba(255,255,255,.09);
    color: #fff;
}

.home-modern-flash-time-unit .cz-countdown-value {
    text-shadow: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.home-modern-flash-time-unit,
.home-modern-flash-time-unit .cz-countdown-value,
.home-modern-flash-countdown .cz-countdown-value {
    text-shadow: none !important;
    box-shadow: none !important;
    filter: none !important;
}

.home-modern-flash-time-unit .cz-countdown-value {
    color: #fff !important;
    font-size: 19px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
}

.home-modern-flash-time-unit .cz-countdown-text {
    color: rgba(255,255,255,.68);
    font-size: 9px;
    line-height: 1.2;
}

.home-modern-flash-time-separator {
    color: rgba(255,255,255,.42);
    font-size: 18px;
    font-weight: 700;
}

.home-modern-flash-progress {
    height: 4px;
    margin-top: 18px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255,255,255,.13);
}

.home-modern-flash-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #24c55b, #65de91);
}

.home-modern-flash-button {
    align-self: flex-start;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 22px;
    padding: 0 18px;
    border-radius: 11px;
    background: #20b957;
    color: #fff !important;
    font-size: 13px;
    font-weight: 600;
    box-shadow: 0 9px 22px rgba(32,185,87,.22);
    transition: transform .2s ease, background-color .2s ease;
}

.home-modern-flash-button:hover {
    background: #1b9544;
    transform: translateY(-2px);
}

.home-modern-flash-button svg {
    width: 17px;
    height: 17px;
}

.home-modern-flash-products {
    min-width: 0;
    padding: 24px 22px 22px;
}

.home-modern-flash-products-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 15px;
}

.home-modern-flash-products-heading h3 {
    margin: 0 0 4px;
    color: #20262b;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 700;
}

.home-modern-flash-products-heading p {
    margin: 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.55;
}

.home-modern-flash-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #1b9544 !important;
    font-size: 12px;
    font-weight: 600;
}

.home-modern-flash-carousel-wrap {
    position: relative;
}

.home-modern-flash-slider {
    padding: 2px 42px 4px;
}

.home-modern-flash-slider .owl-stage {
    display: flex;
}

.home-modern-flash-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-flash-product-slide {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 2px;
}

.home-modern-flash-product-slide > * {
    width: 100%;
}

.home-modern-flash-slider .feature-product,
.home-modern-flash-slider .product-card {
    height: 100%;
    overflow: hidden;
    border: 1px solid rgba(22,101,52,.08);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(22,101,52,.045);
}

.home-modern-flash-control {
    position: absolute;
    z-index: 10;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(22,101,52,.13);
    border-radius: 11px;
    background: rgba(255,255,255,.98);
    color: #1b9544;
    box-shadow: 0 5px 15px rgba(22,101,52,.10);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-50%) scale(.92);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease,
                background-color .18s ease, color .18s ease;
}

.home-modern-flash-control svg {
    width: 19px;
    height: 19px;
}

.home-modern-flash-control--left {
    left: 3px;
}

.home-modern-flash-control--right {
    right: 3px;
}

.home-modern-flash-carousel-wrap:hover .home-modern-flash-control {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(-50%) scale(1);
}

.home-modern-flash-control:hover {
    background: #1b9544;
    color: #fff;
    transform: translateY(-50%) scale(1.04);
}

.home-modern-flash-slider .owl-nav,
.home-modern-flash-slider .owl-dots {
    display: none !important;
}

.home-modern-flash-mobile {
    display: none;
}

.home-modern-flash-empty {
    min-height: 270px;
    display: grid;
    place-items: center;
    color: #6b7280;
    font-size: 14px;
}

@media (max-width: 1199.98px) {
    .home-modern-flash-card {
        grid-template-columns: minmax(245px, 31%) minmax(0, 1fr);
    }

    .home-modern-flash-offer-content {
        padding-inline: 22px;
    }

    .home-modern-flash-time-unit {
        min-width: 46px;
    }
}

@media (max-width: 991.98px) {
    .home-modern-flash-card {
        grid-template-columns: 1fr;
    }

    .home-modern-flash-offer-content {
        padding: 25px 24px;
    }

    .home-modern-flash-description {
        max-width: 620px;
    }

    .home-modern-flash-button {
        margin-top: 18px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-flash-section {
        margin-top: 15px;
    }

    .home-modern-flash-section .container {
        padding-inline: 10px;
    }

    .home-modern-flash-card {
        border-radius: 18px;
    }

    .home-modern-flash-offer-content {
        padding: 22px 16px;
    }

    .home-modern-flash-title {
        font-size: 21px;
    }

    .home-modern-flash-description {
        margin-bottom: 16px;
        font-size: 12px;
    }

    .home-modern-flash-countdown .cz-countdown {
        justify-content: center;
        gap: 5px;
    }

    .home-modern-flash-time-unit {
        min-width: 48px;
        min-height: 54px;
    }

    .home-modern-flash-time-unit .cz-countdown-value {
        font-size: 17px !important;
    }

    .home-modern-flash-button {
        align-self: center;
    }

    .home-modern-flash-products {
        padding: 18px 12px 15px;
    }

    .home-modern-flash-products-heading {
        margin-bottom: 12px;
    }

    .home-modern-flash-products-heading h3 {
        font-size: 17px;
    }

    .home-modern-flash-products-heading p {
        display: none;
    }

    .home-modern-flash-carousel-wrap {
        display: none;
    }

    .home-modern-flash-mobile {
        display: block;
    }

    .home-modern-flash-mobile .owl-stage {
        display: flex;
    }

    .home-modern-flash-mobile .owl-item {
        display: flex;
        height: auto;
    }

    .home-modern-flash-mobile .owl-nav,
    .home-modern-flash-mobile .owl-dots {
        display: none !important;
    }
}

@media (max-width: 399.98px) {
    .home-modern-flash-time-unit {
        min-width: 43px;
    }

    .home-modern-flash-time-separator {
        font-size: 14px;
    }
}

/* =============================================================
   FINAL — Flash Deals light theme + unified View All size
   ============================================================= */

.home-modern-flash-offer {
    color: #20262b !important;
    background:
        radial-gradient(circle at 14% 14%, rgba(36, 197, 91, .14), transparent 34%),
        linear-gradient(145deg, #eefaf2 0%, #f7fcf9 52%, #edf8f1 100%) !important;
    border-inline-start: 1px solid rgba(22, 101, 52, .08);
}

.home-modern-flash-offer::before,
.home-modern-flash-offer::after {
    border-color: rgba(27, 149, 68, .09) !important;
}

.home-modern-flash-eyebrow {
    border-color: rgba(27, 149, 68, .14) !important;
    background: rgba(27, 149, 68, .07) !important;
    color: #1b9544 !important;
}

.home-modern-flash-title {
    color: #20262b !important;
}

.home-modern-flash-description {
    color: #647068 !important;
}

.home-modern-flash-time-unit {
    border-color: rgba(27, 149, 68, .12) !important;
    background: rgba(255, 255, 255, .92) !important;
    color: #20262b !important;
    box-shadow: 0 5px 14px rgba(22, 101, 52, .05);
}

.home-modern-flash-time-separator {
    color: rgba(27, 149, 68, .48) !important;
}

.home-modern-flash-progress {
    background: rgba(27, 149, 68, .10) !important;
}

.home-modern-flash-progress span {
    background: linear-gradient(90deg, #1b9544, #45d87c) !important;
}

/* Same size and visual weight as the upper View All link */
.home-modern-flash-button {
    min-height: auto !important;
    margin-top: 18px !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #1b9544 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    font-weight: 600 !important;
    box-shadow: none !important;
    gap: 6px !important;
}

.home-modern-flash-button:hover {
    background: transparent !important;
    color: #147a37 !important;
    transform: none !important;
}

.home-modern-flash-button svg {
    width: 13px !important;
    height: 13px !important;
}

@media (max-width: 767.98px) {
    .home-modern-flash-button {
        align-self: flex-start !important;
        margin-top: 16px !important;
        font-size: 12px !important;
    }
}

/* =============================================================
   FINAL — Flash Deals clean glass theme
   Replaces the previous mint circles with a cleaner premium look.
   ============================================================= */

.home-modern-flash-offer {
    position: relative;
    overflow: hidden;
    color: #20262b !important;
    background:
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(248,252,249,.98) 58%, rgba(241,248,244,.98) 100%) !important;
    border-inline-start: 1px solid rgba(27,149,68,.08);
}

/* remove the large circles from the previous version */
.home-modern-flash-offer::before,
.home-modern-flash-offer::after {
    content: "" !important;
    position: absolute !important;
    pointer-events: none !important;
}

/* subtle diagonal light shape */
.home-modern-flash-offer::before {
    width: 180px !important;
    height: 520px !important;
    top: -145px !important;
    inset-inline-end: 28px !important;
    border: 0 !important;
    border-radius: 40px !important;
    background: linear-gradient(
        180deg,
        rgba(27,149,68,.08) 0%,
        rgba(27,149,68,.025) 100%
    ) !important;
    transform: rotate(28deg) !important;
}

/* fine dotted decorative pattern */
.home-modern-flash-offer::after {
    width: 120px !important;
    height: 120px !important;
    inset-inline-start: 18px !important;
    bottom: 16px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-image: radial-gradient(
        rgba(27,149,68,.16) 1px,
        transparent 1px
    ) !important;
    background-size: 10px 10px !important;
    opacity: .42 !important;
}

.home-modern-flash-offer-content {
    position: relative;
    z-index: 2;
}

/* soft accent line */
.home-modern-flash-offer-content::before {
    content: "";
    position: absolute;
    top: 30px;
    bottom: 30px;
    inset-inline-start: 0;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(
        180deg,
        rgba(27,149,68,.15),
        #1b9544,
        rgba(27,149,68,.15)
    );
}

.home-modern-flash-eyebrow {
    border: 1px solid rgba(27,149,68,.12) !important;
    background: rgba(255,255,255,.82) !important;
    color: #1b9544 !important;
    box-shadow: 0 4px 12px rgba(22,101,52,.04);
}

.home-modern-flash-title {
    color: #1f2937 !important;
}

.home-modern-flash-description {
    color: #69736c !important;
}

.home-modern-flash-time-unit {
    border: 1px solid rgba(27,149,68,.10) !important;
    background: rgba(255,255,255,.96) !important;
    color: #20262b !important;
    box-shadow: 0 6px 16px rgba(18,56,31,.055) !important;
}

.home-modern-flash-time-unit .cz-countdown-value {
    color: #1b9544 !important;
}

.home-modern-flash-time-unit .cz-countdown-text {
    color: #6b7280 !important;
}

.home-modern-flash-time-separator {
    color: rgba(27,149,68,.42) !important;
}

.home-modern-flash-progress {
    background: rgba(27,149,68,.09) !important;
}

.home-modern-flash-progress span {
    background: linear-gradient(90deg, #1b9544 0%, #45d87c 100%) !important;
}

/* exact same visual scale as the section-level View All link */
.home-modern-flash-button {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-height: 0 !important;
    margin-top: 18px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #1b9544 !important;
    box-shadow: none !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
}

.home-modern-flash-button span {
    font-size: 13px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
}

.home-modern-flash-button svg {
    width: 11px !important;
    height: 11px !important;
}

.home-modern-flash-button:hover {
    background: transparent !important;
    color: #147a37 !important;
    box-shadow: none !important;
    transform: none !important;
}

@media (max-width: 767.98px) {
    .home-modern-flash-offer::before {
        width: 130px !important;
        height: 360px !important;
        top: -90px !important;
        inset-inline-end: 16px !important;
    }

    .home-modern-flash-offer::after {
        width: 90px !important;
        height: 90px !important;
        inset-inline-start: 10px !important;
        bottom: 10px !important;
    }

    .home-modern-flash-offer-content::before {
        top: 20px;
        bottom: 20px;
    }
}

/* =============================================================
   3STORE 2026 — Creative Flash Deals Final
   Premium light design matched to categories and brands.
   ============================================================= */

.home-modern-flash-card {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(31, 41, 55, .07) !important;
    border-radius: 22px !important;
    background:
        linear-gradient(135deg, rgba(255,255,255,.94) 0%, rgba(250,251,251,.88) 100%) !important;
    box-shadow: none !important;
}

.home-modern-flash-products {
    position: relative;
    background:
        linear-gradient(180deg, rgba(255,255,255,.86) 0%, rgba(250,251,251,.72) 100%) !important;
}

.home-modern-flash-offer {
    position: relative;
    overflow: hidden;
    padding: 22px !important;
    color: #1f2937 !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.76) 0%, rgba(248,250,249,.70) 100%) !important;
    border-inline-start: 1px solid rgba(31,41,55,.06) !important;
}

.home-modern-flash-offer::before {
    content: "" !important;
    position: absolute !important;
    width: 210px !important;
    height: 210px !important;
    top: -98px !important;
    inset-inline-end: -76px !important;
    border: 1px solid rgba(31,41,55,.045) !important;
    border-radius: 50% !important;
    background:
        radial-gradient(circle, rgba(255,255,255,.72) 0%, rgba(244,247,246,.24) 54%, transparent 56%) !important;
    transform: none !important;
    pointer-events: none !important;
}

.home-modern-flash-offer::after {
    content: "" !important;
    position: absolute !important;
    width: 110px !important;
    height: 110px !important;
    inset-inline-start: 20px !important;
    bottom: 18px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-image: radial-gradient(rgba(31,41,55,.07) 1px, transparent 1px) !important;
    background-size: 10px 10px !important;
    opacity: .16 !important;
    pointer-events: none !important;
}

.home-modern-flash-offer-content {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 100%;
    padding: 20px !important;
    border: 1px solid rgba(255,255,255,.88) !important;
    border-radius: 20px !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.58) 100%) !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

.home-modern-flash-offer-content::before {
    display: none !important;
    content: none !important;
}

.home-modern-flash-headline-wrap {
    position: relative;
    margin-bottom: 16px;
    padding: 16px 16px 15px;
    overflow: hidden;
    border: 1px solid rgba(27,149,68,.09);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.96) 0%, rgba(246,251,248,.92) 100%);
    box-shadow: 0 8px 20px rgba(22,101,52,.045);
}

.home-modern-flash-headline-wrap::before {
    content: "";
    position: absolute;
    top: 13px;
    bottom: 13px;
    inset-inline-start: 0;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, #1b9544 0%, #49da80 100%);
}

.home-modern-flash-headline-wrap::after {
    content: "";
    position: absolute;
    width: 92px;
    height: 92px;
    inset-inline-end: -46px;
    top: -48px;
    border-radius: 50%;
    background: rgba(36,197,91,.07);
}

.home-modern-flash-eyebrow {
    position: relative;
    z-index: 1;
    display: inline-flex !important;
    align-items: center;
    margin-bottom: 10px !important;
    padding: 6px 11px !important;
    border: 1px solid rgba(27,149,68,.12) !important;
    border-radius: 999px !important;
    background: rgba(27,149,68,.055) !important;
    color: #1b9544 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

.home-modern-flash-title {
    position: relative;
    z-index: 1;
    margin: 0 0 7px !important;
    color: #20262b !important;
    font-size: 27px !important;
    line-height: 1.25 !important;
    font-weight: 800 !important;
}

.home-modern-flash-description {
    position: relative;
    z-index: 1;
    margin: 0 !important;
    color: #667169 !important;
    font-size: 13px !important;
    line-height: 1.75 !important;
    font-weight: 500;
}

.home-modern-flash-timer-wrap {
    position: relative;
    padding: 15px 14px 13px;
    border: 1px solid rgba(27,149,68,.09);
    border-radius: 16px;
    background: rgba(255,255,255,.86);
    box-shadow: 0 8px 20px rgba(22,101,52,.04);
}

.home-modern-flash-countdown .cz-countdown {
    justify-content: center !important;
}

.home-modern-flash-time-unit {
    min-width: 52px !important;
    min-height: 58px !important;
    border: 1px solid rgba(27,149,68,.10) !important;
    border-radius: 13px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.home-modern-flash-time-unit .cz-countdown-value {
    color: #1b9544 !important;
    font-size: 19px !important;
    font-weight: 800 !important;
}

.home-modern-flash-time-unit .cz-countdown-text {
    color: #6b7280 !important;
    font-size: 9px !important;
    font-weight: 600 !important;
}

.home-modern-flash-time-separator {
    color: rgba(27,149,68,.43) !important;
}

.home-modern-flash-progress {
    height: 5px !important;
    margin-top: 15px !important;
    background: rgba(27,149,68,.10) !important;
}

.home-modern-flash-progress span {
    background: linear-gradient(90deg, #1b9544 0%, #47d97e 100%) !important;
}

.home-modern-flash-button {
    min-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    margin-top: 15px !important;
    padding: 0 13px !important;
    border: 1px solid rgba(27,149,68,.11) !important;
    border-radius: 11px !important;
    background: rgba(255,255,255,.92) !important;
    color: #1b9544 !important;
    box-shadow: 0 6px 16px rgba(22,101,52,.05) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
}

.home-modern-flash-button span {
    font-size: 13px !important;
    line-height: 1 !important;
    font-weight: 600 !important;
}

.home-modern-flash-button svg {
    width: 12px !important;
    height: 12px !important;
}

.home-modern-flash-button:hover {
    border-color: rgba(27,149,68,.20) !important;
    background: #ffffff !important;
    color: #147a37 !important;
    box-shadow: 0 9px 20px rgba(22,101,52,.09) !important;
    transform: translateY(-2px) !important;
}

.home-modern-flash-products-heading {
    margin-bottom: 17px !important;
    padding: 12px 14px;
    border: 1px solid rgba(27,149,68,.07);
    border-radius: 15px;
    background:
        linear-gradient(135deg, rgba(248,252,249,.95) 0%, rgba(255,255,255,.98) 100%);
}

.home-modern-flash-products-heading-copy {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
}

.home-modern-flash-products-heading-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #edf8f1;
    color: #1b9544;
}

.home-modern-flash-products-heading-icon svg {
    width: 20px;
    height: 20px;
}

.home-modern-flash-products-heading h3 {
    margin: 0 0 3px !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}

.home-modern-flash-products-heading p {
    margin: 0 !important;
    color: #6b7280 !important;
}

.home-modern-flash-view-all {
    min-height: 34px;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 0 10px;
    border: 1px solid rgba(27,149,68,.08);
    border-radius: 10px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    box-shadow: 0 5px 14px rgba(22,101,52,.035);
}

@media (max-width: 991.98px) {
    .home-modern-flash-offer {
        padding: 16px !important;
    }

    .home-modern-flash-offer-content {
        padding: 16px !important;
    }
}

@media (max-width: 767.98px) {
    .home-modern-flash-card {
        border-radius: 18px !important;
    }

    .home-modern-flash-offer {
        padding: 12px !important;
        border-inline-start: 0 !important;
        border-top: 1px solid rgba(22,101,52,.08) !important;
    }

    .home-modern-flash-offer-content {
        padding: 13px !important;
        border-radius: 16px !important;
    }

    .home-modern-flash-headline-wrap {
        padding: 14px 13px 13px;
        border-radius: 14px;
    }

    .home-modern-flash-title {
        font-size: 21px !important;
    }

    .home-modern-flash-description {
        font-size: 12px !important;
    }

    .home-modern-flash-timer-wrap {
        padding: 12px 10px 10px;
        border-radius: 14px;
    }

    .home-modern-flash-time-unit {
        min-width: 45px !important;
        min-height: 52px !important;
    }

    .home-modern-flash-button {
        width: 100% !important;
    }

    .home-modern-flash-products-heading {
        padding: 10px 11px;
        border-radius: 13px;
    }

    .home-modern-flash-products-heading-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .home-modern-flash-view-all {
        min-height: 32px;
        padding-inline: 8px;
        font-size: 12px !important;
    }
}

/* =============================================================
   FINAL RESPONSIVE FIX — Creative Flash Deals
   Mobile/tablet only. Desktop remains unchanged.
   ============================================================= */
@media (max-width: 767.98px) {
    .home-modern-flash-section {
        margin-top: 14px !important;
    }

    .home-modern-flash-section .container {
        padding-inline: 8px !important;
    }

    .home-modern-flash-card {
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        border-radius: 17px !important;
        overflow: hidden !important;
    }

    /* Compact offer panel */
    .home-modern-flash-offer {
        order: 1 !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: 8px !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(22,101,52,.08) !important;
    }

    .home-modern-flash-offer-content {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        display: block !important;
        padding: 8px !important;
        border-radius: 14px !important;
    }

    .home-modern-flash-headline-wrap {
        margin-bottom: 8px !important;
        padding: 12px 11px 11px !important;
        border-radius: 12px !important;
    }

    .home-modern-flash-headline-wrap::before {
        width: 3px !important;
    }

    .home-modern-flash-eyebrow {
        margin-bottom: 7px !important;
        padding: 5px 9px !important;
        font-size: 10px !important;
    }

    .home-modern-flash-title {
        margin-bottom: 5px !important;
        font-size: 19px !important;
        line-height: 1.25 !important;
    }

    .home-modern-flash-description {
        font-size: 11px !important;
        line-height: 1.55 !important;
    }

    /* Countdown: one clean horizontal row */
    .home-modern-flash-timer-wrap {
        margin-top: 0 !important;
        padding: 9px 8px 8px !important;
        border-radius: 12px !important;
    }

    .home-modern-flash-countdown,
    .home-modern-flash-countdown .cz-countdown {
        width: 100% !important;
    }

    .home-modern-flash-countdown .cz-countdown {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 5px !important;
    }

    .home-modern-flash-time-unit {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 50px !important;
        padding: 5px 2px !important;
        border-radius: 10px !important;
    }

    .home-modern-flash-time-unit .cz-countdown-value {
        font-size: 16px !important;
    }

    .home-modern-flash-time-unit .cz-countdown-text {
        font-size: 8px !important;
        white-space: nowrap !important;
    }

    .home-modern-flash-time-separator {
        display: none !important;
    }

    .home-modern-flash-progress {
        height: 4px !important;
        margin-top: 9px !important;
    }

    .home-modern-flash-button {
        width: auto !important;
        min-height: 32px !important;
        margin-top: 9px !important;
        padding: 0 10px !important;
        border-radius: 9px !important;
        font-size: 11px !important;
    }

    .home-modern-flash-button span {
        font-size: 11px !important;
    }

    /* Products area */
    .home-modern-flash-products {
        order: 2 !important;
        width: 100% !important;
        padding: 10px 8px 12px !important;
    }

    .home-modern-flash-products-heading {
        align-items: center !important;
        gap: 8px !important;
        margin-bottom: 9px !important;
        padding: 8px 9px !important;
        border-radius: 11px !important;
    }

    .home-modern-flash-products-heading-copy {
        gap: 7px !important;
    }

    .home-modern-flash-products-heading-icon {
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        border-radius: 9px !important;
    }

    .home-modern-flash-products-heading-icon svg {
        width: 16px !important;
        height: 16px !important;
    }

    .home-modern-flash-products-heading h3 {
        margin: 0 !important;
        font-size: 15px !important;
        line-height: 1.3 !important;
    }

    .home-modern-flash-products-heading p {
        display: none !important;
    }

    .home-modern-flash-view-all {
        min-height: 28px !important;
        padding-inline: 7px !important;
        border-radius: 8px !important;
        font-size: 10.5px !important;
        white-space: nowrap !important;
    }

    .home-modern-flash-mobile {
        margin-inline: -2px !important;
    }

    .home-modern-flash-mobile .owl-stage-outer {
        overflow: hidden !important;
    }

    .home-modern-flash-mobile .owl-stage {
        display: flex !important;
        align-items: stretch !important;
    }

    .home-modern-flash-mobile .owl-item {
        display: flex !important;
        height: auto !important;
    }

    .home-modern-flash-mobile .home-modern-flash-product-slide {
        width: 100% !important;
        height: 100% !important;
        padding: 1px !important;
    }

    .home-modern-flash-mobile .product-card,
    .home-modern-flash-mobile .flash_deal_product {
        height: 100% !important;
        margin: 0 !important;
        border-radius: 10px !important;
    }

    /* Prevent desktop custom arrows from appearing on touch layouts */
    .home-modern-flash-control {
        display: none !important;
    }
}

@media (max-width: 399.98px) {
    .home-modern-flash-section .container {
        padding-inline: 5px !important;
    }

    .home-modern-flash-time-unit {
        min-height: 47px !important;
    }

    .home-modern-flash-time-unit .cz-countdown-value {
        font-size: 15px !important;
    }

    .home-modern-flash-time-unit .cz-countdown-text {
        font-size: 7.5px !important;
    }

    .home-modern-flash-products-heading {
        padding-inline: 7px !important;
    }

    .home-modern-flash-products-heading h3 {
        font-size: 14px !important;
    }
}

/* =============================================================
   3STORE 2026 — Modern Featured Products section
   ============================================================= */
.home-modern-featured-section {
    position: relative;
}

.home-modern-featured-card {
    position: relative;
    padding: 18px;
    overflow: hidden;
    border: 1px solid rgba(31, 41, 55, .055);
    border-radius: 22px;
    background:
        radial-gradient(circle at 95% 0%, rgba(36, 197, 91, .018), transparent 28%),
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(250,251,251,.94) 100%);
    box-shadow: 0 3px 12px rgba(31, 41, 55, .025);
}

.home-modern-featured-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    inset-inline-end: -95px;
    bottom: -110px;
    border: 1px solid rgba(27, 149, 68, .08);
    border-radius: 50%;
    pointer-events: none;
}

.home-modern-featured-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 1px solid rgba(22, 101, 52, .08);
    border-radius: 16px;
    background: rgba(255,255,255,.84);
}

.home-modern-featured-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-modern-featured-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #ecf8f0;
    color: #1b9544;
}

.home-modern-featured-icon svg {
    width: 22px;
    height: 22px;
}

.home-modern-featured-title {
    margin: 0;
    color: #20262b;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-featured-subtitle {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.5;
}

.home-modern-featured-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 11px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-featured-view-all:hover {
    border-color: rgba(27, 149, 68, .26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-featured-carousel-wrap {
    position: relative;
    padding-inline: 48px;
}

.home-modern-featured-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-featured-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-featured-slide {
    width: 100%;
    height: 100%;
    padding: 4px 2px 8px;
}

.home-modern-featured-slide > .feature-product {
    height: 100%;
}

.home-modern-featured-slider .owl-stage-outer {
    padding: 3px 2px 10px;
    margin: -3px -2px -10px;
}

.home-modern-featured-control {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(22, 101, 52, .13);
    border-radius: 11px;
    background-color: rgba(255,255,255,.98);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
    box-shadow: 0 5px 15px rgba(22, 101, 52, .10);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) scale(.96);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease,
                border-color .18s ease, background-color .18s ease;
}

.home-modern-featured-card:hover .home-modern-featured-control {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) scale(1);
}

.home-modern-featured-control--left {
    left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-featured-control--right {
    right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-featured-control:hover {
    border-color: #1b9544;
    background-color: #1b9544;
}

.home-modern-featured-control--left:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-featured-control--right:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 991.98px) {
    .home-modern-featured-card {
        padding: 15px;
        border-radius: 19px;
    }

    .home-modern-featured-heading {
        padding: 12px 13px;
    }

    .home-modern-featured-carousel-wrap {
        padding-inline: 42px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-featured-card {
        padding: 11px 9px 12px;
        border-radius: 17px;
    }

    .home-modern-featured-heading {
        gap: 10px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-featured-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-featured-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-featured-title {
        font-size: 16px;
    }

    .home-modern-featured-subtitle {
        display: none;
    }

    .home-modern-featured-view-all {
        min-height: 32px;
        padding-inline: 10px;
        font-size: 11px;
        border-radius: 9px;
    }

    .home-modern-featured-carousel-wrap {
        padding-inline: 0;
    }

    .home-modern-featured-control {
        display: none;
    }

    .home-modern-featured-slider .owl-stage-outer {
        overflow: visible;
        padding: 2px 2px 9px;
        margin: -2px -2px -9px;
    }

    .home-modern-featured-slide {
        padding: 3px;
    }
}

/* =============================================================
   FINAL FEATURED SECTION WIDTH + HEADER BORDER FIX
   Match Flash Deals width and remove the indicated header border.
   ============================================================= */
.home-modern-featured-section .container {
    max-width: 1380px;
}

.home-modern-featured-heading {
    border: 0 !important;
}

/* =============================================================
   FINAL FEATURED MOBILE CARD BORDER FIX
   Keep card borders/corners visible inside the responsive carousel.
   ============================================================= */
@media (max-width: 767.98px) {
    .home-modern-featured-carousel-wrap {
        overflow: visible !important;
    }

    .home-modern-featured-slider,
    .home-modern-featured-slider .owl-stage-outer {
        overflow: visible !important;
    }

    .home-modern-featured-slider .owl-stage-outer {
        padding: 4px 4px 12px !important;
        margin: -4px -4px -12px !important;
    }

    .home-modern-featured-slider .owl-item {
        padding: 0 3px !important;
        box-sizing: border-box !important;
    }

    .home-modern-featured-slide {
        padding: 2px !important;
        overflow: visible !important;
    }

    .home-modern-featured-slide > .feature-product {
        overflow: visible !important;
        border-radius: 14px !important;
    }

    .home-modern-featured-slide .store-creative-product-card {
        overflow: hidden !important;
        border: 1px solid rgba(22, 101, 52, .16) !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
    }
}

/* =============================================================
   3STORE 2026 — Modern Featured Deals section
   Matches the Featured Products section without changing cards.
   ============================================================= */
.home-modern-featured-deals-section .container {
    max-width: 1380px;
}

.home-modern-featured-deals-card {
    position: relative;
    padding: 18px;
    overflow: hidden;
    border: 1px solid rgba(31, 41, 55, .055);
    border-radius: 22px;
    background:
        radial-gradient(circle at 95% 0%, rgba(36, 197, 91, .018), transparent 28%),
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(250,251,251,.94) 100%);
    box-shadow: 0 3px 12px rgba(31, 41, 55, .025);
}

.home-modern-featured-deals-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    inset-inline-end: -95px;
    bottom: -110px;
    border: 1px solid rgba(27, 149, 68, .08);
    border-radius: 50%;
    pointer-events: none;
}

.home-modern-featured-deals-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 0;
    border-radius: 16px;
    background: rgba(255,255,255,.84);
}

.home-modern-featured-deals-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-modern-featured-deals-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #ecf8f0;
    color: #1b9544;
}

.home-modern-featured-deals-icon svg {
    width: 22px;
    height: 22px;
}

.home-modern-featured-deals-title {
    margin: 0;
    color: #20262b;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-featured-deals-subtitle {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.5;
}

.home-modern-featured-deals-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 11px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-featured-deals-view-all:hover {
    border-color: rgba(27, 149, 68, .26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-featured-deals-carousel-wrap {
    position: relative;
    padding-inline: 48px;
}

.home-modern-featured-deals-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-featured-deals-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-featured-deals-slide {
    width: 100%;
    height: 100%;
    padding: 4px 2px 8px;
}

.home-modern-featured-deals-slide > .product-single-hover {
    width: 100%;
    height: 100%;
}

.home-modern-featured-deals-slider .owl-stage-outer {
    padding: 3px 2px 10px;
    margin: -3px -2px -10px;
}

.home-modern-featured-deals-control {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(22, 101, 52, .13);
    border-radius: 11px;
    background-color: rgba(255,255,255,.98);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
    box-shadow: 0 5px 15px rgba(22, 101, 52, .10);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) scale(.96);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease,
                border-color .18s ease, background-color .18s ease;
}

.home-modern-featured-deals-card:hover .home-modern-featured-deals-control {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) scale(1);
}

.home-modern-featured-deals-control--left {
    left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-featured-deals-control--right {
    right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-featured-deals-control:hover {
    border-color: #1b9544;
    background-color: #1b9544;
}

.home-modern-featured-deals-control--left:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-featured-deals-control--right:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 991.98px) {
    .home-modern-featured-deals-card {
        padding: 15px;
        border-radius: 19px;
    }

    .home-modern-featured-deals-heading {
        padding: 12px 13px;
    }

    .home-modern-featured-deals-carousel-wrap {
        padding-inline: 42px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-featured-deals-card {
        padding: 11px 9px 12px;
        border-radius: 17px;
    }

    .home-modern-featured-deals-heading {
        gap: 10px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-featured-deals-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-featured-deals-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-featured-deals-title {
        font-size: 16px;
    }

    .home-modern-featured-deals-subtitle {
        display: none;
    }

    .home-modern-featured-deals-view-all {
        min-height: 32px;
        padding-inline: 10px;
        font-size: 11px;
        border-radius: 9px;
    }

    .home-modern-featured-deals-carousel-wrap {
        padding-inline: 0;
        overflow: visible !important;
    }

    .home-modern-featured-deals-control {
        display: none;
    }

    .home-modern-featured-deals-slider,
    .home-modern-featured-deals-slider .owl-stage-outer {
        overflow: visible !important;
    }

    .home-modern-featured-deals-slider .owl-stage-outer {
        padding: 4px 4px 12px !important;
        margin: -4px -4px -12px !important;
    }

    .home-modern-featured-deals-slider .owl-item {
        padding: 0 3px !important;
        box-sizing: border-box !important;
    }

    .home-modern-featured-deals-slide {
        padding: 2px !important;
        overflow: visible !important;
    }

    .home-modern-featured-deals-slide > .product-single-hover {
        overflow: visible !important;
        border-radius: 14px !important;
    }

    .home-modern-featured-deals-slide .store-creative-product-card {
        overflow: hidden !important;
        border: 1px solid rgba(22, 101, 52, .16) !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
    }
}

/* =============================================================
   FEATURED DEALS — remove old Owl Carousel arrows
   Custom hover arrows remain active.
   ============================================================= */
.home-modern-featured-deals-slider > .owl-nav,
.home-modern-featured-deals-slider .owl-nav {
    display: none !important;
}

/* =============================================================
   DEFINITIVE FEATURED DEALS ARROW CLEANUP
   Hide every Owl/theme arrow; keep only our two custom controls.
   ============================================================= */
.home-modern-featured-deals-card .owl-nav,
.home-modern-featured-deals-card .owl-prev,
.home-modern-featured-deals-card .owl-next,
.home-modern-featured-deals-card [class*="owl-prev"],
.home-modern-featured-deals-card [class*="owl-next"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.home-modern-featured-deals-card .home-modern-featured-deals-control {
    display: grid !important;
    pointer-events: auto !important;
}

@media (max-width: 767.98px) {
    .home-modern-featured-deals-card .home-modern-featured-deals-control {
        display: none !important;
    }
}

/* =============================================================
   3STORE 2026 — Modern Clearance Sale section
   ============================================================= */
.home-modern-clearance-section .container {
    max-width: 1380px;
}

.home-modern-clearance-card {
    position: relative;
    padding: 18px;
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .09);
    border-radius: 22px;
    background:
        radial-gradient(circle at 92% 5%, rgba(36, 197, 91, .075), transparent 30%),
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(247,252,248,.96) 100%);
    box-shadow: 0 10px 32px rgba(22, 101, 52, .06);
}

.home-modern-clearance-card::before {
    content: "";
    position: absolute;
    width: 155px;
    height: 155px;
    inset-inline-start: -90px;
    bottom: -90px;
    border: 1px solid rgba(27, 149, 68, .08);
    border-radius: 50%;
    pointer-events: none;
}

.home-modern-clearance-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
    padding: 14px 16px;
    border: 0;
    border-radius: 16px;
    background: rgba(255,255,255,.84);
}

.home-modern-clearance-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-modern-clearance-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #ecf8f0;
    color: #1b9544;
}

.home-modern-clearance-icon svg {
    width: 22px;
    height: 22px;
}

.home-modern-clearance-title {
    margin: 0;
    color: #20262b;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-clearance-subtitle {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.5;
}

.home-modern-clearance-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(31, 41, 55, .045);
    border-radius: 11px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-clearance-view-all:hover {
    border-color: rgba(27, 149, 68, .26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-clearance-carousel-wrap {
    position: relative;
    padding-inline: 48px;
}

.home-modern-clearance-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-clearance-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-clearance-slide {
    width: 100%;
    height: 100%;
    padding: 4px 2px 8px;
}

.home-modern-clearance-slide > .product-single-hover {
    width: 100%;
    height: 100%;
}

.home-modern-clearance-slider .owl-stage-outer {
    padding: 3px 2px 10px;
    margin: -3px -2px -10px;
}

.home-modern-clearance-slider .owl-nav,
.home-modern-clearance-slider .owl-dots {
    display: none !important;
}

.home-modern-clearance-control {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(22, 101, 52, .13);
    border-radius: 11px;
    background-color: rgba(255,255,255,.98);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
    box-shadow: 0 5px 15px rgba(22, 101, 52, .10);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) scale(.96);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease,
                border-color .18s ease, background-color .18s ease;
}

.home-modern-clearance-card:hover .home-modern-clearance-control {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) scale(1);
}

.home-modern-clearance-control--left {
    left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-clearance-control--right {
    right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-clearance-control:hover {
    border-color: #1b9544;
    background-color: #1b9544;
}

.home-modern-clearance-control--left:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-clearance-control--right:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 991.98px) {
    .home-modern-clearance-card {
        padding: 15px;
        border-radius: 19px;
    }

    .home-modern-clearance-heading {
        padding: 12px 13px;
    }

    .home-modern-clearance-carousel-wrap {
        padding-inline: 42px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-clearance-card {
        padding: 11px 9px 12px;
        border-radius: 17px;
    }

    .home-modern-clearance-heading {
        gap: 10px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-clearance-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-clearance-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-clearance-title {
        font-size: 16px;
    }

    .home-modern-clearance-subtitle {
        display: none;
    }

    .home-modern-clearance-view-all {
        min-height: 32px;
        padding-inline: 10px;
        font-size: 11px;
        border-radius: 9px;
    }

    .home-modern-clearance-carousel-wrap {
        padding-inline: 0;
        overflow: visible !important;
    }

    .home-modern-clearance-control {
        display: none;
    }

    .home-modern-clearance-slider,
    .home-modern-clearance-slider .owl-stage-outer {
        overflow: visible !important;
    }

    .home-modern-clearance-slider .owl-stage-outer {
        padding: 4px 4px 12px !important;
        margin: -4px -4px -12px !important;
    }

    .home-modern-clearance-slider .owl-item {
        padding: 0 3px !important;
        box-sizing: border-box !important;
    }

    .home-modern-clearance-slide {
        padding: 2px !important;
        overflow: visible !important;
    }

    .home-modern-clearance-slide > .product-single-hover {
        overflow: visible !important;
        border-radius: 14px !important;
    }

    .home-modern-clearance-slide .store-creative-product-card {
        overflow: hidden !important;
        border: 1px solid rgba(22, 101, 52, .16) !important;
        border-radius: 14px !important;
        box-sizing: border-box !important;
    }
}

/* =============================================================
   CLEARANCE SALE — Coupon style concept
   Distinct from previous sections, clean and creative.
   Approved View All button remains unchanged.
   ============================================================= */
.home-modern-clearance-card {
    position: relative;
    isolation: isolate;
    padding: 18px;
    overflow: hidden;
    border: 1px solid rgba(31, 41, 55, .045);
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(250,251,251,.84) 100%);
    box-shadow: none;
}

/* Coupon cut-outs */
.home-modern-clearance-card::before,
.home-modern-clearance-card::after {
    content: "";
    position: absolute;
    z-index: 3;
    top: 96px;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 50%;
    background: #f5f8f6;
}

.home-modern-clearance-card::before {
    left: -15px;
}

.home-modern-clearance-card::after {
    right: -15px;
}

/* Header styled like a premium coupon */
.home-modern-clearance-heading {
    position: relative;
    margin-bottom: 18px;
    padding: 16px 18px;
    overflow: hidden;
    border: 1px dashed rgba(31, 41, 55, .065);
    border-radius: 18px;
    background: rgba(255,255,255,.18);
}

.home-modern-clearance-heading::before {
    content: "";
    position: absolute;
    inset-block: 0;
    inset-inline-end: 0;
    width: 140px;
    background: none;
    pointer-events: none;
}

.home-modern-clearance-title-wrap {
    position: relative;
    z-index: 2;
}

.home-modern-clearance-icon {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
    border-radius: 50%;
    border: 1px solid rgba(27,149,68,.14);
    background: #ffffff;
    color: #1b9544;
    box-shadow:
        inset 0 0 0 6px rgba(36,197,91,.06),
        0 7px 18px rgba(22,101,52,.08);
}

.home-modern-clearance-title {
    font-size: 22px;
    font-weight: 800;
}

.home-modern-clearance-subtitle {
    margin-top: 4px;
    color: #617067;
    font-size: 12.5px;
}

/* Small discount badge */
.home-modern-clearance-title-wrap::after {
    content: "-%";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 24px;
    margin-inline-start: 10px;
    padding-inline: 8px;
    border-radius: 999px;
    background: #1b9544;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 5px 12px rgba(27,149,68,.18);
}

/* Product zone with a clean perforated top edge */
.home-modern-clearance-carousel-wrap {
    position: relative;
    padding: 22px 52px 14px;
    border-radius: 18px;
    background: transparent;
}

.home-modern-clearance-carousel-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    inset-inline: 18px;
    height: 1px;
    background:
        repeating-linear-gradient(
            90deg,
            rgba(27,149,68,.22) 0 6px,
            transparent 6px 13px
        );
}

.home-modern-clearance-slide {
    padding: 5px 3px 10px;
}

.home-modern-clearance-slide .store-creative-product-card {
    background: #fff;
    border-color: rgba(22,101,52,.14) !important;
    box-shadow: 0 8px 20px rgba(22,101,52,.045);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.home-modern-clearance-slide .store-creative-product-card:hover {
    transform: translateY(-4px);
    border-color: rgba(27,149,68,.30) !important;
    box-shadow: 0 14px 30px rgba(22,101,52,.09);
}

/* Approved View All design is preserved */
.home-modern-clearance-view-all {
    position: relative;
    z-index: 3;
}

@media (max-width: 991.98px) {
    .home-modern-clearance-card {
        padding: 15px;
        border-radius: 21px;
    }

    .home-modern-clearance-carousel-wrap {
        padding-inline: 44px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-clearance-card {
        padding: 10px 8px 12px;
        border-radius: 18px;
    }

    .home-modern-clearance-card::before,
    .home-modern-clearance-card::after {
        display: none;
    }

    .home-modern-clearance-heading {
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 14px;
    }

    .home-modern-clearance-icon {
        width: 35px;
        height: 35px;
        flex-basis: 35px;
    }

    .home-modern-clearance-title {
        font-size: 16px;
    }

    .home-modern-clearance-title-wrap::after {
        min-width: 28px;
        height: 21px;
        margin-inline-start: 6px;
        padding-inline: 6px;
        font-size: 10px;
    }

    .home-modern-clearance-carousel-wrap {
        padding: 12px 0 7px !important;
        background: transparent;
    }

    .home-modern-clearance-carousel-wrap::before {
        inset-inline: 4px;
    }

    .home-modern-clearance-slide {
        padding: 2px !important;
    }

    .home-modern-clearance-slide .store-creative-product-card:hover {
        transform: none;
    }
}

/* =============================================================
   CLEARANCE PRODUCT HOVER — no shadow/background
   Different interaction: subtle image lift + border accent only.
   ============================================================= */
.home-modern-clearance-slide .store-creative-product-card,
.home-modern-clearance-slide .store-creative-product-card:hover {
    box-shadow: none !important;
    background: #ffffff !important;
    transform: none !important;
}

.home-modern-clearance-slide {
    position: relative;
    transform: none !important;
}

.home-modern-clearance-slide::after {
    content: "";
    position: absolute;
    inset-inline: 18px;
    bottom: 4px;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(27, 149, 68, .18) 25%,
        rgba(27, 149, 68, .58) 50%,
        rgba(27, 149, 68, .18) 75%,
        transparent 100%
    );
    opacity: 0;
    transform: scaleX(.45);
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: none;
}

.home-modern-clearance-slide:hover::after {
    opacity: 1;
    transform: scaleX(1);
}

.home-modern-clearance-slide .store-creative-product-card {
    transition:
        border-color .22s ease,
        background-color .22s ease !important;
}

.home-modern-clearance-slide:hover .store-creative-product-card {
    border-color: rgba(27, 149, 68, .34) !important;
    background:
        linear-gradient(180deg, #ffffff 0%, #fbfefc 100%) !important;
}

/* Different hover motion: product image moves slightly upward */
.home-modern-clearance-slide .store-creative-product-card img {
    transition: transform .24s ease !important;
}

.home-modern-clearance-slide:hover .store-creative-product-card img {
    transform: translateY(-4px) scale(1.015);
}

/* Keep the card body still */
.home-modern-clearance-slide:hover .store-creative-product-content,
.home-modern-clearance-slide:hover .store-creative-product-meta-row {
    transform: none !important;
}

@media (max-width: 767.98px) {
    .home-modern-clearance-slide::after {
        display: none;
    }

    .home-modern-clearance-slide:hover .store-creative-product-card img {
        transform: none;
    }
}

/* =============================================================
   CREATIVE WIDE BANNER — aligned with modern homepage sections
   ============================================================= */
.home-creative-wide-banner-section {
    position: relative;
    overflow: visible;
}

.home-creative-wide-banner-section .container {
    width: 100%;
    max-width: 1380px;
    margin-inline: auto;
    padding-inline: 0;
}

.home-creative-wide-banner-frame {
    position: relative;
    isolation: isolate;
    width: 100%;
    padding: 6px;
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 20px;
    background: linear-gradient(135deg, #ffffff 0%, #f4fbf6 100%);
    box-shadow: 0 10px 28px rgba(22, 101, 52, .055);
    transition:
        transform .28s ease,
        box-shadow .28s ease,
        border-color .28s ease;
}

/* soft creative glow on one side */
.home-creative-wide-banner-frame::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 18px;
    bottom: 18px;
    inset-inline-end: -10px;
    width: 38%;
    border-radius: 22px;
    background: rgba(36, 197, 91, .075);
    filter: blur(14px);
    opacity: .75;
    pointer-events: none;
    transition: transform .3s ease, opacity .3s ease;
}

/* subtle shine */
.home-creative-wide-banner-frame::before {
    content: "";
    position: absolute;
    z-index: 3;
    inset: 6px;
    border-radius: 15px;
    background:
        linear-gradient(
            110deg,
            transparent 0%,
            rgba(255,255,255,0) 36%,
            rgba(255,255,255,.30) 49%,
            rgba(255,255,255,0) 62%,
            transparent 100%
        );
    transform: translateX(-125%);
    pointer-events: none;
    transition: transform .7s ease;
}

html[dir="rtl"] .home-creative-wide-banner-frame::before {
    transform: translateX(125%);
}

.home-creative-wide-banner-link {
    display: block;
    width: 100%;
    overflow: hidden;
    border-radius: 15px;
    background: #f7faf8;
}

.home-creative-wide-banner-image {
    display: block;
    width: 100% !important;
    height: 165px !important;
    max-height: 165px !important;
    margin: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 15px;
    transition:
        transform .42s cubic-bezier(.2,.75,.25,1),
        filter .3s ease;
}

.home-creative-wide-banner-frame:hover {
    transform: translateY(-3px);
    border-color: rgba(27, 149, 68, .24);
    box-shadow: 0 16px 36px rgba(22, 101, 52, .09);
}

.home-creative-wide-banner-frame:hover::after {
    transform: translateX(5px);
    opacity: 1;
}

.home-creative-wide-banner-frame:hover::before {
    transform: translateX(125%);
}

html[dir="rtl"] .home-creative-wide-banner-frame:hover::before {
    transform: translateX(-125%);
}

.home-creative-wide-banner-frame:hover .home-creative-wide-banner-image {
    transform: scale(1.012);
    filter: saturate(1.025) contrast(1.01);
}

@media (max-width: 1399.98px) {
    .home-creative-wide-banner-section .container {
        max-width: calc(100% - 24px);
    }
}

@media (max-width: 991.98px) {
    .home-creative-wide-banner-frame {
        padding: 5px;
        border-radius: 18px;
    }

    .home-creative-wide-banner-link,
    .home-creative-wide-banner-image {
        border-radius: 13px;
    }

    .home-creative-wide-banner-image {
        height: 150px !important;
        max-height: 150px !important;
    }
}

@media (max-width: 767.98px) {
    .home-creative-wide-banner-section .container {
        width: 100%;
        max-width: calc(100% - 16px);
        padding-inline: 0;
    }

    .home-creative-wide-banner-frame {
        padding: 4px;
        border-radius: 15px;
        box-shadow: 0 7px 20px rgba(22, 101, 52, .05);
    }

    .home-creative-wide-banner-frame::after {
        inset-inline-end: -4px;
        top: 10px;
        bottom: 10px;
        filter: blur(9px);
    }

    .home-creative-wide-banner-frame::before {
        display: none;
    }

    .home-creative-wide-banner-link,
    .home-creative-wide-banner-image {
        border-radius: 11px;
    }

    .home-creative-wide-banner-image {
        height: 132px !important;
        max-height: 132px !important;
        object-fit: cover !important;
    }

    .home-creative-wide-banner-frame:hover {
        transform: none;
    }

    .home-creative-wide-banner-frame:hover .home-creative-wide-banner-image {
        transform: none;
        filter: none;
    }
}

@media (max-width: 399.98px) {
    .home-creative-wide-banner-image {
        height: 118px !important;
        max-height: 118px !important;
    }
}

/* Desktop only: increase creative wide banner height by 30% */
@media (min-width: 992px) {
    .home-creative-wide-banner-image {
        height: 215px !important;
        max-height: 215px !important;
    }
}

/* =============================================================
   WIDE BANNER WIDTH — exactly match Clearance Sale section
   Uses the same Bootstrap container width and side spacing.
   ============================================================= */
.home-creative-wide-banner-section .container {
    width: 100% !important;
    max-width: 1380px !important;
    margin-inline: auto !important;
    padding-right: var(--bs-gutter-x, .75rem) !important;
    padding-left: var(--bs-gutter-x, .75rem) !important;
}

.home-creative-wide-banner-frame {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 1399.98px) {
    .home-creative-wide-banner-section .container {
        max-width: 100% !important;
    }
}

@media (max-width: 767.98px) {
    .home-creative-wide-banner-section .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 10px !important;
        padding-left: 10px !important;
    }
}

/* =============================================================
   MOBILE BANNER OVERFLOW FIX
   Keeps the banner inside the responsive viewport.
   ============================================================= */
@media (max-width: 767.98px) {
    .home-creative-wide-banner-section {
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .home-creative-wide-banner-section .container {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: auto !important;
        padding-inline: 10px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .home-creative-wide-banner-frame,
    .home-creative-wide-banner-link,
    .home-creative-wide-banner-image {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .home-creative-wide-banner-frame {
        margin: 0 !important;
        overflow: hidden !important;
    }

    .home-creative-wide-banner-frame::after {
        inset-inline-end: 0 !important;
        right: 0 !important;
        left: auto !important;
        width: 34% !important;
        filter: blur(8px) !important;
    }

    .home-creative-wide-banner-frame:hover {
        transform: none !important;
    }
}

/* =============================================================
   3STORE 2026 — Latest products + Deal of the Day
   ============================================================= */
.home-modern-latest-deal-section .container {
    max-width: 1380px;
}

.home-modern-latest-deal-layout {
    display: grid;
    grid-template-columns: minmax(245px, 290px) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

/* ---------------- Deal bag ---------------- */
.home-modern-daily-deal-column {
    min-width: 0;
}

.home-modern-daily-deal-card {
    position: relative;
    min-height: 100%;
    margin-top: 34px;
    padding: 38px 16px 18px;
    overflow: visible !important;
    border: 1px solid rgba(27, 149, 68, .75) !important;
    border-radius: 22px !important;
    background:
        linear-gradient(180deg, rgba(235, 249, 241, .96) 0%, rgba(248, 253, 250, .98) 100%) !important;
    box-shadow: 0 14px 34px rgba(22, 101, 52, .08);
}

.home-modern-daily-deal-card::before {
    content: "";
    position: absolute;
    top: -33px;
    left: 50%;
    width: 120px;
    height: 64px;
    transform: translateX(-50%);
    border: 8px solid #1b9544;
    border-bottom: 0;
    border-radius: 70px 70px 0 0;
    background: transparent;
    pointer-events: none;
}

.home-modern-daily-deal-card::after {
    content: "";
    position: absolute;
    top: 25px;
    left: 50%;
    width: 136px;
    height: 16px;
    transform: translateX(-50%);
    background:
        radial-gradient(circle at 8px 8px, #1b9544 0 5px, transparent 6px),
        radial-gradient(circle at 128px 8px, #1b9544 0 5px, transparent 6px);
    pointer-events: none;
}

.deal-bag-title {
    position: relative;
    z-index: 2;
    margin-bottom: 13px;
    text-align: center;
}

.deal-bag-title h2 {
    margin: 0;
    color: #1b9544;
    font-size: 17px;
    font-weight: 800;
}

.home-modern-daily-deal-product {
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .13);
    border-radius: 17px;
    background: #fff;
}

.home-modern-daily-deal-media {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    height: 245px;
    padding: 10px;
    overflow: hidden;
    background: #fff;
}

.home-modern-daily-deal-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform .28s ease;
}

.home-modern-daily-deal-card:hover .home-modern-daily-deal-media img {
    transform: scale(1.035);
}

.home-modern-daily-deal-discount {
    position: absolute;
    z-index: 3;
    top: 10px;
    inset-inline-end: 10px;
    min-height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 8px;
    background: #18a44b;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
}

.home-modern-daily-deal-content {
    padding: 13px 14px 16px;
    border-top: 1px solid rgba(22, 101, 52, .08);
    text-align: center;
}

.home-modern-daily-deal-rating {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 26px;
    margin-bottom: 8px;
    padding: 0 8px;
    border-radius: 999px;
    background: rgba(255, 250, 240, .8);
    color: #4b5563;
    font-size: 10px;
}

.home-modern-daily-deal-name {
    display: -webkit-box;
    min-height: 48px;
    overflow: hidden;
    color: #1f2937 !important;
    font-size: 15px;
    line-height: 1.55;
    font-weight: 700;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.home-modern-daily-deal-prices {
    min-height: 48px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 6px;
}

.home-modern-daily-deal-current {
    color: #1b9544;
    font-size: 17px;
    font-weight: 800;
}

.home-modern-daily-deal-prices del {
    color: #9ca3af;
    font-size: 12px;
}

.home-modern-daily-deal-button {
    min-height: 42px;
    margin-top: 8px;
    padding: 0 18px;
    border: 0;
    border-radius: 11px;
    background: #1b9544;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    transition: transform .2s ease, background-color .2s ease;
}

.home-modern-daily-deal-button:hover {
    background: #167c39;
    transform: translateY(-1px);
}

/* ---------------- Latest products ---------------- */
.home-modern-latest-products-card {
    padding: 18px;
    border: 1px solid rgba(22, 101, 52, .09);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(247,252,248,.96) 100%);
    box-shadow: 0 10px 32px rgba(22, 101, 52, .06);
}

.home-modern-latest-products-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255,255,255,.86);
}

.home-modern-latest-products-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-modern-latest-products-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #ecf8f0;
    color: #1b9544;
}

.home-modern-latest-products-icon svg {
    width: 22px;
    height: 22px;
}

.home-modern-latest-products-heading h2 {
    margin: 0;
    color: #20262b;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-latest-products-heading p {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.5;
}

.home-modern-latest-products-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 11px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-latest-products-view-all:hover {
    border-color: rgba(27, 149, 68, .26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-latest-products-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.home-modern-latest-product-item {
    min-width: 0;
    height: 100%;
}

.home-modern-latest-product-item .store-creative-product-card {
    height: 100%;
}

@media (max-width: 1199.98px) {
    .home-modern-latest-deal-layout {
        grid-template-columns: minmax(230px, 260px) minmax(0, 1fr);
        gap: 16px;
    }

    .home-modern-latest-products-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .home-modern-daily-deal-media {
        height: 220px;
    }
}

@media (max-width: 991.98px) {
    .home-modern-latest-deal-layout {
        grid-template-columns: 1fr;
    }

    .home-modern-daily-deal-column {
        order: 1;
    }

    .home-modern-latest-products-column {
        order: 2;
    }

    .home-modern-daily-deal-card {
        max-width: 430px;
        margin: 34px auto 0;
    }

    .home-modern-latest-products-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .home-modern-latest-deal-section .container {
        padding-inline: 10px;
    }

    .home-modern-latest-products-card {
        padding: 10px 8px 12px;
        border-radius: 17px;
    }

    .home-modern-latest-products-heading {
        gap: 10px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-latest-products-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-latest-products-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-latest-products-heading h2 {
        font-size: 16px;
    }

    .home-modern-latest-products-heading p {
        display: none;
    }

    .home-modern-latest-products-view-all {
        min-height: 32px;
        padding-inline: 10px;
        border-radius: 9px;
        font-size: 11px;
    }

    .home-modern-latest-products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .home-modern-daily-deal-card {
        max-width: 360px;
        margin-top: 31px;
        padding: 34px 10px 12px;
        border-radius: 18px !important;
    }

    .home-modern-daily-deal-card::before {
        width: 100px;
        height: 54px;
        top: -28px;
        border-width: 7px;
    }

    .home-modern-daily-deal-card::after {
        top: 22px;
        width: 114px;
        background:
            radial-gradient(circle at 8px 8px, #1b9544 0 4px, transparent 5px),
            radial-gradient(circle at 106px 8px, #1b9544 0 4px, transparent 5px);
    }

    .home-modern-daily-deal-media {
        height: 220px;
    }

    .home-modern-daily-deal-content {
        padding: 11px 11px 14px;
    }

    .home-modern-daily-deal-name {
        min-height: 44px;
        font-size: 13px;
    }

    .home-modern-daily-deal-current {
        font-size: 15px;
    }
}

@media (max-width: 380px) {
    .home-modern-latest-deal-section .container {
        padding-inline: 6px;
    }

    .home-modern-latest-products-grid {
        gap: 6px;
    }

    .home-modern-daily-deal-card {
        max-width: 330px;
    }

    .home-modern-daily-deal-media {
        height: 200px;
    }
}

/* =============================================================
   MOBILE DEAL BAG — horizontal premium layout
   Desktop/tablet design remains unchanged.
   ============================================================= */
@media (max-width: 767.98px) {
    .home-modern-daily-deal-card {
        max-width: 100%;
        margin: 34px 0 0;
        padding: 38px 10px 12px;
        border-radius: 20px !important;
    }

    .home-modern-daily-deal-product {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0, 1.05fr) minmax(145px, .95fr);
        grid-template-areas: "content media";
        align-items: stretch;
        min-height: 250px;
        overflow: hidden;
        border-radius: 18px;
        background: #fff;
    }

    html[dir="rtl"] .home-modern-daily-deal-product {
        grid-template-areas: "content media";
    }

    html[dir="ltr"] .home-modern-daily-deal-product {
        grid-template-areas: "media content";
    }

    .home-modern-daily-deal-media {
        grid-area: media;
        width: 100%;
        height: 100%;
        min-height: 250px;
        padding: 16px 10px 34px;
        overflow: hidden;
        border-radius: 0;
        background:
            radial-gradient(circle at 50% 56%, rgba(36,197,91,.08), transparent 57%),
            #fff;
    }

    .home-modern-daily-deal-media img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        transform: none !important;
    }

    .home-modern-daily-deal-content {
        grid-area: content;
        min-width: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        padding: 22px 12px 18px 16px;
        border-top: 0;
        text-align: start;
    }

    html[dir="rtl"] .home-modern-daily-deal-content {
        align-items: flex-start;
        text-align: right;
    }

    html[dir="ltr"] .home-modern-daily-deal-content {
        align-items: flex-start;
        text-align: left;
    }

    .home-modern-daily-deal-rating {
        order: 3;
        margin: 8px 0 0;
    }

    .home-modern-daily-deal-name {
        order: 1;
        width: 100%;
        min-height: auto;
        margin-bottom: 8px;
        font-size: 14px;
        line-height: 1.55;
        -webkit-line-clamp: 3;
    }

    .home-modern-daily-deal-prices {
        order: 2;
        min-height: 42px;
        justify-content: flex-start;
        margin-top: 0;
    }

    .home-modern-daily-deal-current {
        font-size: 16px;
    }

    .home-modern-daily-deal-button {
        order: 4;
        min-height: 40px;
        margin-top: 12px;
        padding-inline: 16px;
        border-radius: 12px;
        background: #fff;
        color: #111;
        box-shadow: 0 7px 18px rgba(22, 101, 52, .08);
        border: 1px solid rgba(22, 101, 52, .08);
    }

    .home-modern-daily-deal-button:hover {
        background: #f7fbf8;
        color: #1b9544;
        transform: none;
    }

    .home-modern-daily-deal-discount {
        top: auto;
        bottom: 33px;
        inset-inline-end: 10px;
        min-height: 27px;
        border-radius: 8px 8px 0 8px;
        font-size: 10px;
        box-shadow: 0 5px 12px rgba(220,38,38,.16);
    }

    .home-modern-daily-deal-stock {
        position: absolute;
        z-index: 4;
        inset-inline: 0;
        bottom: 0;
        min-height: 28px;
        display: grid;
        place-items: center;
        padding: 4px 8px;
        background: #ef4444;
        color: #fff;
        font-size: 11px;
        font-weight: 800;
    }

    .deal-bag-title {
        margin-bottom: 12px;
    }

    .deal-bag-title h2 {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 38px;
        padding: 0 20px;
        border-radius: 999px;
        background: linear-gradient(135deg, #24c55b, #4fdc7c);
        color: #fff;
        box-shadow: 0 8px 18px rgba(27,149,68,.20);
    }
}

@media (max-width: 430px) {
    .home-modern-daily-deal-product {
        grid-template-columns: minmax(0, 1fr) minmax(132px, .9fr);
        min-height: 235px;
    }

    .home-modern-daily-deal-media {
        min-height: 235px;
        padding-inline: 6px;
    }

    .home-modern-daily-deal-content {
        padding: 18px 8px 15px 11px;
    }

    .home-modern-daily-deal-name {
        font-size: 12.5px;
    }

    .home-modern-daily-deal-current {
        font-size: 14px;
    }

    .home-modern-daily-deal-prices del {
        font-size: 10px;
    }

    .home-modern-daily-deal-button {
        min-height: 37px;
        padding-inline: 13px;
        font-size: 11.5px;
    }
}

@media (max-width: 360px) {
    .home-modern-daily-deal-product {
        grid-template-columns: minmax(0, 1fr) 122px;
    }

    .home-modern-daily-deal-content {
        padding-inline: 8px;
    }

    .home-modern-daily-deal-name {
        font-size: 11.8px;
    }
}

/* =============================================================
   DEAL BAG HANDLE — refined desktop + mobile spacing
   ============================================================= */

/* Desktop/tablet handle */
.home-modern-daily-deal-card {
    margin-top: 48px !important;
    padding-top: 46px !important;
}

.home-modern-daily-deal-card::before {
    top: -39px !important;
    width: 132px !important;
    height: 74px !important;
    border-width: 9px !important;
    border-color: #1b9544 !important;
    border-bottom: 0 !important;
    border-radius: 78px 78px 0 0 !important;
}

.home-modern-daily-deal-card::after {
    top: 28px !important;
    width: 148px !important;
    height: 18px !important;
    background:
        radial-gradient(circle at 9px 9px, #1b9544 0 5.5px, transparent 6.5px),
        radial-gradient(circle at 139px 9px, #1b9544 0 5.5px, transparent 6.5px) !important;
}

.deal-bag-title {
    margin-top: 2px !important;
}

/* Mobile: give the handle breathing room from the banner above */
@media (max-width: 767.98px) {
    .home-modern-daily-deal-column {
        padding-top: 18px !important;
    }

    .home-modern-daily-deal-card {
        margin-top: 46px !important;
        padding-top: 44px !important;
    }

    .home-modern-daily-deal-card::before {
        top: -36px !important;
        width: 112px !important;
        height: 66px !important;
        border-width: 8px !important;
        border-radius: 68px 68px 0 0 !important;
    }

    .home-modern-daily-deal-card::after {
        top: 26px !important;
        width: 126px !important;
        height: 16px !important;
        background:
            radial-gradient(circle at 8px 8px, #1b9544 0 4.5px, transparent 5.5px),
            radial-gradient(circle at 118px 8px, #1b9544 0 4.5px, transparent 5.5px) !important;
    }

    .deal-bag-title {
        margin-top: 0 !important;
        margin-bottom: 12px !important;
    }

    .deal-bag-title h2 {
        position: relative;
        z-index: 3;
    }
}

@media (max-width: 430px) {
    .home-modern-daily-deal-column {
        padding-top: 22px !important;
    }

    .home-modern-daily-deal-card {
        margin-top: 48px !important;
    }

    .home-modern-daily-deal-card::before {
        top: -37px !important;
        width: 106px !important;
        height: 63px !important;
        border-width: 7px !important;
    }

    .home-modern-daily-deal-card::after {
        top: 24px !important;
        width: 120px !important;
        background:
            radial-gradient(circle at 8px 8px, #1b9544 0 4px, transparent 5px),
            radial-gradient(circle at 112px 8px, #1b9544 0 4px, transparent 5px) !important;
    }
}

/* =============================================================
   DEAL BAG MOBILE — wider card, higher position, connected handle
   ============================================================= */
@media (max-width: 767.98px) {
    .home-modern-daily-deal-column {
        padding-top: 8px !important;
    }

    .home-modern-daily-deal-card {
        width: calc(100% + 8px) !important;
        max-width: none !important;
        margin-inline: -4px !important;
        margin-top: 38px !important;
        padding-top: 42px !important;
    }

    /* Handle ends now visually meet the two attachment dots */
    .home-modern-daily-deal-card::before {
        top: -34px !important;
        width: 120px !important;
        height: 68px !important;
        border-width: 8px !important;
        border-bottom: 0 !important;
        border-radius: 72px 72px 0 0 !important;
    }

    .home-modern-daily-deal-card::after {
        top: 25px !important;
        width: 120px !important;
        height: 16px !important;
        background:
            radial-gradient(circle at 7px 8px, #1b9544 0 5px, transparent 6px),
            radial-gradient(circle at 113px 8px, #1b9544 0 5px, transparent 6px) !important;
    }

    .deal-bag-title {
        margin-top: -2px !important;
    }
}

@media (max-width: 430px) {
    .home-modern-daily-deal-card {
        width: calc(100% + 12px) !important;
        margin-inline: -6px !important;
        margin-top: 36px !important;
    }

    .home-modern-daily-deal-card::before {
        top: -33px !important;
        width: 114px !important;
        height: 65px !important;
        border-width: 7px !important;
    }

    .home-modern-daily-deal-card::after {
        top: 24px !important;
        width: 114px !important;
        background:
            radial-gradient(circle at 7px 8px, #1b9544 0 4.5px, transparent 5.5px),
            radial-gradient(circle at 107px 8px, #1b9544 0 4.5px, transparent 5.5px) !important;
    }
}

@media (max-width: 360px) {
    .home-modern-daily-deal-card {
        width: calc(100% + 8px) !important;
        margin-inline: -4px !important;
    }
}

/* =============================================================
   DEAL OF THE DAY — Out of stock state
   Gray transparent media on desktop + responsive.
   Desktop also shows the stock tag.
   ============================================================= */
.home-modern-daily-deal-media.is-out-of-stock {
    position: relative;
}

.home-modern-daily-deal-media.is-out-of-stock::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    background: rgba(55, 65, 81, .34);
    pointer-events: none;
}

.home-modern-daily-deal-media.is-out-of-stock img {
    filter: grayscale(.18) saturate(.72);
}

.home-modern-daily-deal-stock {
    position: absolute;
    z-index: 5;
    inset-inline: 12px;
    bottom: 10px;
    min-height: 26px;
    display: grid;
    place-items: center;
    padding: 4px 10px;
    border-radius: 8px;
    background: rgba(220, 38, 38, .94);
    color: #fff;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 800;
    box-shadow: 0 6px 14px rgba(220, 38, 38, .18);
    pointer-events: none;
}

/* Ensure tag is visible on desktop */
@media (min-width: 768px) {
    .home-modern-daily-deal-stock {
        display: grid !important;
    }
}

/* Responsive keeps the full-width bottom bar style */
@media (max-width: 767.98px) {
    .home-modern-daily-deal-media.is-out-of-stock::after {
        background: rgba(55, 65, 81, .38);
    }

    .home-modern-daily-deal-stock {
        inset-inline: 0;
        bottom: 0;
        min-height: 28px;
        border-radius: 0;
        font-size: 11px;
    }
}

/* =============================================================
   3STORE 2026 — Best selling + Top rated creative sections
   ============================================================= */
.home-modern-ranking-section .container {
    max-width: 1380px;
}

.home-modern-ranking-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.home-modern-ranking-card {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(22, 101, 52, .09);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(247,252,248,.96) 100%);
    box-shadow: 0 10px 30px rgba(22, 101, 52, .055);
}

.home-modern-ranking-card::before {
    content: "";
    position: absolute;
    width: 130px;
    height: 130px;
    inset-inline-end: -75px;
    top: -78px;
    border: 1px solid rgba(27,149,68,.08);
    border-radius: 50%;
    pointer-events: none;
}

.home-modern-ranking-heading {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 15px;
    padding: 13px 14px;
    border-radius: 16px;
    background: rgba(255,255,255,.86);
}

.home-modern-ranking-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
}

.home-modern-ranking-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #ecf8f0;
    color: #1b9544;
}

.home-modern-ranking-icon svg {
    width: 21px;
    height: 21px;
}

.home-modern-ranking-heading h2 {
    margin: 0;
    color: #20262b;
    font-size: 19px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-ranking-heading p {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 11.5px;
    line-height: 1.45;
}

.home-modern-ranking-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(22,101,52,.10);
    border-radius: 10px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 12px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-ranking-view-all:hover {
    border-color: rgba(27,149,68,.26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-horizontal-products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.home-modern-horizontal-product {
    position: relative;
    min-width: 0;
    min-height: 142px;
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(22,101,52,.13);
    border-radius: 16px;
    background: #fff;
    color: inherit !important;
    transition: border-color .22s ease, background-color .22s ease;
}

.home-modern-horizontal-product::before {
    content: "";
    position: absolute;
    inset-block: 18px;
    inset-inline-start: 0;
    width: 3px;
    border-radius: 0 999px 999px 0;
    background: linear-gradient(180deg, #1b9544, #65dc90);
    opacity: 0;
    transform: scaleY(.45);
    transition: opacity .22s ease, transform .22s ease;
}

html[dir="rtl"] .home-modern-horizontal-product::before {
    border-radius: 999px 0 0 999px;
}

.home-modern-horizontal-product:hover {
    border-color: rgba(27,149,68,.30);
    background: linear-gradient(180deg, #fff 0%, #fbfefc 100%);
}

.home-modern-horizontal-product:hover::before {
    opacity: 1;
    transform: scaleY(1);
}

.home-modern-horizontal-media {
    position: relative;
    min-height: 142px;
    overflow: hidden;
    background: #fff;
}

.home-modern-horizontal-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 9px;
    transition: transform .25s ease;
}

.home-modern-horizontal-product:hover .home-modern-horizontal-media img {
    transform: scale(1.04) translateY(-2px);
}

.home-modern-horizontal-discount {
    position: absolute;
    z-index: 3;
    top: 8px;
    inset-inline-end: 8px;
    min-height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    border-radius: 8px;
    background: #18a44b;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}

.home-modern-horizontal-stock {
    position: absolute;
    z-index: 3;
    inset-inline: 8px;
    bottom: 8px;
    min-height: 21px;
    display: grid;
    place-items: center;
    padding: 3px 7px;
    border-radius: 7px;
    background: rgba(220,38,38,.94);
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}

.home-modern-horizontal-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 13px 12px;
    border-inline-start: 1px solid rgba(22,101,52,.07);
}

.home-modern-horizontal-content h3 {
    display: -webkit-box;
    min-height: 43px;
    margin: 0 0 8px;
    overflow: hidden;
    color: #1f2937;
    font-size: 13px;
    line-height: 1.55;
    font-weight: 650;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.home-modern-horizontal-prices {
    min-height: 38px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 8px;
}

.home-modern-horizontal-current {
    color: #1b9544;
    font-size: 14px;
    font-weight: 800;
    direction: ltr;
    unicode-bidi: isolate;
}

.home-modern-horizontal-prices del {
    color: #9ca3af;
    font-size: 10.5px;
    direction: ltr;
    unicode-bidi: isolate;
}

.home-modern-horizontal-rating {
    align-self: flex-start;
    min-height: 25px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    background: rgba(255,250,240,.76);
    color: #4b5563;
    font-size: 9.5px;
}

.home-modern-horizontal-rating small {
    color: #8a948d;
}

@media (max-width: 1199.98px) {
    .home-modern-ranking-grid {
        grid-template-columns: 1fr;
    }

    .home-modern-horizontal-products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .home-modern-horizontal-products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .home-modern-ranking-section .container {
        padding-inline: 10px;
    }

    .home-modern-ranking-card {
        padding: 10px 8px 12px;
        border-radius: 17px;
    }

    .home-modern-ranking-heading {
        gap: 9px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-ranking-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-ranking-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-ranking-heading h2 {
        font-size: 16px;
    }

    .home-modern-ranking-heading p {
        display: none;
    }

    .home-modern-ranking-view-all {
        min-height: 32px;
        padding-inline: 9px;
        border-radius: 9px;
        font-size: 11px;
    }

    .home-modern-horizontal-products {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .home-modern-horizontal-product {
        min-height: 126px;
        grid-template-columns: 112px minmax(0, 1fr);
        border-radius: 14px;
    }

    .home-modern-horizontal-media {
        min-height: 126px;
    }

    .home-modern-horizontal-media img {
        padding: 7px;
    }

    .home-modern-horizontal-content {
        padding: 10px;
    }

    .home-modern-horizontal-content h3 {
        min-height: 38px;
        margin-bottom: 6px;
        font-size: 12px;
        line-height: 1.5;
    }

    .home-modern-horizontal-current {
        font-size: 13px;
    }

    .home-modern-horizontal-rating {
        min-height: 23px;
        font-size: 8.8px;
    }
}

@media (max-width: 380px) {
    .home-modern-ranking-section .container {
        padding-inline: 6px;
    }

    .home-modern-horizontal-product {
        grid-template-columns: 100px minmax(0, 1fr);
        min-height: 118px;
    }

    .home-modern-horizontal-media {
        min-height: 118px;
    }

    .home-modern-horizontal-content {
        padding-inline: 8px;
    }

    .home-modern-horizontal-content h3 {
        font-size: 11.3px;
    }

    .home-modern-horizontal-current {
        font-size: 12px;
    }
}

/* =============================================================
   3STORE 2026 — New arrivals creative horizontal carousel
   ============================================================= */
.home-modern-new-arrivals-section .container {
    max-width: 1380px;
}

.home-modern-new-arrivals-card {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(22,101,52,.09);
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(247,252,248,.96) 100%);
    box-shadow: 0 10px 30px rgba(22,101,52,.055);
}

.home-modern-new-arrivals-card::before {
    content: "";
    position: absolute;
    width: 150px;
    height: 150px;
    inset-inline-end: -85px;
    top: -90px;
    border: 1px solid rgba(27,149,68,.08);
    border-radius: 50%;
    pointer-events: none;
}

.home-modern-new-arrivals-heading {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 15px;
    padding: 14px 16px;
    border-radius: 16px;
    background: rgba(255,255,255,.86);
}

.home-modern-new-arrivals-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-modern-new-arrivals-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #ecf8f0;
    color: #1b9544;
}

.home-modern-new-arrivals-icon svg {
    width: 22px;
    height: 22px;
}

.home-modern-new-arrivals-heading h2 {
    margin: 0;
    color: #20262b;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
}

.home-modern-new-arrivals-heading p {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.5;
}

.home-modern-new-arrivals-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(22,101,52,.10);
    border-radius: 11px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-new-arrivals-view-all:hover {
    border-color: rgba(27,149,68,.26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-new-arrivals-carousel-wrap {
    position: relative;
    padding-inline: 48px;
}

.home-modern-new-arrivals-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-new-arrivals-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-new-arrivals-slide {
    width: 100%;
    height: 100%;
    padding: 4px 2px 8px;
}

.home-modern-new-arrival-product {
    position: relative;
    width: 100%;
    min-width: 0;
    min-height: 150px;
    display: grid;
    grid-template-columns: 120px minmax(0,1fr);
    overflow: hidden;
    border: 1px solid rgba(22,101,52,.14);
    border-radius: 16px;
    background: #fff;
    color: inherit !important;
    transition: border-color .22s ease, background-color .22s ease;
}

.home-modern-new-arrival-product::before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 22px;
    bottom: 22px;
    width: 3px;
    border-radius: 999px;
    background: linear-gradient(180deg, #1b9544, #65dc90);
    opacity: 0;
    transform: scaleY(.45);
    transition: opacity .22s ease, transform .22s ease;
}

.home-modern-new-arrival-product:hover {
    border-color: rgba(27,149,68,.30);
    background: linear-gradient(180deg,#fff 0%,#fbfefc 100%);
}

.home-modern-new-arrival-product:hover::before {
    opacity: 1;
    transform: scaleY(1);
}

.home-modern-new-arrival-media {
    position: relative;
    min-height: 150px;
    overflow: hidden;
    background: #fff;
}

.home-modern-new-arrival-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 9px;
    transition: transform .25s ease;
}

.home-modern-new-arrival-product:hover .home-modern-new-arrival-media img {
    transform: scale(1.04) translateY(-2px);
}

.home-modern-new-arrival-discount {
    position: absolute;
    z-index: 3;
    top: 8px;
    inset-inline-end: 8px;
    min-height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    border-radius: 8px;
    background: #18a44b;
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}

.home-modern-new-arrival-stock {
    position: absolute;
    z-index: 3;
    inset-inline: 8px;
    bottom: 8px;
    min-height: 21px;
    display: grid;
    place-items: center;
    padding: 3px 7px;
    border-radius: 7px;
    background: rgba(220,38,38,.94);
    color: #fff;
    font-size: 9px;
    font-weight: 800;
}

.home-modern-new-arrival-content {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 13px 12px;
    border-inline-start: 1px solid rgba(22,101,52,.07);
}

.home-modern-new-arrival-content h3 {
    display: -webkit-box;
    min-height: 43px;
    margin: 0 0 8px;
    overflow: hidden;
    color: #1f2937;
    font-size: 13px;
    line-height: 1.55;
    font-weight: 650;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.home-modern-new-arrival-prices {
    min-height: 38px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 8px;
}

.home-modern-new-arrival-current {
    color: #1b9544;
    font-size: 14px;
    font-weight: 800;
    direction: ltr;
    unicode-bidi: isolate;
}

.home-modern-new-arrival-prices del {
    color: #9ca3af;
    font-size: 10.5px;
    direction: ltr;
    unicode-bidi: isolate;
}

.home-modern-new-arrival-rating {
    align-self: flex-start;
    min-height: 25px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 5px;
    padding: 0 7px;
    border-radius: 999px;
    background: rgba(255,250,240,.76);
    color: #4b5563;
    font-size: 9.5px;
}

.home-modern-new-arrivals-slider .owl-nav,
.home-modern-new-arrivals-slider .owl-dots {
    display: none !important;
}

.home-modern-new-arrivals-control {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(22,101,52,.13);
    border-radius: 11px;
    background-color: rgba(255,255,255,.98);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
    box-shadow: 0 5px 15px rgba(22,101,52,.10);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) scale(.96);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
}

.home-modern-new-arrivals-card:hover .home-modern-new-arrivals-control {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) scale(1);
}

.home-modern-new-arrivals-control--left {
    left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-new-arrivals-control--right {
    right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 991.98px) {
    .home-modern-new-arrivals-carousel-wrap {
        padding-inline: 42px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-new-arrivals-section .container {
        padding-inline: 10px;
    }

    .home-modern-new-arrivals-card {
        padding: 10px 8px 12px;
        border-radius: 17px;
    }

    .home-modern-new-arrivals-heading {
        gap: 10px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-new-arrivals-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-new-arrivals-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-new-arrivals-heading h2 {
        font-size: 16px;
    }

    .home-modern-new-arrivals-heading p {
        display: none;
    }

    .home-modern-new-arrivals-view-all {
        min-height: 32px;
        padding-inline: 10px;
        border-radius: 9px;
        font-size: 11px;
    }

    .home-modern-new-arrivals-carousel-wrap {
        padding-inline: 0;
    }

    .home-modern-new-arrivals-control {
        display: none;
    }

    .home-modern-new-arrivals-slider .owl-item {
        padding: 0 3px !important;
        box-sizing: border-box !important;
    }

    .home-modern-new-arrival-product {
        min-height: 126px;
        grid-template-columns: 108px minmax(0,1fr);
        border-radius: 14px;
    }

    .home-modern-new-arrival-media {
        min-height: 126px;
    }

    .home-modern-new-arrival-media img {
        padding: 7px;
    }

    .home-modern-new-arrival-content {
        padding: 10px;
    }

    .home-modern-new-arrival-content h3 {
        min-height: 38px;
        margin-bottom: 6px;
        font-size: 12px;
        line-height: 1.5;
    }

    .home-modern-new-arrival-current {
        font-size: 13px;
    }

    .home-modern-new-arrival-rating {
        min-height: 23px;
        font-size: 8.8px;
    }
}

@media (max-width: 380px) {
    .home-modern-new-arrivals-section .container {
        padding-inline: 6px;
    }

    .home-modern-new-arrival-product {
        grid-template-columns: 96px minmax(0,1fr);
        min-height: 118px;
    }

    .home-modern-new-arrival-media {
        min-height: 118px;
    }

    .home-modern-new-arrival-content {
        padding-inline: 8px;
    }

    .home-modern-new-arrival-content h3 {
        font-size: 11.3px;
    }

    .home-modern-new-arrival-current {
        font-size: 12px;
    }
}

/* =============================================================
   NEW ARRIVALS — remove legacy Owl arrows + section spacing
   ============================================================= */
.home-modern-new-arrivals-card .owl-nav,
.home-modern-new-arrivals-card .owl-prev,
.home-modern-new-arrivals-card .owl-next,
.home-modern-new-arrivals-card [class*="owl-prev"],
.home-modern-new-arrivals-card [class*="owl-next"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.home-modern-new-arrivals-card .home-modern-new-arrivals-control {
    display: grid !important;
    visibility: hidden;
    opacity: 0;
}

.home-modern-new-arrivals-card:hover .home-modern-new-arrivals-control {
    visibility: visible;
    opacity: 1;
}

.home-modern-new-arrivals-section {
    margin-bottom: 22px;
}

.home-modern-ranking-section {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .home-modern-new-arrivals-section {
        margin-bottom: 16px;
    }

    .home-modern-new-arrivals-card .home-modern-new-arrivals-control {
        display: none !important;
    }
}

/* =============================================================
   3STORE 2026 — Promotional footer banners
   Same dimensions, refined edges and approved carousel arrows.
   ============================================================= */
.home-modern-promo-banners-section .container {
    max-width: 1380px;
}

.home-modern-promo-banners-wrap {
    position: relative;
    padding-inline: 48px;
}

.home-modern-promo-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-promo-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-promo-slide {
    width: 100%;
    height: 100%;
    padding: 4px 2px 10px;
}

.home-modern-promo-card {
    position: relative;
    isolation: isolate;
    display: block;
    width: 100%;
    height: 100%;
    padding: 5px;
    overflow: hidden;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 18px;
    background: linear-gradient(135deg, #fff 0%, #f5fbf7 100%);
    box-shadow: 0 8px 24px rgba(22, 101, 52, .055);
    transition:
        transform .26s ease,
        border-color .26s ease,
        box-shadow .26s ease;
}

.home-modern-promo-card::before {
    content: "";
    position: absolute;
    z-index: 3;
    inset: 5px;
    border-radius: 13px;
    background:
        linear-gradient(
            110deg,
            transparent 0%,
            rgba(255,255,255,0) 36%,
            rgba(255,255,255,.30) 49%,
            rgba(255,255,255,0) 62%,
            transparent 100%
        );
    transform: translateX(-125%);
    pointer-events: none;
    transition: transform .72s ease;
}

html[dir="rtl"] .home-modern-promo-card::before {
    transform: translateX(125%);
}

.home-modern-promo-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 15px;
    bottom: 15px;
    inset-inline-end: -8px;
    width: 38%;
    border-radius: 18px;
    background: rgba(36, 197, 91, .065);
    filter: blur(12px);
    opacity: .7;
    pointer-events: none;
}

.home-modern-promo-image {
    display: block;
    width: 100% !important;
    height: 165px !important;
    max-height: 165px !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 13px;
    transition:
        transform .4s cubic-bezier(.2,.75,.25,1),
        filter .3s ease;
}

.home-modern-promo-card:hover {
    transform: translateY(-3px);
    border-color: rgba(27, 149, 68, .25);
    box-shadow: 0 14px 32px rgba(22, 101, 52, .09);
}

.home-modern-promo-card:hover::before {
    transform: translateX(125%);
}

html[dir="rtl"] .home-modern-promo-card:hover::before {
    transform: translateX(-125%);
}

.home-modern-promo-card:hover .home-modern-promo-image {
    transform: scale(1.012);
    filter: saturate(1.025) contrast(1.01);
}

.home-modern-promo-slider .owl-nav,
.home-modern-promo-slider .owl-dots,
.home-modern-promo-slider .owl-prev,
.home-modern-promo-slider .owl-next {
    display: none !important;
}

.home-modern-promo-control {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(22, 101, 52, .13);
    border-radius: 11px;
    background-color: rgba(255,255,255,.98);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
    box-shadow: 0 5px 15px rgba(22, 101, 52, .10);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) scale(.96);
    transition:
        opacity .18s ease,
        visibility .18s ease,
        transform .18s ease,
        border-color .18s ease,
        background-color .18s ease;
}

.home-modern-promo-banners-wrap:hover .home-modern-promo-control {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) scale(1);
}

.home-modern-promo-control--left {
    left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-promo-control--right {
    right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-promo-control:hover {
    border-color: #1b9544;
    background-color: #1b9544;
}

.home-modern-promo-control--left:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-promo-control--right:hover {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-promo-single-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
}

@media (max-width: 991.98px) {
    .home-modern-promo-banners-wrap {
        padding-inline: 42px;
    }

    .home-modern-promo-image {
        height: 150px !important;
        max-height: 150px !important;
    }
}

@media (max-width: 767.98px) {
    .home-modern-promo-banners-section .container {
        padding-inline: 10px;
    }

    .home-modern-promo-banners-wrap {
        padding-inline: 0;
    }

    .home-modern-promo-control {
        display: none !important;
    }

    .home-modern-promo-slide {
        padding: 2px 0 8px;
    }

    .home-modern-promo-card {
        padding: 4px;
        border-radius: 15px;
        transform: none !important;
    }

    .home-modern-promo-card::before {
        display: none;
    }

    .home-modern-promo-card::after {
        inset-inline-end: 0;
        filter: blur(8px);
    }

    .home-modern-promo-image {
        height: 132px !important;
        max-height: 132px !important;
        border-radius: 11px;
    }

    .home-modern-promo-card:hover .home-modern-promo-image {
        transform: none;
        filter: none;
    }
}

@media (max-width: 399.98px) {
    .home-modern-promo-image {
        height: 118px !important;
        max-height: 118px !important;
    }
}

/* =============================================================
   PROMO BANNERS — desktop height increase + remove rear shadow
   ============================================================= */
@media (min-width: 992px) {
    .home-modern-promo-image {
        height: 195px !important;
        max-height: 195px !important;
    }

    .home-modern-promo-card {
        background: transparent !important;
        box-shadow: none !important;
    }

    .home-modern-promo-card::after {
        display: none !important;
        content: none !important;
    }

    .home-modern-promo-card:hover {
        box-shadow: none !important;
    }
}

/* =============================================================
   3STORE 2026 — Category product sections
   ============================================================= */
.home-modern-category-products-section .container {
    max-width: 1380px;
}

.home-modern-category-products-card {
    position: relative;
    overflow: hidden;
    padding: 18px;
    border: 1px solid rgba(22,101,52,.09);
    border-radius: 22px;
    background:
        radial-gradient(circle at 93% 2%, rgba(36,197,91,.07), transparent 27%),
        linear-gradient(135deg, rgba(255,255,255,.98) 0%, rgba(247,252,248,.96) 100%);
    box-shadow: 0 10px 30px rgba(22,101,52,.055);
}

.home-modern-category-products-card::before {
    content: "";
    position: absolute;
    width: 145px;
    height: 145px;
    inset-inline-start: -88px;
    bottom: -92px;
    border: 1px solid rgba(27,149,68,.08);
    border-radius: 50%;
    pointer-events: none;
}

.home-modern-category-products-heading {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
    padding: 15px 16px;
    border: 1px solid rgba(22,101,52,.07);
    border-radius: 16px;
    background:
        linear-gradient(100deg, rgba(255,255,255,.96) 0%, rgba(244,252,247,.92) 100%);
}

.home-modern-category-products-title-wrap {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.home-modern-category-products-icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: #ecf8f0;
    color: #1b9544;
    box-shadow: inset 0 0 0 1px rgba(27,149,68,.08);
}

.home-modern-category-products-icon svg {
    width: 22px;
    height: 22px;
}

.home-modern-category-products-title {
    margin: 0;
    color: #20262b;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 800;
}

.home-modern-category-products-subtitle {
    margin: 3px 0 0;
    color: #6b7280;
    font-size: 12px;
    line-height: 1.5;
}

.home-modern-category-products-view-all {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid rgba(22,101,52,.10);
    border-radius: 11px;
    background: #fff;
    color: #1b9544 !important;
    font-size: 13px;
    font-weight: 600;
    transition: border-color .2s ease, background-color .2s ease, transform .2s ease;
}

.home-modern-category-products-view-all:hover {
    border-color: rgba(27,149,68,.26);
    background: #f3fbf6;
    transform: translateY(-1px);
}

.home-modern-category-products-carousel-wrap {
    position: relative;
    padding-inline: 48px;
}

.home-modern-category-products-slider .owl-stage {
    display: flex;
    align-items: stretch;
}

.home-modern-category-products-slider .owl-item {
    display: flex;
    height: auto;
}

.home-modern-category-product-slide {
    width: 100%;
    height: 100%;
    padding: 4px 2px 8px;
}

.home-modern-category-product-card {
    position: relative;
    width: 100%;
    min-width: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(22,101,52,.16);
    border-radius: 18px;
    background: linear-gradient(180deg,#fff 0%,#fbfefc 100%);
    color: inherit !important;
    transition: border-color .22s ease, background-color .22s ease;
}

.home-modern-category-product-card::before {
    content: "";
    position: absolute;
    z-index: 8;
    top: 0;
    inset-inline: 18px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, transparent, #24c55b, transparent);
    opacity: 0;
    transform: scaleX(.55);
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: none;
}

.home-modern-category-product-card:hover {
    border-color: rgba(27,149,68,.34);
    background: linear-gradient(180deg,#fff 0%,#f7fcf9 100%);
}

.home-modern-category-product-card:hover::before {
    opacity: 1;
    transform: scaleX(1);
}

.home-modern-category-product-media {
    position: relative;
    min-height: 205px;
    overflow: hidden;
    background: #fff;
}

.home-modern-category-product-image-link {
    width: 100%;
    height: 205px;
    display: grid;
    place-items: center;
}

.home-modern-category-product-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
    transition: transform .26s ease;
}

.home-modern-category-product-card:hover .home-modern-category-product-image {
    transform: scale(1.035);
}

.home-modern-category-product-discount {
    position: absolute;
    z-index: 4;
    top: 10px;
    inset-inline-end: 10px;
    min-height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 9px;
    border-radius: 9px;
    background: #18a44b;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 6px 14px rgba(24,164,75,.18);
}

.home-modern-category-product-stock-overlay {
    position: absolute;
    z-index: 2;
    inset: 0;
    background: rgba(31,41,55,.34);
    pointer-events: none;
}

.home-modern-category-product-stock {
    position: absolute;
    z-index: 5;
    inset-inline: 10px;
    bottom: 9px;
    min-height: 22px;
    display: grid;
    place-items: center;
    padding: 3px 8px;
    border-radius: 7px;
    background: rgba(220,38,38,.94);
    color: #fff;
    font-size: 9.5px;
    font-weight: 800;
}

.home-modern-category-product-content {
    min-height: 126px;
    display: grid;
    grid-template-rows: 48px 58px;
    gap: 7px;
    padding: 11px 10px 10px;
}

.home-modern-category-product-title {
    display: -webkit-box;
    height: 48px;
    min-height: 48px;
    overflow: hidden;
    color: #1f2937 !important;
    font-size: 12.5px;
    line-height: 1.5;
    font-weight: 650;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.home-modern-category-product-meta {
    position: relative;
    min-height: 58px;
    display: grid;
    grid-template-columns: minmax(0,1fr) max-content;
    grid-template-rows: 25px 17px;
    align-items: center;
    gap: 4px 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(22,101,52,.08);
}

.home-modern-category-product-prices {
    display: contents;
}

.home-modern-category-product-current {
    grid-column: 1;
    grid-row: 1;
    color: #1b9544;
    font-size: 14px;
    font-weight: 800;
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
}

.home-modern-category-product-prices del {
    grid-column: 1;
    grid-row: 2;
    color: #9ca3af;
    font-size: 10px;
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home-modern-category-product-rating {
    grid-column: 2;
    grid-row: 1 / span 2;
    min-width: 50px;
    height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(255,250,240,.76);
    color: #4b5563;
    font-size: 9px;
    white-space: nowrap;
}

.home-modern-category-products-slider .owl-nav,
.home-modern-category-products-slider .owl-dots,
.home-modern-category-products-slider .owl-prev,
.home-modern-category-products-slider .owl-next {
    display: none !important;
}

.home-modern-category-products-control {
    position: absolute;
    z-index: 20;
    top: 50%;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(22,101,52,.13);
    border-radius: 11px;
    background-color: rgba(255,255,255,.98);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 19px 19px;
    box-shadow: 0 5px 15px rgba(22,101,52,.10);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-50%) scale(.96);
    transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
}

.home-modern-category-products-card:hover .home-modern-category-products-control {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) scale(1);
}

.home-modern-category-products-control--left {
    left: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M15 5l-7 7 7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.home-modern-category-products-control--right {
    right: 5px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 5l7 7-7 7' fill='none' stroke='%231B9544' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

@media (max-width: 1199.98px) {
    .home-modern-category-product-media,
    .home-modern-category-product-image-link {
        min-height: 185px;
        height: 185px;
    }
}

@media (max-width: 991.98px) {
    .home-modern-category-products-carousel-wrap {
        padding-inline: 42px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-category-products-section .container {
        padding-inline: 10px;
    }

    .home-modern-category-products-card {
        padding: 10px 8px 12px;
        border-radius: 17px;
    }

    .home-modern-category-products-heading {
        gap: 10px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 13px;
    }

    .home-modern-category-products-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        border-radius: 10px;
    }

    .home-modern-category-products-icon svg {
        width: 18px;
        height: 18px;
    }

    .home-modern-category-products-title {
        font-size: 16px;
    }

    .home-modern-category-products-subtitle {
        display: none;
    }

    .home-modern-category-products-view-all {
        min-height: 32px;
        padding-inline: 10px;
        border-radius: 9px;
        font-size: 11px;
    }

    .home-modern-category-products-carousel-wrap {
        padding-inline: 0;
    }

    .home-modern-category-products-control {
        display: none !important;
    }

    .home-modern-category-products-slider .owl-stage-outer {
        padding: 4px 4px 10px !important;
        margin: -4px -4px -10px !important;
    }

    .home-modern-category-products-slider .owl-item {
        padding: 0 3px !important;
        box-sizing: border-box !important;
    }

    .home-modern-category-product-media,
    .home-modern-category-product-image-link {
        min-height: 165px;
        height: 165px;
    }

    .home-modern-category-product-content {
        min-height: 118px;
        grid-template-rows: 44px 54px;
        padding: 9px 9px 9px;
    }

    .home-modern-category-product-title {
        height: 44px;
        min-height: 44px;
        font-size: 11.3px;
        line-height: 1.45;
    }

    .home-modern-category-product-current {
        font-size: 12.5px;
    }

    .home-modern-category-product-rating {
        min-width: 48px;
        height: 24px;
        font-size: 8.3px;
    }
}

@media (max-width: 380px) {
    .home-modern-category-products-section .container {
        padding-inline: 6px;
    }

    .home-modern-category-product-media,
    .home-modern-category-product-image-link {
        min-height: 150px;
        height: 150px;
    }

    .home-modern-category-product-content {
        min-height: 126px;
        grid-template-rows: 50px 58px;
        padding-inline: 8px;
    }

    .home-modern-category-product-title {
        height: 50px;
        min-height: 50px;
        font-size: 10.7px;
    }

    .home-modern-category-product-current {
        font-size: 11.5px;
    }
}

/* =============================================================
   CATEGORY SECTIONS — Creative container only
   Product cards remain exactly as they are.
   ============================================================= */
.home-modern-category-products-section {
    position: relative;
}

.home-modern-category-products-card {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 20px;
    border: 1px solid rgba(22, 101, 52, .10);
    border-radius: 26px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.94) 0%, rgba(250,251,251,.78) 100%);
    box-shadow: none;
}

/* Soft diagonal decorative band */
.home-modern-category-products-card::after {
    content: "";
    position: absolute;
    z-index: -1;
    width: 420px;
    height: 125px;
    inset-inline-end: -115px;
    top: 70px;
    border-radius: 999px;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,.22) 55%,
            rgba(255,255,255,0) 100%
        );
    transform: rotate(-12deg);
    pointer-events: none;
}

/* Decorative corner pattern */
.home-modern-category-products-heading::after {
    display: none;
    content: none;
}

.home-modern-category-products-heading {
    position: relative;
    overflow: hidden;
    margin-bottom: 18px;
    padding: 16px 18px;
    border: 1px solid rgba(22,101,52,.09);
    border-radius: 18px;
    background: rgba(255,255,255,.48);
    box-shadow: none;
}

/* Strong vertical accent beside category name */
.home-modern-category-products-heading::before {
    content: "";
    position: absolute;
    inset-block: 12px;
    inset-inline-start: 0;
    width: 4px;
    border-radius: 0 999px 999px 0;
    background: linear-gradient(180deg, #1b9544 0%, #65dc90 100%);
}

html[dir="rtl"] .home-modern-category-products-heading::before {
    border-radius: 999px 0 0 999px;
}

.home-modern-category-products-icon {
    position: relative;
    width: 48px;
    height: 48px;
    flex-basis: 48px;
    border-radius: 16px;
    background:
        linear-gradient(145deg, #1b9544 0%, #29c85e 100%);
    color: #fff;
    box-shadow: 0 9px 20px rgba(27,149,68,.18);
}

.home-modern-category-products-icon::after {
    content: "";
    position: absolute;
    inset: 5px;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 11px;
}

.home-modern-category-products-title {
    font-size: 22px;
    letter-spacing: -.2px;
}

.home-modern-category-products-subtitle {
    color: #587064;
}

.home-modern-category-products-carousel-wrap {
    position: relative;
    padding: 16px 48px 12px;
    border: 1px solid rgba(22,101,52,.07);
    border-radius: 19px;
    background: rgba(255,255,255,.28);
    box-shadow: none;
}

/* Fine line under the product area */
.home-modern-category-products-carousel-wrap::after {
    content: "";
    position: absolute;
    inset-inline: 52px;
    bottom: 5px;
    height: 1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(27,149,68,.15) 22%,
            rgba(27,149,68,.15) 78%,
            transparent
        );
    pointer-events: none;
}

@media (max-width: 991.98px) {
    .home-modern-category-products-card {
        padding: 16px;
        border-radius: 22px;
    }

    .home-modern-category-products-heading {
        padding: 14px 15px;
        border-radius: 16px;
    }

    .home-modern-category-products-carousel-wrap {
        padding-inline: 42px;
    }
}

@media (max-width: 767.98px) {
    .home-modern-category-products-card {
        padding: 10px 8px 12px;
        border-radius: 18px;
        box-shadow: 0 10px 26px rgba(22,101,52,.055);
    }

    .home-modern-category-products-card::after {
        display: none;
    }

    .home-modern-category-products-heading {
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 14px;
    }

    .home-modern-category-products-heading::after {
        display: none;
    }

    .home-modern-category-products-heading::before {
        inset-block: 9px;
        width: 3px;
    }

    .home-modern-category-products-icon {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        border-radius: 11px;
        box-shadow: 0 6px 15px rgba(27,149,68,.15);
    }

    .home-modern-category-products-icon::after {
        inset: 4px;
        border-radius: 8px;
    }

    .home-modern-category-products-title {
        font-size: 16px;
    }

    .home-modern-category-products-carousel-wrap {
        padding: 8px 0 6px;
        border-radius: 14px;
        background: rgba(255,255,255,.58);
    }

    .home-modern-category-products-carousel-wrap::after {
        display: none;
    }
}

@media (max-width: 380px) {
    .home-modern-category-products-card {
        padding-inline: 6px;
    }

    .home-modern-category-products-heading {
        padding-inline: 8px;
    }
}

/* =============================================================
   3STORE — Formal Deal of the Day card
   Neutral, shadow-free presentation for desktop and responsive.
   ============================================================= */
.home-modern-daily-deal-column {
    padding-top: 0 !important;
}

.home-modern-daily-deal-card {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 16px !important;
    overflow: hidden !important;
    border: 1px solid rgba(31, 41, 55, .065) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(36,197,91,.018), transparent 34%),
        linear-gradient(135deg, #ffffff 0%, rgba(250,251,251,.97) 100%) !important;
    box-shadow: none !important;
}

.home-modern-daily-deal-card::before,
.home-modern-daily-deal-card::after {
    display: none !important;
    content: none !important;
}

.deal-bag-title {
    margin: 0 0 16px !important;
    padding: 2px 2px 13px !important;
    border-bottom: 1px solid rgba(31, 41, 55, .075) !important;
    border-radius: 0 !important;
    background: transparent !important;
    text-align: start !important;
}

.deal-bag-title h2 {
    display: block !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #20262b !important;
    font-size: 17px !important;
    line-height: 1.45 !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

.home-modern-daily-deal-product {
    border-color: rgba(31, 41, 55, .09) !important;
    background: #fff !important;
    box-shadow: none !important;
}

.home-modern-daily-deal-media {
    background: #fff !important;
}

.home-modern-daily-deal-content {
    border-color: rgba(31, 41, 55, .07) !important;
    background: #fff !important;
}

.home-modern-daily-deal-button,
.home-modern-daily-deal-button:hover {
    border: 0 !important;
    background: #1b9544 !important;
    color: #fff !important;
    box-shadow: none !important;
}

@media (max-width: 991.98px) {
    .home-modern-daily-deal-card {
        max-width: 560px !important;
        margin-inline: auto !important;
    }
}

@media (max-width: 767.98px) {
    .home-modern-daily-deal-column {
        padding-top: 0 !important;
    }

    .home-modern-daily-deal-card {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 12px !important;
        border-radius: 17px !important;
    }

    .deal-bag-title {
        margin-bottom: 11px !important;
        padding: 2px 2px 10px !important;
        border-radius: 0 !important;
    }

    .deal-bag-title h2 {
        padding: 0 !important;
        font-size: 15px !important;
    }

    .home-modern-daily-deal-product {
        border-radius: 15px !important;
    }

    .home-modern-daily-deal-media {
        background: #fff !important;
    }

    .home-modern-daily-deal-button {
        background: #1b9544 !important;
        color: #fff !important;
        border: 0 !important;
        box-shadow: none !important;
    }
}

@media (max-width: 430px) {
    .home-modern-daily-deal-card {
        width: 100% !important;
        margin-inline: 0 !important;
        padding: 10px !important;
    }
}

/* =============================================================
   3STORE - Deal of the Day white container
   Explicitly overrides the legacy green .deal_of_the_day panel.
   ============================================================= */
.home-modern-latest-deal-layout .home-modern-daily-deal-column {
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

.home-modern-latest-deal-layout .deal_of_the_day.home-modern-daily-deal-card {
    border: 1px solid rgba(22, 101, 52, .09) !important;
    border-radius: 22px !important;
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
}

.home-modern-latest-deal-layout .deal_of_the_day.home-modern-daily-deal-card .deal-bag-title,
.home-modern-latest-deal-layout .deal_of_the_day.home-modern-daily-deal-card .home-modern-daily-deal-product,
.home-modern-latest-deal-layout .deal_of_the_day.home-modern-daily-deal-card .home-modern-daily-deal-media,
.home-modern-latest-deal-layout .deal_of_the_day.home-modern-daily-deal-card .home-modern-daily-deal-content {
    background-color: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
}

@media (max-width: 767.98px) {
    .home-modern-latest-deal-layout .deal_of_the_day.home-modern-daily-deal-card {
        border-radius: 17px !important;
        background: #fff !important;
        background-image: none !important;
    }
}