/* navabar*/

/* =========================================================
   PREMIUM TOP ANNOUNCEMENT BAR
   WARM CREAM + PEACH + GOLD
========================================================= */

/* =========================================================================
   GOLD BLISS — GLOBAL TYPOGRAPHY (css/gb-typography.css)
   Load this LAST in <head> (after every <style> block).

   Headings : Playfair Display  (elegant, stylish serif)
   Body/UI  : Poppins           (clean, very readable sans)

   Class names / HTML / PHP logic are NOT changed.
   Font Awesome / Bootstrap / Themify icons are excluded, so icons keep working.
   ========================================================================= */

:root {
    --gb-font-heading: "Playfair Display", Georgia, "Times New Roman", serif;
    --gb-font-body: "Poppins", "Segoe UI", Arial, sans-serif;
}


/* -------------------------------------------------------------------------
   1. BODY FONT — everything (except icons)
   :where() keeps specificity at zero so the heading rule below can win.
   ------------------------------------------------------------------------- */

body,
body :where(*:not(i, .fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands, .bi, [class^="ti-"], [class*=" ti-"])) {
    font-family: var(--gb-font-body) !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}


/* -------------------------------------------------------------------------
   2. HEADING FONT — headings + display text (and their <em>/<span> children)
   ------------------------------------------------------------------------- */

body :is(h1, h2, h3, h4, h5, h6,
    .homeban-title,
    .budget-card__price strong,
    .collection-video-modal__title,
    .gb-header__rate-title),
body :is(h1, h2, h3, h4, h5, h6,
    .homeban-title,
    .budget-card__price strong,
    .collection-video-modal__title,
    .gb-header__rate-title) :where(*:not(i, .fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands)) {
    font-family: var(--gb-font-heading) !important;
}


/* -------------------------------------------------------------------------
   3. HEADER NAV (old rule forced DM Sans with !important — match it)
   ------------------------------------------------------------------------- */

.gb-header .gbx-header__nav,
.gb-header .gbx-header__nav a,
.gb-header .gbx-header__nav span,
.gb-header .gbx-header__nav strong,
.gb-header .gbx-header__nav small,
.gb-header .gbx-header__nav button {
    font-family: var(--gb-font-body) !important;
}


/* -------------------------------------------------------------------------
   4. PLAYFAIR NEEDS NORMAL SPACING (old CSS used -1px … -3px, line-height .9)
   ------------------------------------------------------------------------- */

.homeban-title,
.jewel-story-content h2,
.gb-hero__content h1,
.collections-heading h2,
.shop-budget__heading h2,
.latest-products-heading h2 {
    letter-spacing: -0.01em !important;
    line-height: 1.12 !important;
}

.gb-promo-card__title {
    font-size: clamp(28px, 2.6vw, 40px) !important;
    line-height: 1.15 !important;
    white-space: normal !important;
}

@media (min-width: 768px) {
    .home-category-info h3 {
        font-size: 16px !important;
        letter-spacing: 1px !important;
    }
}


/* -------------------------------------------------------------------------
   5. CLEARER SMALL TEXT (many labels were 5.8px – 10px, too small to read)
   ------------------------------------------------------------------------- */

.gb-hero__eyebrow small            { font-size: 12px !important; }
.gb-hero__content p                { font-size: 14px !important; line-height: 1.75 !important; }
.gb-hero__button                   { font-size: 12px !important; }
.gb-hero__feature-link             { font-size: 12px !important; }

.home-category-info span           { font-size: 12px !important; letter-spacing: 1px !important; }

.gb-promo-card__eyebrow            { font-size: 11px !important; }
.gb-promo-card__text               { font-size: 13px !important; line-height: 1.7 !important; max-width: 320px !important; }
.gb-promo-card__button             { font-size: 11px !important; min-height: 38px !important; }

.latest-products-eyebrow           { font-size: 11px !important; }
.latest-products-heading p         { font-size: 14px !important; }
.latest-product-info p             { font-size: 13px !important; }
.latest-product-rating             { font-size: 12px !important; }
.latest-product-rating small       { font-size: 11px !important; }
.latest-product-cart               { font-size: 12px !important; }
.latest-products-view-all a        { font-size: 12px !important; }

.shop-budget__heading p            { font-size: 11px !important; }
.budget-card__price small          { font-size: 12px !important; }

.jewel-story-eyebrow               { font-size: 12px !important; }
.jewel-story-description           { font-size: 15px !important; }
.jewel-story-point strong          { font-size: 14px !important; }
.jewel-story-point small           { font-size: 12.5px !important; }
.jewel-story-button                { font-size: 12px !important; }
.jewel-arch-label span             { font-size: 11px !important; }

.collections-heading p             { font-size: 11px !important; }
.collection-card__text p           { font-size: 10px !important; }
.collection-card__description      { font-size: 12px !important; max-width: 230px !important; }


/* -------------------------------------------------------------------------
   6. MOBILE — never go below 11px
   ------------------------------------------------------------------------- */

@media (max-width: 767px) {

    .gb-hero__eyebrow small        { font-size: 11px !important; }
    .gb-hero__content p            { font-size: 13px !important; }
    .gb-hero__button               { font-size: 11px !important; }

    .home-category-info span       { font-size: 11px !important; }

    .gb-promo-card__eyebrow        { font-size: 10px !important; }
    .gb-promo-card__title          { font-size: 24px !important; }
    .gb-promo-card__text           { font-size: 11px !important; max-width: 230px !important; }
    .gb-promo-card__button         { font-size: 10px !important; }

    .latest-product-info p         { font-size: 12px !important; }
    .latest-product-rating         { font-size: 11px !important; }
    .latest-product-cart           { font-size: 11px !important; }
    .latest-products-view-all a    { font-size: 11px !important; }
    .latest-products-heading p     { font-size: 12px !important; }

    .shop-budget__heading p        { font-size: 10px !important; }
    .budget-card__price small      { font-size: 11px !important; }

    .jewel-story-description       { font-size: 14px !important; }
    .jewel-story-point strong      { font-size: 13px !important; }
    .jewel-story-point small       { font-size: 11.5px !important; }
    .jewel-arch-label span         { font-size: 9px !important; letter-spacing: 2px !important; }

    .collections-heading p         { font-size: 10px !important; }
    .collection-card__text p       { font-size: 9px !important; }
    .collection-card__description  { font-size: 11px !important; }
}
.luxury-topbar {


    --topbar-bg: #f8922d;
    --topbar-text: #322821;
    --topbar-muted: #292421;
    --topbar-gold: #b8863e;
    --topbar-peach: #f1c9a9;

    position: relative;

    width: 100%;

    height: 38px;

    background:
        linear-gradient(
            90deg,
            #fedebe 0%,
            #f0b985 50%,
            #ffe2c1 100%
        );

    border-bottom:
        1px solid
        rgba(184, 134, 62, .12);

    z-index: 10000;

    overflow: hidden;
}


/* =========================================================
   INNER CONTAINER
========================================================= */

.luxury-topbar__inner {

    width:
        min(
            1500px,
            calc(100% - 70px)
        );

    height: 100%;

    margin:
        0 auto;

    display:
        grid;

    grid-template-columns:
        1fr
        2fr
        1fr;

    align-items:
        center;

    position:
        relative;

    z-index:
        2;
}


/* =========================================================
   LEFT PHONE
========================================================= */

.luxury-topbar__left {

    display:
        flex;

    align-items:
        center;

    justify-content:
        flex-start;
}


.luxury-topbar__phone {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    color:
        var(--topbar-text) !important;

    text-decoration:
        none !important;

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        .8px;

    transition:
        color .3s ease;
}


.luxury-topbar__phone:hover {

    color:
        var(--topbar-gold) !important;
}


.luxury-topbar__phone i {

    color:
        var(--topbar-gold);

    font-size:
        9px;
}


/* =========================================================
   CENTER MESSAGE
========================================================= */

.luxury-topbar__center {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        0;
}


.luxury-topbar__message {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        15px;

    white-space:
        nowrap;

    color:
        var(--topbar-muted);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        10.5px;

    font-weight:
        700;

    letter-spacing:
        1.5px;

    text-transform:
        uppercase;
}


.luxury-topbar__message b {

    color:
        var(--topbar-gold);

    font-size:
        8px;

    font-weight:
        800;

    transform:
        rotate(45deg);

    display:
        inline-block;
}


/* =========================================================
   RIGHT ACTIONS
========================================================= */

.luxury-topbar__right {

    display:
        flex;

    align-items:
        center;

    justify-content:
        flex-end;

    gap:
        13px;
}


.luxury-topbar__action {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        6px;

    color:
        var(--topbar-text) !important;

    text-decoration:
        none !important;

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        10.5px;

    font-weight:
        800;

    letter-spacing:
        .8px;

    text-transform:
        uppercase;

    transition:
        all .3s ease;
}


.luxury-topbar__action:hover {

    color:
        var(--topbar-gold) !important;

    transform:
        translateY(-1px);
}


.luxury-topbar__action i {

    color:
        var(--topbar-gold);

    font-size:
        11px;

    transition:
        transform .3s ease;
}


.luxury-topbar__action:hover i {

    transform:
        scale(1.12);
}


/* =========================================================
   DIVIDER
========================================================= */

.luxury-topbar__divider {

    width:
        1px;

    height:
        13px;

    background:
        rgba(
            184,
            134,
            62,
            .25
        );
}


/* =========================================================
   SUBTLE DECORATIVE GOLD LINE
========================================================= */

.luxury-topbar::after {

    content:
        "";

    position:
        absolute;

    left:
        50%;

    bottom:
        0;

    width:
        70px;

    height:
        1px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--topbar-peach),
            transparent
        );

    opacity:
        .8;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    .luxury-topbar__inner {

        width:
            calc(100% - 35px);

        grid-template-columns:
            1fr
            2fr
            1fr;
    }


    .luxury-topbar__message {

        gap:
            9px;

        font-size:
            7.5px;

        letter-spacing:
            1px;
    }


    .luxury-topbar__action span {

        display:
            none;
    }


    .luxury-topbar__phone span {

        font-size:
            8px;
    }


    .luxury-topbar__right {

        gap:
            8px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .luxury-topbar {

        height:
            34px;
    }


    .luxury-topbar__inner {

        width:
            calc(100% - 20px);

        display:
            flex;

        align-items:
            center;

        justify-content:
            space-between;
    }


    /* Phone */

    .luxury-topbar__phone span {

        display:
            none;
    }


    .luxury-topbar__phone i {

        font-size:
            11px;
    }


    /* Center message */

    .luxury-topbar__center {

        flex:
            1;

        overflow:
            hidden;

        margin:
            0 10px;
    }


    .luxury-topbar__message {

        gap:
            8px;

        font-size:
            6.5px;

        letter-spacing:
            .7px;

        white-space:
            nowrap;

        animation:
            topbarMessageScroll
            12s
            linear
            infinite;
    }


    /* Right icons */

    .luxury-topbar__right {

        gap:
            8px;
    }


    .luxury-topbar__action i {

        font-size:
            12px;
    }


    .luxury-topbar__divider {

        height:
            11px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 430px) {

    .luxury-topbar {

        height:
            32px;
    }


    .luxury-topbar__inner {

        width:
            calc(100% - 16px);
    }


    .luxury-topbar__message {

        font-size:
            5.8px;

        letter-spacing:
            .5px;

        gap:
            6px;
    }


    .luxury-topbar__message b {

        font-size:
            6px;
    }


    .luxury-topbar__right {

        gap:
            6px;
    }


    .luxury-topbar__action i {

        font-size:
            11px;
    }

}


/* =========================================================
   TOP MESSAGE ANIMATION
========================================================= */

@keyframes topbarMessageScroll {

    0% {
        transform:
            translateX(0);
    }

    20% {
        transform:
            translateX(0);
    }

    50% {
        transform:
            translateX(-8%);
    }

    80% {
        transform:
            translateX(0);
    }

    100% {
        transform:
            translateX(0);
    }

}
/* =========================================================
   PREMIUM JEWELLERY HEADER
   PALETTE JEWELS STYLE
   WARM CREAM + PEACH + GOLD
========================================================= */

.luxury-header {

    --luxury-bg: #fffdf9;
    --luxury-cream: #fff8f1;

    --luxury-peach: #f3d0b2;
    --luxury-peach-light: #f9e3d0;

    --luxury-gold: #b8863e;
    --luxury-gold-light: #d5a66a;

    --luxury-text: #332820;
    --luxury-muted: #76675d;

    position: relative;

    width: 100%;

    height: 86px;

    background:
        rgba(255, 253, 249, 0.97);

    border-bottom:
        1px solid
        rgba(184, 134, 62, 0.10);

    z-index: 9999;

    box-shadow:
        0 5px 25px
        rgba(80, 45, 20, 0.035);
}


/* =========================================================
   SOFT DECORATIVE BACKGROUND
========================================================= */

.luxury-header__decor {

    position: absolute;

    pointer-events: none;

    z-index: 0;

    border-radius: 50%;

    opacity: 0.65;
}


.luxury-header__decor--left {

    width: 120px;

    height: 120px;

    left: -45px;

    top: -60px;

    background:
        radial-gradient(
            circle,
            #f9dfc8 0%,
            #fcefe3 55%,
            transparent 72%
        );
}


.luxury-header__decor--right {

    width: 145px;

    height: 145px;

    right: -65px;

    top: -65px;

    background:
        radial-gradient(
            circle,
            #e8f1eb 0%,
            #f4f8f5 55%,
            transparent 72%
        );
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.luxury-header__container {

    position: relative;

    z-index: 5;

    width:
        min(
            1500px,
            calc(100% - 70px)
        );

    height: 100%;

    margin: 0 auto;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;
}


/* =========================================================
   LOGO
========================================================= */

.luxury-header__logo {

    flex:
        0 0 auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    text-decoration:
        none;
}


.luxury-header__logo img {

    display:
        block;

    width:
        auto;

    height:
        72px;

    max-width:
        220px;

    object-fit:
        contain;

    transition:
        transform .3s ease;
}


.luxury-header__logo:hover img {

    transform:
        translateY(-1px);
}


/* =========================================================
   DESKTOP NAVIGATION
========================================================= */

.luxury-header__nav {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        clamp(
            24px,
            3vw,
            46px
        );

    margin-left:
        auto;

    margin-right:
        auto;

    height:
        100%;
}


.luxury-header__nav-link {

    position:
        relative;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        7px;

    height:
        100%;

    color:
        var(--luxury-text) !important;

    text-decoration:
        none !important;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        15px;

    font-weight:
        500;

    white-space:
        nowrap;

    transition:
        color .3s ease;
}


.luxury-header__nav-link:hover {

    color:
        var(--luxury-gold) !important;
}


.luxury-header__nav-link.active {

    color:
        var(--luxury-gold) !important;
}


/* Elegant active line */

.luxury-header__nav-link.active::after {

    content:
        "";

    position:
        absolute;

    left:
        50%;

    bottom:
        17px;

    width:
        28px;

    height:
        1px;

    transform:
        translateX(-50%);

    background:
        var(--luxury-gold);
}


.luxury-header__nav-link i {

    font-size:
        8px;

    color:
        var(--luxury-gold);
}


/* =========================================================
   ALL JEWELLERY DROPDOWN
========================================================= */

.luxury-header__dropdown {

    position:
        relative;

    height:
        100%;

    display:
        flex;

    align-items:
        center;
}


.luxury-header__dropdown-menu {

    position:
        absolute;

    top:
        calc(100% + 1px);

    left:
        50%;

    transform:
        translateX(-50%)
        translateY(12px);

    width:
        650px;

    padding:
        24px;

    background:
        rgba(
            255,
            253,
            249,
            0.98
        );

    border:
        1px solid
        rgba(
            184,
            134,
            62,
            0.18
        );

    border-radius:
        0 0 14px 14px;

    box-shadow:
        0 20px 45px
        rgba(
            80,
            45,
            20,
            0.12
        );

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

    transition:
        all .3s ease;
}


.luxury-header__dropdown:hover
.luxury-header__dropdown-menu {

    opacity:
        1;

    visibility:
        visible;

    pointer-events:
        auto;

    transform:
        translateX(-50%)
        translateY(0);
}


.luxury-header__dropdown-grid {

    display:
        grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap:
        15px;
}


.luxury-category-item {

    display:
        flex;

    flex-direction:
        column;

    align-items:
        center;

    gap:
        8px;

    padding:
        8px;

    color:
        var(--luxury-text) !important;

    text-decoration:
        none !important;

    border-radius:
        10px;

    transition:
        all .3s ease;
}


.luxury-category-item:hover {

    background:
        #fff4e8;

    transform:
        translateY(-3px);
}


.luxury-category-item img {

    width:
        85px;

    height:
        70px;

    object-fit:
        cover;

    border-radius:
        8px;

    border:
        1px solid
        rgba(
            184,
            134,
            62,
            .14
        );
}


.luxury-category-item span {

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        13px;

    color:
        var(--luxury-text);

    text-align:
        center;
}


.luxury-category-view-more {

    grid-column:
        span 4;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    padding:
        11px;

    margin-top:
        5px;

    color:
        var(--luxury-gold) !important;

    text-decoration:
        none !important;

    border-top:
        1px solid
        rgba(
            184,
            134,
            62,
            .15
        );

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        10px;

    letter-spacing:
        1.5px;

    text-transform:
        uppercase;
}


/* =========================================================
   RIGHT ACTIONS
========================================================= */

.luxury-header__actions {

    display:
        flex;

    align-items:
        center;

    gap:
        8px;

    flex:
        0 0 auto;
}


/* =========================================================
   ICON BUTTON
========================================================= */

.luxury-icon-btn {

    position:
        relative;

    width:
        40px;

    height:
        40px;

    padding:
        0;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        var(--luxury-text) !important;

    background:
        transparent !important;

    border:
        0 !important;

    text-decoration:
        none !important;

    cursor:
        pointer;

    font-size:
        17px;

    transition:
        all .3s ease;
}


.luxury-icon-btn:hover {

    color:
        var(--luxury-gold) !important;

    transform:
        translateY(-2px);
}


.luxury-icon-btn i {

    font-size:
        17px;
}


/* =========================================================
   CART COUNT
========================================================= */

.luxury-cart .cart-count {

    position:
        absolute;

    top:
        2px;

    right:
        1px;

    min-width:
        15px;

    height:
        15px;

    padding:
        0 4px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        50%;

    background:
        var(--luxury-gold);

    color:
        #fff;

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        7px;

    line-height:
        1;
}


/* =========================================================
   TODAY RATE POPUP
========================================================= */

.luxury-rate {

    position:
        relative;
}


.luxury-rate__popup {

    position:
        absolute;

    top:
        calc(100% + 14px);

    right:
        -70px;

    width:
        230px;

    padding:
        20px;

    background:
        #fffdf9;

    border:
        1px solid
        rgba(
            184,
            134,
            62,
            .18
        );

    border-radius:
        12px;

    box-shadow:
        0 18px 45px
        rgba(
            70,
            40,
            20,
            .13
        );

    opacity:
        0;

    visibility:
        hidden;

    transform:
        translateY(10px);

    transition:
        all .3s ease;

    pointer-events:
        none;
}


.luxury-rate:hover
.luxury-rate__popup {

    opacity:
        1;

    visibility:
        visible;

    transform:
        translateY(0);

    pointer-events:
        auto;
}


.luxury-rate__title {

    margin-bottom:
        14px;

    color:
        var(--luxury-gold);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        2px;

    text-transform:
        uppercase;
}


.luxury-rate__row {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        15px;
}


.luxury-rate__row span {

    color:
        var(--luxury-muted);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        11px;
}


.luxury-rate__row strong {

    color:
        var(--luxury-text);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        11px;
}


.luxury-rate__divider {

    width:
        100%;

    height:
        1px;

    margin:
        12px 0;

    background:
        rgba(
            184,
            134,
            62,
            .14
        );
}


.luxury-rate__empty {

    color:
        var(--luxury-muted);

    font-size:
        11px;
}


/* =========================================================
   USER MENU
========================================================= */

.luxury-user {

    position:
        relative;
}


.luxury-user__menu {

    position:
        absolute;

    top:
        calc(100% + 12px);

    right:
        0;

    width:
        190px;

    padding:
        12px;

    background:
        #fffdf9;

    border:
        1px solid
        rgba(
            184,
            134,
            62,
            .16
        );

    border-radius:
        12px;

    box-shadow:
        0 18px 40px
        rgba(
            70,
            40,
            20,
            .12
        );

    opacity:
        0;

    visibility:
        hidden;

    transform:
        translateY(10px);

    transition:
        all .3s ease;
}


.luxury-user:hover
.luxury-user__menu {

    opacity:
        1;

    visibility:
        visible;

    transform:
        translateY(0);
}


.luxury-user__name {

    padding:
        8px 10px 12px;

    margin-bottom:
        5px;

    border-bottom:
        1px solid
        rgba(
            184,
            134,
            62,
            .12
        );

    color:
        var(--luxury-gold);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        10px;

    font-weight:
        700;
}


.luxury-user__menu a {

    display:
        flex;

    align-items:
        center;

    gap:
        10px;

    padding:
        9px 10px;

    color:
        var(--luxury-text) !important;

    text-decoration:
        none !important;

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        10px;

    border-radius:
        6px;

    transition:
        all .25s ease;
}


.luxury-user__menu a:hover {

    background:
        #fff3e5;

    color:
        var(--luxury-gold) !important;
}


.luxury-user__menu a i {

    width:
        15px;

    color:
        var(--luxury-gold);
}


/* =========================================================
   EXPLORE COLLECTION BUTTON
========================================================= */

.luxury-header__cta {

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        15px;

    min-width:
        175px;

    padding:
        13px 22px;

    margin-left:
        8px;

    color:
        #493429 !important;

    background:
        linear-gradient(
            135deg,
            #f7d4b7,
            #e5a36d
        );

    border:
        1px solid
        rgba(
            184,
            134,
            62,
            .08
        );

    border-radius:
        30px;

    text-decoration:
        none !important;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        14px;

    font-weight:
        600;

    transition:
        all .35s ease;
}


.luxury-header__cta:hover {

    color:
        #fff !important;

    background:
        var(--luxury-gold);

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 22px
        rgba(
            184,
            134,
            62,
            .18
        );
}


.luxury-header__cta i {

    font-size:
        10px;

    transition:
        transform .3s ease;
}


.luxury-header__cta:hover i {

    transform:
        translateX(5px);
}


/* =========================================================
   MOBILE TOGGLE
========================================================= */

.luxury-mobile-toggle {

    display:
        none;

    width:
        42px;

    height:
        42px;

    padding:
        8px;

    border:
        0;

    background:
        transparent;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    gap:
        5px;

    cursor:
        pointer;
}


.luxury-mobile-toggle span {

    display:
        block;

    width:
        22px;

    height:
        1px;

    background:
        var(--luxury-text);

    transition:
        all .3s ease;
}


/* =========================================================
   MOBILE MENU
========================================================= */

.luxury-mobile-menu {

    display:
        none;

    position:
        absolute;

    top:
        100%;

    left:
        0;

    width:
        100%;

    padding:
        20px;

    background:
        rgba(
            255,
            253,
            249,
            .98
        );

    border-top:
        1px solid
        rgba(
            184,
            134,
            62,
            .12
        );

    box-shadow:
        0 20px 30px
        rgba(
            70,
            40,
            20,
            .10
        );
}


.luxury-mobile-menu.is-open {

    display:
        flex;

    flex-direction:
        column;
}


.luxury-mobile-menu > a {

    padding:
        14px 5px;

    color:
        var(--luxury-text) !important;

    text-decoration:
        none !important;

    border-bottom:
        1px solid
        rgba(
            184,
            134,
            62,
            .10
        );

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        17px;
}


.luxury-mobile-menu__cta {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        10px;

    margin-top:
        12px;

    padding:
        13px !important;

    color:
        #493429 !important;

    background:
        #f3c9a7;

    border:
        0 !important;

    border-radius:
        25px;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .luxury-header__container {

        width:
            calc(100% - 35px);

        gap:
            15px;
    }


    .luxury-header__nav {

        gap:
            18px;
    }


    .luxury-header__nav-link {

        font-size:
            14px;
    }


    .luxury-header__cta {

        min-width:
            145px;

        padding:
            11px 15px;

        font-size:
            13px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .luxury-header {

        height:
            74px;
    }


    .luxury-header__container {

        width:
            calc(100% - 25px);

        justify-content:
            space-between;
    }


    .luxury-header__logo img {

        height:
            60px;

        max-width:
            175px;
    }


    .luxury-header__nav,
    .luxury-header__actions {

        display:
            none;
    }


    .luxury-mobile-toggle {

        display:
            flex;
    }


    .luxury-header__decor--left {

        width:
            90px;

        height:
            90px;
    }


    .luxury-header__decor--right {

        width:
            100px;

        height:
            100px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .luxury-header {

        height:
            68px;
    }


    .luxury-header__container {

        width:
            calc(100% - 18px);
    }


    .luxury-header__logo img {

        height:
            55px;

        max-width:
            155px;
    }

}
/* home banner  */
/* =========================================================
   HOME PAGE PREMIUM BANNER
   PREFIX: homeban-
   LIGHT ORANGE / PEACH / CHAMPAGNE GOLD
========================================================= */

.homeban-hero {

    --homeban-peach: #f8e8d7;
    --homeban-peach-soft: #fff7ef;
    --homeban-cream: #fffaf4;

    --homeban-gold: #b77a3c;
    --homeban-gold-light: #d9ae78;

    --homeban-text: #33251e;
    --homeban-muted: #77665b;

    position: relative;

    width: 100%;

    height: clamp(580px, 78vh, 760px);

    min-height: 580px;

    overflow: hidden;

    display: grid;

    /* ONLY TWO COLUMNS
       NO RIGHT SIDE GAP */

    grid-template-columns:
        minmax(390px, 0.88fr)
        minmax(500px, 1.12fr);

    background:
        linear-gradient(
            135deg,
            #fffdf9 0%,
            #fff7ee 52%,
            #f4dfcc 100%
        );
}


/* =========================================================
   LEFT CONTENT
========================================================= */

.homeban-content {

    position: relative;

    z-index: 10;

    grid-column: 1;
    grid-row: 1;

    min-width: 0;
    min-height: 100%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: flex-start;

    padding:
        55px
        clamp(35px, 6vw, 100px)
        55px
        clamp(40px, 6vw, 105px);

    background:

        radial-gradient(
            circle at 8% 15%,
            rgba(216, 174, 120, 0.12),
            transparent 24%
        ),

        linear-gradient(
            135deg,
            #fffdf9 0%,
            #fff8f1 100%
        );
}


/* =========================================================
   DECORATIVE CIRCLES
========================================================= */

.homeban-content::before {

    content: "";

    position: absolute;

    width: 390px;
    height: 390px;

    left: -245px;
    bottom: -255px;

    border:
        1px solid
        rgba(183, 122, 60, 0.18);

    border-radius: 50%;

    pointer-events: none;
}


.homeban-content::after {

    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    left: -180px;
    bottom: -195px;

    border:
        1px solid
        rgba(183, 122, 60, 0.10);

    border-radius: 50%;

    pointer-events: none;
}


/* =========================================================
   EYEBROW
========================================================= */

.homeban-eyebrow {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;
}


.homeban-eyebrow-line {

    width: 40px;

    height: 1px;

    display: block;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--homeban-gold)
        );
}


.homeban-eyebrow-text {

    color:
        var(--homeban-gold);

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 10px;

    font-weight: 600;

    letter-spacing: 4px;

    text-transform: uppercase;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.homeban-title {

    margin: 0;

    max-width: 620px;

    color:
        var(--homeban-text);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            46px,
            5vw,
            76px
        );

    font-weight: 400;

    line-height: 0.98;

    letter-spacing: -3px;
}


.homeban-title em {

    color:
        #ad7137;

    font-style: italic;

    font-weight: 400;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.homeban-description {

    max-width: 470px;

    margin:
        28px 0
        32px;

    color:
        var(--homeban-muted);

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 13px;

    line-height: 1.85;
}


/* =========================================================
   BUTTON
========================================================= */

.homeban-button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 22px;

    padding:
        15px
        25px;

    color: #ffffff;

    background:
        #ad692d;

    border:
        1px solid
        #ad692d;

    text-decoration: none;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;

    transition:
        all 0.35s ease;
}


.homeban-button:hover {

    color: #ffffff;

    background:
        var(--homeban-gold);

    border-color:
        var(--homeban-gold);

    transform:
        translateY(-3px);

    text-decoration: none;

    box-shadow:
        0 12px 25px
        rgba(173, 105, 45, 0.18);
}


.homeban-button i {

    font-size: 10px;

    transition:
        transform 0.3s ease;
}


.homeban-button:hover i {

    transform:
        translateX(5px);
}


/* =========================================================
   RIGHT IMAGE AREA
========================================================= */

.homeban-visual {

    position: relative;

    grid-column: 2;
    grid-row: 1;

    width: 100%;
    height: 100%;

    min-width: 0;

    overflow: hidden;

    background:
        #ead8c5;

    /*
       LARGE MODERN CURVED SHAPE
       Image itself follows this shape
    */

    border-radius:
        190px
        0
        0
        0;
}


/* =========================================================
   BACKEND SLIDES
========================================================= */

.homeban-slides {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    overflow: hidden;
}


.homeban-slide {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    opacity: 0;

    visibility: hidden;

    transform:
        scale(1.035);

    transition:
        opacity 1s ease,
        transform 6s ease,
        visibility 1s ease;
}


.homeban-slide.is-active {

    opacity: 1;

    visibility: visible;

    transform:
        scale(1);
}


/* =========================================================
   BACKEND IMAGE
========================================================= */

.homeban-slide img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    /*
       Important:
       Backend image fills the entire image area
    */

    object-position: center;

    transition:
        transform 1s ease;
}


/* =========================================================
   SOFT IMAGE OVERLAY
========================================================= */

.homeban-slide::after {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    background:

        linear-gradient(
            90deg,
            rgba(255, 247, 238, 0.15),
            transparent 28%
        ),

        linear-gradient(
            180deg,
            rgba(255,255,255,0.05),
            transparent 35%
        );
}


/* =========================================================
   OUTER CURVED GOLD FRAME
========================================================= */

.homeban-frame {

    position: absolute;

    z-index: 5;

    top: 28px;

    left: 38px;

    right: 38px;

    bottom: 28px;

    pointer-events: none;

    border:
        1px solid
        rgba(177, 90, 32, 0.68);

    border-radius:
        175px
        0
        0
        0;

    box-shadow:
        inset
        0 0 0 1px
        rgba(183, 122, 60, 0.12);
}


/* =========================================================
   INNER GOLD LINE
========================================================= */

.homeban-frame-inner {

    position: absolute;

    z-index: 6;

    top: 39px;

    left: 49px;

    right: 49px;

    bottom: 39px;

    pointer-events: none;

    border:
        1px solid
        rgba(183, 122, 60, 0.35);

    border-radius:
        165px
        0
        0
        0;
}


/* =========================================================
   IMAGE GOLD ACCENT
========================================================= */

.homeban-image-accent {

    position: absolute;

    z-index: 12;

    right: 55px;

    bottom: 34px;

    display: flex;

    align-items: center;

    gap: 10px;

    opacity: 0.9;
}


.homeban-image-accent span {

    display: block;

    width: 30px;

    height: 1px;

    background:
        rgba(255,255,255,0.7);
}


.homeban-image-accent i {

    color:
        #e2b77e;

    font-size: 12px;

    font-style: normal;
}


/* =========================================================
   SLIDER DOTS
========================================================= */

.homeban-dots {

    position: absolute;

    z-index: 30;

    right: 45px;

    bottom: 30px;

    display: flex;

    align-items: center;

    gap: 8px;
}


.homeban-dots span {

    width: 24px;

    height: 2px;

    display: block;

    cursor: pointer;

    background:
        rgba(255,255,255,0.5);

    transition:
        all 0.35s ease;
}


.homeban-dots span.is-active {

    width: 42px;

    background:
        #e1b579;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .homeban-hero {

        grid-template-columns:
            minmax(350px, 0.9fr)
            minmax(400px, 1.1fr);

        min-height: 560px;

        height: 72vh;
    }


    .homeban-content {

        padding:
            45px;
    }


    .homeban-title {

        font-size:
            clamp(
                42px,
                5vw,
                62px
            );
    }


    .homeban-description {

        max-width: 390px;
    }


    .homeban-visual {

        border-radius:
            150px
            0
            0
            0;
    }


    .homeban-frame {

        top: 25px;

        left: 28px;

        right: 28px;

        bottom: 25px;

        border-radius:
            135px
            0
            0
            0;
    }


    .homeban-frame-inner {

        top: 35px;

        left: 38px;

        right: 38px;

        bottom: 35px;

        border-radius:
            125px
            0
            0
            0;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .homeban-hero {

        display: flex;

        flex-direction: column;

        width: 100%;

        height: auto;

        min-height: 0;

        max-height: none;

        background:
            #fff9f3;
    }


    /* IMAGE FIRST */

    .homeban-visual {

        order: 1;

        width: 100%;

        height: 70vw;

        min-height: 310px;

        max-height: 430px;

        border-radius:
            100px
            0
            0
            0;
    }


    /* CONTENT SECOND */

    .homeban-content {

        order: 2;

        width: 100%;

        min-height: auto;

        padding:
            42px
            28px
            48px;

        align-items:
            flex-start;
    }


    .homeban-eyebrow {

        margin-bottom:
            16px;
    }


    .homeban-eyebrow-text {

        font-size:
            8px;

        letter-spacing:
            3px;
    }


    .homeban-title {

        font-size:
            clamp(
                40px,
                11vw,
                58px
            );

        letter-spacing:
            -1.8px;
    }


    .homeban-description {

        max-width:
            100%;

        margin:
            21px 0
            28px;

        font-size:
            12px;
    }


    .homeban-button {

        padding:
            13px
            20px;
    }


    /* MOBILE FRAME */

    .homeban-frame {

        top: 18px;

        left: 20px;

        right: 20px;

        bottom: 18px;

        border-radius:
            85px
            0
            0
            0;
    }


    .homeban-frame-inner {

        top: 27px;

        left: 29px;

        right: 29px;

        bottom: 27px;

        border-radius:
            76px
            0
            0
            0;
    }


    .homeban-image-accent {

        right: 25px;

        bottom: 20px;
    }


    .homeban-image-accent span {

        width: 18px;
    }


    .homeban-dots {

        right: 25px;

        bottom: 20px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .homeban-visual {

        height:
            82vw;

        min-height:
            285px;

        border-radius:
            75px
            0
            0
            0;
    }


    .homeban-content {

        padding:
            36px
            22px
            42px;
    }


    .homeban-title {

        font-size:
            40px;

        line-height:
            1;
    }


    .homeban-description {

        font-size:
            11px;

        line-height:
            1.75;
    }


    .homeban-frame {

        top: 14px;

        left: 15px;

        right: 15px;

        bottom: 14px;

        border-radius:
            62px
            0
            0
            0;
    }


    .homeban-frame-inner {

        top: 22px;

        left: 22px;

        right: 22px;

        bottom: 22px;

        border-radius:
            55px
            0
            0
            0;
    }


    .homeban-image-accent {

        display: none;
    }


    .homeban-dots {

        right: 18px;

        bottom: 15px;
    }
}


/* =========================================================
   JEWELLERY FEATURES
   BOTTOM OVERLAY INSIDE HERO
========================================================= */

.jewellery-features {
    position: absolute;
    z-index: 40;

    left: 50%;
    bottom: -55px;

    transform: translateX(-50%);

    width: calc(100% - 90px);
    max-width: 1500px;

    padding: 16px 20px;

    background: rgba(255, 250, 245, 0.96);

    border: 1px solid rgba(184, 134, 62, 0.22);

    border-radius: 16px;

    box-shadow:
        0 14px 40px rgba(88, 54, 28, 0.10);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}


/* =========================================================
   CONTAINER
========================================================= */

.jewellery-features__container {

    width: 100%;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        repeat(5, 1fr);

    align-items: center;
}


/* =========================================================
   EACH FEATURE
========================================================= */

.jewellery-feature {

    min-height: 62px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 13px;

    padding:
        7px 22px;

    position: relative;
}


/* =========================================================
   VERTICAL DIVIDER
========================================================= */

.jewellery-feature:not(:last-child)::after {

    content: "";

    position: absolute;

    right: 0;

    top: 6px;

    bottom: 6px;

    width: 1px;

    background:
        rgba(184, 134, 62, 0.20);
}


/* =========================================================
   ICON
========================================================= */

.jewellery-feature__icon {

    width: 46px;

    height: 46px;

    flex: 0 0 46px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        #FFF5EA;

    border:
        1px solid
        rgba(184, 134, 62, 0.20);

    color:
        #B87832;

    font-size: 19px;

    transition:
        all 0.35s ease;
}


/* =========================================================
   TEXT
========================================================= */

.jewellery-feature__content {

    min-width: 0;
}


.jewellery-feature__content h4 {

    margin:
        0 0 3px;

    color:
        #3D3028;

    font-family:
        "Saira",
        sans-serif;

    font-size:
        14px;

    font-weight:
        600;

    line-height:
        1.2;

    white-space:
        nowrap;
}


.jewellery-feature__content p {

    margin: 0;

    color:
        #9A8879;

    font-family:
        "Quicksand",
        sans-serif;

    font-size:
        10px;

    line-height:
        1.4;

    white-space:
        nowrap;
}


/* =========================================================
   HOVER
========================================================= */

.jewellery-feature:hover
.jewellery-feature__icon {

    transform:
        translateY(-3px);

    background:
        #D89A5B;

    color:
        #ffffff;

    box-shadow:
        0 8px 18px
        rgba(184, 134, 62, 0.18);
}


/* =========================================================
   KEEP SLIDER DOTS ABOVE / AWAY FROM FEATURE BAR
========================================================= */

.homeban-dots {

    z-index: 50 !important;

    bottom: auto !important;

    top: 30px !important;

    right: 40px;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .jewellery-features {

        width:
            calc(100% - 50px);

        bottom:
            18px;

        padding:
            13px 10px;

        border-radius:
            14px;
    }


    .jewellery-feature {

        gap:
            8px;

        padding:
            6px 10px;
    }


    .jewellery-feature__icon {

        width:
            40px;

        height:
            40px;

        flex-basis:
            40px;

        font-size:
            16px;
    }


    .jewellery-feature__content h4 {

        font-size:
            12px;
    }


    .jewellery-feature__content p {

        font-size:
            9px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .jewellery-features {

        position: absolute;

        bottom:
            14px;

        width:
            calc(100% - 28px);

        padding:
            12px 8px;

        border-radius:
            12px;
    }


    .jewellery-features__container {

        grid-template-columns:
            repeat(2, 1fr);

        row-gap:
            4px;
    }


    .jewellery-feature {

        min-height:
            58px;

        justify-content:
            flex-start;

        padding:
            6px 7px;
    }


    .jewellery-feature:not(:last-child)::after {

        display:
            none;
    }


    .jewellery-feature__icon {

        width:
            36px;

        height:
            36px;

        flex-basis:
            36px;

        font-size:
            14px;
    }


    .jewellery-feature__content h4 {

        font-size:
            11px;

        white-space:
            normal;
    }


    .jewellery-feature__content p {

        font-size:
            9px;

        white-space:
            normal;
    }


    .homeban-dots {

        top:
            18px !important;

        right:
            18px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .jewellery-features {

        bottom:
            10px;

        width:
            calc(100% - 20px);

        padding:
            9px 6px;

        border-radius:
            10px;
    }


    .jewellery-features__container {

        grid-template-columns:
            repeat(2, 1fr);
    }


    .jewellery-feature {

        min-height:
            52px;

        gap:
            7px;

        padding:
            5px 4px;
    }


    .jewellery-feature__icon {

        width:
            32px;

        height:
            32px;

        flex-basis:
            32px;

        font-size:
            13px;
    }


    .jewellery-feature__content h4 {

        font-size:
            10px;
    }


    .jewellery-feature__content p {

        font-size:
            8px;
    }

}
/* =========================================================
   FIX: FEATURE BAR SHOULD STAY ABOVE NEXT SECTION
========================================================= */

.homeban-hero {
    overflow: visible !important;
    position: relative;
    z-index: 20;
    margin-bottom: 65px;
}

.jewellery-features {
    z-index: 100 !important;
    bottom: -55px !important;
}

.home-categories {
    position: relative;
    z-index: 1;
}
/* =========================================================
   SHOP BY CATEGORY
   LIGHT ORANGE / PEACH
========================================================= */

/* =========================================================
   SHOP BY CATEGORY
   PREMIUM LIGHT ORANGE / PEACH THEME
   LARGE SEMI-CIRCLE CAROUSEL
========================================================= */

.home-categories {
    --orange-main: #f4d1ae;
    --orange-dark: #B9783E;
    --orange-soft: #f7d4b5;
    --orange-pale: #FBEBDD;

    --cream: #FFF9F3;
    --white: #FFFDF9;

    --text-dark: #3D3028;
    --text-soft: #806F63;

    width: 100%;
    padding: 80px 0 70px;

    background:
        linear-gradient(
            180deg,
            #faede0 0%,
            #FDF0E4 50%,
            #FFF9F3 100%
        );

    overflow: hidden;
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.home-categories__container {
    width: min(1800px, 94%);
    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.home-categories__heading {
    text-align: center;
    margin-bottom: 55px;
}

.home-categories__eyebrow {
    display: block;

    margin-bottom: 12px;

    color: var(--orange-dark);

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 10px;
    font-weight: 600;

    letter-spacing: 4px;

    text-transform: uppercase;
}


.home-categories__heading h2 {
    margin: 0;

    color: var(--text-dark);

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        clamp(42px, 4vw, 60px);

    font-weight: 600;

    line-height: 1;

    letter-spacing: -1px;
}


/* =========================================================
   HEADING DECORATION
========================================================= */

.home-categories__heading-line {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    margin: 18px auto 14px;
}


.home-categories__heading-line span {
    width: 62px;
    height: 1px;

    background: #D5A06B;
}


.home-categories__heading-line b {
    color: var(--orange-main);

    font-size: 13px;
    font-weight: 400;
}


.home-categories__heading p {
    max-width: 560px;

    margin: 0 auto;

    color: var(--text-soft);

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 13px;

    line-height: 1.8;
}


/* =========================================================
   CAROUSEL WRAPPER
========================================================= */

.home-category-carousel {
    position: relative;

    width: 100%;

    display: flex;

    align-items: center;

    gap: 18px;
}


/* =========================================================
   VIEWPORT
========================================================= */

.home-category-viewport {
    width: 100%;

    overflow: hidden;

    padding:
        15px 5px
        35px;
}


/* =========================================================
   TRACK
========================================================= */

.home-category-track {
    display: flex;

    gap: 30px;

    width: max-content;

    will-change: transform;

    transition:
        transform
        0.85s
        cubic-bezier(.22, .61, .36, 1);
}


/* =========================================================
   CATEGORY SLIDE
========================================================= */

.home-category-slide {
    flex:
        0 0
        calc((100vw - 240px) / 6);

    max-width: 290px;

    min-width: 0;
}


/* =========================================================
   CATEGORY CARD
========================================================= */

.home-category-card {
    display: block;

    width: 100%;

    text-align: center;

    color: inherit;

    text-decoration: none;

    transition:
        transform
        0.45s
        ease;
}


.home-category-card:hover {
    color: inherit;

    text-decoration: none;

    transform:
        translateY(-8px);
}


/* =========================================================
   LARGE SEMI-CIRCLE IMAGE
========================================================= */

.home-category-image {
    position: relative;

    width: 100%;

    height: 420px;

    padding: 4px;

    background: #9c3f00;

    /*
       Large rounded arch
    */
    border-radius:
        155px
        155px
        16px
        16px;

    box-shadow:
        0 18px 40px
        rgba(183, 119, 62, 0.11);

    overflow: hidden;

    transition:
        transform
        0.45s
        ease,
        box-shadow
        0.45s
        ease;
}


/* =========================================================
   INNER IMAGE
========================================================= */

.home-category-image__inner {
    position: relative;

    width: 100%;
    height: 100%;

    overflow: hidden;

    border-radius:
        146px
        146px
        10px
        10px;

    background:
        linear-gradient(
            145deg,
            #F8DEC8,
            #FFF8F0
        );
}


/* =========================================================
   CATEGORY IMAGE
========================================================= */

.home-category-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    border-radius: inherit;

    transition:
        transform
        0.7s
        cubic-bezier(.22, .61, .36, 1);
}


/* =========================================================
   GOLD BORDER
========================================================= */

.home-category-image::after {
    content: "";

    position: absolute;

    inset: 9px;

    border:
        1px solid
        rgba(194, 139, 79, 0.30);

    border-radius:
        148px
        148px
        11px
        11px;

    pointer-events: none;

    z-index: 2;
}


/* =========================================================
   IMAGE HOVER
========================================================= */

.home-category-card:hover
.home-category-image {
    transform:
        translateY(-6px);

    box-shadow:
        0 25px 50px
        rgba(183, 119, 62, 0.17);
}


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


/* =========================================================
   CATEGORY INFO
========================================================= */

.home-category-info {
    padding-top: 20px;

    text-align: center;
}


.home-category-info h3 {
    margin:
        0 0 8px;

    color:
        var(--text-dark);

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size: 28px;

    font-weight: 600;

    line-height: 1.15;

    text-transform: capitalize;
}


/* =========================================================
   EXPLORE
========================================================= */

.home-category-info span {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color:
        var(--orange-dark);

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 10px;

    font-weight: 600;

    letter-spacing: 2.5px;

    text-transform: uppercase;

    transition:
        color
        0.3s
        ease;
}


.home-category-info span i {
    font-size: 10px;

    transition:
        transform
        0.3s
        ease;
}


.home-category-card:hover
.home-category-info span {
    color:
        #965A2B;
}


.home-category-card:hover
.home-category-info span i {
    transform:
        translateX(5px);
}


/* =========================================================
   LEFT / RIGHT ARROWS
========================================================= */

.home-category-arrow {
    flex:
        0 0 58px;

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(194, 139, 79, 0.25);

    border-radius: 50%;

    background:
        rgba(255, 253, 249, 0.96);

    color:
        var(--orange-dark);

    font-size: 15px;

    cursor: pointer;

    z-index: 10;

    box-shadow:
        0 8px 25px
        rgba(120, 75, 35, 0.10);

    transition:
        all
        0.3s
        ease;
}


.home-category-arrow:hover {
    background:
        var(--orange-main);

    border-color:
        var(--orange-main);

    color:
        #FFFFFF;

    transform:
        scale(1.08);

    box-shadow:
        0 12px 28px
        rgba(183, 119, 62, 0.20);
}


.home-category-arrow:disabled {
    opacity: 0.35;

    cursor:
        not-allowed;

    transform:
        none;

    box-shadow:
        none;
}


.home-category-arrow--prev {
    margin-left: -5px;
}


.home-category-arrow--next {
    margin-right: -5px;
}


/* =========================================================
   PROGRESS
========================================================= */

.home-category-progress {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 15px;

    margin-top: 30px;
}


.home-category-progress__line {
    width: 160px;
    height: 2px;

    background:
        rgba(194, 139, 79, 0.18);

    overflow: hidden;
}


.home-category-progress__line span {
    display: block;

    width: 20%;
    height: 100%;

    background:
        var(--orange-main);

    transition:
        width
        0.6s
        ease;
}


.home-category-progress__count {
    color:
        var(--orange-dark);

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 11px;

    font-weight: 600;

    letter-spacing: 2px;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1600px) {

    .home-category-slide {
        flex:
            0 0
            calc((100vw - 250px) / 6);

        max-width: 300px;
    }

    .home-category-image {
        height: 440px;

        border-radius:
            165px
            165px
            16px
            16px;
    }

    .home-category-image__inner {
        border-radius:
            156px
            156px
            10px
            10px;
    }

    .home-category-image::after {
        border-radius:
            158px
            158px
            11px
            11px;
    }

    .home-category-info h3 {
        font-size: 30px;
    }
}


/* =========================================================
   DESKTOP / LAPTOP
========================================================= */

@media (max-width: 1400px) {

    .home-categories__container {
        width: 94%;
    }

    .home-category-slide {
        flex:
            0 0
            calc((100vw - 230px) / 5);

        max-width: 270px;
    }

    .home-category-image {
        height: 400px;

        border-radius:
            145px
            145px
            15px
            15px;
    }

    .home-category-image__inner {
        border-radius:
            136px
            136px
            9px
            9px;
    }

    .home-category-image::after {
        border-radius:
            138px
            138px
            10px
            10px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .home-categories {
        padding:
            70px 0
            60px;
    }

    .home-categories__heading {
        margin-bottom: 45px;
    }

    .home-category-carousel {
        gap: 12px;
    }

    .home-category-slide {
        flex:
            0 0
            calc((100vw - 145px) / 4);

        max-width: 245px;
    }

    .home-category-track {
        gap: 24px;
    }

    .home-category-image {
        height: 365px;

        border-radius:
            130px
            130px
            14px
            14px;
    }

    .home-category-image__inner {
        border-radius:
            121px
            121px
            8px
            8px;
    }

    .home-category-image::after {
        border-radius:
            123px
            123px
            9px
            9px;
    }

    .home-category-info h3 {
        font-size: 25px;
    }

    .home-category-arrow {
        width: 50px;
        height: 50px;

        flex-basis: 50px;
    }
}


/* =========================================================
   TABLET SMALL
========================================================= */

@media (max-width: 991px) {

    .home-categories__container {
        width: 91%;
    }

    .home-category-slide {
        flex:
            0 0
            calc((100vw - 110px) / 3);

        max-width: 230px;
    }

    .home-category-image {
        height: 345px;

        border-radius:
            120px
            120px
            13px
            13px;
    }

    .home-category-image__inner {
        border-radius:
            112px
            112px
            8px
            8px;
    }

    .home-category-image::after {
        border-radius:
            114px
            114px
            9px
            9px;
    }

    .home-category-info h3 {
        font-size: 23px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .home-categories {
        padding:
            55px 0
            50px;
    }

    .home-categories__container {
        width: 92%;
    }

    .home-categories__heading {
        margin-bottom: 35px;
    }

    .home-categories__eyebrow {
        font-size: 8px;

        letter-spacing: 3px;
    }

    .home-categories__heading h2 {
        font-size: 40px;
    }

    .home-categories__heading-line {
        margin:
            15px auto
            12px;
    }

    .home-categories__heading-line span {
        width: 45px;
    }

    .home-categories__heading p {
        font-size: 11px;

        padding:
            0 15px;
    }

    .home-category-carousel {
        gap: 8px;
    }

    .home-category-slide {
        flex:
            0 0
            calc((100vw - 80px) / 2);

        max-width: 210px;
    }

    .home-category-track {
        gap: 18px;
    }

    .home-category-image {
        height: 315px;

        border-radius:
            108px
            108px
            12px
            12px;
    }

    .home-category-image__inner {
        border-radius:
            100px
            100px
            7px
            7px;
    }

    .home-category-image::after {
        border-radius:
            102px
            102px
            8px
            8px;
    }

    .home-category-info {
        padding-top: 16px;
    }

    .home-category-info h3 {
        font-size: 22px;
    }

    .home-category-info span {
        font-size: 8px;

        letter-spacing: 1.8px;
    }

    .home-category-arrow {
        width: 42px;
        height: 42px;

        flex-basis: 42px;

        font-size: 11px;
    }

    .home-category-progress {
        margin-top: 25px;
    }

    .home-category-progress__line {
        width: 110px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .home-categories {
        padding:
            45px 0
            40px;
    }

    .home-categories__container {
        width: 94%;
    }

    .home-categories__heading {
        margin-bottom: 30px;
    }

    .home-categories__heading h2 {
        font-size: 34px;
    }

    .home-category-carousel {
        gap: 5px;
    }

    .home-category-slide {
        flex:
            0 0
            calc(100vw - 90px);

        max-width: 280px;
    }

    .home-category-track {
        gap: 15px;
    }

    .home-category-image {
        width: 100%;
        height: 370px;

        border-radius:
            135px
            135px
            13px
            13px;
    }

    .home-category-image__inner {
        border-radius:
            126px
            126px
            8px
            8px;
    }

    .home-category-image::after {
        border-radius:
            128px
            128px
            9px
            9px;
    }

    .home-category-info h3 {
        font-size: 25px;
    }

    .home-category-arrow {
        width: 36px;
        height: 36px;

        flex-basis: 36px;

        font-size: 9px;
    }

    .home-category-progress__line {
        width: 90px;
    }
}


/* =========================================================
   EXTRA SMALL
========================================================= */

@media (max-width: 360px) {

    .home-category-slide {
        flex:
            0 0
            calc(100vw - 70px);
    }

    .home-category-image {
        height: 350px;
    }

    .home-category-info h3 {
        font-size: 23px;
    }

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

/* =========================================================
   CATEGORY CARD - WIDTH INCREASE ONLY
========================================================= */

.home-category-slide {
    flex: 0 0 310px;
    width: 310px;
    max-width: 310px;
}

.home-category-image {
    width: 310px;
    height: 420px;
}


/* Keep inner arch matching the wider card */
.home-category-image__inner {
    border-radius:
        155px
        155px
        10px
        10px;
}

.home-category-image::after {
    border-radius:
        157px
        157px
        11px
        11px;
}


/* =========================================================
   LARGE SCREEN
========================================================= */

@media (min-width: 1600px) {

    .home-category-slide {
        flex: 0 0 320px;
        width: 320px;
        max-width: 320px;
    }

    .home-category-image {
        width: 320px;
        height: 440px;
    }

    .home-category-image__inner {
        border-radius:
            160px
            160px
            10px
            10px;
    }

    .home-category-image::after {
        border-radius:
            162px
            162px
            11px
            11px;
    }
}

/* =========================================================
   SHOP BY BUDGET
   REFERENCE-STYLE ASYMMETRIC IMAGE GRID
   DESIGN ONLY — EXISTING LINKS / BACKEND DATA UNCHANGED
========================================================= */

.shop-budget {
    --budget-burgundy: #6d1f2a;
    --budget-gold: #c9a15a;
    --budget-cream: #fffaf5;

    position: relative;
    width: 100%;
    padding: 72px 0 78px;
    overflow: hidden;

    background:
        radial-gradient(circle at 8% 20%, rgba(232, 210, 188, .24), transparent 28%),
        radial-gradient(circle at 92% 78%, rgba(215, 184, 143, .18), transparent 30%),
        #fffaf6;
}

.shop-budget::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    left: -260px;
    bottom: -280px;
    border-radius: 50%;
    border: 1px solid rgba(109, 31, 42, .08);
    box-shadow:
        0 0 0 24px rgba(109, 31, 42, .025),
        0 0 0 48px rgba(201, 161, 90, .025);
    pointer-events: none;
}

.shop-budget::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    right: -230px;
    top: -230px;
    border-radius: 50%;
    border: 1px solid rgba(201, 161, 90, .12);
    pointer-events: none;
}

.shop-budget__container {
    position: relative;
    z-index: 2;
    width: min(1280px, calc(100% - 40px));
    margin: 0 auto;
}

/* ---------------------------------------------------------
   HEADING
--------------------------------------------------------- */

.shop-budget__heading {
    text-align: center;
    margin-bottom: 42px;
}

.shop-budget__heading h2 {
    margin: 0;
    color: #3c2924;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(40px, 4vw, 58px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.5px;
}

.shop-budget__heading h2 span {
    color: var(--budget-burgundy);
}

.shop-budget__divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 14px auto 11px;
}

.shop-budget__divider span {
    width: 52px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--budget-gold));
}

.shop-budget__divider span:last-child {
    background: linear-gradient(90deg, var(--budget-gold), transparent);
}

.shop-budget__divider i {
    color: var(--budget-gold);
    font-size: 11px;
    transform: rotate(45deg);
}

.shop-budget__heading p {
    margin: 0;
    color: #9b8174;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 3px;
}

/* ---------------------------------------------------------
   REFERENCE IMAGE GRID
--------------------------------------------------------- */

.shop-budget__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px;
    width: 100%;
    max-width: 1100px;
    height: 510px;
    margin: 0 auto;
}

.budget-card {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border-radius: 8px;
    text-decoration: none !important;
    color: #fff !important;
    background: #eadfd5;
    box-shadow: 0 10px 28px rgba(66, 39, 27, .08);
    transform: translateZ(0);
    transition:
        transform .4s ease,
        box-shadow .4s ease;
}

.budget-card:first-child {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.budget-card:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
}

.budget-card:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
}

.budget-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgba(66, 39, 27, .15);
}

.budget-card__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: hidden;
    box-shadow: none;
}

.budget-card__image::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: inherit;
    pointer-events: none;
    z-index: 3;
}

.budget-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    transition: transform .8s cubic-bezier(.22, .61, .36, 1);
}

.budget-card:hover .budget-card__image img {
    transform: scale(1.045);
}

/* Soft cinematic overlay — keeps text readable without changing images */
.budget-card__image::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(
            180deg,
            rgba(20, 12, 8, .02) 15%,
            rgba(20, 12, 8, .04) 42%,
            rgba(20, 12, 8, .48) 100%
        );
    pointer-events: none;
}

/* ---------------------------------------------------------
   PRICE / LABEL OVERLAY
--------------------------------------------------------- */

.budget-card__price {
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    bottom: 38px;
    margin: 0;
    min-width: 0;
    padding: 0 22px;
    text-align: center;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    transition: transform .35s ease;
}

.budget-card__price::before,
.budget-card__price::after {
    display: none;
}

.budget-card:hover .budget-card__price {
    transform: translateY(-3px);
    box-shadow: none;
}

.budget-card__price small {
    display: block;
    margin-bottom: 2px;
    color: rgba(255, 255, 255, .9);
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.budget-card__price strong {
    display: block;
    color: #fff;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(29px, 3vw, 42px);
    font-weight: 600;
    line-height: .95;
    letter-spacing: .5px;
    text-shadow: 0 3px 16px rgba(0, 0, 0, .35);
}

/* ---------------------------------------------------------
   CAPTION — hidden from the old circular-card layout.
   The budget price becomes the visual label in the image.
--------------------------------------------------------- */

.budget-card__caption {
    display: none;
}

/* Keep old modifier classes harmless; layout is now controlled by grid. */
.budget-card--small,
.budget-card--medium,
.budget-card--large,
.budget-card--small:hover,
.budget-card--medium:hover,
.budget-card--large:hover {
    transform: none;
}

/* ---------------------------------------------------------
   TABLET
--------------------------------------------------------- */

@media (max-width: 900px) {
    .shop-budget {
        padding: 62px 0 65px;
    }

    .shop-budget__container {
        width: min(94%, 760px);
    }

    .shop-budget__grid {
        height: 430px;
    }

    .budget-card__price {
        bottom: 28px;
    }

    .budget-card__price strong {
        font-size: clamp(26px, 4vw, 36px);
    }
}

/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media (max-width: 767px) {
    .shop-budget {
        padding: 52px 0 55px;
    }

    .shop-budget__container {
        width: calc(100% - 24px);
    }

    .shop-budget__heading {
        margin-bottom: 28px;
    }

    .shop-budget__heading h2 {
        font-size: 38px;
    }

    .shop-budget__heading p {
        font-size: 7px;
        letter-spacing: 2px;
    }

    .shop-budget__divider {
        margin: 12px auto 9px;
    }

    .shop-budget__divider span {
        width: 38px;
    }

    .shop-budget__grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: none;
        gap: 6px;
        height: auto;
    }

    .budget-card:first-child,
    .budget-card:nth-child(2),
    .budget-card:nth-child(3) {
        grid-column: auto;
        grid-row: auto;
    }

    .budget-card {
        height: 260px;
        border-radius: 8px;
    }

    .budget-card:first-child {
        height: 360px;
    }

    .budget-card__price {
        bottom: 24px;
        padding: 0 15px;
    }

    .budget-card__price small {
        font-size: 8px;
        letter-spacing: 1.5px;
    }

    .budget-card__price strong {
        font-size: 31px;
    }
}

/* ---------------------------------------------------------
   SMALL MOBILE
--------------------------------------------------------- */

@media (max-width: 430px) {
    .shop-budget__heading h2 {
        font-size: 34px;
    }

    .shop-budget__grid {
        gap: 5px;
    }

    .budget-card {
        height: 225px;
    }

    .budget-card:first-child {
        height: 310px;
    }

    .budget-card__price {
        bottom: 20px;
    }

    .budget-card__price strong {
        font-size: 28px;
    }
}

/* =========================================================
   SHOP BY BUDGET - CORNER SVG DECORATION
========================================================= */

.shop-budget {
    position: relative;
    overflow: hidden;
}


/* SVG decorative corners */

.shop-budget__corner-design {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: fill;

    pointer-events: none;

    z-index: 1;

    opacity: 0.75;
}


/* Content should stay above SVG */

.shop-budget__container {
    position: relative;
    z-index: 2;
}

/* =========================================================
   COLLECTIONS
   PREMIUM BURGUNDY + GOLD CARD DESIGN
   REFERENCE SCREENSHOT STYLE
   ========================================================= */

.collections-section {
    width: 100%;
    padding: 55px 60px 75px;

    /* KEEP EXISTING SECTION BACKGROUND */
    background: #fff8f4;

    overflow: visible;
}

.collections-container {
    width: 100%;
    max-width: 1920px;
    margin: 0 auto;
    position: relative;
}


/* =========================================================
   COLLECTIONS HEADING
   ========================================================= */

.collections-heading {
    position: relative;
    text-align: center;
    margin-bottom: 38px;
}

.collections-heading__line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-bottom: 12px;
}

.collections-heading__line span {
    width: 105px;
    height: 1px;

    background: linear-gradient(
        90deg,
        transparent,
        #c9a15b
    );

    opacity: 0.8;
}

.collections-heading__line span:last-child {
    background: linear-gradient(
        90deg,
        #c9a15b,
        transparent
    );
}

.collections-heading__line i {
    color: #c9a15b;
    font-size: 14px;

    filter: drop-shadow(
        0 0 8px rgba(201, 161, 91, 0.35)
    );
}

.collections-heading h2 {
    margin: 0;

    color: #6e182d;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size: clamp(
        48px,
        4.5vw,
        72px
    );

    font-weight: 600;
    line-height: 1;

    letter-spacing: -1px;
}

.collections-heading p {
    margin: 12px 0 0;

    color: #b88645;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 11px;
    font-weight: 600;

    letter-spacing: 5px;

    text-transform: uppercase;
}


/* =========================================================
   SEE ALL BUTTON
   ========================================================= */

.collections-see-all {
    position: absolute;

    top: 0;
    right: 0;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 15px;

    min-width: 155px;
    height: 62px;

    padding: 0 25px;

    border: 1px solid
        rgba(255, 255, 255, 0.08);

    border-radius: 34px;

    background:
        rgba(91, 28, 43, 0.88);

    color: #fff9ed !important;

    text-decoration: none !important;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 13px;
    font-weight: 500;

    transition:
        transform .35s ease,
        background .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.collections-see-all i {
    color: #e1bc76;
    font-size: 13px;

    transition:
        transform .35s ease;
}

.collections-see-all:hover {
    transform: translateY(-3px);

    background:
        #741c32;

    border-color:
        rgba(210, 170, 95, .45);

    box-shadow:
        0 12px 30px
        rgba(74, 18, 35, .20);
}

.collections-see-all:hover i {
    transform: translateX(4px);
}


/* =========================================================
   GRID WRAPPER
   ========================================================= */

.collections-grid-wrap {
    position: relative;
    width: 100%;
}

.collections-grid {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 28px;

    align-items: stretch;
}


/* =========================================================
   COLLECTION CARD
   ========================================================= */

.collection-card {
    position: relative;

    width: 100%;
    height: 480px;

    min-width: 0;

    overflow: hidden;

    border:
        1px solid
        rgba(221, 191, 132, 0.58);

    border-radius: 30px;

    background:
        #351019;

    box-shadow:
        0 18px 42px
        rgba(48, 13, 23, 0.16);

    isolation: isolate;

    transition:
        transform .55s cubic-bezier(.22, .61, .36, 1),
        border-color .4s ease,
        box-shadow .5s ease;
}

.collection-card:hover {
    transform:
        translateY(-8px);

    border-color:
        rgba(229, 197, 133, 0.95);

    box-shadow:
        0 28px 55px
        rgba(48, 13, 23, 0.28);
}


/* =========================================================
   VIDEO / IMAGE AREA
   ========================================================= */

.collection-card__media {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    display: block;

    overflow: hidden;

    background:
        #350d19;
}


/* =========================================================
   REMOVE OLD SIDE NUMBER AREA
   ========================================================= */

.collection-card__side {
    display: none !important;
}


/* =========================================================
   VIDEO
   ========================================================= */

.collection-card__video {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    overflow: hidden;

    background:
        #350d19;
}

.collection-card__video video {
    position: absolute;

    inset: 0;

    z-index: 1;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    background:
        #350d19;

    cursor: pointer;

    transform:
        scale(1.001);

    transition:
        transform 1.1s cubic-bezier(.22, .61, .36, 1),
        filter .8s ease;
}


/* =========================================================
   IMAGE DARK OVERLAY
   ========================================================= */

.collection-card__video::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 2;

    pointer-events: none;

    background:
        linear-gradient(
            to bottom,
            rgba(37, 7, 17, 0.08) 0%,
            rgba(37, 7, 17, 0.02) 38%,
            rgba(37, 7, 17, 0.35) 62%,
            rgba(27, 5, 13, 0.96) 100%
        );
}


/* =========================================================
   SUBTLE BURGUNDY HOVER GLOW
   ========================================================= */

.collection-card__video::after {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 3;

    pointer-events: none;

    opacity: 0;

    background:
        radial-gradient(
            circle at 50% 40%,
            rgba(176, 66, 91, 0.16),
            transparent 58%
        );

    transition:
        opacity .7s ease;
}

.collection-card:hover
.collection-card__video::after {
    opacity: 1;
}

.collection-card:hover
.collection-card__video video {
    transform:
        scale(1.055);

    filter:
        saturate(1.08)
        contrast(1.03);
}


/* =========================================================
   THREE DOTS BUTTON
   ========================================================= */

.collection-card__menu {
    position: absolute;

    top: 30px;
    right: 30px;

    z-index: 8;

    width: 58px;
    height: 58px;

    padding: 0;

    border: 0;

    border-radius: 50%;

    background:
        rgba(24, 18, 17, 0.58);

    color: #fff;

    display: flex;
    align-items: center;
    justify-content: center;

    backdrop-filter:
        blur(8px);

    -webkit-backdrop-filter:
        blur(8px);

    cursor: pointer;

    transition:
        transform .35s ease,
        background .35s ease,
        box-shadow .35s ease;
}

.collection-card__menu i {
    font-size: 17px;

    letter-spacing: 3px;

    margin-left: 3px;
}

.collection-card__menu:hover {
    transform:
        scale(1.08);

    background:
        rgba(112, 30, 49, 0.82);

    box-shadow:
        0 8px 20px
        rgba(0, 0, 0, .22);
}


/* =========================================================
   PLAY BUTTON
   ========================================================= */

.collection-play {
    position: absolute;

    right: 30px;
    bottom: 30px;

    left: auto;
    top: auto;

    transform:
        scale(1);

    z-index: 10;

    width: 78px;
    height: 78px;

    padding: 0;

    border:
        1px solid
        rgba(255, 255, 255, 0.85);

    border-radius: 50%;

    background:
        rgba(255, 255, 255, 0.96);

    color:
        #171313;

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;

    backdrop-filter:
        blur(5px);

    box-shadow:
        0 8px 25px
        rgba(0, 0, 0, 0.16);

    transition:
        transform .4s cubic-bezier(.22, .61, .36, 1),
        background .35s ease,
        box-shadow .35s ease,
        opacity .25s ease;
}

.collection-play i {
    font-size: 20px;

    margin-left: 4px;
}

.collection-play:hover {
    transform:
        scale(1.09);

    background:
        #fff;

    box-shadow:
        0 12px 30px
        rgba(0, 0, 0, 0.25);
}


/* =========================================================
   CARD INFORMATION
   MERGED INTO IMAGE
   ========================================================= */

.collection-card__info {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    z-index: 6;

    width: 100%;

    min-height: 185px;

    padding:
        28px 32px 32px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 20px;

    background:
        linear-gradient(
            to bottom,
            transparent 0%,
            rgba(34, 5, 14, 0.16) 15%,
            rgba(34, 5, 14, 0.72) 52%,
            rgba(24, 4, 11, 0.97) 100%
        );

    pointer-events: none;
}


/* =========================================================
   CARD TEXT
   ========================================================= */

.collection-card__text {
    min-width: 0;

    max-width: 72%;
}

.collection-card__text::before {
    content: "";

    display: block;

    width: 30px;
    height: 1px;

    margin-bottom: 12px;

    background:
        #d8b56f;

    opacity: .85;
}

.collection-card__text p {
    order: -1;

    margin: 0 0 12px;

    color:
        rgba(255, 246, 231, 0.92);

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 10px;

    font-weight: 500;

    letter-spacing:
        4px;

    line-height: 1.4;

    text-transform:
        uppercase;
}

.collection-card__text h3 {
    margin: 0;

    color:
        #fffaf0;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        clamp(27px, 2.15vw, 39px);

    font-weight:
        600;

    line-height:
        1.05;

    letter-spacing:
        -0.3px;

    word-break:
        break-word;

    text-shadow:
        0 2px 15px
        rgba(0, 0, 0, 0.28);
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.collection-card__description {
    margin: 13px 0 0;

    max-width: 240px;

    color:
        rgba(255, 246, 235, 0.78);

    font-family:
        "Montserrat",
        sans-serif;

    font-size:
        13px;

    font-weight:
        400;

    letter-spacing:
        1px;

    line-height:
        1.55;
}


/* =========================================================
   HIDE OLD ACTION AREA
   ========================================================= */

.collection-card__action {
    display: none !important;
}

.collection-arrow {
    display: none !important;
}


/* =========================================================
   RIGHT CAROUSEL ARROW
   ========================================================= */

.collections-next {
    position: absolute;

    top: 50%;
    right: -28px;

    transform:
        translateY(-50%);

    z-index: 20;

    width: 78px;
    height: 78px;

    padding: 0;

    border:
        1px solid
        rgba(201, 177, 132, 0.55);

    border-radius: 50%;

    background:
        rgba(73, 35, 43, 0.82);

    color:
        #f8e7c7;

    display: flex;
    align-items: center;
    justify-content: center;

    backdrop-filter:
        blur(7px);

    -webkit-backdrop-filter:
        blur(7px);

    cursor: pointer;

    transition:
        transform .35s ease,
        background .35s ease,
        border-color .35s ease;
}

.collections-next i {
    font-size: 21px;
}

.collections-next:hover {
    transform:
        translateY(-50%)
        translateX(4px);

    background:
        #741c32;

    border-color:
        #d6b46e;
}


/* =========================================================
   REMOVE OLD BOTTOM DECORATION
   ========================================================= */

.collections-bottom,
.collections-bottom-text {
    display: none !important;
}


/* =========================================================
   FULLSCREEN VIDEO
   ========================================================= */

.collection-card__video:fullscreen {
    width: 100vw;
    height: 100vh;

    background: #000;

    display: flex;
    align-items: center;
    justify-content: center;
}

.collection-card__video:fullscreen video {
    width: 100%;
    height: 100%;

    object-fit: contain;

    background: #000;

    transform: none !important;
}

.collection-card__video:-webkit-full-screen {
    width: 100vw;
    height: 100vh;

    background: #000;

    display: flex;
    align-items: center;
    justify-content: center;
}

.collection-card__video:-webkit-full-screen video {
    width: 100%;
    height: 100%;

    object-fit: contain;

    background: #000;

    transform: none !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1200px) {

    .collections-section {
        padding-left: 35px;
        padding-right: 35px;
    }

    .collections-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 24px;
    }

    .collection-card {
        height: 450px;
    }

    .collections-next {
        right: -20px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .collections-section {
        padding:
            50px 16px 55px;
    }

    .collections-heading {
        margin-bottom: 30px;
    }

    .collections-heading__line {
        gap: 10px;
    }

    .collections-heading__line span {
        width: 45px;
    }

    .collections-heading h2 {
        font-size: 42px;
    }

    .collections-heading p {
        font-size: 8px;
        letter-spacing: 2.5px;
    }

    .collections-see-all {
        position: relative;

        top: auto;
        right: auto;

        margin:
            20px auto 0;

        min-width: 125px;
        height: 44px;

        font-size: 10px;

        gap: 10px;
    }

    .collections-grid {
        grid-template-columns: 1fr;

        gap: 20px;
    }

    .collection-card {
        height: 430px;

        border-radius: 23px;
    }

    .collection-card__menu {
        top: 20px;
        right: 20px;

        width: 50px;
        height: 50px;
    }

    .collection-card__menu i {
        font-size: 15px;
    }

    .collection-play {
        right: 20px;
        bottom: 20px;

        width: 64px;
        height: 64px;
    }

    .collection-play i {
        font-size: 17px;
    }

    .collection-card__info {
        min-height: 175px;

        padding:
            25px 22px 25px;
    }

    .collection-card__text {
        max-width: 78%;
    }

    .collection-card__text p {
        margin-bottom: 9px;

        font-size: 8px;
        letter-spacing: 2.5px;
    }

    .collection-card__text h3 {
        font-size: 29px;
    }

    .collection-card__description {
        font-size: 10px;
        max-width: 190px;
    }

    .collections-next {
        display: none;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .collections-section {
        padding:
            42px 12px 48px;
    }

    .collections-heading h2 {
        font-size: 36px;
    }

    .collections-heading p {
        font-size: 7px;
        letter-spacing: 2px;
    }

    .collection-card {
        height: 390px;

        border-radius: 20px;
    }

    .collection-card__menu {
        top: 16px;
        right: 16px;

        width: 46px;
        height: 46px;
    }

    .collection-play {
        right: 17px;
        bottom: 17px;

        width: 58px;
        height: 58px;
    }

    .collection-card__info {
        min-height: 155px;

        padding:
            22px 18px 21px;
    }

    .collection-card__text h3 {
        font-size: 25px;
    }

    .collection-card__description {
        font-size: 9px;
    }
}


/* =========================================================
   EXTRA SMALL
   ========================================================= */

@media (max-width: 360px) {

    .collections-section {
        padding-left: 9px;
        padding-right: 9px;
    }

    .collection-card {
        height: 365px;
    }

    .collection-card__text h3 {
        font-size: 23px;
    }

    .collection-card__text p {
        font-size: 7px;
        letter-spacing: 2px;
    }
}

/* jewel story section  */
/* =========================================================
   JEWELLERY STORY SECTION
   CLEAN PREMIUM ARCH DESIGN
========================================================= */

.jewel-story-section {

    position: relative;

    width: 100%;

    overflow: hidden;

    padding: 105px 0 110px;

    background:
        linear-gradient(
            135deg,
            #fffdf9 0%,
            #fff9f3 50%,
            #f8e1cf 100%
        );
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.jewel-story-container {

    width: min(
        1380px,
        calc(100% - 80px)
    );

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        0.82fr
        1.18fr;

    align-items: center;

    gap: 55px;

    position: relative;

    z-index: 2;
}


/* =========================================================
   LEFT CONTENT
========================================================= */

.jewel-story-content {

    padding: 20px 0;

    position: relative;

    z-index: 5;
}


/* =========================================================
   TOP DECORATIVE LINE
========================================================= */

.jewel-story-top-line {

    display: flex;

    align-items: center;

    gap: 13px;

    margin-bottom: 22px;
}


.jewel-story-top-line span {

    width: 62px;

    height: 1px;

    display: block;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c28a4c
        );
}


.jewel-story-top-line span:last-child {

    background:
        linear-gradient(
            90deg,
            #c28a4c,
            transparent
        );
}


.jewel-story-top-line i {

    width: 25px;

    height: 25px;

    border-radius: 50%;

    border: 1px solid
        rgba(194, 138, 76, 0.6);

    display: flex;

    align-items: center;

    justify-content: center;

    color: #bd7e39;

    font-size: 10px;

    background: #fffaf4;
}


/* =========================================================
   EYEBROW
========================================================= */

.jewel-story-eyebrow {

    display: block;

    margin-bottom: 17px;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 11px;

    font-weight: 600;

    letter-spacing: 5px;

    color: #a96e32;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.jewel-story-content h2 {
    text-align: left;

    margin: 0;

    max-width: 560px;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            45px,
            4.5vw,
            72px
        );

    line-height: 0.98;

    font-weight: 400;

    letter-spacing: -2.5px;

    color: #302019;
}


.jewel-story-content h2 em {

    font-style: italic;

    color: #b87532;

    font-weight: 400;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.jewel-story-description {

    max-width: 500px;

    margin: 30px 0 30px;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 14px;

    line-height: 1.85;

    color: #76645b;
}


/* =========================================================
   FEATURE LIST
========================================================= */

.jewel-story-points {

    display: flex;

    flex-direction: column;

    gap: 14px;

    margin-bottom: 30px;
}


/* =========================================================
   FEATURE ITEM
========================================================= */

.jewel-story-point {

    display: flex;

    align-items: center;

    gap: 13px;
}


/* =========================================================
   FEATURE ICON
========================================================= */

.jewel-story-point-icon {

    width: 40px;

    height: 40px;

    flex: 0 0 40px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    border: 1px solid
        rgba(194, 138, 76, 0.42);

    color: #b97836;

    background:
        rgba(255, 253, 249, 0.8);

    font-size: 12px;

    transition:
        all 0.3s ease;
}


.jewel-story-point:hover
.jewel-story-point-icon {

    background: #b97836;

    color: #fff;

    transform:
        translateY(-2px);
}


/* =========================================================
   FEATURE TEXT
========================================================= */

.jewel-story-point strong {

    display: block;

    margin-bottom: 2px;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 13px;

    font-weight: 700;

    color: #3c2b24;
}


.jewel-story-point small {

    display: block;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 11px;

    color: #9a8377;
}


/* =========================================================
   BUTTON
========================================================= */

.jewel-story-button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 22px;

    min-width: 205px;

    padding: 15px 21px;

    text-decoration: none;

    border-radius: 0;

    background: #a96829;

    border: 1px solid #a96829;

    color: #fff;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 2px;

    transition:
        all 0.35s ease;
}


.jewel-story-button i {

    font-size: 10px;

    transition:
        transform 0.3s ease;
}


.jewel-story-button:hover {

    background: transparent;

    color: #a96829;

    transform:
        translateY(-2px);

    box-shadow:
        0 12px 30px
        rgba(169, 104, 41, 0.12);
}


.jewel-story-button:hover i {

    transform:
        translateX(5px);
}


/* =========================================================
   RIGHT VISUAL
========================================================= */

.jewel-story-visual {

    position: relative;

    width: 100%;

    height: 590px;

    display: flex;

    align-items: flex-end;

    justify-content: center;

    gap: 20px;
}


/* =========================================================
   ARCH COMMON STYLE
========================================================= */

.jewel-arch {

    position: relative;

    flex: 0 0 30%;

    max-width: 230px;

    height: 450px;

    overflow: hidden;

    border: 1px solid
        rgba(190, 128, 57, 0.75);

    border-bottom: 0;

    border-radius:
        120px 120px 0 0;

    background:
        #f4dfcd;

    box-shadow:
        0 12px 30px
        rgba(100, 65, 40, 0.06);

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


/* =========================================================
   ARCH 01
========================================================= */

.jewel-arch--one {

    height: 390px;

    transform:
        translateY(0);
}


/* =========================================================
   ARCH 02
========================================================= */

.jewel-arch--two {

    height: 475px;

    transform:
        translateY(0);
}


/* =========================================================
   ARCH 03
========================================================= */

.jewel-arch--three {

    height: 550px;

    transform:
        translateY(0);
}


/* =========================================================
   ARCH HOVER
========================================================= */

.jewel-arch:hover {

    transform:
        translateY(-7px);

    box-shadow:
        0 20px 45px
        rgba(100, 65, 40, 0.13);
}


/* =========================================================
   IMAGE AREA
========================================================= */

.jewel-arch-image {

    position: absolute;

    inset: 0;

    overflow: hidden;

    border-radius:
        119px 119px 0 0;
}


/* =========================================================
   IMAGE
========================================================= */

.jewel-arch-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transform:
        scale(1.01);

    transition:
        transform 0.7s ease;
}


.jewel-arch:hover
.jewel-arch-image img {

    transform:
        scale(1.045);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.jewel-arch-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,0.03) 45%,
            rgba(54,34,24,0.15) 100%
        );

    pointer-events: none;
}


/* =========================================================
   NUMBER
========================================================= */

.jewel-arch-number {

    position: absolute;

    top: 18px;

    left: 18px;

    width: 35px;

    height: 35px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 5;

    background:
        rgba(255,250,244,0.9);

    border: 1px solid
        rgba(255,255,255,0.9);

    color: #8f5d2d;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 10px;

    font-weight: 700;
}


/* =========================================================
   BOTTOM LABEL
========================================================= */

.jewel-arch-label {

    position: absolute;

    left: 0;

    right: 0;

    bottom: 0;

    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    z-index: 6;

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(53,33,24,0.65)
        );
}


.jewel-arch-label span {

    padding-top: 12px;

    color: #fff;

    font-family:
        "Be Vietnam Pro",
        sans-serif;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 4px;
}


/* =========================================================
   REMOVE OLD ORBIT ELEMENTS
   IF THEY ARE PRESENT IN HTML
========================================================= */

.jewel-story-visual
.jewel-orbit {

    display: none !important;
}


.jewel-visual-line {

    display: none !important;
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1200px) {

    .jewel-story-container {

        width:
            min(
                1100px,
                calc(100% - 50px)
            );

        gap: 35px;
    }


    .jewel-story-content h2 {

        font-size: 54px;
    }


    .jewel-story-visual {

        height: 530px;

        gap: 15px;
    }


    .jewel-arch {

        max-width: 195px;
    }


    .jewel-arch--one {

        height: 350px;
    }


    .jewel-arch--two {

        height: 425px;
    }


    .jewel-arch--three {

        height: 500px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .jewel-story-section {

        padding:
            80px 0 90px;
    }


    .jewel-story-container {

        grid-template-columns:
            1fr 1fr;

        gap: 25px;

        width:
            calc(100% - 40px);
    }


    .jewel-story-content h2 {

        font-size: 46px;

        letter-spacing: -1.8px;
    }


    .jewel-story-description {

        font-size: 13px;

        line-height: 1.75;
    }


    .jewel-story-visual {

        height: 500px;

        gap: 10px;
    }


    .jewel-arch {

        flex-basis: 31%;

        max-width: 170px;

        border-radius:
            90px 90px 0 0;
    }


    .jewel-arch-image {

        border-radius:
            89px 89px 0 0;
    }


    .jewel-arch--one {

        height: 320px;
    }


    .jewel-arch--two {

        height: 400px;
    }


    .jewel-arch--three {

        height: 475px;
    }


    .jewel-arch-number {

        width: 30px;

        height: 30px;

        top: 14px;

        left: 14px;

        font-size: 9px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .jewel-story-section {

        padding:
            70px 0 75px;
    }


    .jewel-story-container {

        width:
            calc(100% - 30px);

        grid-template-columns: 1fr;

        gap: 55px;
    }


    /* LEFT CONTENT */

    .jewel-story-content {

        text-align: center;

        padding: 0;
    }


    .jewel-story-top-line {

        justify-content: center;
    }


    .jewel-story-eyebrow {

        font-size: 10px;

        letter-spacing: 4px;
    }


    .jewel-story-content h2 {

        font-size: 43px;

        line-height: 1;

        letter-spacing: -1.5px;

        max-width: 500px;

        margin:
            0 auto;
    }


    .jewel-story-description {

        margin:
            25px auto 28px;

        max-width: 500px;

        font-size: 13px;
    }


    .jewel-story-points {

        max-width: 340px;

        margin:
            0 auto 30px;

        text-align: left;
    }


    .jewel-story-button {

        margin: 0 auto;
    }


    /* RIGHT ARCHES */

    .jewel-story-visual {

        height: 470px;

        width: 100%;

        gap: 8px;
    }


    .jewel-arch {

        flex-basis: 31%;

        max-width: 130px;

        border-radius:
            70px 70px 0 0;
    }


    .jewel-arch-image {

        border-radius:
            69px 69px 0 0;
    }


    .jewel-arch--one {

        height: 300px;
    }


    .jewel-arch--two {

        height: 365px;
    }


    .jewel-arch--three {

        height: 425px;
    }


    .jewel-arch-number {

        width: 27px;

        height: 27px;

        top: 10px;

        left: 10px;

        font-size: 8px;
    }


    .jewel-arch-label {

        height: 45px;
    }


    .jewel-arch-label span {

        padding-top: 8px;

        font-size: 8px;

        letter-spacing: 2.5px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .jewel-story-section {

        padding:
            60px 0 65px;
    }


    .jewel-story-container {

        width:
            calc(100% - 22px);

        gap: 45px;
    }


    .jewel-story-top-line span {

        width: 42px;
    }


    .jewel-story-content h2 {

        font-size: 35px;

        letter-spacing: -1px;
    }


    .jewel-story-description {

        padding:
            0 8px;

        font-size: 12px;

        line-height: 1.75;
    }


    .jewel-story-point {

        gap: 10px;
    }


    .jewel-story-point-icon {

        width: 35px;

        height: 35px;

        flex-basis: 35px;

        font-size: 10px;
    }


    .jewel-story-point strong {

        font-size: 11px;
    }


    .jewel-story-point small {

        font-size: 9px;
    }


    .jewel-story-button {

        min-width: 190px;

        padding:
            13px 17px;

        font-size: 9px;

        letter-spacing: 1.5px;
    }


    /* ARCH AREA */

    .jewel-story-visual {

        height: 390px;

        gap: 5px;
    }


    .jewel-arch {

        flex-basis: 31%;

        max-width: 100px;

        border-radius:
            55px 55px 0 0;
    }


    .jewel-arch-image {

        border-radius:
            54px 54px 0 0;
    }


    .jewel-arch--one {

        height: 245px;
    }


    .jewel-arch--two {

        height: 300px;
    }


    .jewel-arch--three {

        height: 355px;
    }


    .jewel-arch-number {

        width: 23px;

        height: 23px;

        top: 8px;

        left: 8px;

        font-size: 7px;
    }


    .jewel-arch-label {

        height: 37px;
    }


    .jewel-arch-label span {

        padding-top: 6px;

        font-size: 6px;

        letter-spacing: 1.5px;
    }
}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 360px) {

    .jewel-story-content h2 {

        font-size: 31px;
    }


    .jewel-story-visual {

        height: 350px;
    }


    .jewel-arch {

        max-width: 88px;

        border-radius:
            48px 48px 0 0;
    }


    .jewel-arch-image {

        border-radius:
            47px 47px 0 0;
    }


    .jewel-arch--one {

        height: 220px;
    }


    .jewel-arch--two {

        height: 270px;
    }


    .jewel-arch--three {

        height: 315px;
    }
}
/* shop by cat light  */
/* =========================================================
   SHOP BY CATEGORY - LIGHT / DARK TOGGLE
========================================================= */

.home-categories__title-row {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* Light button */

.category-theme-toggle {
    position: absolute;

    right: 20px;
    top: 50%;

    width: 44px;
    height: 44px;

    transform: translateY(-50%);

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    border: 1px solid rgba(184, 134, 62, 0.28);
    border-radius: 50%;

    background: rgba(255, 253, 249, 0.90);

    color: #B9783E;

    cursor: pointer;

    box-shadow:
        0 6px 18px rgba(120, 75, 35, 0.08);

    transition:
        all 0.35s ease;
}


/* Bulb */

.category-theme-toggle__icon {
    width: 32px;
    height: 32px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #FFF3E4;

    color: #B9783E;

    font-size: 15px;

    transition:
        all 0.35s ease;
}


/* Hover */

.category-theme-toggle:hover {
    transform:
        translateY(-50%)
        scale(1.06);

    border-color:
        rgba(184, 134, 62, 0.50);

    box-shadow:
        0 8px 22px
        rgba(120, 75, 35, 0.14);
}


/* =========================================================
   DARK MODE
   ONLY SHOP BY CATEGORY
========================================================= */

.home-categories.category-night-mode {

    background:
      linear-gradient(180deg, #890937 0%, #500a35 50%, #880d42 100%);

    color: #F5E7D5;
}


/* Heading */

.home-categories.category-night-mode
.home-categories__eyebrow {
    color: #D9A45B;
}

.home-categories.category-night-mode
.home-categories__heading h2 {
    color: #F5E7D5;
}

.home-categories.category-night-mode
.home-categories__heading p {
    color: #B9A99B;
}


/* Divider */

.home-categories.category-night-mode
.home-categories__heading-line span {
    background: #C9914C;
}

.home-categories.category-night-mode
.home-categories__heading-line b {
    color: #DDAE68;
}


/* Category card */

.home-categories.category-night-mode
.home-category-image {
    background: #f2c762;

    border-color:
        rgba(218, 164, 91, 0.28);

    box-shadow:
        0 18px 40px
        rgba(0, 0, 0, 0.35);
}


/* Image inner */

.home-categories.category-night-mode
.home-category-image__inner {
    background: #211713;
}


/* Gold border */

.home-categories.category-night-mode
.home-category-image::after {
    border-color:
        rgba(224, 129, 5, 0.38);
}


/* Category name */

.home-categories.category-night-mode
.home-category-info h3 {
    color: #F3DFCA;
}


/* Explore */

.home-categories.category-night-mode
.home-category-info span {
    color: #D9A45B;
}


/* Arrows */

.home-categories.category-night-mode
.home-category-arrow {

    background: #281C16;

    color: #D9A45B;

    border-color:
        rgba(218, 164, 91, 0.30);

    box-shadow:
        0 8px 22px
        rgba(0, 0, 0, 0.30);
}


/* Arrow hover */

.home-categories.category-night-mode
.home-category-arrow:hover {

    background: #D09A51;

    color: #18110E;

    border-color: #D09A51;
}


/* Progress */

.home-categories.category-night-mode
.home-category-progress__line {
    background:
        rgba(218, 164, 91, 0.16);
}

.home-categories.category-night-mode
.home-category-progress__line span {
    background: #D9A45B;
}

.home-categories.category-night-mode
.home-category-progress__count {
    color: #D9A45B;
}


/* Toggle in dark mode */

.home-categories.category-night-mode
.category-theme-toggle {

    background: #281C16;

    border-color:
        rgba(218, 164, 91, 0.40);

    box-shadow:
        0 0 18px
        rgba(218, 164, 91, 0.15);
}


.home-categories.category-night-mode
.category-theme-toggle__icon {

    background:
        linear-gradient(
            145deg,
            #E6B66C,
            #A96F32
        );

    color: #21150F;

    box-shadow:
        0 0 16px
        rgba(226, 171, 91, 0.35);
}


/* Smooth section transition */

.home-categories {
    transition:
        background 0.5s ease;
}

.home-categories__heading h2,
.home-categories__heading p,
.home-categories__eyebrow,
.home-category-image,
.home-category-image__inner,
.home-category-info h3,
.home-category-info span,
.home-category-arrow,
.home-category-progress__line,
.home-category-progress__count,
.category-theme-toggle,
.category-theme-toggle__icon {
    transition:
        background 0.5s ease,
        background-color 0.5s ease,
        color 0.5s ease,
        border-color 0.5s ease,
        box-shadow 0.5s ease;
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .category-theme-toggle {
        right: 5px;

        width: 38px;
        height: 38px;
    }

    .category-theme-toggle__icon {
        width: 28px;
        height: 28px;

        font-size: 13px;
    }

    .home-categories__title-row h2 {
        padding-right: 45px;
    }
}


@media (max-width: 480px) {

    .category-theme-toggle {
        right: 0;

        width: 34px;
        height: 34px;
    }

    .category-theme-toggle__icon {
        width: 25px;
        height: 25px;

        font-size: 12px;
    }

    .home-categories__title-row h2 {
        padding-right: 40px;
    }
}

/* product caroseoul */
/* =========================================================
   LATEST PRODUCTS
   PREMIUM JEWELLERY CENTER-ZOOM CAROUSEL
========================================================= */

/* =========================================================
   LATEST PRODUCTS
   LUXURY ARCH / OVAL CARD CAROUSEL
========================================================= */

.latest-products-section {
    --lp-bg: #fff9f1;
    --lp-card: #fffdf9;
    --lp-gold: #bd8233;
    --lp-gold-light: #e4bd7e;
    --lp-gold-soft: rgba(189, 130, 51, 0.20);
    --lp-text: #34271f;
    --lp-muted: #8d7969;

    position: relative;
    width: 100%;

    padding: 0px 0 0px !important;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 50% 48%,
            rgba(255, 255, 255, 0.95) 0%,
            rgba(255, 249, 241, 0.90) 45%,
            rgba(247, 224, 198, 0.32) 100%
        );
}


/* =========================================================
   CONTAINER
========================================================= */

.latest-products-container {
    width: min(1740px, calc(100% - 70px));

    margin: 0 auto;

    position: relative;
}


/* =========================================================
   HEADING
========================================================= */

.latest-products-heading {
    text-align: center;

    margin-bottom: 42px;

    position: relative;

    z-index: 5;
}

.latest-products-eyebrow {
    display: block;

    margin-bottom: 12px;

    color: var(--lp-gold);

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 10px;

    font-weight: 600;

    letter-spacing: 4px;

    text-transform: uppercase;
}

.latest-products-title-row {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 15px;

    margin-bottom: 10px;
}

.latest-title-line {
    width: 45px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--lp-gold)
        );
}

.latest-title-line:last-child {
    background:
        linear-gradient(
            90deg,
            var(--lp-gold),
            transparent
        );
}

.latest-products-title-row i {
    color: var(--lp-gold);

    font-size: 14px;
}

.latest-products-heading h2 {
    margin: 0;

    color: var(--lp-text);

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size:
        clamp(42px, 4vw, 60px);

    font-weight: 600;

    line-height: 1;
}

.latest-products-heading p {
    margin: 12px 0 0;

    color: var(--lp-muted);

    font-family:
        "Quicksand",
        sans-serif;

    font-size: 12px;

    letter-spacing: 1.5px;
}


/* =========================================================
   CAROUSEL WRAPPER
========================================================= */

.latest-products-carousel {
    position: relative;

    width: 100%;

    display: flex;

    align-items: center;
}


/* =========================================================
   VIEWPORT
========================================================= */

.latest-products-viewport {
    width: 100%;

    overflow: hidden;

    padding:
        60px 0
        65px;

    position: relative;
}


/* =========================================================
   TRACK
========================================================= */

.latest-products-track {
    display: flex;

    align-items: center;

    gap: 24px;

    width: max-content;

    will-change: transform;

    transition:
        transform
        0.75s
        cubic-bezier(
            0.22,
            0.61,
            0.36,
            1
        );
}


/* =========================================================
   CARD
   ARCH / OVAL STYLE
========================================================= */

.latest-product-card {

    flex:
        0 0
        calc(
            (100vw - 70px - 96px) / 5
        );

    width:
        calc(
            (100vw - 70px - 96px) / 5
        );

    max-width: 325px;

    min-width: 0;

    position: relative;

    padding:
        18px
        15px
        22px;

    background:
        linear-gradient(
            180deg,
            #f1d9be 0%,
            #fce7c7 100%
        );

    border:
    1.5px solid
       #fce7c7;

    /*
       ARCH TOP + OVAL BOTTOM
    */

    border-radius:
        150px
        150px
        65px
        65px;

    box-shadow:
        0 18px 45px
        rgba(100, 65, 35, 0.10);

    transform:
    scale(0.88)
    translateY(18px);

    opacity: 0.68;

    filter:
        saturate(0.88);

    transition:
        transform 0.75s
        cubic-bezier(
            0.22,
            0.61,
            0.36,
            1
        ),

        opacity 0.55s ease,

        box-shadow 0.55s ease,

        filter 0.55s ease;

    z-index: 1;
}


/* =========================================================
   CARD INNER GLOW
========================================================= */

.latest-product-card::before {

    content: "";

    position: absolute;

    inset: 5px;

    border-radius:
        145px
        145px
        60px
        60px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.85
        );

    pointer-events: none;

    z-index: 0;
}




/* =========================================================
   CENTER CARD
========================================================= */

.latest-product-card.is-active {

    transform:
        scale(1.13)
        translateY(-18px);

    opacity: 1;

    filter:
        saturate(1);

    box-shadow:
        0 30px 80px
        rgba(
            105,
            67,
            31,
            0.20
        );

    z-index: 20;
}


/* =========================================================
   CENTER CARD GOLD BORDER
========================================================= */

.latest-product-card.is-active {

    border-color:
        rgba(
            189,
            130,
            51,
            0.65
        );
}


/* =========================================================
   PRODUCT TOP
========================================================= */
.latest-product-top {
    position: relative;
    z-index: 5;

    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 35px;

    margin-top: 25px;
    margin-left: 18px;
    margin-right: 18px;
    margin-bottom: 4px;
}


/* =========================================================
   NEW BADGE
========================================================= */

.latest-product-badge {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding:
        6px
        12px;

    border-radius: 30px;

    background:
        linear-gradient(
            135deg,
            #f8dcae,
            #efbd68
        );

    color:
        #6d4522;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 0.8px;

    text-transform: uppercase;
}


/* =========================================================
   WISHLIST
========================================================= */

.latest-product-wishlist {

    width: 36px;

    height: 36px;

    border: none;

    border-radius: 50%;

    background:
        transparent;

    color:
        #5d4b3d;

    display: flex;

    align-items: center;

    justify-content: center;

    cursor: pointer;

    transition:
        all 0.3s ease;

    position: relative;

    z-index: 5;
}

.latest-product-wishlist:hover {

    color:
        var(--lp-gold);

    background:
        rgba(
            189,
            130,
            51,
            0.08
        );

    transform:
        scale(1.08);
}


/* =========================================================
   IMAGE LINK
========================================================= */

.latest-product-image-link {

    display: block;

    text-decoration: none;

    position: relative;

    z-index: 3;

    margin-top: 4px;
}


/* =========================================================
   IMAGE AREA
========================================================= */

.latest-product-image {

    width: 100%;

    height: 200px;

    overflow: hidden;

    display: flex;

    align-items: center;

    justify-content: center;

    background:
        linear-gradient(
            145deg,
            #ffe6d4,
            #fae6d2
        );

    /*
       Matching arch image shape
    */

    border-radius:
        10px
        105px
        30px
        30px;

    border:
        1px solid
        rgba(
            189,
            130,
            51,
            0.08
        );
          box-shadow:
        0 12px 28px rgba(235, 174, 190, 0.18),
        0 4px 12px rgba(235, 174, 190, 0.10);
}



/* =========================================================
   IMAGE
========================================================= */

.latest-product-image img {

    width: 100%;

    height: 250px;

    object-fit: contain;

    padding: 13px;

    display: block;

    transition:
        transform
        0.75s
        cubic-bezier(
            0.22,
            0.61,
            0.36,
            1
        );
}


/* =========================================================
   IMAGE HOVER
========================================================= */

.latest-product-card:hover
.latest-product-image img {

    transform:
        scale(1.07);
}


/* =========================================================
   CENTER IMAGE
========================================================= */

.latest-product-card.is-active
.latest-product-image img {

    transform:
        scale(1.06);
}


/* =========================================================
   PRODUCT INFO
========================================================= */

.latest-product-info {

    position: relative;

    z-index: 4;

    padding:
        15px
        4px
        0;

    text-align: left;
}


/* =========================================================
   PRODUCT NAME
========================================================= */

.latest-product-info h3 {

    margin:
        0 0 5px;

    color:
        var(--lp-text);

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.05;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.latest-product-info p {

    margin:
        0 0 12px;

    color:
        var(--lp-muted);

    font-family:
        "Quicksand",
        sans-serif;

    font-size: 10px;

    line-height: 1.4;

    min-height: 28px;

    overflow: hidden;
}


/* =========================================================
   RATING
========================================================= */

.latest-product-rating {

    display: flex;

    align-items: center;

    gap: 5px;

    margin-bottom: 14px;

    color:
        #79695d;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 9px;
}

.latest-star {

    color:
        #d99520;

    font-size: 13px;
}

.latest-product-rating small {

    color:
        #9a887a;

    font-size: 8px;
}


/* =========================================================
   BOTTOM
========================================================= */

.latest-product-bottom {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 10px;
}


/* =========================================================
   PRICE
========================================================= */

.latest-product-price {

    color:
        #35281f;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 15px;

    font-weight: 700;

    white-space: nowrap;
}


/* =========================================================
   ADD TO CART
========================================================= */

.latest-product-cart-form {

    margin: 0;

    padding: 0;
}

.latest-product-cart {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 7px;

    min-height: 37px;

    padding:
        8px
        15px;

    border: none;

    border-radius: 30px;

    background:
        linear-gradient(
            135deg,
            #c58b3d,
            #aa6d27
        );

    color:
        #fff;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 8px;

    font-weight: 600;

    white-space: nowrap;

    cursor: pointer;

    box-shadow:
        0 7px 18px
        rgba(
            169,
            108,
            39,
            0.22
        );

    transition:
        all 0.3s ease;
}

.latest-product-cart i {

    font-size: 9px;
}

.latest-product-cart:hover {

    background:
        #4a0e18 !important;

    border:
        1px solid
        #e9c87c !important;

    color:
        #e9c87c !important;

    transform:
        none !important;

    box-shadow:
        0 8px 20px
        rgba(
            74,
            14,
            24,
            0.28
        ) !important;
}

.latest-product-cart:hover i {

    color:
        #e9c87c !important;

    transform:
        none !important;
}

.latest-product-cart:disabled {

    opacity: 0.45;

    cursor:
        not-allowed;

    transform: none;

    box-shadow: none;
}


/* =========================================================
   CENTER CARD CONTENT
========================================================= */

.latest-product-card.is-active
.latest-product-info h3 {

    font-size: 27px;
}

.latest-product-card.is-active
.latest-product-price {

    font-size: 18px;
}

.latest-product-card.is-active
.latest-product-cart {

    min-height: 42px;

    padding:
        9px 18px;

    font-size: 9px;
}


/* =========================================================
   ARROWS
========================================================= */

.latest-products-arrow {

    position: absolute;

    top: 50%;

    transform:
        translateY(-50%);

    width: 54px;

    height: 54px;

    border:
        1px solid
        rgba(
            189,
            130,
            51,
            0.25
        );

    border-radius: 50%;

    background:
        rgba(
            255,
            253,
            249,
            0.96
        );

    color:
        #65452d;

    display: flex;

    align-items: center;

    justify-content: center;

    cursor: pointer;

    z-index: 50;

    box-shadow:
        0 10px 28px
        rgba(
            80,
            50,
            25,
            0.12
        );

    transition:
        all 0.3s ease;
}

.latest-products-arrow:hover {

    background:
        var(--lp-gold);

    color:
        #fff;

    transform:
        translateY(-50%)
        scale(1.08);
}

.latest-products-arrow:disabled {

    opacity:
        0.45;

    cursor:
        default;
}

.latest-products-prev {

    left:
        -22px;
}

.latest-products-next {

    right:
        -22px;
}


/* =========================================================
   DOTS
========================================================= */

.latest-products-dots {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    margin-top:
        3px;
}

.latest-product-dot {

    width: 9px;

    height: 9px;

    padding: 0;

    border:
        1px solid
        var(--lp-gold);

    border-radius: 50%;

    background:
        transparent;

    cursor: pointer;

    transition:
        all 0.35s ease;
}

.latest-product-dot:hover {

    transform:
        scale(1.15);
}

.latest-product-dot.is-active {

    width: 11px;

    height: 11px;

    background:
        var(--lp-gold);

    border-color:
        var(--lp-gold);

    box-shadow:
        0 0 0 4px
        rgba(
            189,
            130,
            51,
            0.10
        );
}


/* =========================================================
   VIEW ALL
========================================================= */

.latest-products-view-all {

    display: flex;

    justify-content: center;

    margin-top:
        34px;
}

.latest-products-view-all a {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 20px;

    min-width:
        260px;

    padding:
        14px 24px;

    border:
        1px solid
        #b9783e;

    border-radius:
        4px;

    background:
        rgba(
            255,
            253,
            249,
            0.60
        );

    color:
        #553a27 !important;

    text-decoration:
        none !important;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 9px;

    font-weight: 600;

    letter-spacing: 2.3px;

    transition:
        all 0.35s ease;
}

.latest-products-view-all a:hover {

    background:
        var(--lp-gold);

    color:
        #fff !important;

    transform:
        translateY(-2px);

    box-shadow:
        0 10px 25px
        rgba(
            184,
            134,
            62,
            0.20
        );
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1400px) {

    .latest-products-container {

        width:
            calc(100% - 65px);
    }

    .latest-product-card {

        flex:
            0 0
            calc(
                (100% - 72px) / 4
            );

        width:
            calc(
                (100% - 72px) / 4
            );
    }

    .latest-product-card.is-active {

        transform:
            scale(1.10);
    }

    .latest-product-image {

        height: 215px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .latest-products-container {

        width:
            calc(100% - 50px);
    }

    .latest-product-card {

        flex:
            0 0
            calc(
                (100% - 48px) / 3
            );

        width:
            calc(
                (100% - 48px) / 3
            );

        border-radius:
            120px
            120px
            50px
            50px;
    }

    .latest-product-card.is-active {

        transform:
            scale(1.07);
    }

    .latest-product-image {

        height: 200px;

        border-radius:
            85px
            85px
            25px
            25px;
    }

    .latest-product-info h3 {

        font-size: 20px;
    }

    .latest-product-card.is-active
    .latest-product-info h3 {

        font-size: 23px;
    }

    .latest-products-prev {

        left:
            -12px;
    }

    .latest-products-next {

        right:
            -12px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .latest-products-section {

        padding:
            65px 0
            55px;
    }

    .latest-products-container {

        width:
            calc(100% - 30px);
    }

    .latest-products-heading {

        margin-bottom:
            25px;
    }

    .latest-products-heading h2 {

        font-size:
            42px;
    }

    .latest-products-heading p {

        font-size:
            10px;
    }

    .latest-products-viewport {

        padding:
            45px 0
            55px;
    }

    .latest-product-card {

        flex:
            0 0
            calc(
                (100% - 24px) / 2
            );

        width:
            calc(
                (100% - 24px) / 2
            );

        padding:
            13px
            12px
            18px;

        border-radius:
            90px
            90px
            40px
            40px;
    }

    .latest-product-card.is-active {

        transform:
            scale(1.06);
    }

    .latest-product-image {

        height:
            185px;

        border-radius:
            65px
            65px
            22px
            22px;
    }

    .latest-product-info h3 {

        font-size:
            18px;
    }

    .latest-product-card.is-active
    .latest-product-info h3 {

        font-size:
            20px;
    }

    .latest-product-info p {

        font-size:
            8px;
    }

    .latest-product-price {

        font-size:
            13px;
    }

    .latest-product-cart {

        min-height:
            34px;

        padding:
            7px
            11px;

        font-size:
            7px;
    }

    .latest-products-arrow {

        width:
            40px;

        height:
            40px;

        font-size:
            10px;
    }

    .latest-products-prev {

        left:
            -6px;
    }

    .latest-products-next {

        right:
            -6px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 520px) {

    .latest-products-container {

        width:
            calc(100% - 22px);
    }

    .latest-product-card {

        flex:
            0 0
            82%;

        width:
            82%;

        border-radius:
            105px
            105px
            45px
            45px;
    }

    .latest-product-card.is-active {

        transform:
            scale(1.035);
    }

    .latest-product-image {

        height:
            215px;

        border-radius:
            75px
            75px
            25px
            25px;
    }

    .latest-product-cart span {

        display:
            inline;
    }

    .latest-products-prev {

        left:
            -3px;
    }

    .latest-products-next {

        right:
            -3px;
    }
}
/* home banner  */
/* =========================================================
   HERO IMAGE — IMAGE ONLY INSIDE INNER GOLD FRAME
   OUTSIDE AREA = LIGHT ORANGE / PEACH
========================================================= */

.homeban-visual {
    position: relative;
    overflow: hidden;

    /* Light orange area outside the image */
    background: #f2c9a1 !important;

    border-radius:
        190px
        0
        0
        0;
}


/* IMAGE AREA — PUSH INSIDE THE INNER GOLD LINE */
.homeban-visual .homeban-slides {
    position: absolute;

    top: 39px;
    left: 49px;
    right: 49px;
    bottom: 39px;

    width: auto;
    height: auto;

    overflow: hidden;

    border-radius:
        165px
        0
        0
        0;
}


/* IMAGE */
.homeban-visual .homeban-slide {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    border-radius:
        165px
        0
        0
        0;

    overflow: hidden;
}


/* BACKEND IMAGE */
.homeban-visual .homeban-slide img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
}


/* INNER GOLD LINE — NOW EXACTLY AROUND IMAGE */
.homeban-visual .homeban-frame {
    top: 39px;
    left: 49px;
    right: 49px;
    bottom: 39px;

    border:
        1px solid
        rgba(183, 122, 60, 0.42);

    border-radius:
        165px
        0
        0
        0;

    pointer-events: none;
    z-index: 20;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .homeban-visual .homeban-slides {
        top: 35px;
        left: 39px;
        right: 39px;
        bottom: 35px;

        border-radius:
            135px
            0
            0
            0;
    }

    .homeban-visual .homeban-slide {
        border-radius:
            135px
            0
            0
            0;
    }

    .homeban-visual .homeban-frame {
        top: 35px;
        left: 39px;
        right: 39px;
        bottom: 35px;

        border-radius:
            135px
            0
            0
            0;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .homeban-visual .homeban-slides {
        top: 27px;
        left: 29px;
        right: 29px;
        bottom: 27px;

        border-radius:
            76px
            0
            0
            0;
    }

    .homeban-visual .homeban-slide {
        border-radius:
            76px
            0
            0
            0;
    }

    .homeban-visual .homeban-frame {
        top: 27px;
        left: 29px;
        right: 29px;
        bottom: 27px;

        border-radius:
            76px
            0
            0
            0;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .homeban-visual .homeban-slides {
        top: 22px;
        left: 22px;
        right: 22px;
        bottom: 22px;

        border-radius:
            55px
            0
            0
            0;
    }

    .homeban-visual .homeban-slide {
        border-radius:
            55px
            0
            0
            0;
    }

    .homeban-visual .homeban-frame {
        top: 22px;
        left: 22px;
        right: 22px;
        bottom: 22px;

        border-radius:
            55px
            0
            0
            0;
    }
}

/* =========================================================
   PREMIUM FULL PAGE TRANSITIONS
   ADD THIS AT THE VERY END OF YOUR CSS FILE
========================================================= */

/* ---------------------------------------------------------
   1. PAGE LOAD
--------------------------------------------------------- */

html {
    scroll-behavior: smooth;
}

body {
    animation: pageFadeIn 0.8s ease both;
}

@keyframes pageFadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


/* ---------------------------------------------------------
   2. HEADER PREMIUM ENTRANCE
--------------------------------------------------------- */

.luxury-topbar {
    animation: topbarReveal 0.8s ease both;
}

.luxury-header {
    animation: headerReveal 1s cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes topbarReveal {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes headerReveal {
    from {
        opacity: 0;
        transform: translateY(-25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ---------------------------------------------------------
   3. HEADER NAV LINKS
--------------------------------------------------------- */

.luxury-header__nav-link {
    transition:
        color 0.35s ease,
        transform 0.35s ease;
}

.luxury-header__nav-link:hover {
    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   4. LOGO SMOOTH EFFECT
--------------------------------------------------------- */

.luxury-header__logo {
    transition:
        transform 0.45s cubic-bezier(.22, 1, .36, 1);
}

.luxury-header__logo:hover {
    transform: scale(1.025);
}

.luxury-header__logo img {
    transition:
        transform 0.5s cubic-bezier(.22, 1, .36, 1),
        filter 0.4s ease;
}

.luxury-header__logo:hover img {
    transform: scale(1.035);
}


/* ---------------------------------------------------------
   5. HEADER ICONS
--------------------------------------------------------- */

.luxury-icon-btn {
    transition:
        transform 0.4s cubic-bezier(.22, 1, .36, 1),
        color 0.3s ease;
}

.luxury-icon-btn:hover {
    transform: translateY(-3px) scale(1.06);
}


/* ---------------------------------------------------------
   6. CTA PREMIUM HOVER
--------------------------------------------------------- */

.luxury-header__cta {
    position: relative;
    overflow: hidden;
    transition:
        transform 0.45s cubic-bezier(.22, 1, .36, 1),
        box-shadow 0.45s ease,
        background 0.4s ease;
}

.luxury-header__cta::before {
    content: "";
    position: absolute;

    top: 0;
    left: -120%;

    width: 80%;
    height: 100%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,0.28),
        transparent
    );

    transform: skewX(-20deg);

    transition:
        left 0.7s ease;

    pointer-events: none;
}

.luxury-header__cta:hover::before {
    left: 140%;
}

.luxury-header__cta:hover {
    transform: translateY(-3px);
}


/* ---------------------------------------------------------
   7. HOME HERO ENTRANCE
--------------------------------------------------------- */

.homeban-content {
    animation:
        heroContentReveal
        1.1s
        cubic-bezier(.22, 1, .36, 1)
        0.15s
        both;
}

.homeban-visual {
    animation:
        heroVisualReveal
        1.2s
        cubic-bezier(.22, 1, .36, 1)
        0.25s
        both;
}

@keyframes heroContentReveal {

    from {
        opacity: 0;
        transform: translateX(-45px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes heroVisualReveal {

    from {
        opacity: 0;
        transform: translateX(45px) scale(1.025);
    }

    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}


/* ---------------------------------------------------------
   8. HERO EYEBROW
--------------------------------------------------------- */

.homeban-eyebrow {
    animation:
        luxuryFadeUp
        0.8s
        cubic-bezier(.22, 1, .36, 1)
        0.3s
        both;
}


/* ---------------------------------------------------------
   9. HERO TITLE
--------------------------------------------------------- */

.homeban-title {
    animation:
        luxuryTitleReveal
        1s
        cubic-bezier(.22, 1, .36, 1)
        0.4s
        both;
}

@keyframes luxuryTitleReveal {

    from {
        opacity: 0;
        transform: translateY(35px);
        filter: blur(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}


/* ---------------------------------------------------------
   10. HERO DESCRIPTION
--------------------------------------------------------- */

.homeban-description {
    animation:
        luxuryFadeUp
        0.9s
        cubic-bezier(.22, 1, .36, 1)
        0.55s
        both;
}

@keyframes luxuryFadeUp {

    from {
        opacity: 0;
        transform: translateY(22px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ---------------------------------------------------------
   11. HERO BUTTON
--------------------------------------------------------- */

.homeban-button {
    position: relative;
    overflow: hidden;

    animation:
        luxuryFadeUp
        0.9s
        cubic-bezier(.22, 1, .36, 1)
        0.7s
        both;

    transition:
        transform 0.45s cubic-bezier(.22, 1, .36, 1),
        box-shadow 0.45s ease,
        background 0.4s ease;
}

.homeban-button::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 80%;
    height: 100%;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,0.3),
        transparent
    );

    transform: skewX(-20deg);

    transition:
        left 0.7s ease;
}

.homeban-button:hover::before {
    left: 140%;
}

.homeban-button:hover {
    transform: translateY(-4px);
}


/* ---------------------------------------------------------
   12. HERO IMAGE
--------------------------------------------------------- */

.homeban-slide img {
    transition:
        transform 1.4s cubic-bezier(.22, 1, .36, 1),
        filter 0.8s ease;
}

.homeban-slide.is-active img {
    transform: scale(1.025);
}

.homeban-slide:hover img {
    transform: scale(1.045);
}


/* ---------------------------------------------------------
   13. IMAGE FRAME
--------------------------------------------------------- */

.homeban-frame,
.homeban-frame-inner {
    transition:
        opacity 0.6s ease,
        transform 0.7s cubic-bezier(.22, 1, .36, 1);
}

.homeban-visual:hover .homeban-frame {
    transform: scale(0.985);
}

.homeban-visual:hover .homeban-frame-inner {
    transform: scale(0.975);
}


/* ---------------------------------------------------------
   14. SLIDER DOTS
--------------------------------------------------------- */

.homeban-dots span {
    transition:
        width 0.45s cubic-bezier(.22, 1, .36, 1),
        opacity 0.35s ease,
        transform 0.35s ease;
}

.homeban-dots span:hover {
    transform: scaleX(1.15);
}


/* ---------------------------------------------------------
   15. JEWELLERY FEATURE BAR
--------------------------------------------------------- */

.jewellery-features {
    animation:
        featureBarReveal
        1s
        cubic-bezier(.22, 1, .36, 1)
        0.8s
        both;

    transition:
        transform 0.5s cubic-bezier(.22, 1, .36, 1),
        box-shadow 0.5s ease;
}

@keyframes featureBarReveal {

    from {
        opacity: 0;
        transform: translate(-50%, 35px);
    }

    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

.jewellery-feature {
    transition:
        transform 0.4s cubic-bezier(.22, 1, .36, 1),
        background 0.35s ease;
}

.jewellery-feature:hover {
    transform: translateY(-3px);
}

.jewellery-feature__icon {
    transition:
        transform 0.45s cubic-bezier(.22, 1, .36, 1),
        background 0.35s ease,
        color 0.35s ease,
        box-shadow 0.4s ease;
}

.jewellery-feature:hover .jewellery-feature__icon {
    transform: translateY(-4px) scale(1.08) rotate(-3deg);
}


/* ---------------------------------------------------------
   16. JEWELLERY STORY SECTION
--------------------------------------------------------- */

.jewel-story-section {
    overflow: hidden;
}

.jewel-story-content {
    animation:
        storyContentReveal
        1.1s
        cubic-bezier(.22, 1, .36, 1)
        both;
}

@keyframes storyContentReveal {

    from {
        opacity: 0;
        transform: translateY(45px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ---------------------------------------------------------
   17. STORY TOP DECORATIVE LINE
--------------------------------------------------------- */

.jewel-story-top-line {
    animation:
        lineReveal
        1s
        cubic-bezier(.22, 1, .36, 1)
        0.2s
        both;
}

@keyframes lineReveal {

    from {
        opacity: 0;
        transform: scaleX(0.3);
        transform-origin: left center;
    }

    to {
        opacity: 1;
        transform: scaleX(1);
    }
}


/* ---------------------------------------------------------
   18. STORY HEADING
--------------------------------------------------------- */

.jewel-story-content h2 {
    animation:
        storyTitleReveal
        1s
        cubic-bezier(.22, 1, .36, 1)
        0.3s
        both;

    text-align: left;
}

@keyframes storyTitleReveal {

    from {
        opacity: 0;
        transform: translateY(30px);
        filter: blur(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}


/* ---------------------------------------------------------
   19. STORY DESCRIPTION
--------------------------------------------------------- */

.jewel-story-description {
    animation:
        luxuryFadeUp
        0.9s
        cubic-bezier(.22, 1, .36, 1)
        0.5s
        both;
}


/* ---------------------------------------------------------
   20. STORY FEATURE ITEMS
--------------------------------------------------------- */

.jewel-story-point {
    transition:
        transform 0.45s cubic-bezier(.22, 1, .36, 1),
        opacity 0.35s ease;
}

.jewel-story-point:hover {
    transform: translateX(7px);
}

.jewel-story-point-icon {
    transition:
        transform 0.45s cubic-bezier(.22, 1, .36, 1),
        background 0.35s ease,
        color 0.35s ease,
        box-shadow 0.4s ease;
}

.jewel-story-point:hover .jewel-story-point-icon {
    transform: scale(1.08) rotate(-4deg);
}


/* ---------------------------------------------------------
   21. ALL IMAGES - PREMIUM HOVER
--------------------------------------------------------- */

img {
    transition:
        transform 0.7s cubic-bezier(.22, 1, .36, 1),
        filter 0.5s ease;
}


/* Don't zoom logos */
.luxury-header__logo img,
.luxury-topbar img {
    transition:
        transform 0.45s ease;
}


/* ---------------------------------------------------------
   22. LINKS
--------------------------------------------------------- */

a {
    transition:
        color 0.3s ease,
        opacity 0.3s ease;
}


/* ---------------------------------------------------------
   23. BUTTONS
--------------------------------------------------------- */

button {
    transition:
        transform 0.35s cubic-bezier(.22, 1, .36, 1),
        box-shadow 0.35s ease,
        background 0.35s ease,
        color 0.3s ease;
}

button:hover {
    transform: translateY(-2px);
}


/* ---------------------------------------------------------
   24. CARDS - GENERIC PREMIUM EFFECT
--------------------------------------------------------- */

[class*="card"] {
    transition:
        transform 0.5s cubic-bezier(.22, 1, .36, 1),
        box-shadow 0.5s ease,
        border-color 0.35s ease;
}

[class*="card"]:hover {
    transform: translateY(-5px);
}


/* ---------------------------------------------------------
   25. DROPDOWN ITEMS
--------------------------------------------------------- */

.luxury-category-item {
    transition:
        transform 0.4s cubic-bezier(.22, 1, .36, 1),
        background 0.35s ease,
        box-shadow 0.35s ease;
}

.luxury-category-item:hover {
    transform: translateY(-5px);
    box-shadow:
        0 10px 25px rgba(80, 45, 20, 0.08);
}


/* ---------------------------------------------------------
   26. MOBILE MENU
--------------------------------------------------------- */

.luxury-mobile-menu {
    transition:
        opacity 0.4s ease,
        transform 0.4s cubic-bezier(.22, 1, .36, 1);
}


/* ---------------------------------------------------------
   27. RATE / USER POPUPS
--------------------------------------------------------- */

.luxury-rate__popup,
.luxury-user__menu,
.luxury-header__dropdown-menu {
    transition:
        opacity 0.4s ease,
        visibility 0.4s ease,
        transform 0.45s cubic-bezier(.22, 1, .36, 1);
}


/* ---------------------------------------------------------
   28. DECORATIVE CIRCLES - VERY SUBTLE MOTION
--------------------------------------------------------- */

.homeban-content::before {
    animation:
        softFloat 8s ease-in-out infinite;
}

.homeban-content::after {
    animation:
        softFloat 10s ease-in-out infinite reverse;
}

@keyframes softFloat {

    0%,
    100% {
        transform: translate3d(0, 0, 0);
    }

    50% {
        transform: translate3d(8px, -8px, 0);
    }
}


/* ---------------------------------------------------------
   29. ACCESSIBILITY
--------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}


/* ---------------------------------------------------------
   30. MOBILE - KEEP IT SMOOTH
--------------------------------------------------------- */

@media (max-width: 767px) {

    .homeban-content,
    .homeban-visual {
        animation-duration: 0.9s;
    }

    .homeban-title {
        animation-delay: 0.25s;
    }

    .homeban-description {
        animation-delay: 0.4s;
    }

    .homeban-button {
        animation-delay: 0.55s;
    }

    .jewel-story-content {
        animation-duration: 0.9s;
    }

    .jewellery-feature:hover {
        transform: none;
    }

    .jewel-story-point:hover {
        transform: translateX(3px);
    }
}

/* =========================================================
   FINAL MOBILE RESPONSIVE FIX
   HOMEPAGE ONLY
========================================================= */

@media (max-width: 767px) {

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

    .home-categories {
        width: 100%;
        overflow: hidden;
    }

    .home-categories__container {
        width: calc(100% - 24px);
        max-width: 100%;
        margin: 0 auto;
    }

    .home-category-carousel {
        width: 100%;
        max-width: 100%;
        overflow: hidden;

        display: flex;
        align-items: center;

        gap: 6px;
    }

    .home-category-viewport {
        width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .home-category-track {
        display: flex;
        gap: 14px;

        width: max-content;
        min-width: 100%;
    }

    /* IMPORTANT:
       Override the later 310px desktop rule
    */

    .home-category-slide {
        flex:
            0 0
            calc(100vw - 70px) !important;

        width:
            calc(100vw - 70px) !important;

        max-width:
            calc(100vw - 70px) !important;

        min-width:
            0 !important;
    }

    .home-category-image {
        width: 100% !important;
        height: 350px !important;

        box-sizing: border-box;
    }

    .home-category-image__inner {
        width: 100%;
        height: 100%;
        box-sizing: border-box;
    }

    .home-category-image img {
        width: 100%;
        height: 100%;

        object-fit: cover;
    }

    .home-category-info {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }

    .home-category-info h3 {
        font-size: 23px;
        line-height: 1.1;
    }

    .home-category-arrow {
        flex:
            0 0 36px !important;

        width: 36px !important;
        height: 36px !important;

        min-width: 36px;

        z-index: 20;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .home-categories__container {
        width: calc(100% - 16px);
    }

    .home-category-carousel {
        gap: 4px;
    }

    .home-category-track {
        gap: 12px;
    }

    .home-category-slide {
        flex:
            0 0
            calc(100vw - 55px) !important;

        width:
            calc(100vw - 55px) !important;

        max-width:
            calc(100vw - 55px) !important;
    }

    .home-category-image {
        height: 350px !important;
    }

    .home-category-info h3 {
        font-size: 22px;
    }

    .home-category-arrow {
        width: 32px !important;
        height: 32px !important;

        flex-basis: 32px !important;
        min-width: 32px;
    }
}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 360px) {

    .home-category-slide {
        flex:
            0 0
            calc(100vw - 48px) !important;

        width:
            calc(100vw - 48px) !important;

        max-width:
            calc(100vw - 48px) !important;
    }

    .home-category-image {
        height: 325px !important;
    }

    .home-category-info h3 {
        font-size: 20px;
    }

    .home-category-arrow {
        display: flex !important;
    }
}
/* repsonsive */
/* =========================================================================
   ✅ FINAL CLEAN MOBILE RESPONSIVE FIX (v3)
   Sections: Home Banner | Shop by Category | Latest Products
   Paste this AT THE VERY END of your CSS file
   ========================================================================= */

@media (max-width: 767px) {

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

    /* =====================================================================
       1. HOME BANNER — feature bar goes AFTER "Shop Now" button, not on top
    ===================================================================== */

    .homeban-hero {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin-bottom: 20px !important;
        overflow: visible !important;
        background: #fff9f3 !important;
    }

    .homeban-visual {
        order: 1 !important;
        position: relative !important;
        width: 100% !important;
        height: 78vw !important;
        min-height: 300px !important;
        max-height: 420px !important;
        border-radius: 90px 0 0 0 !important;
        background: #f2c9a1 !important;
    }

    .homeban-visual .homeban-slides {
        top: 20px !important;
        left: 22px !important;
        right: 22px !important;
        bottom: 20px !important;
        border-radius: 70px 0 0 0 !important;
    }

    .homeban-visual .homeban-slide,
    .homeban-visual .homeban-slide img {
        border-radius: 70px 0 0 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .homeban-visual .homeban-frame {
        top: 20px !important;
        left: 22px !important;
        right: 22px !important;
        bottom: 20px !important;
        border-radius: 70px 0 0 0 !important;
    }

    .homeban-frame-inner {
        display: none !important;
    }

    .homeban-dots {
        top: 14px !important;
        right: 14px !important;
        bottom: auto !important;
    }

    /* Text content comes right after the image */
    .homeban-content {
        order: 2 !important;
        width: 100% !important;
        min-height: auto !important;
        padding: 30px 22px 34px !important;
        align-items: flex-start !important;
    }

    .homeban-content::before,
    .homeban-content::after {
        display: none !important;
    }

    .homeban-title {
        font-size: clamp(34px, 10vw, 50px) !important;
        letter-spacing: -1.5px !important;
        max-width: 100% !important;
    }

    .homeban-description {
        max-width: 100% !important;
        font-size: 12px !important;
        margin: 18px 0 24px !important;
    }

    /* Feature bar comes LAST — below the Shop Now button */
    .jewellery-features {
        order: 3 !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: calc(100% - 24px) !important;
        margin: 0 auto 20px !important;
        padding: 14px 10px !important;
        border-radius: 14px !important;
        z-index: 5 !important;
    }

    .jewellery-features__container {
        grid-template-columns: repeat(2, 1fr) !important;
        row-gap: 8px !important;
    }

    .jewellery-feature {
        min-height: 58px !important;
        justify-content: flex-start !important;
        padding: 6px 8px !important;
    }

    .jewellery-feature:not(:last-child)::after {
        display: none !important;
    }

    .jewellery-feature__icon {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        font-size: 14px !important;
    }

    .jewellery-feature__content h4 {
        font-size: 12px !important;
        white-space: normal !important;
    }

    .jewellery-feature__content p {
        font-size: 9px !important;
        white-space: normal !important;
    }


    /* =====================================================================
       2. SHOP BY CATEGORY — fix width cut-off, keep arch shape fully visible
    ===================================================================== */

    .home-categories {
        width: 100% !important;
        overflow: hidden !important;
        padding: 50px 0 45px !important;
        box-sizing: border-box !important;
    }

    .home-categories__container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    .home-categories__heading h2 {
        font-size: 30px !important;
    }

    .category-theme-toggle {
        right: 4px !important;
        width: 34px !important;
        height: 34px !important;
    }

    .home-categories__title-row h2 {
        padding-right: 42px !important;
    }

    .home-category-carousel {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        box-sizing: border-box !important;
    }

    .home-category-viewport {
        width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        padding: 12px 4px 30px !important;
        box-sizing: border-box !important;
    }

    .home-category-track {
        display: flex !important;
        gap: 14px !important;
        width: max-content !important;
    }

    /* card sized to fit FULLY within the viewport — arch not cut on right edge */
    .home-category-slide {
        flex: 0 0 calc(100vw - 110px) !important;
        width: calc(100vw - 110px) !important;
        max-width: calc(100vw - 110px) !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .home-category-image {
        width: 100% !important;
        height: 310px !important;
        border-radius: 130px 130px 14px 14px !important;
        box-sizing: border-box !important;
    }

    .home-category-image__inner {
        width: 100% !important;
        height: 100% !important;
        border-radius: 122px 122px 8px 8px !important;
        box-sizing: border-box !important;
    }

    .home-category-image::after {
        border-radius: 124px 124px 9px 9px !important;
    }

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

    .home-category-info {
        width: 100% !important;
        text-align: center !important;
        padding-top: 16px !important;
        box-sizing: border-box !important;
    }

    .home-category-info h3 {
        font-size: 21px !important;
        line-height: 1.1 !important;
    }

    .home-category-info span {
        font-size: 8px !important;
        letter-spacing: 1.8px !important;
    }

    .home-category-arrow {
        flex: 0 0 34px !important;
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        font-size: 10px !important;
        z-index: 20 !important;
    }

    .home-category-progress {
        margin-top: 22px !important;
    }

    .home-category-progress__line {
        width: 110px !important;
    }


    /* =====================================================================
       3. LATEST PRODUCTS — restore gold/peach arch design (not flat grey box)
    ===================================================================== */

    .latest-products-section {
        padding: 55px 0 45px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        background:
            radial-gradient(
                circle at 50% 48%,
                rgba(255, 255, 255, 0.95) 0%,
                rgba(255, 249, 241, 0.90) 45%,
                rgba(247, 224, 198, 0.32) 100%
            ) !important;
    }

    .latest-products-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        box-sizing: border-box !important;
    }

    .latest-products-heading {
        margin-bottom: 22px !important;
    }

    .latest-products-heading h2 {
        font-size: 32px !important;
    }

    .latest-products-heading p {
        font-size: 9px !important;
    }

    .latest-products-carousel {
        width: 100% !important;
        overflow: visible !important;
    }

    .latest-products-viewport {
        width: 100% !important;
        padding: 35px 4px 45px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .latest-products-track {
        gap: 14px !important;
    }

    /* card fits fully inside viewport width, keeps gold/peach gradient + arch */
    .latest-product-card {
        flex: 0 0 calc(100vw - 110px) !important;
        width: calc(100vw - 110px) !important;
        max-width: calc(100vw - 110px) !important;
        min-width: 0 !important;
        padding: 14px 12px 20px !important;
        border-radius: 95px 95px 40px 40px !important;
        background:
            linear-gradient(
                180deg,
                #f1d9be 0%,
                #fce7c7 100%
            ) !important;
        border: 1.5px solid #fce7c7 !important;
        transform: scale(1) !important;
        opacity: 1 !important;
        filter: saturate(1) !important;
        box-sizing: border-box !important;
        box-shadow: 0 18px 45px rgba(100, 65, 35, 0.10) !important;
    }

    .latest-product-card::before {
        border-radius: 90px 90px 35px 35px !important;
        inset: 5px !important;
        border: 1px solid rgba(255, 255, 255, 0.85) !important;
    }

    .latest-product-card.is-active {
        transform: scale(1) !important;
        border-color: rgba(189, 130, 51, 0.65) !important;
    }

    .latest-product-top {
        margin-left: 14px !important;
        margin-right: 14px !important;
        margin-top: 22px !important;
    }

    .latest-product-badge {
        background:
            linear-gradient(135deg, #f8dcae, #efbd68) !important;
        color: #6d4522 !important;
    }

    .latest-product-image-link {
        margin-top: 4px !important;
    }

    .latest-product-image {
        width: 100% !important;
        height: 200px !important;
        border-radius: 10px 105px 30px 30px !important;
        background:
            linear-gradient(145deg, #ffe6d4, #fae6d2) !important;
        box-sizing: border-box !important;
    }

    .latest-product-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        padding: 10px !important;
    }

    .latest-product-info {
        padding: 15px 4px 0 !important;
        text-align: left !important;
    }

    .latest-product-info h3,
    .latest-product-card.is-active .latest-product-info h3 {
        font-size: 20px !important;
        white-space: normal !important;
        color: #34271f !important;
    }

    .latest-product-info p {
        font-size: 9px !important;
        color: #8d7969 !important;
    }

    .latest-product-rating {
        color: #79695d !important;
    }

    .latest-product-price,
    .latest-product-card.is-active .latest-product-price {
        font-size: 14px !important;
        color: #35281f !important;
    }

    .latest-product-cart {
        min-height: 36px !important;
        padding: 8px 13px !important;
        font-size: 8px !important;
        background:
            linear-gradient(135deg, #c58b3d, #aa6d27) !important;
        color: #fff !important;
    }

    .latest-products-arrow {
        width: 38px !important;
        height: 38px !important;
        font-size: 10px !important;
        background: rgba(255, 253, 249, 0.96) !important;
        color: #65452d !important;
    }

    .latest-products-prev { left: 2px !important; }
    .latest-products-next { right: 2px !important; }

    .latest-products-view-all a {
        min-width: 220px !important;
        padding: 12px 18px !important;
        font-size: 8px !important;
    }
}


/* =========================================================================
   SMALL MOBILE (≤480px)
   ========================================================================= */

@media (max-width: 480px) {

    .homeban-visual {
        height: 82vw !important;
        min-height: 275px !important;
        border-radius: 70px 0 0 0 !important;
    }

    .homeban-visual .homeban-slides,
    .homeban-visual .homeban-slide,
    .homeban-visual .homeban-slide img,
    .homeban-visual .homeban-frame {
        border-radius: 55px 0 0 0 !important;
    }

    .jewellery-features {
        margin: 0 auto 16px !important;
        padding: 10px 8px !important;
    }

    .jewellery-feature__icon {
        width: 32px !important;
        height: 32px !important;
        flex-basis: 32px !important;
        font-size: 12px !important;
    }

    .home-categories__heading h2 {
        font-size: 27px !important;
    }

    .home-category-slide {
        flex: 0 0 calc(100vw - 90px) !important;
        width: calc(100vw - 90px) !important;
        max-width: calc(100vw - 90px) !important;
    }

    .home-category-image {
        height: 285px !important;
        border-radius: 110px 110px 12px 12px !important;
    }

    .home-category-image__inner {
        border-radius: 102px 102px 7px 7px !important;
    }

    .home-category-image::after {
        border-radius: 104px 104px 8px 8px !important;
    }

    .home-category-info h3 {
        font-size: 19px !important;
    }

    .home-category-arrow {
        width: 30px !important;
        height: 30px !important;
        flex-basis: 30px !important;
        min-width: 30px !important;
    }

    .latest-products-heading h2 {
        font-size: 28px !important;
    }

    .latest-product-card {
        flex: 0 0 calc(100vw - 90px) !important;
        width: calc(100vw - 90px) !important;
        max-width: calc(100vw - 90px) !important;
        border-radius: 85px 85px 35px 35px !important;
    }

    .latest-product-image {
        height: 175px !important;
    }
}


/* =========================================================================
   VERY SMALL MOBILE (≤360px)
   ========================================================================= */

@media (max-width: 360px) {

    .homeban-visual {
        min-height: 250px !important;
    }

    .home-category-slide {
        flex: 0 0 calc(100vw - 72px) !important;
        width: calc(100vw - 72px) !important;
        max-width: calc(100vw - 72px) !important;
    }

    .home-category-image {
        height: 265px !important;
    }

    .home-category-arrow {
        display: flex !important;
    }

    .latest-product-card {
        flex: 0 0 calc(100vw - 72px) !important;
        width: calc(100vw - 72px) !important;
        max-width: calc(100vw - 72px) !important;
    }

    .latest-product-image {
        height: 160px !important;
    }
}
@media (max-width: 767px) {
    .home-category-slide {
        flex: 0 0 calc(100vw - 140px) !important;
        width: calc(100vw - 140px) !important;
        max-width: calc(100vw - 140px) !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .home-category-viewport {
        padding: 12px 8px 30px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .home-category-carousel {
        gap: 4px !important;
    }

    .home-category-arrow {
        flex: 0 0 30px !important;
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        font-size: 9px !important;
    }
}

@media (max-width: 480px) {
    .home-category-slide {
        flex: 0 0 calc(100vw - 120px) !important;
        width: calc(100vw - 120px) !important;
        max-width: calc(100vw - 120px) !important;
    }
}

@media (max-width: 360px) {
    .home-category-slide {
        flex: 0 0 calc(100vw - 100px) !important;
        width: calc(100vw - 100px) !important;
        max-width: calc(100vw - 100px) !important;
    }
}
/* =========================================================================
   FINAL COMPLETE RESPONSIVE FIX
   Sections: Home Banner | Shop by Category | Latest Products
   Covers: Mobile | Tablet | Laptop / Desktop
   Paste this AT THE VERY END of your CSS file
   ========================================================================= */

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


/* =========================================================================
   LAPTOP / SMALL DESKTOP  (1101px - 1400px)
   ========================================================================= */

@media (max-width: 1400px) and (min-width: 1101px) {

    .homeban-hero {
        grid-template-columns:
            minmax(370px, 0.9fr)
            minmax(460px, 1.1fr) !important;
    }

    .jewellery-features {
        width: calc(100% - 60px) !important;
    }

    .home-categories__container,
    .shop-budget__container,
    .latest-products-container {
        width: 94% !important;
    }

    .home-category-slide {
        flex: 0 0 260px !important;
        width: 260px !important;
        max-width: 260px !important;
    }

    .home-category-image {
        width: 260px !important;
        height: 360px !important;
    }

    .latest-product-card {
        flex: 0 0 calc((100% - 72px) / 4) !important;
        width: calc((100% - 72px) / 4) !important;
    }
}


/* =========================================================================
   TABLET  (768px - 1100px)
   ========================================================================= */

@media (max-width: 1100px) and (min-width: 768px) {

    .homeban-hero {
        grid-template-columns:
            minmax(340px, 0.9fr)
            minmax(380px, 1.1fr) !important;
        min-height: 540px !important;
        height: 70vh !important;
    }

    .homeban-content {
        padding: 40px !important;
    }

    .homeban-title {
        font-size: clamp(38px, 5vw, 58px) !important;
    }

    .homeban-description {
        max-width: 360px !important;
    }

    .jewellery-features {
        width: calc(100% - 50px) !important;
        padding: 13px 10px !important;
    }

    .jewellery-feature {
        padding: 6px 10px !important;
        gap: 8px !important;
    }

    .jewellery-feature__icon {
        width: 40px !important;
        height: 40px !important;
        flex-basis: 40px !important;
        font-size: 16px !important;
    }

    .jewellery-feature__content h4 {
        font-size: 12px !important;
    }

    .jewellery-feature__content p {
        font-size: 9px !important;
    }

    .home-categories__container {
        width: 91% !important;
    }

    .home-category-slide {
        flex: 0 0 calc((100vw - 110px) / 3) !important;
        width: calc((100vw - 110px) / 3) !important;
        max-width: 230px !important;
    }

    .home-category-image {
        width: 100% !important;
        height: 340px !important;
        border-radius: 120px 120px 13px 13px !important;
    }

    .home-category-image__inner {
        border-radius: 112px 112px 8px 8px !important;
    }

    .home-category-image::after {
        border-radius: 114px 114px 9px 9px !important;
    }

    .home-category-info h3 {
        font-size: 23px !important;
    }

    .latest-products-container {
        width: calc(100% - 50px) !important;
    }

    .latest-product-card {
        flex: 0 0 calc((100% - 48px) / 3) !important;
        width: calc((100% - 48px) / 3) !important;
        border-radius: 120px 120px 50px 50px !important;
    }

    .latest-product-card.is-active {
        transform: scale(1.07) !important;
    }

    .latest-product-image {
        height: 200px !important;
        border-radius: 85px 85px 25px 25px !important;
    }

    .latest-product-info h3 {
        font-size: 20px !important;
    }

    .latest-product-card.is-active .latest-product-info h3 {
        font-size: 23px !important;
    }

    .latest-products-prev { left: -12px !important; }
    .latest-products-next { right: -12px !important; }
}


/* =========================================================================
   MOBILE  (up to 767px)
   ========================================================================= */

@media (max-width: 767px) {

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

    /* 1. HOME BANNER */

    .homeban-hero {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin-bottom: 20px !important;
        overflow: visible !important;
        background: #fff9f3 !important;
    }

    .homeban-visual {
        order: 1 !important;
        position: relative !important;
        width: 100% !important;
        height: 78vw !important;
        min-height: 300px !important;
        max-height: 420px !important;
        border-radius: 90px 0 0 0 !important;
        background: #f2c9a1 !important;
    }

    .homeban-visual .homeban-slides {
        top: 20px !important;
        left: 22px !important;
        right: 22px !important;
        bottom: 20px !important;
        border-radius: 70px 0 0 0 !important;
    }

    .homeban-visual .homeban-slide,
    .homeban-visual .homeban-slide img {
        border-radius: 70px 0 0 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .homeban-visual .homeban-frame {
        top: 20px !important;
        left: 22px !important;
        right: 22px !important;
        bottom: 20px !important;
        border-radius: 70px 0 0 0 !important;
    }

    .homeban-frame-inner {
        display: none !important;
    }

    .homeban-dots {
        top: 14px !important;
        right: 14px !important;
        bottom: auto !important;
    }

    .homeban-content {
        order: 2 !important;
        width: 100% !important;
        min-height: auto !important;
        padding: 30px 22px 34px !important;
        align-items: flex-start !important;
    }

    .homeban-content::before,
    .homeban-content::after {
        display: none !important;
    }

    .homeban-title {
        font-size: clamp(34px, 10vw, 50px) !important;
        letter-spacing: -1.5px !important;
        max-width: 100% !important;
    }

    .homeban-description {
        max-width: 100% !important;
        font-size: 12px !important;
        margin: 18px 0 24px !important;
    }

    .jewellery-features {
        order: 3 !important;
        position: relative !important;
        left: auto !important;
        top: auto !important;
        bottom: auto !important;
        transform: none !important;
        width: calc(100% - 24px) !important;
        margin: 0 auto 20px !important;
        padding: 14px 10px !important;
        border-radius: 14px !important;
        z-index: 5 !important;
    }

    .jewellery-features__container {
        grid-template-columns: repeat(2, 1fr) !important;
        row-gap: 8px !important;
    }

    .jewellery-feature {
        min-height: 58px !important;
        justify-content: flex-start !important;
        padding: 6px 8px !important;
    }

    .jewellery-feature:not(:last-child)::after {
        display: none !important;
    }

    .jewellery-feature__icon {
        width: 36px !important;
        height: 36px !important;
        flex-basis: 36px !important;
        font-size: 14px !important;
    }

    .jewellery-feature__content h4 {
        font-size: 12px !important;
        white-space: normal !important;
    }

    .jewellery-feature__content p {
        font-size: 9px !important;
        white-space: normal !important;
    }

    /* 2. SHOP BY CATEGORY */

    .home-categories {
        width: 100% !important;
        overflow: hidden !important;
        padding: 50px 0 45px !important;
        box-sizing: border-box !important;
    }

    .home-categories__container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    .home-categories__heading h2 {
        font-size: 30px !important;
    }

    .category-theme-toggle {
        right: 4px !important;
        width: 34px !important;
        height: 34px !important;
    }

    .home-categories__title-row h2 {
        padding-right: 42px !important;
    }

    .home-category-carousel {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
        box-sizing: border-box !important;
    }

    .home-category-viewport {
        width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        padding: 12px 8px 30px !important;
        box-sizing: border-box !important;
    }

    .home-category-track {
        display: flex !important;
        gap: 14px !important;
        width: max-content !important;
    }

    .home-category-slide {
        flex: 0 0 calc(100vw - 140px) !important;
        width: calc(100vw - 140px) !important;
        max-width: calc(100vw - 140px) !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .home-category-image {
        width: 100% !important;
        height: 310px !important;
        border-radius: 130px 130px 14px 14px !important;
        box-sizing: border-box !important;
    }

    .home-category-image__inner {
        width: 100% !important;
        height: 100% !important;
        border-radius: 122px 122px 8px 8px !important;
        box-sizing: border-box !important;
    }

    .home-category-image::after {
        border-radius: 124px 124px 9px 9px !important;
    }

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

    .home-category-info {
        width: 100% !important;
        text-align: center !important;
        padding-top: 16px !important;
        box-sizing: border-box !important;
    }

    .home-category-info h3 {
        font-size: 21px !important;
        line-height: 1.1 !important;
    }

    .home-category-info span {
        font-size: 8px !important;
        letter-spacing: 1.8px !important;
    }

    .home-category-arrow {
        flex: 0 0 30px !important;
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        font-size: 9px !important;
        z-index: 20 !important;
    }

    .home-category-progress {
        margin-top: 22px !important;
    }

    .home-category-progress__line {
        width: 110px !important;
    }

    /* 3. LATEST PRODUCTS */

    .latest-products-section {
        padding: 55px 0 45px !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
        background:
            radial-gradient(
                circle at 50% 48%,
                rgba(255, 255, 255, 0.95) 0%,
                rgba(255, 249, 241, 0.90) 45%,
                rgba(247, 224, 198, 0.32) 100%
            ) !important;
    }

    .latest-products-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
        box-sizing: border-box !important;
    }

    .latest-products-heading {
        margin-bottom: 22px !important;
    }

    .latest-products-heading h2 {
        font-size: 32px !important;
    }

    .latest-products-heading p {
        font-size: 9px !important;
    }

    .latest-products-carousel {
        width: 100% !important;
        overflow: visible !important;
    }

    .latest-products-viewport {
        width: 100% !important;
        padding: 35px 8px 45px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .latest-products-track {
        gap: 14px !important;
    }

    .latest-product-card {
        flex: 0 0 calc(100vw - 140px) !important;
        width: calc(100vw - 140px) !important;
        max-width: calc(100vw - 140px) !important;
        min-width: 0 !important;
        padding: 14px 12px 20px !important;
        border-radius: 95px 95px 40px 40px !important;
        background:
            linear-gradient(
                180deg,
                #f1d9be 0%,
                #fce7c7 100%
            ) !important;
        border: 1.5px solid #fce7c7 !important;
        transform: scale(1) !important;
        opacity: 1 !important;
        filter: saturate(1) !important;
        box-sizing: border-box !important;
        box-shadow: 0 18px 45px rgba(100, 65, 35, 0.10) !important;
    }

    .latest-product-card::before {
        border-radius: 90px 90px 35px 35px !important;
        inset: 5px !important;
        border: 1px solid rgba(255, 255, 255, 0.85) !important;
    }

    .latest-product-card.is-active {
        transform: scale(1) !important;
        border-color: rgba(189, 130, 51, 0.65) !important;
    }

    .latest-product-top {
        margin-left: 14px !important;
        margin-right: 14px !important;
        margin-top: 22px !important;
    }

    .latest-product-badge {
        background: linear-gradient(135deg, #f8dcae, #efbd68) !important;
        color: #6d4522 !important;
    }

    .latest-product-image-link {
        margin-top: 4px !important;
    }

    .latest-product-image {
        width: 100% !important;
        height: 200px !important;
        border-radius: 10px 105px 30px 30px !important;
        background: linear-gradient(145deg, #ffe6d4, #fae6d2) !important;
        box-sizing: border-box !important;
    }

    .latest-product-image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        padding: 10px !important;
    }

    .latest-product-info {
        padding: 15px 4px 0 !important;
        text-align: left !important;
    }

    .latest-product-info h3,
    .latest-product-card.is-active .latest-product-info h3 {
        font-size: 20px !important;
        white-space: normal !important;
        color: #34271f !important;
    }

    .latest-product-info p {
        font-size: 9px !important;
        color: #8d7969 !important;
    }

    .latest-product-rating {
        color: #79695d !important;
    }

    .latest-product-price,
    .latest-product-card.is-active .latest-product-price {
        font-size: 14px !important;
        color: #35281f !important;
    }

    .latest-product-cart {
        min-height: 36px !important;
        padding: 8px 13px !important;
        font-size: 8px !important;
        background: linear-gradient(135deg, #c58b3d, #aa6d27) !important;
        color: #fff !important;
    }

    .latest-products-arrow {
        width: 38px !important;
        height: 38px !important;
        font-size: 10px !important;
        background: rgba(255, 253, 249, 0.96) !important;
        color: #65452d !important;
    }

    .latest-products-prev { left: 2px !important; }
    .latest-products-next { right: 2px !important; }

    .latest-products-view-all a {
        min-width: 220px !important;
        padding: 12px 18px !important;
        font-size: 8px !important;
    }
}


/* =========================================================================
   SMALL MOBILE  (up to 480px)
   ========================================================================= */

@media (max-width: 480px) {

    .homeban-visual {
        height: 82vw !important;
        min-height: 275px !important;
        border-radius: 70px 0 0 0 !important;
    }

    .homeban-visual .homeban-slides,
    .homeban-visual .homeban-slide,
    .homeban-visual .homeban-slide img,
    .homeban-visual .homeban-frame {
        border-radius: 55px 0 0 0 !important;
    }

    .jewellery-features {
        margin: 0 auto 16px !important;
        padding: 10px 8px !important;
    }

    .jewellery-feature__icon {
        width: 32px !important;
        height: 32px !important;
        flex-basis: 32px !important;
        font-size: 12px !important;
    }

    .home-categories__heading h2 {
        font-size: 27px !important;
    }

    .home-category-slide {
        flex: 0 0 calc(100vw - 120px) !important;
        width: calc(100vw - 120px) !important;
        max-width: calc(100vw - 120px) !important;
    }

    .home-category-image {
        height: 285px !important;
        border-radius: 110px 110px 12px 12px !important;
    }

    .home-category-image__inner {
        border-radius: 102px 102px 7px 7px !important;
    }

    .home-category-image::after {
        border-radius: 104px 104px 8px 8px !important;
    }

    .home-category-info h3 {
        font-size: 19px !important;
    }

    .home-category-arrow {
        width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important;
        min-width: 28px !important;
    }

    .latest-products-heading h2 {
        font-size: 28px !important;
    }

    .latest-product-card {
        flex: 0 0 calc(100vw - 120px) !important;
        width: calc(100vw - 120px) !important;
        max-width: calc(100vw - 120px) !important;
        border-radius: 85px 85px 35px 35px !important;
    }

    .latest-product-image {
        height: 175px !important;
    }
}


/* =========================================================================
   VERY SMALL MOBILE  (up to 360px)
   ========================================================================= */

@media (max-width: 360px) {

    .homeban-visual {
        min-height: 250px !important;
    }

    .home-category-slide {
        flex: 0 0 calc(100vw - 100px) !important;
        width: calc(100vw - 100px) !important;
        max-width: calc(100vw - 100px) !important;
    }

    .home-category-image {
        height: 265px !important;
    }

    .home-category-arrow {
        display: flex !important;
    }

    .latest-product-card {
        flex: 0 0 calc(100vw - 100px) !important;
        width: calc(100vw - 100px) !important;
        max-width: calc(100vw - 100px) !important;
    }

    .latest-product-image {
        height: 160px !important;
    }
}

/* transition */

/* =========================================================================
   GOLD BLISS — REFERENCE HEADER + BANNER DESIGN
   Palette matched to supplied reference:
   Deep Burgundy / Wine + Ivory + Champagne Gold
   ========================================================================= */

:root {
    --gb-burgundy: #65151f;
    --gb-burgundy-dark: #4c0e16;
    --gb-burgundy-soft: #7b202b;
    --gb-ivory: #f8f2e9;
    --gb-ivory-soft: #fffaf4;
    --gb-gold: #d7b06b;
    --gb-gold-light: #efd39b;
    --gb-text: #2f1d1d;
}

/* =========================
   HERO / FULL BLEED IMAGE
   ========================= */

.gb-hero {
    position: relative;
    width: 100%;
    min-height: min(760px, 100vh);
    height: min(760px, 100vh);
    overflow: hidden;
    isolation: isolate;
    background: #4c0e16;
    font-family: "Montserrat", sans-serif;
}

.gb-hero__slides,
.gb-hero__slide,
.gb-hero__overlay {
    position: absolute;
    inset: 0;
}

.gb-hero__slides {
    z-index: 0;
}

.gb-hero__slide {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 0;
    transform: scale(1.045);
    transition:
        opacity 1.05s ease,
        transform 6s cubic-bezier(.2,.7,.2,1);
}

.gb-hero__slide.is-active {
    opacity: 1;
    transform: scale(1);
}

.gb-hero__overlay {
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(
            90deg,
            rgba(62, 7, 14, .82) 0%,
            rgba(78, 11, 19, .58) 30%,
            rgba(75, 11, 18, .25) 58%,
            rgba(42, 5, 10, .18) 100%
        ),
        linear-gradient(
            180deg,
            rgba(31, 4, 8, .30) 0%,
            rgba(31, 4, 8, .08) 55%,
            rgba(31, 4, 8, .48) 100%
        );
}

/* =========================
   GLASS SHELL
   ========================= */

.gb-hero__shell {
    position: relative;
    z-index: 5;
    width: min(1260px, calc(100% - 14vw));
    height: calc(100% - 105px);
    min-height: 520px;
    margin: 52px auto;
    border: 1px solid rgba(255, 244, 231, .28);
    border-radius: 24px;
    background: rgba(83, 16, 24, .20);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 20px 70px rgba(30, 0, 4, .16);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* subtle inner glass highlight */
.gb-hero__shell::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.09),
            transparent 28%,
            transparent 72%,
            rgba(255,255,255,.035)
        );
}

/* =========================
   HEADER
   ========================= */

.gb-header {
    position: relative;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 28px;
    min-height: 96px;
    padding: 20px 28px 14px 30px;
}

.gb-header__logo {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    text-decoration: none !important;
}

.gb-header__logo img {
    display: block;
    width: auto;
    max-width: 190px;
    height: 58px;
    object-fit: contain;
    /* filter: brightness(0) invert(1); */
}

.gb-header__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 50px;
    margin-left: auto;
    padding: 4px 7px;
    border-radius: 999px;
    background: rgba(255, 250, 245, .96);
    box-shadow: 0 10px 30px rgba(34, 3, 8, .13);
}

.gb-header__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 0 21px;
    border-radius: 999px;
    color: #332124 !important;
    font-family: "Montserrat", sans-serif;
    font-size: 15px !important;
    font-weight: 600;
    letter-spacing: .1px;
    white-space: nowrap;
    text-decoration: none !important;
    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}

.gb-header__link:hover,
.gb-header__link.is-active {
    color: #fff !important;
    background: var(--gb-burgundy);
}

.gb-header__link i {
    font-size: 8px;
    margin-top: 1px;
}

/* =========================
   CATEGORY DROPDOWN
   ========================= */

.gb-header__dropdown {
    position: relative;
}

/* =========================================================
   DROPDOWN HOVER BRIDGE
   Keeps dropdown open while moving mouse from
   "All Jewelry" to the dropdown menu.
   ========================================================= */

.gb-header__dropdown::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 14px;
    background: transparent;
    z-index: 999;
}

.gb-header__dropdown-menu {
    position: absolute;

    /* Keep the original visual gap */
    top: calc(100% + 13px);

    left: 50%;

    width: min(610px, 75vw);

    padding: 18px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translate(-50%, 8px);

    border: 1px solid rgba(215, 176, 107, .28);

    border-radius: 18px;

    background: rgba(255, 250, 245, .98);

    box-shadow:
        0 24px 60px rgba(43, 7, 13, .24);

    transition:
        opacity .25s ease,
        visibility .25s ease,
        transform .25s ease;

    z-index: 1000;
}

.gb-header__dropdown:hover .gb-header__dropdown-menu,
.gb-header__dropdown:focus-within .gb-header__dropdown-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transform: translate(-50%, 0);
}

.gb-header__category-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.gb-header__category {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 12px;
    color: #392528 !important;
    text-decoration: none !important;
    transition: .25s ease;
}

.gb-header__category:hover {
    background: #f6ece5;
    transform: translateY(-2px);
}

.gb-header__category img {
    width: 72px;
    height: 55px;
    border-radius: 10px;
    object-fit: cover;
}

.gb-header__category span,
.gb-header__view-more {
    font-size: 10px;
    font-weight: 600;
    text-align: center;
}

.gb-header__view-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--gb-burgundy) !important;
    text-decoration: none !important;
}

/* =========================
   HEADER ACTIONS
   ========================= */

.gb-header__actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    margin-left: 4px;
}

.gb-header__icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(215,176,107,.42);
    border-radius: 50%;
    background: rgba(255,250,245,.94);
    color: var(--gb-burgundy) !important;
    text-decoration: none !important;
    cursor: pointer;
    transition: .25s ease;
}

.gb-header__icon:hover {
    background: var(--gb-gold-light);
    border-color: var(--gb-gold-light);
    color: var(--gb-burgundy-dark) !important;
    transform: translateY(-1px);
}

.gb-header__icon i {
    font-size: 13px;
}

.gb-header__cart span {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--gb-gold);
    color: #4c0e16;
    font-size: 8px;
    font-weight: 800;
    line-height: 16px;
    text-align: center;
}

.gb-header__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 40px;
    padding: 0 19px;
    border-radius: 999px;
    background: var(--gb-burgundy);
    color: #fff !important;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15px;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow: 0 8px 22px rgba(63, 7, 15, .20);
    transition: .25s ease;
}

.gb-header__cta:hover {
    background: #7a1c28;
    color: #fff !important;
    transform: translateY(-1px);
}

.gb-header__cta i {
    font-size: 9px;
}

/* rate popup */
.gb-header__rate,
.gb-header__user {
    position: relative;
}

.gb-header__rate-popup,
.gb-header__user-menu {
    position: absolute;
    top: calc(100% + 13px);
    right: 0;
    z-index: 50;
    width: 190px;
    padding: 15px;
    border: 1px solid rgba(215, 176, 107, .30);
    border-radius: 15px;
    background: rgba(255, 250, 245, .98);
    color: #332124;
    box-shadow: 0 22px 50px rgba(43, 7, 13, .25);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(7px);
    transition: .25s ease;
}

.gb-header__rate.is-open .gb-header__rate-popup,
.gb-header__user.is-open .gb-header__user-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.gb-header__rate-title {
    margin-bottom: 11px;
    color: var(--gb-burgundy);
    font-family: "Cormorant Garamond", serif;
    font-size: 19px;
    font-weight: 700;
}

.gb-header__rate-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 10px;
}

.gb-header__rate-row strong {
    color: var(--gb-burgundy);
}

.gb-header__rate-divider {
    height: 1px;
    margin: 10px 0;
    background: rgba(101, 21, 31, .12);
}

.gb-header__rate-empty {
    font-size: 10px;
    color: #806d6d;
}

.gb-header__user-menu {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.gb-header__user-menu strong {
    display: block;
    margin-bottom: 6px;
    padding-bottom: 9px;
    border-bottom: 1px solid rgba(101,21,31,.10);
    font-size: 11px;
    color: var(--gb-burgundy);
}

.gb-header__user-menu a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 7px;
    border-radius: 8px;
    color: #332124 !important;
    font-size: 10px;
    text-decoration: none !important;
}

.gb-header__user-menu a:hover {
    background: #f6ece5;
    color: var(--gb-burgundy) !important;
}

.gb-header__user-menu i {
    width: 13px;
}

/* mobile button */
.gb-header__mobile-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    margin-left: auto;
    padding: 0;
    border: 1px solid rgba(255,255,255,.30);
    border-radius: 50%;
    background: rgba(49, 5, 11, .28);
    cursor: pointer;
}

.gb-header__mobile-toggle span {
    display: block;
    width: 16px;
    height: 1px;
    margin: 0 auto;
    background: #fff;
    transition: .25s ease;
}

.gb-header__mobile-toggle.is-open span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.gb-header__mobile-toggle.is-open span:nth-child(2) {
    opacity: 0;
}

.gb-header__mobile-toggle.is-open span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}

.gb-mobile-menu {
    display: none;
}

/* =========================
   HERO CONTENT
   ========================= */

.gb-hero__content {
    position: absolute;
    z-index: 10;
    left: 32px;
    bottom: 76px;
    width: min(570px, 48%);
    color: #fff;
}

.gb-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 15px;
}

.gb-hero__eyebrow span {
    width: 28px;
    height: 1px;
    background: var(--gb-gold-light);
}

.gb-hero__eyebrow small {
    color: var(--gb-gold-light);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.gb-hero__content h1 {
    max-width: 650px;
    margin: 0 0 15px;
    color: #fff;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(46px, 5.5vw, 78px);
    font-weight: 600;
    line-height: .90;
    letter-spacing: -1.4px;
    text-shadow: 0 5px 25px rgba(28,0,5,.25);
}

.gb-hero__title-gold {
    color: var(--gb-gold-light);
}

.gb-hero__content p {
    max-width: 455px;
    margin: 0 0 25px;
    color: rgba(255, 247, 239, .86);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.75;
}

.gb-hero__button {
    display: inline-flex;
    align-items: center;
    gap: 22px;
    min-height: 44px;
    padding: 0 18px 0 21px;
    border-radius: 999px;
    background: var(--gb-ivory);
    color: #3d2929 !important;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .7px;
    text-decoration: none !important;
    transition: .3s ease;
}

.gb-hero__button i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--gb-burgundy);
    color: #fff;
    font-size: 9px;
    transition: .3s ease;
}

.gb-hero__button:hover {
    background: #fff;
    color: var(--gb-burgundy) !important;
    transform: translateY(-2px);
}

.gb-hero__button:hover i {
    transform: translateX(3px);
}

/* =========================
   LEFT MENU MARK
   ========================= */

.gb-hero__left-menu {
    position: absolute;
    left: 18px;
    top: 50%;
    z-index: 18;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 34px;
    height: 42px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: default;
}

.gb-hero__left-menu span {
    display: block;
    width: 20px;
    height: 1px;
    margin-left: 0;
    background: var(--gb-gold-light);
    box-shadow: 0 0 8px rgba(239,211,155,.18);
}

/* =========================
   RIGHT CAROUSEL CONTROLS
   ========================= */

.gb-hero__right {
    display: none !important;
    position: absolute;
    right: 32px;
    bottom: 55px;
    z-index: 15;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 15px;
}

.gb-hero__counter {
    display: flex;
    align-items: center;
    gap: 9px;
    color: rgba(255,255,255,.88);
    font-family: "Cormorant Garamond", serif;
    font-size: 17px;
}

.gb-hero__counter i {
    width: 28px;
    height: 1px;
    background: rgba(255,255,255,.55);
}

.gb-hero__arrows {
    display: flex;
    gap: 8px;
}

.gb-hero__arrows button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.36);
    border-radius: 50%;
    background: rgba(54, 6, 13, .27);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: .25s ease;
}

.gb-hero__arrows button:hover {
    border-color: var(--gb-gold-light);
    background: var(--gb-gold);
    color: var(--gb-burgundy-dark);
}

.gb-hero__arrows i {
    font-size: 10px;
}

.gb-hero__dots {
    position: absolute;
    z-index: 15;
    left: 32px;
    bottom: 28px;
    display: flex;
    align-items: center;
    gap: 7px;
}

.gb-hero__dot {
    width: 22px;
    height: 2px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,.34);
    cursor: pointer;
    transition: .3s ease;
}

.gb-hero__dot.is-active {
    width: 40px;
    background: var(--gb-gold-light);
}

.gb-hero__empty {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 14px;
}

/* =========================================================================
   TABLET
   ========================================================================= */

@media (max-width: 1100px) {

    .gb-hero__shell {
        width: calc(100% - 34px);
        margin: 17px auto;
        height: calc(100% - 34px);
    }

    .gb-header {
        gap: 14px;
        padding: 16px 18px;
    }

    .gb-header__logo img {
        max-width: 160px;
        height: 50px;
    }

    .gb-header__link {
        padding: 0 12px;
        font-size: 10px;
    }

    .gb-header__cta {
        padding: 0 13px;
        font-size: 9px;
    }

    .gb-hero__content {
        left: 26px;
        bottom: 64px;
        width: min(520px, 54%);
    }

    .gb-hero__right {
        right: 26px;
        bottom: 47px;
    }

    .gb-hero__dots {
        left: 26px;
        bottom: 25px;
    }
}

/* =========================================================================
   MOBILE
   ========================================================================= */

@media (max-width: 820px) {

    .gb-hero {
        height: auto;
        min-height: 720px;
    }

    .gb-hero__slide {
        background-position: 58% center;
    }

    .gb-hero__overlay {
        background:
            linear-gradient(
                180deg,
                rgba(55, 7, 14, .60) 0%,
                rgba(66, 8, 15, .48) 35%,
                rgba(48, 5, 11, .78) 100%
            );
    }

    .gb-hero__shell {
        width: calc(100% - 22px);
        height: auto;
        min-height: 696px;
        margin: 11px auto;
        border-radius: 18px;
    }

    .gb-header {
        min-height: 76px;
        padding: 12px 13px;
    }

    .gb-header__logo img {
        max-width: 145px;
        height: 48px;
    }

    .gb-header__nav,
    .gb-header__actions {
        display: none;
    }

    .gb-header__mobile-toggle {
        display: flex;
    }

    .gb-mobile-menu {
        position: absolute;
        top: 76px;
        left: 13px;
        right: 13px;
        z-index: 30;
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 10px;
        border: 1px solid rgba(255,255,255,.20);
        border-radius: 15px;
        background: rgba(66, 10, 17, .94);
        box-shadow: 0 22px 45px rgba(31,0,4,.30);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-8px);
        transition: .25s ease;
    }

    .gb-mobile-menu.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }

    .gb-mobile-menu a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 43px;
        padding: 0 13px;
        border-radius: 9px;
        color: #fff !important;
        font-size: 11px;
        text-decoration: none !important;
    }

    .gb-mobile-menu a:hover {
        background: rgba(255,255,255,.08);
    }

    .gb-mobile-menu__cta {
        margin-top: 4px;
        background: var(--gb-burgundy-soft);
    }

    .gb-hero__content {
        left: 22px;
        right: 22px;
        bottom: 105px;
        width: auto;
        max-width: none;
    }

    .gb-hero__content h1 {
        max-width: 90%;
        font-size: clamp(42px, 12vw, 62px);
    }

    .gb-hero__content p {
        max-width: 92%;
        font-size: 11px;
    }

    .gb-hero__right {
        right: 22px;
        bottom: 27px;
        flex-direction: row;
        align-items: center;
    }

    .gb-hero__counter {
        font-size: 15px;
    }

    .gb-hero__arrows button {
        width: 35px;
        height: 35px;
    }

    .gb-hero__dots {
        left: 22px;
        bottom: 28px;
    }
}

/* =========================================================================
   SMALL MOBILE
   ========================================================================= */

@media (max-width: 480px) {

    .gb-hero {
        min-height: 670px;
    }

    .gb-hero__shell {
        min-height: 646px;
    }

    .gb-header {
        padding: 10px 11px;
    }

    .gb-header__logo img {
        max-width: 125px;
        height: 43px;
    }

    .gb-hero__content {
        left: 19px;
        right: 19px;
        bottom: 104px;
    }

    .gb-hero__eyebrow {
        margin-bottom: 11px;
    }

    .gb-hero__eyebrow small {
        font-size: 8px;
        letter-spacing: 2.1px;
    }

    .gb-hero__content h1 {
        max-width: 100%;
        margin-bottom: 12px;
        font-size: 43px;
        line-height: .93;
        letter-spacing: -.8px;
    }

    .gb-hero__content p {
        max-width: 100%;
        margin-bottom: 18px;
        font-size: 10px;
        line-height: 1.65;
    }

    .gb-hero__button {
        min-height: 40px;
        padding-left: 17px;
        gap: 15px;
        font-size: 8px;
    }

    .gb-hero__button i {
        width: 27px;
        height: 27px;
    }

    .gb-hero__right {
        right: 19px;
        bottom: 24px;
        gap: 9px;
    }

    .gb-hero__counter {
        display: none;
    }

    .gb-hero__dots {
        left: 19px;
        bottom: 29px;
    }

    .gb-hero__dot {
        width: 17px;
    }

    .gb-hero__dot.is-active {
        width: 30px;
    }
}


/* USER REQUEST: remove the decorative line/gem row before Latest Products / New Arrivals */
.latest-products-title-row {
    display: none !important;
}

/* keep the three header icons compact after Home / All Jewelry / Queries */
.gb-header__icon {
    width: 36px;
    height: 36px;
}

/* =========================================================================
   HOME HERO + HEADER — UPDATE PACK
   1. Dots removed -> left / right arrows on the glass container
   2. Right-bottom rotating design card
   3. Second line of the hero title always gold
   4. Header icons without circle, burgundy circle on hover
   ========================================================================= */


/* -------------------------------------------------------------------------
   3. SECOND LINE GOLD
   ------------------------------------------------------------------------- */

.gb-hero__title-gold {
    color: var(--gb-gold-light) !important;
}


/* -------------------------------------------------------------------------
   1. REMOVE OLD DOTS + OLD RIGHT CONTROLS
   ------------------------------------------------------------------------- */

.gb-hero__dots,
.gb-hero__right {
    display: none !important;
}


/* -------------------------------------------------------------------------
   1. NEW SIDE ARROWS (left + right of the glass shell)
   ------------------------------------------------------------------------- */

.gb-hero__nav-arrow {
    position: absolute;
    top: 50%;
    z-index: 30;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 40px;
    height: 40px;
    padding: 0;

    transform: translateY(-50%);

    border: 1px solid rgba(239, 211, 155, .55);
    border-radius: 50%;

    /* fully transparent — no fill */
    background: transparent;
    color: var(--gb-gold-light);

    cursor: pointer;

    box-shadow: none;

    transition: .3s ease;
}

/* pushed completely OUTSIDE the glass container */
.gb-hero__nav-arrow--prev {
    left: -74px;
}

.gb-hero__nav-arrow--next {
    right: -74px;
}

.gb-hero__nav-arrow i {
    font-size: 15px;
}

.gb-hero__nav-arrow:hover {
    background: rgba(239, 211, 155, .14);
    border-color: var(--gb-gold-light);
    color: #fff;
    transform: translateY(-50%) scale(1.07);
}


/* -------------------------------------------------------------------------
   2. RIGHT BOTTOM DESIGN CARD
   ------------------------------------------------------------------------- */

.gb-hero__feature {
    position: absolute;
    z-index: 16;

    right: 30px;
    bottom: 46px;

    display: flex;
    align-items: center;
    gap: 16px;

    width: 345px;
    padding: 12px;

    border: 1px solid rgba(215, 176, 107, .30);
    border-radius: 16px;

    background: rgba(255, 250, 245, .96);

    box-shadow: 0 22px 48px rgba(30, 0, 4, .22);
}

.gb-hero__feature-image {
    flex: 0 0 98px;
    width: 98px;
    height: 80px;

    overflow: hidden;
    border-radius: 12px;

    background: #f1e3d4;
}

.gb-hero__feature-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gb-hero__feature-text {
    min-width: 0;
}

.gb-hero__feature-text h4 {
    margin: 0 0 9px;

    color: var(--gb-burgundy);

    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.15;
}

.gb-hero__feature-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    color: #4a3330 !important;

    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .6px;

    text-decoration: none !important;
}

.gb-hero__feature-link i {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 24px;
    height: 24px;

    border: 1px solid rgba(101, 21, 31, .35);
    border-radius: 50%;

    font-size: 8px;
    color: var(--gb-burgundy);

    transition: .25s ease;
}

.gb-hero__feature-link:hover i {
    background: var(--gb-burgundy);
    border-color: var(--gb-burgundy);
    color: #fff;
}


/* -------------------------------------------------------------------------
   4. HEADER ICONS — NO CIRCLE, BURGUNDY CIRCLE ON HOVER
   ------------------------------------------------------------------------- */

.gb-header__icon {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--gb-burgundy) !important;
}

.gb-header__icon i {
    color: inherit !important;
}

.gb-header__icon:hover,
.gb-header__icon:focus {
    border: 0 !important;
    background: var(--gb-burgundy) !important;
    color: #fff !important;
    transform: translateY(-1px);
}

.gb-header__icon:hover i,
.gb-header__icon:focus i {
    color: #fff !important;
}


/* -------------------------------------------------------------------------
   TABLET
   ------------------------------------------------------------------------- */

@media (max-width: 1100px) {

    .gb-hero__nav-arrow {
        width: 44px;
        height: 44px;
    }

    .gb-hero__nav-arrow--prev {
        left: -52px;
    }

    .gb-hero__nav-arrow--next {
        right: -52px;
    }

    .gb-hero__nav-arrow i {
        font-size: 13px;
    }

    .gb-hero__feature {
        right: 22px;
        bottom: 40px;
        width: 300px;
        gap: 13px;
        padding: 10px;
    }

    .gb-hero__feature-image {
        flex: 0 0 84px;
        width: 84px;
        height: 70px;
    }

    .gb-hero__feature-text h4 {
        font-size: 17px;
    }
}


/* -------------------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------------------- */

@media (max-width: 820px) {

    .gb-hero__feature {
        display: none;
    }

    /* Mobile: hide manual hero arrows.
       The hero continues with automatic slide rotation only. */
    .gb-hero__nav-arrow {
        display: none !important;
    }
}


/* =========================================================================
   GOLD BLISS — EXPLORE OUR COLLECTIONS
   WHITE SECTION + BURGUNDY CLOTH IMAGE ON EACH CARD
   ========================================================================= */

.home-categories {

    /*
     * IMPORTANT:
     * home.css is inside /css/
     * cloth burgandy.webp is inside /img/
     *
     * Therefore:
     * ../img/cloth%20burgandy.png
     */
    --cat-bg: url("../img/cloth%20burgandy.png");

    --cat-burgundy: #65151f;

    width: 100%;
    padding: 80px 0 0px !important;
    margin: 0;

    /* SECTION BACKGROUND REMAINS WHITE */
    background: #ffffff !important;

    overflow: hidden !important;
}


/* =========================================================================
   CONTAINER
   ========================================================================= */

.home-categories__container {

    width: min(1240px, calc(100% - 48px)) !important;
    max-width: 1240px !important;

    margin: 0 auto !important;
    padding: 0 !important;

    box-sizing: border-box;
}


/* =========================================================================
   SECTION HEADING
   ========================================================================= */

.home-categories__heading {

    width: 100%;

    text-align: center !important;

    margin: 0 0 30px !important;
}


.home-categories__heading h2 {

    margin: 0 !important;
    padding: 0 !important;

    color: var(--cat-burgundy) !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;

    font-size: 34px !important;

    font-weight: 700 !important;

    line-height: 1.15 !important;

    letter-spacing: 3px !important;

    text-transform: uppercase !important;
}


/* Hide unwanted elements */

.home-categories__title-row,
.category-theme-toggle {

    display: none !important;
}


.home-categories__heading-line {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    gap: 10px !important;

    width: 120px !important;

    height: 12px !important;

    margin: 10px auto 0 !important;
}


.home-categories__heading-line span {

    display: block !important;

    width: 42px !important;

    height: 1px !important;

    background: var(--cat-burgundy) !important;

    opacity: 0.85 !important;
}


.home-categories__heading-line b {

    display: block !important;

    color: var(--cat-burgundy) !important;

    font-family: Georgia, serif !important;

    font-size: 10px !important;

    font-weight: 400 !important;

    line-height: 1 !important;
}


.home-categories__heading > p,
.home-categories__eyebrow {

    display: none !important;
}


/* =========================================================================
   CATEGORY CAROUSEL
   ========================================================================= */

.home-category-carousel {

    position: relative !important;

    width: 100% !important;

    max-width: 100% !important;

    display: block !important;

    overflow: visible !important;

    margin: 0 !important;

    padding: 0 !important;
}


.home-category-viewport {

    width: 100% !important;

    max-width: 100% !important;

    overflow: hidden !important;

    padding: 4px 0 !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


.home-category-track {

    display: flex !important;

    align-items: stretch !important;

    gap: 14px !important;

    width: max-content !important;

    min-width: 100% !important;

    padding: 0 !important;

    margin: 0 !important;

    will-change: transform;

    transition:
        transform 0.65s cubic-bezier(.22, 1, .36, 1) !important;
}


.home-category-slide {

    flex: 0 0 calc((100% - 56px) / 5) !important;

    width: calc((100% - 56px) / 5) !important;

    max-width: calc((100% - 56px) / 5) !important;

    min-width: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================================
   CATEGORY CARD
   BURGUNDY CLOTH IMAGE IS APPLIED ONLY HERE
   ========================================================================= */

.home-category-card {

    position: relative !important;

    display: flex !important;

    flex-direction: column !important;

    width: 103% !important;

    height: 68% !important;

    padding: 12px 12px 0 !important;

    margin: 0 !important;

    overflow: hidden !important;


    /* ---------------------------------------------------------
       CARD BACKGROUND
       This is where cloth burgandy.webp is applied.
       It is NOT applied to .home-categories.
       --------------------------------------------------------- */

    background-color: #65151f !important;

    background-image: var(--cat-bg) !important;

    background-size: cover !important;

    background-position: center !important;

    background-repeat: no-repeat !important;


    border: 1px solid rgba(101, 21, 31, 0.35) !important;

    border-radius: 8px !important;

    box-shadow:
        0 4px 14px rgba(65, 20, 25, 0.14) !important;

    color: var(--cat-burgundy) !important;

    text-decoration: none !important;

    box-sizing: border-box !important;

    transform: translateY(0);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease !important;
}


/* Card hover */

.home-category-card:hover {

    transform: translateY(-4px) !important;

    border-color: rgba(101, 21, 31, 0.7) !important;

    box-shadow:
        0 12px 26px rgba(65, 20, 25, 0.24) !important;
}


/* =========================================================================
   CATEGORY IMAGE
   ========================================================================= */

.home-category-image {

    position: relative !important;

    width: 100% !important;

    height: 175px !important;

    margin: 0 !important;

    padding: 0 !important;

    overflow: hidden !important;

    /* No white frame around the category image */
    border: 0 !important;

    border-radius: 6px !important;

    /*
     * Keep the image area transparent so the burgundy cloth
     * card background remains visible if the image has a
     * different aspect ratio.
     */
    background: transparent !important;

    box-shadow:
        0 6px 16px rgba(30, 0, 4, 0.28) !important;

    box-sizing: border-box !important;
}


.home-category-image__inner {

    position: relative !important;

    width: 100% !important;

    height: 100% !important;

    overflow: hidden !important;

    border: 0 !important;

    border-radius: 0 !important;

    background: transparent !important;

    box-sizing: border-box !important;
}


/* Remove overlay */

.home-category-image::after {

    display: none !important;
}


/* Actual category image */

.home-category-image img {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    padding: 0 !important;

    margin: 0 !important;

    /*
     * SHOW THE COMPLETE CATEGORY IMAGE.
     * cover was cropping the jewellery image because the
     * fixed image box has a different aspect ratio.
     */
    object-fit: contain !important;

    object-position: center !important;

    border: 0 !important;

    border-radius: 0 !important;

    transform: scale(1.001) !important;

    transition:
        transform 0.55s cubic-bezier(.22, 1, .36, 1) !important;
}


/* Image hover zoom */

.home-category-card:hover
.home-category-image img {

    transform: scale(1.06) !important;
}


/* =========================================================================
   CATEGORY INFORMATION
   ========================================================================= */

.home-category-info {

    width: calc(100% + 24px) !important;

    margin: 12px -12px 0 !important;

    min-height: 72px !important;

    padding: 12px 8px 11px !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    justify-content: center !important;

    gap: 6px !important;

    text-align: center !important;

    /*
     * Ivory strip for readability
     */
    background: #fffaf4 !important;

    border-top:
        1px solid rgba(101, 21, 31, 0.18) !important;

    box-sizing: border-box !important;
}


/* Category name */

.home-category-info h3 {

    margin: 0 !important;

    padding: 0 !important;

    color: var(--cat-burgundy) !important;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif !important;

    font-size: 18px !important;

    font-weight: 700 !important;

    line-height: 1.1 !important;

    letter-spacing: 1.4px !important;

    text-transform: uppercase !important;

    white-space: nowrap !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;

    max-width: 100% !important;
}


/* Explore Now */

.home-category-info span {

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    gap: 6px !important;

    margin: 0 !important;

    padding: 0 !important;

    color: #8b6a4a !important;

    font-family:
        "Montserrat",
        Arial,
        sans-serif !important;

    font-size: 11px !important;

    font-weight: 600 !important;

    line-height: 1 !important;

    letter-spacing: 0.6px !important;

    text-transform: none !important;
}


/* Arrow */

.home-category-info span i {

    margin: 0 !important;

    color: var(--cat-burgundy) !important;

    font-size: 10px !important;

    transition:
        transform 0.25s ease !important;
}


/* Arrow hover */

.home-category-card:hover
.home-category-info span i {

    transform: translateX(3px) !important;
}


/* Hide unwanted carousel elements */

.home-category-arrow,
.home-category-progress {

    display: none !important;
}


/* Empty state */

.home-category-empty {

    width: 100%;

    padding: 30px;

    text-align: center;

    color: #806f63;

    font-family:
        "Montserrat",
        Arial,
        sans-serif;

    font-size: 14px;
}


/* =========================================================================
   TABLET — 4 CARDS
   ========================================================================= */

@media (max-width: 1200px) {

    .home-categories__container {

        width: calc(100% - 36px) !important;
    }


    .home-category-slide {

        flex-basis:
            calc((100% - 42px) / 4) !important;

        width:
            calc((100% - 42px) / 4) !important;

        max-width:
            calc((100% - 42px) / 4) !important;
    }
}


/* =========================================================================
   TABLET — 3 CARDS
   ========================================================================= */

@media (max-width: 991px) {

    .home-categories {

        padding: 42px 0 46px !important;
    }


    .home-categories__heading h2 {

        font-size: 30px !important;
    }


    .home-category-slide {

        flex-basis:
            calc((100% - 28px) / 3) !important;

        width:
            calc((100% - 28px) / 3) !important;

        max-width:
            calc((100% - 28px) / 3) !important;
    }


    .home-category-image {

        height: 170px !important;
    }
}


/* =========================================================================
   MOBILE — 2 CARDS
   ========================================================================= */

@media (max-width: 767px) {

    .home-categories {

        padding: 36px 0 40px !important;
    }


    .home-categories__container {

        width: calc(100% - 24px) !important;
    }


    .home-categories__heading {

        margin-bottom: 22px !important;
    }


    .home-categories__heading h2 {

        font-size: 24px !important;

        letter-spacing: 2px !important;
    }


    .home-category-track {

        gap: 10px !important;
    }


    .home-category-slide {

        flex-basis:
            calc((100% - 10px) / 2) !important;

        width:
            calc((100% - 10px) / 2) !important;

        max-width:
            calc((100% - 10px) / 2) !important;
    }


    .home-category-card {

        padding: 9px 9px 0 !important;
    }


    .home-category-image {

        height: 140px !important;
    }


    .home-category-info {

        width:
            calc(100% + 18px) !important;

        margin:
            9px -9px 0 !important;

        min-height: 62px !important;

        padding: 9px 5px !important;
    }


    .home-category-info h3 {

        font-size: 14px !important;

        letter-spacing: 1px !important;
    }


    .home-category-info span {

        font-size: 9.5px !important;
    }
}


/* =========================================================================
   SMALL MOBILE — 1 CARD
   ========================================================================= */

@media (max-width: 480px) {

    .home-categories__container {

        width: calc(100% - 28px) !important;
    }


    .home-categories__heading h2 {

        font-size: 21px !important;

        letter-spacing: 1.6px !important;
    }


    .home-category-slide {

        flex-basis: 100% !important;

        width: 100% !important;

        max-width: 100% !important;
    }


    .home-category-card {

        padding: 12px 12px 0 !important;
    }


    .home-category-image {

        height: 210px !important;
    }


    .home-category-info {

        width:
            calc(100% + 24px) !important;

        margin:
            12px -12px 0 !important;

        min-height: 70px !important;
    }


    .home-category-info h3 {

        font-size: 17px !important;

        letter-spacing: 1.3px !important;
    }


    .home-category-info span {

        font-size: 11px !important;
    }
}


/* =========================================================================
   VERY SMALL MOBILE
   ========================================================================= */

@media (max-width: 360px) {

    .home-category-image {

        height: 185px !important;
    }
}


/* =========================================================================
   GOLD BLISS — LATEST PRODUCTS
   NEW CARD DESIGN
   Reference: soft mobile-app style card
   IMPORTANT:
   - Design-only override
   - Existing PHP/data/query/cart/wishlist logic is untouched
   - Uses the existing Gold Bliss burgundy + gold palette
   ========================================================================= */

:root {
    --lp-new-burgundy: #65151f;
    --lp-new-burgundy-dark: #4c0e16;
    --lp-new-burgundy-soft: #7b202b;
    --lp-new-gold: #d7b06b;
    --lp-new-gold-light: #efd39b;
    --lp-new-cream: #fffaf4;
    --lp-new-cream-2: #f8f2e9;
    --lp-new-text: #2f1d1d;
    --lp-new-muted: #806f63;
}

/* -------------------------------------------------------------------------
   SECTION
   ------------------------------------------------------------------------- */

.latest-products-section {
    position: relative !important;
    width: 100% !important;
    padding: 78px 0 70px !important;
    overflow: hidden !important;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(239, 211, 155, 0.18) 0%,
            rgba(255, 250, 244, 0.94) 34%,
            #fffaf4 72%,
            #f8f2e9 100%
        ) !important;
}

/* subtle luxury glow */
.latest-products-section::before {
    content: "" !important;
    position: absolute !important;
    width: 420px !important;
    height: 420px !important;
    left: -230px !important;
    top: 120px !important;
    border-radius: 50% !important;
    background: rgba(215, 176, 107, 0.08) !important;
    filter: blur(10px) !important;
    pointer-events: none !important;
}

.latest-products-section::after {
    content: "" !important;
    position: absolute !important;
    width: 360px !important;
    height: 360px !important;
    right: -200px !important;
    bottom: 50px !important;
    border-radius: 50% !important;
    background: rgba(101, 21, 31, 0.035) !important;
    filter: blur(12px) !important;
    pointer-events: none !important;
}

.latest-products-container {
    position: relative !important;
    z-index: 2 !important;
    width: min(1320px, calc(100% - 70px)) !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
}

/* -------------------------------------------------------------------------
   HEADING
   ------------------------------------------------------------------------- */

.latest-products-heading {
    position: relative !important;
    z-index: 2 !important;
    margin: 0 auto 42px !important;
    text-align: center !important;
}

.latest-products-eyebrow {
    display: inline-block !important;
    margin-bottom: 9px !important;
    color: var(--lp-new-gold) !important;
    font-family: "Montserrat", sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
}

.latest-products-title-row {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    margin: 0 auto 9px !important;
}

.latest-products-title-row .latest-title-line {
    display: block !important;
    width: 38px !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        transparent,
        var(--lp-new-gold)
    ) !important;
}

.latest-products-title-row .latest-title-line:last-child {
    background: linear-gradient(
        90deg,
        var(--lp-new-gold),
        transparent
    ) !important;
}

.latest-products-title-row i {
    color: var(--lp-new-gold) !important;
    font-size: 11px !important;
}

.latest-products-heading h2 {
    margin: 0 !important;
    color: var(--lp-new-burgundy) !important;
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: clamp(38px, 4vw, 54px) !important;
    font-weight: 700 !important;
    line-height: 0.95 !important;
    letter-spacing: 0.4px !important;
}

.latest-products-heading p {
    margin: 13px 0 0 !important;
    color: var(--lp-new-muted) !important;
    font-family: "Montserrat", sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 1.7px !important;
    text-transform: uppercase !important;
}

/* -------------------------------------------------------------------------
   CAROUSEL
   ------------------------------------------------------------------------- */

.latest-products-carousel {
    position: relative !important;
    width: 100% !important;
}

.latest-products-viewport {
    width: 100% !important;
    padding: 20px 55px 38px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.latest-products-track {
    display: flex !important;
    align-items: stretch !important;
    gap: 24px !important;
    width: max-content !important;
}

/* -------------------------------------------------------------------------
   NEW PRODUCT CARD
   ------------------------------------------------------------------------- */

.latest-product-card {
    position: relative !important;
    flex: 0 0 calc((100% - 72px) / 4) !important;
    width: calc((100% - 72px) / 4) !important;
    max-width: 305px !important;
    min-width: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;

    display: flex !important;
    flex-direction: column !important;

    background: #fff !important;
    border: 1px solid rgba(101, 21, 31, 0.10) !important;
    border-radius: 26px !important;

    box-shadow:
        0 15px 35px rgba(76, 14, 22, 0.08),
        0 3px 10px rgba(215, 176, 107, 0.08) !important;

    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    z-index: 1 !important;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease !important;
}

.latest-product-card::before {
    content: none !important;
}

.latest-product-card:hover {
    transform: translateY(-7px) !important;
    border-color: rgba(215, 176, 107, 0.55) !important;
    box-shadow:
        0 24px 48px rgba(76, 14, 22, 0.13),
        0 5px 16px rgba(215, 176, 107, 0.13) !important;
}

/* Do not use the old centre-zoom visual treatment */
.latest-product-card.is-active {
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    z-index: 2 !important;
    border-color: rgba(215, 176, 107, 0.40) !important;
    box-shadow:
        0 18px 40px rgba(76, 14, 22, 0.10),
        0 4px 14px rgba(215, 176, 107, 0.10) !important;
}

.latest-product-card.is-active:hover {
    transform: translateY(-7px) !important;
}

/* -------------------------------------------------------------------------
   TOP / WISHLIST
   ------------------------------------------------------------------------- */

.latest-product-top {
    position: absolute !important;
    top: 14px !important;
    left: 14px !important;
    right: 14px !important;
    z-index: 10 !important;

    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;

    margin: 0 !important;
    min-height: 0 !important;
    pointer-events: none !important;
}

.latest-product-badge {
    display: none !important;
}

/* Floating heart, matching the soft rounded reference-card style */
.latest-product-wishlist {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-left: auto !important;

    border: 1px solid rgba(101, 21, 31, 0.13) !important;
    border-radius: 50% !important;

    background: rgba(255, 250, 244, 0.94) !important;
    color: var(--lp-new-burgundy) !important;

    box-shadow: 0 6px 16px rgba(76, 14, 22, 0.10) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;

    cursor: pointer !important;
    pointer-events: auto !important;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease,
        border-color .25s ease !important;
}

.latest-product-wishlist i {
    color: inherit !important;
    font-size: 15px !important;
}

.latest-product-wishlist:hover {
    transform: scale(1.08) !important;
    background: var(--lp-new-burgundy) !important;
    border-color: var(--lp-new-burgundy) !important;
    color: #fff !important;
}

.latest-product-wishlist.is-wishlisted {
    background: var(--lp-new-burgundy) !important;
    border-color: var(--lp-new-burgundy) !important;
    color: #fff !important;
}

.latest-product-wishlist.is-clicked {
    animation: latestWishlistPop .35s ease !important;
}

@keyframes latestWishlistPop {
    0% { transform: scale(1); }
    45% { transform: scale(1.20); }
    100% { transform: scale(1); }
}

/* -------------------------------------------------------------------------
   PRODUCT IMAGE
   ------------------------------------------------------------------------- */

.latest-product-image-link {
    display: block !important;
    position: relative !important;
    z-index: 3 !important;
    margin: 0 !important;
    text-decoration: none !important;
}

.latest-product-image {
    position: relative !important;
    width: 100% !important;
    height: 265px !important;
    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            #fffdf9 0%,
            #f8f2e9 100%
        ) !important;

    border: 0 !important;
    border-radius: 25px 25px 0 0 !important;
    box-shadow: inset 0 -1px 0 rgba(101, 21, 31, 0.06) !important;
}

.latest-product-image::after {
    content: "" !important;
    position: absolute !important;
    left: 18px !important;
    right: 18px !important;
    bottom: 13px !important;
    height: 1px !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(215, 176, 107, 0.32),
        transparent
    ) !important;
    pointer-events: none !important;
}

.latest-product-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;

    object-fit: contain !important;
    object-position: center !important;

    padding: 22px !important;
    margin: 0 !important;

    transform: scale(1) !important;
    transition: transform .55s cubic-bezier(.22, 1, .36, 1) !important;
}

.latest-product-card:hover .latest-product-image img,
.latest-product-card.is-active .latest-product-image img {
    transform: scale(1.045) !important;
}

/* -------------------------------------------------------------------------
   PRODUCT DETAILS — cream panel like the reference
   ------------------------------------------------------------------------- */

.latest-product-info {
    position: relative !important;
    z-index: 4 !important;

    flex: 1 1 auto !important;

    display: flex !important;
    flex-direction: column !important;

    padding: 18px 18px 19px !important;
    text-align: left !important;

    background:
        linear-gradient(
            180deg,
            #fffaf4 0%,
            #fffdf9 100%
        ) !important;
}

.latest-product-info h3,
.latest-product-card.is-active .latest-product-info h3 {
    margin: 0 0 6px !important;
    padding: 0 !important;

    color: var(--lp-new-burgundy) !important;

    font-family:
        "Cormorant Garamond",
        Georgia,
        serif !important;

    font-size: 23px !important;
    font-weight: 700 !important;
    line-height: 1.05 !important;
    letter-spacing: .15px !important;

    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.latest-product-info p {
    margin: 0 0 12px !important;
    padding: 0 !important;

    color: var(--lp-new-muted) !important;

    font-family:
        "Montserrat",
        Arial,
        sans-serif !important;

    font-size: 10px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;

    min-height: 29px !important;
    max-height: 30px !important;
    overflow: hidden !important;
}

.latest-product-rating {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;

    margin: 0 0 14px !important;

    color: #705f56 !important;
    font-family: "Montserrat", sans-serif !important;
    font-size: 9px !important;
}

.latest-star {
    color: var(--lp-new-gold) !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

.latest-product-rating small {
    color: #a08f85 !important;
    font-size: 8px !important;
}

/* -------------------------------------------------------------------------
   PRICE + CART
   ------------------------------------------------------------------------- */

.latest-product-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 11px !important;

    margin-top: auto !important;
}

.latest-product-price,
.latest-product-card.is-active .latest-product-price {
    display: block !important;
    margin: 0 !important;

    color: var(--lp-new-burgundy) !important;

    font-family:
        "Montserrat",
        Arial,
        sans-serif !important;

    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.latest-product-cart-form {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.latest-product-cart {
    width: 100% !important;
    min-height: 42px !important;
    padding: 10px 16px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    border: 1px solid var(--lp-new-burgundy) !important;
    border-radius: 999px !important;

    background: var(--lp-new-burgundy) !important;
    color: #fffaf4 !important;

    font-family:
        "Montserrat",
        Arial,
        sans-serif !important;

    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;

    white-space: nowrap !important;
    cursor: pointer !important;

    box-shadow:
        0 8px 18px rgba(101, 21, 31, 0.15) !important;

    transition:
        background .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease,
        box-shadow .3s ease !important;
}

.latest-product-cart i {
    color: var(--lp-new-gold-light) !important;
    font-size: 11px !important;
}

.latest-product-cart:hover,
.latest-product-cart:disabled:hover {

    transform:
        none !important;

    background:
        #4a0e18 !important;

    border:
        1px solid
        #e9c87c !important;

    border-color:
        #e9c87c !important;

    color:
        #e9c87c !important;

    box-shadow:
        0 8px 20px
        rgba(74, 14, 24, 0.28) !important;
}


.latest-product-cart:hover i,
.latest-product-cart:disabled:hover i {

    color:
        #e9c87c !important;

    transform:
        none !important;
}


.latest-product-cart:hover span,
.latest-product-cart:disabled:hover span {

    color:
        #e9c87c !important;
}


.latest-product-cart:disabled {

    opacity:
        1 !important;

    cursor:
        not-allowed !important;

    pointer-events:
        auto !important;

    transform:
        none !important;

    box-shadow:
        0 8px 18px
        rgba(0, 0, 0, 0.16) !important;
}

/* -------------------------------------------------------------------------
   ARROWS
   ------------------------------------------------------------------------- */

.latest-products-arrow {
    position: absolute !important;
    top: 50% !important;
    z-index: 30 !important;

    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 1px solid rgba(101, 21, 31, 0.16) !important;
    border-radius: 50% !important;

    background: rgba(255, 250, 244, 0.96) !important;
    color: var(--lp-new-burgundy) !important;

    box-shadow: 0 8px 20px rgba(76, 14, 22, 0.09) !important;
    transform: translateY(-50%) !important;

    transition:
        background .25s ease,
        color .25s ease,
        border-color .25s ease,
        transform .25s ease !important;
}

.latest-products-prev {
    left: 5px !important;
}

.latest-products-next {
    right: 5px !important;
}

.latest-products-arrow i {
    font-size: 11px !important;
}

.latest-products-arrow:hover {
    background: var(--lp-new-burgundy) !important;
    border-color: var(--lp-new-burgundy) !important;
    color: #fff !important;
    transform: translateY(-50%) scale(1.06) !important;
}

/* -------------------------------------------------------------------------
   DOTS + VIEW ALL
   ------------------------------------------------------------------------- */

.latest-products-dots {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    margin: 4px 0 25px !important;
}

.latest-product-dot {
    width: 7px !important;
    height: 7px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: rgba(101, 21, 31, 0.20) !important;
    cursor: pointer !important;
    transition: .25s ease !important;
}

.latest-product-dot.is-active {
    width: 24px !important;
    border-radius: 99px !important;
    background: var(--lp-new-gold) !important;
}

.latest-products-view-all {
    text-align: center !important;
}

.latest-products-view-all a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    min-width: 220px !important;
    padding: 12px 22px !important;

    border: 1px solid var(--lp-new-burgundy) !important;
    border-radius: 999px !important;

    background: transparent !important;
    color: var(--lp-new-burgundy) !important;

    font-family: "Montserrat", sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-decoration: none !important;
    text-transform: uppercase !important;

    transition: .3s ease !important;
}

.latest-products-view-all a i {
    color: var(--lp-new-gold) !important;
    font-size: 9px !important;
}

.latest-products-view-all a:hover {
    background: var(--lp-new-burgundy) !important;
    color: #fff !important;
    transform: translateY(-2px) !important;
}

.latest-products-view-all a:hover i {
    color: var(--lp-new-gold-light) !important;
}

/* -------------------------------------------------------------------------
   TABLET
   ------------------------------------------------------------------------- */

@media (max-width: 1200px) {
    .latest-products-container {
        width: calc(100% - 48px) !important;
    }

    .latest-product-card {
        flex: 0 0 calc((100% - 48px) / 3) !important;
        width: calc((100% - 48px) / 3) !important;
    }

    .latest-product-image {
        height: 245px !important;
    }
}

@media (max-width: 900px) {
    .latest-products-section {
        padding: 64px 0 58px !important;
    }

    .latest-products-container {
        width: calc(100% - 36px) !important;
    }

    .latest-products-viewport {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }

    .latest-product-card {
        flex: 0 0 calc((100% - 24px) / 2) !important;
        width: calc((100% - 24px) / 2) !important;
    }

    .latest-product-image {
        height: 235px !important;
    }
}

/* -------------------------------------------------------------------------
   MOBILE — single prominent card, like the reference screenshot
   ------------------------------------------------------------------------- */

@media (max-width: 767px) {
    .latest-products-section {
        padding: 54px 0 48px !important;
    }

    .latest-products-container {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 15px !important;
        box-sizing: border-box !important;
    }

    .latest-products-heading {
        margin-bottom: 25px !important;
    }

    .latest-products-eyebrow {
        font-size: 8px !important;
        letter-spacing: 2.4px !important;
    }

    .latest-products-title-row {
        gap: 8px !important;
    }

    .latest-products-title-row .latest-title-line {
        width: 28px !important;
    }

    .latest-products-heading h2 {
        font-size: 34px !important;
    }

    .latest-products-heading p {
        margin-top: 10px !important;
        font-size: 8px !important;
        letter-spacing: 1.2px !important;
    }

    .latest-products-viewport {
        width: 100% !important;
        padding: 8px 28px 35px !important;
        overflow: hidden !important;
    }

    .latest-products-track {
        gap: 14px !important;
    }

    .latest-product-card {
        flex: 0 0 calc(100vw - 86px) !important;
        width: calc(100vw - 86px) !important;
        max-width: 330px !important;
        border-radius: 24px !important;
    }

    .latest-product-image {
        height: 250px !important;
        border-radius: 23px 23px 0 0 !important;
    }

    .latest-product-image img {
        padding: 20px !important;
    }

    .latest-product-top {
        top: 12px !important;
        left: 12px !important;
        right: 12px !important;
    }

    .latest-product-wishlist {
        width: 36px !important;
        height: 36px !important;
    }

    .latest-product-info {
        padding: 17px 17px 18px !important;
    }

    .latest-product-info h3,
    .latest-product-card.is-active .latest-product-info h3 {
        font-size: 22px !important;
    }

    .latest-product-info p {
        font-size: 9px !important;
    }

    .latest-product-price,
    .latest-product-card.is-active .latest-product-price {
        font-size: 16px !important;
    }

    .latest-product-cart {
        min-height: 41px !important;
        font-size: 8px !important;
    }

    .latest-products-arrow {
        width: 34px !important;
        height: 34px !important;
    }

    .latest-products-prev {
        left: 1px !important;
    }

    .latest-products-next {
        right: 1px !important;
    }
}

@media (max-width: 480px) {
    .latest-products-container {
        padding: 0 10px !important;
    }

    .latest-products-viewport {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .latest-product-card {
        flex-basis: calc(100vw - 58px) !important;
        width: calc(100vw - 58px) !important;
        max-width: 350px !important;
    }

    .latest-product-image {
        height: 245px !important;
    }

    .latest-products-heading h2 {
        font-size: 31px !important;
    }

    .latest-products-view-all a {
        min-width: 195px !important;
    }
}

@media (max-width: 360px) {
    .latest-products-viewport {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .latest-product-card {
        flex-basis: calc(100vw - 40px) !important;
        width: calc(100vw - 40px) !important;
    }

    .latest-product-image {
        height: 225px !important;
    }

    .latest-product-info {
        padding: 15px !important;
    }

    .latest-product-info h3,
    .latest-product-card.is-active .latest-product-info h3 {
        font-size: 20px !important;
    }
}


/* =========================================================
   GOLD BLISS — "WHERE JEWELLERY SPEAKS FIRST"
   BURGUNDY BACKGROUND + GOLD TEXT OVERRIDE
   ========================================================= */

.jewel-story-section {
    background:
        linear-gradient(
            135deg,
            #4c0e16 0%,
            #65151f 50%,
            #7b202b 100%
        ) !important;
}

/* Top decorative line */
.jewel-story-top-line span {
    background:
        linear-gradient(90deg, transparent, #d7b06b) !important;
}
.jewel-story-top-line span:last-child {
    background:
        linear-gradient(90deg, #d7b06b, transparent) !important;
}
.jewel-story-top-line i {
    border-color: rgba(215, 176, 107, .55) !important;
    color: #efd39b !important;
    background: rgba(255, 250, 245, .06) !important;
}

/* Eyebrow */
.jewel-story-eyebrow {
    color: #d7b06b !important;
}

/* Main heading */
.jewel-story-content h2 {
    color: #f8f2e9 !important;
}
.jewel-story-content h2 em {
    color: #efd39b !important;
}

/* Description */
.jewel-story-description {
    color: #d9c6bb !important;
}

/* Feature icons */
.jewel-story-point-icon {
    border-color: rgba(215, 176, 107, .45) !important;
    color: #efd39b !important;
    background: rgba(255, 250, 245, .08) !important;
}
.jewel-story-point:hover .jewel-story-point-icon {
    background: #d7b06b !important;
    color: #4c0e16 !important;
}

/* Feature text */
.jewel-story-point strong {
    color: #f8f2e9 !important;
}
.jewel-story-point small {
    color: #cbb6a9 !important;
}

/* CTA button */
.jewel-story-button {
    background: #d7b06b !important;
    border-color: #d7b06b !important;
    color: #4c0e16 !important;
}
.jewel-story-button:hover {
    background: transparent !important;
    color: #efd39b !important;
    border-color: #efd39b !important;
}

/* Arches */
.jewel-arch {
    border-color: rgba(215, 176, 107, .45) !important;
    background: #7b202b !important;
}
.jewel-arch-number {
    background: rgba(255, 250, 245, .92) !important;
    border-color: rgba(215, 176, 107, .5) !important;
    color: #65151f !important;
}
.jewel-arch-label span {
    color: #f8f2e9 !important;
}

/* =========================================================
   FINAL FIX — LARGE LAPTOP / BIG DESKTOP
   Same card width/alignment as normal laptop
   Increased card height
   NO IMAGE CROP
   DO NOT CHANGE WIDTH / DESIGN / MOBILE
========================================================= */

@media (min-width: 1401px) {

    /* Same section width as normal laptop */
    .home-categories__container {
        width: 1240px !important;
        max-width: 1240px !important;
        margin: 0 auto !important;
    }

    /* EXACT same card width as normal laptop */
    .home-category-slide {
        flex: 0 0 260px !important;
        width: 260px !important;
        max-width: 260px !important;
        min-width: 260px !important;
        box-sizing: border-box !important;
    }

    /* Keep card width/design exactly the same */
    .home-category-card {
        width: 103% !important;
        box-sizing: border-box !important;
    }

    /* =====================================================
       BIG LAPTOP CARD HEIGHT
       Image area increased to 300px
    ===================================================== */

    .home-category-image {
        width: 100% !important;
        height: 300px !important;
        box-sizing: border-box !important;

        /* Prevent image area from cropping */
        overflow: hidden !important;
    }

    .home-category-image__inner {
        width: 100% !important;
        height: 100% !important;
        box-sizing: border-box !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        overflow: hidden !important;
    }

    /* =====================================================
       IMPORTANT — SHOW FULL IMAGE
       Do NOT crop top / bottom
    ===================================================== */

    .home-category-image img {
        width: 100% !important;
        height: 100% !important;

        object-fit: contain !important;
        object-position: center center !important;

        display: block !important;
    }

    /* Keep information section design */
    .home-category-info {
        width: calc(100% + 24px) !important;
        margin: 12px -12px 0 !important;
        min-height: 72px !important;
        padding: 12px 8px 11px !important;
        box-sizing: border-box !important;
    }
}


/* =========================================================
   FINAL FIX — CONSISTENT SECTION CONTENT WIDTH
   Keeps every major homepage section aligned to one
   common content width without changing colors/design.
========================================================= */

:root {
    --gb-page-max-width: 1280px;
    --gb-page-side-gap: 40px;
}

/* ---------- COMMON DESKTOP CONTENT WIDTH ---------- */
@media (min-width: 1101px) {

    .jewellery-features__container,
    .home-categories__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container,
    .gb-promo-section__container {
        width: min(
            var(--gb-page-max-width),
            calc(100% - 2 * var(--gb-page-side-gap))
        ) !important;

        max-width: var(--gb-page-max-width) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }
}

/* ---------- TABLET ---------- */
@media (min-width: 768px) and (max-width: 1100px) {

    .jewellery-features__container,
    .home-categories__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container,
    .gb-promo-section__container {
        width: calc(100% - 50px) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }
}

/* ---------- MOBILE ---------- */
@media (max-width: 767px) {

    .jewellery-features__container,
    .home-categories__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container,
    .gb-promo-section__container {
        width: calc(100% - 32px) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }
}

/* ---------- SMALL MOBILE ---------- */
@media (max-width: 430px) {

    .jewellery-features__container,
    .home-categories__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container,
    .gb-promo-section__container {
        width: calc(100% - 24px) !important;
    }
}

/* =========================================================================
   GOLD BLISS — HOME PAGE CSS (CLEAN / FINAL)
   Only classes that exist in the current index.php HTML.
   Sections: Base | Hero + Header | Categories | Promo | Latest Products |
             Shop by Budget | Jewellery Story | Collections + Video Modal
   NOTE: the image path 'img/sandal-bg.png' is written for CSS placed INLINE
   in the page <style>. If you move this to css/home.css, change it to
   '../img/sandal-bg.png'.
   ========================================================================= */

:root {
    --gb-burgundy: #65151f;
    --gb-burgundy-dark: #4c0e16;
    --gb-burgundy-soft: #7b202b;
    --gb-ivory: #f8f2e9;
    --gb-gold: #d7b06b;
    --gb-gold-light: #efd39b;

    --gb-page-max-width: 1280px;
    --gb-page-side-gap: 40px;

    --lpc-maroon-top: #7a1c2b;
    --lpc-maroon-bottom: #4a0e18;
    --lpc-gold: #e9c87c;
    --lpc-cream: #faf2e4;
    --lpc-muted: #cdb7a8;
}


/* =========================================================================
   BASE
   ========================================================================= */

html {
    scroll-behavior: smooth;
}

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

body {
    animation: pageFadeIn 0.8s ease both;
}

@keyframes pageFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

a {
    text-decoration: none !important;
    transition: color 0.3s ease, opacity 0.3s ease;
}

ul {
    padding-left: 0;
}

/* Common content width for all homepage sections */
.home-categories__container,
.gb-promo-section__container,
.latest-products-container,
.shop-budget__container,
.jewel-story-container,
.collections-container {
    width: min(var(--gb-page-max-width), calc(100% - 2 * var(--gb-page-side-gap)));
    max-width: var(--gb-page-max-width);
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

@media (min-width: 768px) and (max-width: 1100px) {
    .home-categories__container,
    .gb-promo-section__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container {
        width: calc(100% - 50px);
        max-width: none;
    }
}

@media (max-width: 767px) {
    .home-categories__container,
    .gb-promo-section__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container {
        width: calc(100% - 32px);
        max-width: none;
    }
}

@media (max-width: 430px) {
    .home-categories__container,
    .gb-promo-section__container,
    .latest-products-container,
    .shop-budget__container,
    .jewel-story-container,
    .collections-container {
        width: calc(100% - 24px);
    }
}


/* =========================================================================
   HERO + HEADER
   ========================================================================= */

.gb-hero {
    position: relative;
    width: 100%;
    height: clamp(640px, 34vw, 800px);
    min-height: 640px;
    overflow: hidden;
    isolation: isolate;
    background: var(--gb-burgundy-dark);
    font-family: "Montserrat", sans-serif;
}

.gb-hero__slides,
.gb-hero__slide,
.gb-hero__overlay {
    position: absolute;
    inset: 0;
}

.gb-hero__slides {
    z-index: 0;
}

.gb-hero__slide {
    background-size: cover;
    background-position: right center;
    background-repeat: no-repeat;
    opacity: 0;
    transform: scale(1.045);
    transition: opacity 1.05s ease, transform 6s cubic-bezier(.2, .7, .2, 1);
}

.gb-hero__slide.is-active {
    opacity: 1;
    transform: scale(1);
}

.gb-hero__overlay {
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(90deg,
            rgba(62, 7, 14, .82) 0%,
            rgba(78, 11, 19, .58) 30%,
            rgba(75, 11, 18, .25) 58%,
            rgba(42, 5, 10, .18) 100%),
        linear-gradient(180deg,
            rgba(31, 4, 8, .30) 0%,
            rgba(31, 4, 8, .08) 55%,
            rgba(31, 4, 8, .48) 100%);
}

.gb-hero__empty {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 14px;
}

/* ---------- glass shell ---------- */

.gb-hero__shell {
    position: relative;
    z-index: 5;
    width: min(1260px, calc(100% - 14vw));
    height: calc(100% - 105px);
    min-height: 520px;
    margin: 52px auto;
    border: 1px solid rgba(255, 244, 231, .28);
    border-radius: 24px;
    background: rgba(83, 16, 24, .20);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 20px 70px rgba(30, 0, 4, .16);
}

.gb-hero__shell::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(135deg,
        rgba(255, 255, 255, .09),
        transparent 28%,
        transparent 72%,
        rgba(255, 255, 255, .035));
}

/* ---------- header ---------- */

.gb-header {
    position: relative;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 28px;
    min-height: 96px;
    padding: 20px 28px 14px 30px;
}

.gb-header__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 88px;
    height: 62px;
    padding: 5px 8px;
    box-sizing: border-box;
    border: 1px solid rgba(215, 176, 107, .48);
    border-radius: 14px;
    background: rgba(255, 250, 245, .94);
    box-shadow:
        0 8px 22px rgba(30, 0, 4, .18),
        inset 0 1px 0 rgba(255, 255, 255, .72);
    transition: transform 0.45s cubic-bezier(.22, 1, .36, 1);
}

.gb-header__logo:hover {
    transform: scale(1.025);
}

.gb-header__logo img {
    display: block;
    width: 100%;
    max-width: 78px;
    height: 52px;
    object-fit: contain;
}

.gb-header__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 50px;
    margin-left: auto;
    padding: 4px 7px;
    border-radius: 999px;
    background: rgba(255, 250, 245, .96);
    box-shadow: 0 10px 30px rgba(34, 3, 8, .13);
}

.gb-header__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 0 21px;
    border-radius: 999px;
    color: #332124 !important;
    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .1px;
    white-space: nowrap;
    transition: background .25s ease, color .25s ease;
}

.gb-header__link:hover,
.gb-header__link.is-active {
    color: #fff !important;
    background: var(--gb-burgundy);
}

.gb-header__link i {
    font-size: 8px;
    margin-top: 1px;
}

/* ---------- category dropdown ---------- */

.gb-header__dropdown {
    position: relative;
}

/* hover bridge so the menu stays open */
.gb-header__dropdown::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 14px;
    background: transparent;
    z-index: 999;
}

.gb-header__dropdown-menu {
    position: absolute;
    top: calc(100% + 13px);
    left: 50%;
    z-index: 1000;
    width: min(610px, 75vw);
    padding: 18px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, 8px);
    border: 1px solid rgba(215, 176, 107, .28);
    border-radius: 18px;
    background: rgba(255, 250, 245, .98);
    box-shadow: 0 24px 60px rgba(43, 7, 13, .24);
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
}

.gb-header__dropdown:hover .gb-header__dropdown-menu,
.gb-header__dropdown:focus-within .gb-header__dropdown-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, 0);
}

.gb-header__category-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.gb-header__category {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-radius: 12px;
    color: #392528 !important;
    transition: transform .4s cubic-bezier(.22, 1, .36, 1), background .3s ease, box-shadow .3s ease;
}

.gb-header__category:hover {
    background: #f6ece5;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(80, 45, 20, .08);
}

.gb-header__category img {
    width: 72px;
    height: 55px;
    border-radius: 10px;
    object-fit: cover;
}

.gb-header__category span,
.gb-header__view-more {
    font-size: 10px;
    font-weight: 600;
    text-align: center;
}

.gb-header__view-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: var(--gb-burgundy) !important;
}

/* ---------- header actions (inside nav pill) ---------- */

.gb-header__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: 6px;
}

.gb-header__icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(215, 176, 107, .42);
    border-radius: 50%;
    background: rgba(255, 250, 245, .94);
    color: var(--gb-burgundy) !important;
    cursor: pointer;
    transition: transform .3s ease, background .25s ease, border-color .25s ease, color .25s ease;
}

.gb-header__icon:hover {
    background: var(--gb-gold-light);
    border-color: var(--gb-gold-light);
    color: var(--gb-burgundy-dark) !important;
    transform: translateY(-1px);
}

.gb-header__icon i {
    font-size: 13px;
}

.gb-header__cart span {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--gb-gold);
    color: var(--gb-burgundy-dark);
    font-size: 8px;
    font-weight: 800;
    line-height: 16px;
    text-align: center;
}

.gb-header__rate,
.gb-header__user {
    position: relative;
}

.gb-header__rate-popup,
.gb-header__user-menu {
    position: absolute;
    top: calc(100% + 13px);
    right: 0;
    z-index: 50;
    width: 190px;
    padding: 15px;
    border: 1px solid rgba(215, 176, 107, .30);
    border-radius: 15px;
    background: rgba(255, 250, 245, .98);
    color: #332124;
    box-shadow: 0 22px 50px rgba(43, 7, 13, .25);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(7px);
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
}

.gb-header__rate.is-open .gb-header__rate-popup,
.gb-header__user.is-open .gb-header__user-menu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.gb-header__rate-title {
    margin-bottom: 11px;
    color: var(--gb-burgundy);
    font-family: "Cormorant Garamond", serif;
    font-size: 19px;
    font-weight: 700;
}

.gb-header__rate-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 10px;
}

.gb-header__rate-row strong {
    color: var(--gb-burgundy);
}

.gb-header__rate-divider {
    height: 1px;
    margin: 10px 0;
    background: rgba(101, 21, 31, .12);
}

.gb-header__rate-empty {
    font-size: 10px;
    color: #806d6d;
}

.gb-header__user-menu {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.gb-header__user-menu strong {
    display: block;
    margin-bottom: 6px;
    padding-bottom: 9px;
    border-bottom: 1px solid rgba(101, 21, 31, .10);
    font-size: 11px;
    color: var(--gb-burgundy);
}

.gb-header__user-menu a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 7px;
    border-radius: 8px;
    color: #332124 !important;
    font-size: 10px;
}

.gb-header__user-menu a:hover {
    background: #f6ece5;
    color: var(--gb-burgundy) !important;
}

.gb-header__user-menu i {
    width: 13px;
}

/* ---------- mobile toggle + menu ---------- */

.gb-header__mobile-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    margin-left: auto;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .30);
    border-radius: 50%;
    background: rgba(49, 5, 11, .28);
    cursor: pointer;
}

.gb-header__mobile-toggle span {
    display: block;
    width: 16px;
    height: 1px;
    margin: 0 auto;
    background: #fff;
    transition: .25s ease;
}

.gb-header__mobile-toggle.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.gb-header__mobile-toggle.is-open span:nth-child(2) { opacity: 0; }
.gb-header__mobile-toggle.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.gb-mobile-menu {
    display: none;
}

/* ---------- hero content ---------- */

.gb-hero__content {
    position: absolute;
    z-index: 10;
    left: 32px;
    bottom: 64px;
    width: min(570px, 48%);
    color: #fff;
}

.gb-hero__eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 15px;
}

.gb-hero__eyebrow span {
    width: 28px;
    height: 1px;
    background: var(--gb-gold-light);
}

.gb-hero__eyebrow small {
    color: var(--gb-gold-light);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.gb-hero__content h1 {
    max-width: 650px;
    margin: 0 0 15px;
    color: #fff;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(46px, 5.5vw, 78px);
    font-weight: 600;
    line-height: .90;
    letter-spacing: -1.4px;
    text-shadow: 0 5px 25px rgba(28, 0, 5, .25);
}

.gb-hero__title-gold {
    color: var(--gb-gold-light);
    font-style: italic;
}

.gb-hero__content p {
    max-width: 455px;
    margin: 0 0 25px;
    color: rgba(255, 247, 239, .86);
    font-size: 12px;
    font-weight: 400;
    line-height: 1.75;
}

.gb-hero__button {
    display: inline-flex;
    align-items: center;
    gap: 22px;
    min-height: 44px;
    padding: 0 18px 0 21px;
    border-radius: 999px;
    background: var(--gb-ivory);
    color: #3d2929 !important;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .7px;
    transition: .3s ease;
}

.gb-hero__button i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--gb-burgundy);
    color: #fff;
    font-size: 9px;
    transition: .3s ease;
}

.gb-hero__button:hover {
    background: #fff;
    color: var(--gb-burgundy) !important;
    transform: translateY(-2px);
}

.gb-hero__button:hover i {
    transform: translateX(3px);
}

/* ---------- side arrows ---------- */

.gb-hero__nav-arrow {
    position: absolute;
    top: 50%;
    z-index: 15;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-top: -22px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .40);
    border-radius: 50%;
    background: rgba(54, 6, 13, .38);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    transition: background .25s ease, border-color .25s ease, color .25s ease;
}

.gb-hero__nav-arrow i {
    font-size: 11px;
}

.gb-hero__nav-arrow--prev { left: -22px; }
.gb-hero__nav-arrow--next { right: -22px; }

.gb-hero__nav-arrow:hover {
    background: var(--gb-gold);
    border-color: var(--gb-gold-light);
    color: var(--gb-burgundy-dark);
}

/* ---------- bottom-right feature card ---------- */

.gb-hero__feature {
    position: absolute;
    z-index: 12;
    right: 32px;
    bottom: 40px;
    display: flex;
    align-items: center;
    gap: 14px;
    width: 280px;
    padding: 10px;
    border: 1px solid rgba(255, 244, 231, .35);
    border-radius: 18px;
    background: rgba(255, 250, 245, .14);
    box-shadow: 0 16px 40px rgba(30, 0, 4, .22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.gb-hero__feature-image {
    flex: 0 0 84px;
    width: 84px;
    height: 84px;
    overflow: hidden;
    border-radius: 12px;
    background: rgba(255, 255, 255, .12);
}

.gb-hero__feature-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gb-hero__feature-text {
    min-width: 0;
}

.gb-hero__feature-text h4 {
    margin: 0 0 8px;
    color: #fff;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.1;
}

.gb-hero__feature-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gb-gold-light) !important;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.gb-hero__feature-link i {
    font-size: 8px;
    transition: transform .3s ease;
}

.gb-hero__feature-link:hover i {
    transform: translateX(4px);
}

/* ---------- hero: tablet ---------- */

@media (max-width: 1100px) {

    .gb-hero__shell {
        width: calc(100% - 34px);
        margin: 17px auto;
        height: calc(100% - 34px);
    }

    .gb-header {
        gap: 14px;
        padding: 16px 18px;
    }

    .gb-header__link {
        padding: 0 14px;
        font-size: 14px;
    }

    .gb-hero__content {
        left: 26px;
        bottom: 56px;
        width: min(520px, 54%);
    }

    .gb-hero__nav-arrow--prev { left: -8px; }
    .gb-hero__nav-arrow--next { right: -8px; }

    .gb-hero__feature {
        right: 26px;
        bottom: 34px;
        width: 235px;
    }

    .gb-hero__feature-image {
        flex-basis: 70px;
        width: 70px;
        height: 70px;
    }

    .gb-hero__feature-text h4 {
        font-size: 16px;
    }
}

/* ---------- hero: mobile ---------- */

@media (max-width: 820px) {

    .gb-hero {
        height: auto;
        min-height: 720px;
    }

    .gb-hero__overlay {
        background: linear-gradient(180deg,
            rgba(55, 7, 14, .60) 0%,
            rgba(66, 8, 15, .48) 35%,
            rgba(48, 5, 11, .78) 100%);
    }

    .gb-hero__shell {
        width: calc(100% - 22px);
        height: auto;
        min-height: 696px;
        margin: 11px auto;
        border-radius: 18px;
    }

    .gb-header {
        min-height: 76px;
        padding: 12px 13px;
    }

    .gb-header__nav {
        display: none;
    }

    .gb-header__mobile-toggle {
        display: flex;
    }

    .gb-mobile-menu {
        position: absolute;
        top: 76px;
        left: 13px;
        right: 13px;
        z-index: 30;
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 10px;
        border: 1px solid rgba(255, 255, 255, .20);
        border-radius: 15px;
        background: rgba(66, 10, 17, .94);
        box-shadow: 0 22px 45px rgba(31, 0, 4, .30);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-8px);
        transition: .25s ease;
    }

    .gb-mobile-menu.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }

    .gb-mobile-menu a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 43px;
        padding: 0 13px;
        border-radius: 9px;
        color: #fff !important;
        font-size: 11px;
    }

    .gb-mobile-menu a:hover {
        background: rgba(255, 255, 255, .08);
    }

    .gb-hero__content {
        left: 22px;
        right: 22px;
        bottom: 96px;
        width: auto;
        max-width: none;
    }

    .gb-hero__content h1 {
        max-width: 90%;
        font-size: clamp(42px, 12vw, 62px);
    }

    .gb-hero__content p {
        max-width: 92%;
        font-size: 11px;
    }

    .gb-hero__feature {
        display: none;
    }

    /* arrows move to the bottom-right corner */
    .gb-hero__nav-arrow {
        top: auto;
        bottom: 24px;
        margin-top: 0;
        width: 38px;
        height: 38px;
    }

    .gb-hero__nav-arrow--prev { left: auto; right: 66px; }
    .gb-hero__nav-arrow--next { right: 22px; }
}

@media (max-width: 480px) {

    .gb-hero {
        min-height: 670px;
    }

    .gb-hero__shell {
        min-height: 646px;
    }

    .gb-header {
        padding: 10px 11px;
    }

    .gb-hero__content {
        left: 19px;
        right: 19px;
        bottom: 90px;
    }

    .gb-hero__eyebrow {
        margin-bottom: 11px;
    }

    .gb-hero__eyebrow small {
        font-size: 8px;
        letter-spacing: 2.1px;
    }

    .gb-hero__content h1 {
        max-width: 100%;
        margin-bottom: 12px;
        font-size: 43px;
        line-height: .93;
        letter-spacing: -.8px;
    }

    .gb-hero__content p {
        max-width: 100%;
        margin-bottom: 18px;
        font-size: 10px;
        line-height: 1.65;
    }

    .gb-hero__button {
        min-height: 40px;
        padding-left: 17px;
        gap: 15px;
        font-size: 8px;
    }

    .gb-hero__button i {
        width: 27px;
        height: 27px;
    }

    .gb-hero__nav-arrow--next { right: 19px; }
    .gb-hero__nav-arrow--prev { right: 63px; }
}


/* =========================================================================
   SHOP BY CATEGORY — "EXPLORE OUR COLLECTIONS"
   Card size is controlled by --cat-w (arch radius + height follow it).
   ========================================================================= */

.home-categories {
    width: 100%;
    padding: 80px 0 70px;
    overflow: hidden;
    background: linear-gradient(180deg, #faede0 0%, #FDF0E4 50%, #FFF9F3 100%);
}

.home-categories__heading {
    text-align: center;
    margin-bottom: 55px;
}

.home-categories__heading h2 {
    margin: 0;
    color: #3D3028;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(42px, 4vw, 60px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -1px;
}

.home-categories__heading-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 18px auto 0;
}

.home-categories__heading-line span {
    width: 62px;
    height: 1px;
    background: #D5A06B;
}

.home-categories__heading-line b {
    color: #f4d1ae;
    font-size: 13px;
    font-weight: 400;
}

.home-category-carousel {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

.home-category-viewport {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 15px 5px 5px;
    box-sizing: border-box;
}

.home-category-track {
    display: flex;
    gap: 30px;
    width: max-content;
    will-change: transform;
    transition: transform 0.85s cubic-bezier(.22, .61, .36, 1);
}

.home-category-empty {
    padding: 30px 0;
    color: #806F63;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
}

.home-category-slide {
    --cat-w: 310px;
    flex: 0 0 var(--cat-w);
    width: var(--cat-w);
    max-width: var(--cat-w);
    min-width: 0;
}

.home-category-card {
    display: block;
    width: 100%;
    text-align: center;
    color: inherit;
    transition: transform 0.45s ease;
}

.home-category-card:hover {
    color: inherit;
    transform: translateY(-8px);
}

.home-category-image {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1.35;
    padding: 4px;
    box-sizing: border-box;
    overflow: hidden;
    background: #9c3f00;
    border-radius: calc(var(--cat-w) / 2) calc(var(--cat-w) / 2) 16px 16px;
    box-shadow: 0 18px 40px rgba(183, 119, 62, 0.11);
    transition: transform 0.45s ease, box-shadow 0.45s ease;
}

.home-category-image__inner {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: linear-gradient(145deg, #F8DEC8, #FFF8F0);
    border-radius: calc(var(--cat-w) / 2 - 4px) calc(var(--cat-w) / 2 - 4px) 10px 10px;
}

.home-category-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
    transition: transform 0.7s cubic-bezier(.22, .61, .36, 1);
}

/* thin gold inner border */
.home-category-image::after {
    content: "";
    position: absolute;
    inset: 9px;
    z-index: 2;
    pointer-events: none;
    border: 1px solid rgba(194, 139, 79, 0.30);
    border-radius: calc(var(--cat-w) / 2 - 9px) calc(var(--cat-w) / 2 - 9px) 11px 11px;
}

.home-category-card:hover .home-category-image {
    transform: translateY(-6px);
    box-shadow: 0 25px 50px rgba(183, 119, 62, 0.17);
}

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

.home-category-info {
    padding-top: 20px;
    text-align: center;
}

.home-category-info h3 {
    margin: 0 0 8px;
    color: #3D3028;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 28px;
    font-weight: 600;
    line-height: 1.15;
    text-transform: capitalize;
}

.home-category-info span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #B9783E;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    transition: color 0.3s ease;
}

.home-category-info span i {
    font-size: 10px;
    transition: transform 0.3s ease;
}

.home-category-card:hover .home-category-info span {
    color: #965A2B;
}

.home-category-card:hover .home-category-info span i {
    transform: translateX(5px);
}

/* scroll indicator dots */
.home-category-scroll-indicator {
    position: relative;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 8px;
    margin-top: 24px;
}

.home-category-scroll-dot {
    width: 7px;
    height: 7px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #e7d1cc;
    box-shadow: 0 1px 4px rgba(116, 65, 45, 0.08);
    cursor: pointer;
    transition: width 0.35s ease, background 0.35s ease, border-radius 0.35s ease, box-shadow 0.35s ease, transform 0.35s ease;
}

.home-category-scroll-dot:hover {
    transform: scale(1.15);
    background: #d8b3ad;
}

.home-category-scroll-dot.is-active {
    width: 26px;
    border-radius: 999px;
    background: linear-gradient(90deg, #c9974f, #dcae63);
    box-shadow: 0 3px 10px rgba(184, 134, 62, 0.18);
}

/* categories: responsive */

@media (min-width: 1600px) {
    .home-category-slide { --cat-w: 320px; }
    .home-category-info h3 { font-size: 30px; }
}

@media (min-width: 1101px) and (max-width: 1400px) {
    .home-category-slide { --cat-w: 260px; }
}

@media (max-width: 1100px) {
    .home-categories { padding: 70px 0 60px; }
    .home-categories__heading { margin-bottom: 45px; }
    .home-category-track { gap: 24px; }
    .home-category-slide { --cat-w: 230px; }
    .home-category-info h3 { font-size: 24px; }
}

@media (max-width: 767px) {
    .home-categories { padding: 50px 0 45px; }
    .home-categories__heading { margin-bottom: 32px; }
    .home-categories__heading h2 { font-size: 30px; }
    .home-categories__heading-line span { width: 45px; }
    .home-category-viewport { padding: 12px 8px 20px; }
    .home-category-track { gap: 14px; }
    .home-category-slide { --cat-w: min(280px, calc(100vw - 90px)); }
    .home-category-info { padding-top: 16px; }
    .home-category-info h3 { font-size: 21px; }
    .home-category-info span { font-size: 8px; letter-spacing: 1.8px; }
    .home-category-scroll-indicator { gap: 5px; margin-top: 8px; }
    .home-category-scroll-dot { width: 6px; height: 6px; }
    .home-category-scroll-dot.is-active { width: 22px; }
}

@media (max-width: 480px) {
    .home-categories__heading h2 { font-size: 27px; }
    .home-category-track { gap: 12px; }
    .home-category-info h3 { font-size: 19px; }
}


/* =========================================================================
   PROMO BANNERS
   ========================================================================= */

.gb-promo-section {
    width: 100%;
    padding: 85px 0;
    background: #ffffff;
}

.gb-promo-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.gb-promo-card {
    position: relative;
    min-height: 290px;
    overflow: hidden;
    isolation: isolate;
    background: #4b1020;
    border: 1px solid rgba(196, 155, 77, 0.35);
    box-shadow: 0 12px 35px rgba(74, 16, 32, 0.10);
}

.gb-promo-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg,
        rgba(55, 7, 20, 0.94) 0%,
        rgba(76, 14, 31, 0.72) 34%,
        rgba(76, 14, 31, 0.18) 72%,
        rgba(76, 14, 31, 0.02) 100%);
}

.gb-promo-card--right::before {
    background: linear-gradient(270deg,
        rgba(55, 7, 20, 0.94) 0%,
        rgba(76, 14, 31, 0.72) 34%,
        rgba(76, 14, 31, 0.18) 72%,
        rgba(76, 14, 31, 0.02) 100%);
}

.gb-promo-card__image {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform .7s ease;
}

.gb-promo-card:hover .gb-promo-card__image {
    transform: scale(1.035);
}

.gb-promo-card--left .gb-promo-card__content,
.gb-promo-card--right .gb-promo-card__content {
    position: relative;
    z-index: 2;
    width: 70%;
    min-height: 290px;
    padding: 38px 25px 38px 46px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    text-align: left;
}

.gb-promo-card__eyebrow {
    margin: 0 0 10px;
    color: #e4c47a;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.7px;
    line-height: 1.2;
    text-transform: uppercase;
}

.gb-promo-card__title {
    margin: 0;
    color: #f8e6b2;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(32px, 3vw, 46px);
    font-weight: 600;
    line-height: .95;
    letter-spacing: .1px;
    white-space: nowrap;
}

.gb-promo-card__text {
    margin: 13px 0 21px;
    max-width: 275px;
    color: rgba(255, 246, 222, .92);
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.7;
}

.gb-promo-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 35px;
    padding: 8px 16px;
    color: #4a0e20 !important;
    background: linear-gradient(135deg, #f4d88d, #c99a4c);
    border: 1px solid #e4c47a;
    font-family: "Montserrat", sans-serif;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.35px;
    text-transform: uppercase;
    transition: all .3s ease;
}

.gb-promo-card__button:hover {
    color: #fff8e8 !important;
    background: #6d1830;
    border-color: #e4c47a;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(201, 154, 76, .18);
}

.gb-promo-card__button i {
    font-size: 8px;
    transition: transform .3s ease;
}

.gb-promo-card__button:hover i {
    transform: translateX(3px);
}

@media (max-width: 900px) {
    .gb-promo-section { padding: 55px 0; }
    .gb-promo-grid { grid-template-columns: 1fr; gap: 16px; }
    .gb-promo-card { min-height: 255px; }

    .gb-promo-card--left .gb-promo-card__content,
    .gb-promo-card--right .gb-promo-card__content {
        min-height: 255px;
        padding: 30px 24px;
    }
}

@media (max-width: 600px) {
    .gb-promo-section { padding: 40px 0; }
    .gb-promo-card { min-height: 220px; }

    .gb-promo-card--left .gb-promo-card__content,
    .gb-promo-card--right .gb-promo-card__content {
        width: 76%;
        min-height: 220px;
        padding: 22px 17px;
    }

    .gb-promo-card__eyebrow { font-size: 7px; letter-spacing: 1.7px; }
    .gb-promo-card__title { font-size: 25px; }
    .gb-promo-card__text { margin: 9px 0 14px; max-width: 205px; font-size: 7px; line-height: 1.55; }
    .gb-promo-card__button { min-height: 29px; padding: 6px 11px; font-size: 6.5px; }
}


/* =========================================================================
   LATEST PRODUCTS — BURGUNDY + GOLD CARD CAROUSEL
   NOTE: .latest-products-track must stay position:static and
   .latest-products-viewport position:relative (JS uses offsetLeft).
   ========================================================================= */

.latest-products-section {
    position: relative;
    width: 100%;
    padding: 0 0 20px;
    overflow: hidden;
    background: radial-gradient(circle at 50% 48%,
        rgba(255, 255, 255, 0.95) 0%,
        rgba(255, 249, 241, 0.90) 45%,
        rgba(247, 224, 198, 0.32) 100%);
}

.latest-products-container {
    position: relative;
}

.latest-products-heading {
    position: relative;
    z-index: 5;
    margin-bottom: 30px;
    text-align: center;
}

.latest-products-eyebrow {
    display: block;
    margin-bottom: 12px;
    color: #bd8233;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 4px;
    text-transform: uppercase;
}

.latest-products-title-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-bottom: 10px;
}

.latest-title-line {
    width: 45px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #bd8233);
}

.latest-title-line:last-child {
    background: linear-gradient(90deg, #bd8233, transparent);
}

.latest-products-title-row i {
    color: #bd8233;
    font-size: 14px;
}

.latest-products-heading h2 {
    margin: 0;
    color: #34271f;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(42px, 4vw, 60px);
    font-weight: 600;
    line-height: 1;
}

.latest-products-heading p {
    margin: 12px 0 0;
    color: #8d7969;
    font-family: "Quicksand", sans-serif;
    font-size: 12px;
    letter-spacing: 1.5px;
}

.latest-products-empty {
    padding: 30px 0;
    text-align: center;
    color: #8d7969;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
}

.latest-products-carousel {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
}

.latest-products-viewport {
    position: relative;
    width: 100%;
    overflow: hidden;
    padding: 30px 0 40px;
    box-sizing: border-box;
}

.latest-products-track {
    display: flex;
    align-items: stretch;
    gap: 24px;
    width: max-content;
    will-change: transform;
    transition: transform 0.75s cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ---------- card ---------- */

.latest-product-card {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 0 0 270px;
    width: 270px;
    min-width: 0;
    padding: 14px 14px 22px;
    box-sizing: border-box;
    overflow: hidden;
    background: linear-gradient(180deg, var(--lpc-maroon-top) 0%, var(--lpc-maroon-bottom) 100%);
    border: 1px solid rgba(233, 200, 124, .35);
    border-radius: 26px;
    box-shadow: 0 18px 40px rgba(40, 4, 10, .28);
    transition: border-color .35s ease, box-shadow .35s ease;
}

.latest-product-card:hover,
.latest-product-card.is-active {
    border-color: rgba(233, 200, 124, .65);
    box-shadow: 0 24px 50px rgba(40, 4, 10, .36);
}

/* ---------- wishlist ---------- */

.latest-product-top {
    position: absolute;
    top: 22px;
    left: 22px;
    right: 22px;
    z-index: 6;
    display: flex;
    justify-content: flex-end;
    pointer-events: none;
}

.latest-product-badge {
    display: none;
}

.latest-product-wishlist {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid var(--lpc-maroon-bottom);
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    color: var(--lpc-maroon-bottom);
    cursor: pointer;
    pointer-events: auto;
    box-shadow: 0 4px 12px rgba(40, 4, 10, .10);
    transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .3s ease, box-shadow .3s ease;
}

.latest-product-wishlist i {
    font-size: 14px;
    color: var(--lpc-maroon-bottom);
    transition: color .3s ease, transform .3s ease;
}

.latest-product-wishlist:hover,
.latest-product-wishlist.is-wishlisted {
    background: var(--lpc-maroon-bottom);
    border-color: var(--lpc-maroon-bottom);
    color: var(--lpc-gold);
    box-shadow: 0 6px 16px rgba(74, 14, 24, .28);
}

.latest-product-wishlist:hover {
    transform: scale(1.06);
}

.latest-product-wishlist:hover i,
.latest-product-wishlist.is-wishlisted i {
    color: var(--lpc-gold);
}

.latest-product-wishlist:hover i {
    transform: scale(1.08);
}

/* ---------- image ---------- */

.latest-product-image-link {
    position: relative;
    z-index: 3;
    display: block;
}

.latest-product-image {
    width: 100%;
    height: 260px;
    overflow: hidden;
    border-radius: 20px;
    background: url('img/sandal-bg.png') center center / cover no-repeat;
}

.latest-product-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    transition: transform .45s ease;
}

.latest-product-card:hover .latest-product-image img {
    transform: scale(1.04);
}

/* ---------- info ---------- */

.latest-product-info {
    position: relative;
    z-index: 4;
    padding: 18px 6px 0;
    text-align: left;
}

.latest-product-info h3 {
    margin: 0 0 2px;
    color: var(--lpc-cream);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.1;
    text-transform: capitalize;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.latest-product-info p {
    margin: 0 0 10px;
    color: var(--lpc-muted);
    font-family: "Montserrat", sans-serif;
    font-size: 12px;
    line-height: 1.4;
}

.latest-product-rating {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 14px;
    color: var(--lpc-cream);
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
}

.latest-star {
    color: var(--lpc-gold);
    font-size: 14px;
}

.latest-product-rating small {
    color: var(--lpc-muted);
    font-size: 8px;
}

.latest-product-bottom {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
}

.latest-product-price {
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(233, 200, 124, .25);
    color: var(--lpc-gold);
    font-family: "Montserrat", sans-serif;
    font-size: 22px;
    font-weight: 700;
    white-space: nowrap;
}

.latest-product-cart-form {
    width: 100%;
    margin: 0;
    padding: 0;
}

.latest-product-cart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    padding: 12px 18px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: linear-gradient(135deg, #f3d79c 0%, #d6a94f 100%);
    color: #4a0e18;
    font-family: "Montserrat", sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .16);
    transition: background .3s ease, border-color .3s ease, color .3s ease, box-shadow .3s ease;
}

.latest-product-cart i,
.latest-product-cart span {
    color: inherit;
    font-size: 12px;
}

.latest-product-cart span {
    font-size: inherit;
}

/* disabled / out of stock */
.latest-product-cart:disabled {
    opacity: .45;
    cursor: not-allowed;
    box-shadow: none;
}

/* same hover look for every card — disabled included (card hover drives it) */
.latest-product-cart:hover,
.latest-product-card:hover .latest-product-cart:disabled {
    opacity: 1;
    background: var(--lpc-maroon-bottom);
    border-color: var(--lpc-gold);
    color: var(--lpc-gold);
    box-shadow: 0 8px 20px rgba(74, 14, 24, .28);
}

/* ---------- arrows ---------- */

.latest-products-arrow {
    position: absolute;
    top: 50%;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(189, 130, 51, 0.25);
    border-radius: 50%;
    background: rgba(255, 253, 249, 0.96);
    color: #65452d;
    cursor: pointer;
    box-shadow: 0 10px 28px rgba(80, 50, 25, 0.12);
    transform: translateY(-50%);
    transition: background .3s ease, color .3s ease, transform .3s ease;
}

.latest-products-arrow:hover {
    background: #bd8233;
    color: #fff;
    transform: translateY(-50%) scale(1.08);
}

.latest-products-arrow:disabled {
    opacity: 0.45;
    cursor: default;
}

.latest-products-prev { left: -22px; }
.latest-products-next { right: -22px; }

/* ---------- dots ---------- */

.latest-products-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 3px;
}

.latest-product-dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 1px solid #bd8233;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    transition: all 0.35s ease;
}

.latest-product-dot:hover {
    transform: scale(1.15);
}

.latest-product-dot.is-active {
    width: 11px;
    height: 11px;
    background: #bd8233;
    box-shadow: 0 0 0 4px rgba(189, 130, 51, 0.10);
}

/* ---------- view all ---------- */

.latest-products-view-all {
    display: flex;
    justify-content: center;
    margin-top: 34px;
}

.latest-products-view-all a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    min-width: 260px;
    padding: 14px 24px;
    border: 1px solid #b9783e;
    border-radius: 4px;
    background: rgba(255, 253, 249, 0.60);
    color: #553a27 !important;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 2.3px;
    transition: all 0.35s ease;
}

.latest-products-view-all a:hover {
    background: #bd8233;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(184, 134, 62, 0.20);
}

/* latest products: responsive */

@media (max-width: 1100px) {
    .latest-product-card { flex-basis: 250px; width: 250px; }
    .latest-product-image { height: 240px; }
    .latest-products-prev { left: -12px; }
    .latest-products-next { right: -12px; }
}

@media (max-width: 767px) {
    .latest-products-section { padding: 0 0 40px; }
    .latest-products-heading { margin-bottom: 18px; }
    .latest-products-heading h2 { font-size: 32px; }
    .latest-products-heading p { font-size: 9px; }
    .latest-products-viewport { padding: 25px 8px 35px; }
    .latest-products-track { gap: 14px; }

    .latest-product-card {
        flex-basis: min(300px, calc(100vw - 120px));
        width: min(300px, calc(100vw - 120px));
        padding: 12px 12px 18px;
        border-radius: 22px;
    }

    .latest-product-image { height: 220px; border-radius: 17px; }
    .latest-product-image img { border-radius: 17px; }
    .latest-product-info h3 { font-size: 21px; }
    .latest-product-price { font-size: 18px; }
    .latest-product-wishlist { width: 32px; height: 32px; }
    .latest-product-wishlist i { font-size: 13px; }
    .latest-product-cart { min-height: 46px; font-size: 10px; }

    .latest-products-arrow { width: 38px; height: 38px; font-size: 10px; }
    .latest-products-prev { left: 2px; }
    .latest-products-next { right: 2px; }

    .latest-products-view-all a { min-width: 220px; padding: 12px 18px; font-size: 8px; }
}

@media (max-width: 480px) {
    .latest-products-heading h2 { font-size: 28px; }
}


/* =========================================================================
   SHOP BY BUDGET
   ========================================================================= */

.shop-budget {
    position: relative;
    width: 100%;
    padding: 72px 0 78px;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 20%, rgba(232, 210, 188, .24), transparent 28%),
        radial-gradient(circle at 92% 78%, rgba(215, 184, 143, .18), transparent 30%),
        #fffaf6;
}

.shop-budget::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    left: -260px;
    bottom: -280px;
    border-radius: 50%;
    border: 1px solid rgba(109, 31, 42, .08);
    box-shadow:
        0 0 0 24px rgba(109, 31, 42, .025),
        0 0 0 48px rgba(201, 161, 90, .025);
    pointer-events: none;
}

.shop-budget::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    right: -230px;
    top: -230px;
    border-radius: 50%;
    border: 1px solid rgba(201, 161, 90, .12);
    pointer-events: none;
}

.shop-budget__container {
    position: relative;
    z-index: 2;
}

.shop-budget__heading {
    text-align: center;
    margin-bottom: 42px;
}

.shop-budget__heading h2 {
    margin: 0;
    color: #3c2924;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(40px, 4vw, 58px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.5px;
}

.shop-budget__heading h2 span {
    color: #6d1f2a;
}

.shop-budget__divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 14px auto 11px;
}

.shop-budget__divider span {
    width: 52px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #c9a15a);
}

.shop-budget__divider span:last-child {
    background: linear-gradient(90deg, #c9a15a, transparent);
}

.shop-budget__divider i {
    color: #c9a15a;
    font-size: 11px;
    transform: rotate(45deg);
}

.shop-budget__heading p {
    margin: 0;
    color: #9b8174;
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 3px;
}

.shop-budget__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px;
    width: 100%;
    max-width: 1100px;
    height: 510px;
    margin: 0 auto;
}

.budget-card {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
    border-radius: 8px;
    color: #fff !important;
    background: #eadfd5;
    box-shadow: 0 10px 28px rgba(66, 39, 27, .08);
    transform: translateZ(0);
    transition: transform .4s ease, box-shadow .4s ease;
}

.budget-card:first-child { grid-column: 1; grid-row: 1 / span 2; }
.budget-card:nth-child(2) { grid-column: 2; grid-row: 1; }
.budget-card:nth-child(3) { grid-column: 2; grid-row: 2; }

.budget-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgba(66, 39, 27, .15);
}

.budget-card__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    isolation: isolate;
    background: transparent;
}

.budget-card__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1);
    transition: transform 1.35s cubic-bezier(.22, .61, .36, 1), filter 1.35s ease;
    will-change: transform, filter;
}

/* dark overlay so the white label stays readable */
.budget-card__image::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg,
        rgba(0, 0, 0, .04) 0%,
        rgba(0, 0, 0, .02) 42%,
        rgba(0, 0, 0, .72) 100%);
    transition: opacity 1.15s ease;
}

/* thin border + shiny light sweep */
.budget-card__image::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    border: 1px solid rgba(255, 255, 255, .20);
    border-radius: inherit;
    background: linear-gradient(115deg,
        transparent 0%,
        transparent 38%,
        rgba(255, 255, 255, 0) 43%,
        rgba(255, 255, 255, .32) 50%,
        rgba(255, 255, 255, 0) 57%,
        transparent 62%,
        transparent 100%);
    background-size: 250% 100%;
    background-position: 120% 0;
    opacity: 0;
    transition: opacity .35s ease, background-position 1.15s ease;
}

.budget-card:hover .budget-card__image img {
    transform: scale(1.12);
    filter: saturate(1.08) contrast(1.04) brightness(1.03);
}

.budget-card:hover .budget-card__image::before {
    opacity: .42;
}

.budget-card:hover .budget-card__image::after {
    opacity: 1;
    background-position: -120% 0;
}

.budget-card__price {
    position: absolute;
    z-index: 4;
    left: 0;
    right: 0;
    bottom: 38px;
    margin: 0;
    padding: 0 22px;
    text-align: center;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity .45s ease, visibility .45s ease, transform .45s ease;
}

.budget-card:hover .budget-card__price {
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
}

.budget-card__price small {
    display: block;
    margin-bottom: 2px;
    color: rgba(255, 255, 255, .9);
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.budget-card__price strong {
    display: block;
    color: #fff;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(29px, 3vw, 42px);
    font-weight: 600;
    line-height: .95;
    letter-spacing: .5px;
    text-shadow: 0 3px 16px rgba(0, 0, 0, .35);
}

/* price is the visual label — caption stays hidden */
.budget-card__caption {
    display: none;
}

@media (max-width: 900px) {
    .shop-budget { padding: 62px 0 65px; }
    .shop-budget__grid { height: 430px; }
    .budget-card__price { bottom: 28px; }
    .budget-card__price strong { font-size: clamp(26px, 4vw, 36px); }
}

@media (max-width: 767px) {
    .shop-budget { padding: 52px 0 55px; }
    .shop-budget__heading { margin-bottom: 28px; }
    .shop-budget__heading h2 { font-size: 38px; }
    .shop-budget__heading p { font-size: 7px; letter-spacing: 2px; }
    .shop-budget__divider { margin: 12px auto 9px; }
    .shop-budget__divider span { width: 38px; }

    .shop-budget__grid {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        height: auto;
    }

    .budget-card:first-child,
    .budget-card:nth-child(2),
    .budget-card:nth-child(3) { grid-column: auto; grid-row: auto; }

    .budget-card { height: 260px; }
    .budget-card:first-child { height: 360px; }
    .budget-card__price { bottom: 24px; padding: 0 15px; }
    .budget-card__price small { font-size: 8px; letter-spacing: 1.5px; }
    .budget-card__price strong { font-size: 31px; }
}

@media (max-width: 430px) {
    .shop-budget__heading h2 { font-size: 34px; }
    .shop-budget__grid { gap: 5px; }
    .budget-card { height: 225px; }
    .budget-card:first-child { height: 310px; }
    .budget-card__price { bottom: 20px; }
    .budget-card__price strong { font-size: 28px; }
}

@media (prefers-reduced-motion: reduce) {
    .budget-card__image img,
    .budget-card__image::before,
    .budget-card__image::after,
    .budget-card__price {
        transition: none !important;
    }
}


/* =========================================================================
   JEWELLERY STORY
   ========================================================================= */

.jewel-story-section {
    position: relative;
    width: 100%;
    padding: 105px 0 110px;
    overflow: hidden;
    background: linear-gradient(135deg, #fffdf9 0%, #fff9f3 50%, #f8e1cf 100%);
}

.jewel-story-container {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 0.82fr 1.18fr;
    align-items: center;
    gap: 55px;
}

.jewel-story-content {
    position: relative;
    z-index: 5;
    padding: 20px 0;
}

.jewel-story-top-line {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 22px;
}

.jewel-story-top-line span {
    display: block;
    width: 62px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #c28a4c);
}

.jewel-story-top-line span:last-child {
    background: linear-gradient(90deg, #c28a4c, transparent);
}

.jewel-story-top-line i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    border: 1px solid rgba(194, 138, 76, 0.6);
    border-radius: 50%;
    background: #fffaf4;
    color: #bd7e39;
    font-size: 10px;
}

.jewel-story-eyebrow {
    display: block;
    margin-bottom: 17px;
    color: #a96e32;
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 5px;
}

.jewel-story-content h2 {
    margin: 0;
    max-width: 560px;
    color: #302019;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(45px, 4.5vw, 72px);
    font-weight: 400;
    line-height: 0.98;
    letter-spacing: -2.5px;
    text-align: left;
}

.jewel-story-content h2 em {
    color: #b87532;
    font-style: italic;
    font-weight: 400;
}

.jewel-story-description {
    max-width: 500px;
    margin: 30px 0;
    color: #76645b;
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 14px;
    line-height: 1.85;
}

.jewel-story-points {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-bottom: 30px;
}

.jewel-story-point {
    display: flex;
    align-items: center;
    gap: 13px;
    transition: transform 0.45s cubic-bezier(.22, 1, .36, 1);
}

.jewel-story-point:hover {
    transform: translateX(7px);
}

.jewel-story-point-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(194, 138, 76, 0.42);
    border-radius: 50%;
    background: rgba(255, 253, 249, 0.8);
    color: #b97836;
    font-size: 12px;
    transition: transform 0.45s cubic-bezier(.22, 1, .36, 1), background 0.3s ease, color 0.3s ease;
}

.jewel-story-point:hover .jewel-story-point-icon {
    background: #b97836;
    color: #fff;
    transform: scale(1.08) rotate(-4deg);
}

.jewel-story-point strong {
    display: block;
    margin-bottom: 2px;
    color: #3c2b24;
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 13px;
    font-weight: 700;
}

.jewel-story-point small {
    display: block;
    color: #9a8377;
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 11px;
}

.jewel-story-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    min-width: 205px;
    padding: 15px 21px;
    border: 1px solid #a96829;
    border-radius: 0;
    background: #a96829;
    color: #fff;
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    transition: all 0.35s ease;
}

.jewel-story-button i {
    font-size: 10px;
    transition: transform 0.3s ease;
}

.jewel-story-button:hover {
    background: transparent;
    color: #a96829;
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(169, 104, 41, 0.12);
}

.jewel-story-button:hover i {
    transform: translateX(5px);
}

/* ---------- arches ---------- */

.jewel-story-visual {
    position: relative;
    width: 100%;
    height: 590px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 20px;
}

.jewel-arch {
    position: relative;
    flex: 0 0 30%;
    max-width: 230px;
    height: 450px;
    overflow: hidden;
    border: 1px solid rgba(190, 128, 57, 0.75);
    border-bottom: 0;
    border-radius: 999px 999px 0 0;
    background: #f4dfcd;
    box-shadow: 0 12px 30px rgba(100, 65, 40, 0.06);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.jewel-arch--one   { height: 390px; }
.jewel-arch--two   { height: 475px; }
.jewel-arch--three { height: 550px; }

.jewel-arch:hover {
    transform: translateY(-7px);
    box-shadow: 0 20px 45px rgba(100, 65, 40, 0.13);
}

.jewel-arch-image {
    position: absolute;
    inset: 0;
    overflow: hidden;
    border-radius: 999px 999px 0 0;
}

.jewel-arch-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.01);
    transition: transform 0.7s ease;
}

.jewel-arch:hover .jewel-arch-image img {
    transform: scale(1.045);
}

.jewel-arch-image::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 45%, rgba(54, 34, 24, 0.15) 100%);
}

.jewel-arch-label {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 6;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 58px;
    background: linear-gradient(180deg, transparent, rgba(53, 33, 24, 0.65));
}

.jewel-arch-label span {
    padding-top: 12px;
    color: #fff;
    font-family: "Be Vietnam Pro", sans-serif;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 4px;
}

/* story: responsive */

@media (max-width: 1200px) {
    .jewel-story-container { gap: 35px; }
    .jewel-story-content h2 { font-size: 54px; }
    .jewel-story-visual { height: 530px; gap: 15px; }
    .jewel-arch { max-width: 195px; }
    .jewel-arch--one   { height: 350px; }
    .jewel-arch--two   { height: 425px; }
    .jewel-arch--three { height: 500px; }
}

@media (max-width: 991px) {
    .jewel-story-section { padding: 80px 0 90px; }
    .jewel-story-container { grid-template-columns: 1fr 1fr; gap: 25px; }
    .jewel-story-content h2 { font-size: 46px; letter-spacing: -1.8px; }
    .jewel-story-description { font-size: 13px; line-height: 1.75; }
    .jewel-story-visual { height: 500px; gap: 10px; }
    .jewel-arch { flex-basis: 31%; max-width: 170px; }
    .jewel-arch--one   { height: 320px; }
    .jewel-arch--two   { height: 400px; }
    .jewel-arch--three { height: 475px; }
}

@media (max-width: 767px) {
    .jewel-story-section { padding: 70px 0 75px; }
    .jewel-story-container { grid-template-columns: 1fr; gap: 55px; }
    .jewel-story-content { padding: 0; text-align: center; }
    .jewel-story-top-line { justify-content: center; }
    .jewel-story-eyebrow { font-size: 10px; letter-spacing: 4px; }
    .jewel-story-content h2 { max-width: 500px; margin: 0 auto; font-size: 43px; line-height: 1; letter-spacing: -1.5px; text-align: center; }
    .jewel-story-description { max-width: 500px; margin: 25px auto 28px; font-size: 13px; }
    .jewel-story-points { max-width: 340px; margin: 0 auto 30px; text-align: left; }
    .jewel-story-button { margin: 0 auto; }
    .jewel-story-visual { height: 470px; gap: 8px; }
    .jewel-arch { flex-basis: 31%; max-width: 130px; }
    .jewel-arch--one   { height: 300px; }
    .jewel-arch--two   { height: 365px; }
    .jewel-arch--three { height: 425px; }
    .jewel-arch-label { height: 45px; }
    .jewel-arch-label span { padding-top: 8px; font-size: 8px; letter-spacing: 2.5px; }
    .jewel-story-point:hover { transform: translateX(3px); }
}

@media (max-width: 480px) {
    .jewel-story-section { padding: 60px 0 65px; }
    .jewel-story-container { gap: 45px; }
    .jewel-story-top-line span { width: 42px; }
    .jewel-story-content h2 { font-size: 35px; letter-spacing: -1px; }
    .jewel-story-description { padding: 0 8px; font-size: 12px; line-height: 1.75; }
    .jewel-story-point { gap: 10px; }
    .jewel-story-point-icon { flex-basis: 35px; width: 35px; height: 35px; font-size: 10px; }
    .jewel-story-point strong { font-size: 11px; }
    .jewel-story-point small { font-size: 9px; }
    .jewel-story-button { min-width: 190px; padding: 13px 17px; font-size: 9px; letter-spacing: 1.5px; }
    .jewel-story-visual { height: 390px; gap: 5px; }
    .jewel-arch { max-width: 100px; }
    .jewel-arch--one   { height: 245px; }
    .jewel-arch--two   { height: 300px; }
    .jewel-arch--three { height: 355px; }
    .jewel-arch-label { height: 37px; }
    .jewel-arch-label span { padding-top: 6px; font-size: 6px; letter-spacing: 1.5px; }
}

@media (max-width: 360px) {
    .jewel-story-content h2 { font-size: 31px; }
    .jewel-story-visual { height: 350px; }
    .jewel-arch { max-width: 88px; }
    .jewel-arch--one   { height: 220px; }
    .jewel-arch--two   { height: 270px; }
    .jewel-arch--three { height: 315px; }
}


/* =========================================================================
   COLLECTIONS (SQUARE VIDEO CARDS) + VIDEO MODAL
   ========================================================================= */

.collections-section {
    width: 100%;
    padding: 55px 0 75px;
    overflow: visible;
    background: #fff8f4;
}

.collections-container {
    position: relative;
}

.collections-heading {
    position: relative;
    margin-bottom: 42px;
    text-align: center;
}

.collections-heading__line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-bottom: 12px;
}

.collections-heading__line span {
    width: 90px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #c9a15b);
    opacity: .75;
}

.collections-heading__line span:last-child {
    background: linear-gradient(90deg, #c9a15b, transparent);
}

.collections-heading__line i {
    color: #c9a15b;
    font-size: 13px;
    filter: drop-shadow(0 0 7px rgba(201, 161, 91, .35));
}

.collections-heading h2 {
    margin: 0;
    color: #721c32;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(48px, 4.5vw, 68px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -1px;
}

.collections-heading p {
    margin: 12px 0 0;
    color: #b88645;
    font-family: "Montserrat", sans-serif;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 5px;
    text-transform: uppercase;
}

.collections-grid-wrap {
    position: relative;
    width: 100%;
}

.collections-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-auto-rows: max-content;
    align-items: start;
    gap: 25px;
    width: 100%;
}

.collection-card {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    align-self: start;
    overflow: hidden;
    box-sizing: border-box;
    isolation: isolate;
    background: #300914;
    border: 1px solid rgba(210, 174, 112, .62);
    border-radius: 26px;
    box-shadow: 0 16px 38px rgba(52, 12, 25, .16);
    transition: transform .5s cubic-bezier(.22, .61, .36, 1), border-color .35s ease, box-shadow .45s ease;
}

.collection-card:hover {
    transform: translateY(-6px);
    border-color: rgba(221, 188, 125, .95);
    box-shadow: 0 25px 48px rgba(52, 12, 25, .25);
}

.collection-card__media {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #300914;
}

.collection-card__video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #300914;
}

.collection-card__video video {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    background: #300914;
    cursor: pointer;
    transform: scale(1.01);
    transition: transform 1s cubic-bezier(.22, .61, .36, 1), filter .7s ease;
}

.collection-card__video::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(to bottom,
        rgba(20, 3, 10, .04) 0%,
        rgba(20, 3, 10, .02) 35%,
        rgba(35, 5, 15, .22) 55%,
        rgba(25, 3, 12, .96) 100%);
}

.collection-card__video::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle at 50% 38%, rgba(194, 139, 58, .14), transparent 58%);
    transition: opacity .65s ease;
}

.collection-card:hover .collection-card__video::after {
    opacity: 1;
}

.collection-card:hover .collection-card__video video {
    transform: scale(1.045);
    filter: saturate(1.06) contrast(1.03);
}

/* eye / preview button */
.collection-card__menu {
    position: absolute;
    top: 17px;
    right: 17px;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(24, 15, 18, .58);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: background .3s ease, box-shadow .3s ease;
}

.collection-card__menu i {
    display: block;
    margin: 0;
    font-size: 14px;
    line-height: 1;
    transition: color .3s ease, transform .3s ease;
}

.collection-card__menu:hover {
    background: rgba(113, 28, 48, .90);
    box-shadow: 0 7px 18px rgba(0, 0, 0, .20);
}

.collection-card__menu:hover i {
    transform: scale(1.08);
    color: #f5dfb5;
}

/* play button */
.collection-play {
    position: absolute;
    right: 19px;
    bottom: 19px;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .9);
    border-radius: 50%;
    background: rgba(255, 255, 255, .96);
    color: #1c1515;
    cursor: pointer;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
    transition: transform .35s cubic-bezier(.22, .61, .36, 1), box-shadow .35s ease, background .3s ease, opacity .3s ease;
}

.collection-play i {
    margin-left: 3px;
    font-size: 16px;
}

.collection-play:hover {
    transform: scale(1.08);
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .25);
}

/* bottom text */
.collection-card__info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 8;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 40%;
    padding: 20px 21px 19px;
    box-sizing: border-box;
    pointer-events: none;
    background: linear-gradient(to bottom,
        transparent 0%,
        rgba(34, 4, 14, .08) 8%,
        rgba(31, 4, 13, .62) 48%,
        rgba(25, 3, 11, .98) 100%);
}

.collection-card__text {
    min-width: 0;
    max-width: 75%;
}

.collection-card__text::before {
    content: "";
    display: block;
    width: 25px;
    height: 1px;
    margin-bottom: 8px;
    background: #d7b36a;
    opacity: .9;
}

.collection-card__text p {
    margin: 0 0 7px;
    color: rgba(255, 247, 234, .94);
    font-family: "Montserrat", sans-serif;
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 2.5px;
    line-height: 1.3;
    text-transform: uppercase;
}

.collection-card__text h3 {
    margin: 0;
    color: #fffaf0;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(24px, 2vw, 32px);
    font-weight: 600;
    line-height: 1;
    letter-spacing: -.2px;
    text-shadow: 0 2px 14px rgba(0, 0, 0, .3);
}

.collection-card__description {
    max-width: 190px;
    margin-top: 7px;
    color: rgba(255, 245, 232, .78);
    font-family: "Montserrat", sans-serif;
    font-size: 9px;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: .2px;
}

/* right arrow */
.collections-next {
    position: absolute;
    top: 50%;
    right: -21px;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(181, 139, 87, .55);
    border-radius: 50%;
    background: rgba(91, 31, 48, .90);
    color: #f5dfb5;
    cursor: pointer;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    box-shadow: 0 8px 20px rgba(65, 17, 32, .16);
    transform: translateY(-50%);
    transition: transform .3s ease, background .3s ease, border-color .3s ease;
}

.collections-next i {
    margin-left: 1px;
    font-size: 12px;
}

.collections-next:hover {
    background: #711d34;
    border-color: #d6b46e;
    transform: translateY(-50%) translateX(3px);
}

/* fullscreen video (card) */
.collection-card__video:fullscreen,
.collection-card__video:-webkit-full-screen {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    height: 100vh;
    background: #000;
}

.collection-card__video:fullscreen video,
.collection-card__video:-webkit-full-screen video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
    transform: none !important;
}

/* ---------- video preview modal ---------- */

.collection-video-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 25px;
    background: rgba(24, 5, 13, .78);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .35s ease, visibility .35s ease;
}

.collection-video-modal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.collection-video-modal__card {
    position: relative;
    width: min(900px, 92vw);
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border: 1px solid rgba(215, 179, 106, .65);
    border-radius: 22px;
    background: #16050c;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
    transform: scale(.94) translateY(15px);
    transition: transform .4s cubic-bezier(.22, .61, .36, 1);
}

.collection-video-modal.is-open .collection-video-modal__card {
    transform: scale(1) translateY(0);
}

.collection-video-modal__video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #000;
    cursor: pointer;
}

.collection-video-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 50%;
    background: rgba(30, 8, 15, .72);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: transform .3s ease, background .3s ease, color .3s ease;
}

.collection-video-modal__close i {
    font-size: 15px;
}

.collection-video-modal__close:hover {
    transform: rotate(90deg) scale(1.08);
    background: #711d34;
    color: #f5dfb5;
}

.collection-video-modal__title {
    position: absolute;
    left: 22px;
    bottom: 18px;
    z-index: 5;
    padding: 8px 14px;
    border-radius: 20px;
    background: rgba(30, 5, 13, .65);
    color: #fff8ef;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 20px;
    line-height: 1;
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    pointer-events: none;
}

body.collection-video-modal-open {
    overflow: hidden;
}

/* collections: responsive */

@media (max-width: 1200px) {
    .collections-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
    .collections-next { right: -18px; }
}

@media (max-width: 767px) {
    .collections-section { padding: 45px 0 55px; }
    .collections-heading { margin-bottom: 30px; }
    .collections-heading__line { gap: 9px; }
    .collections-heading__line span { width: 45px; }
    .collections-heading h2 { font-size: 42px; }
    .collections-heading p { font-size: 7px; letter-spacing: 2.5px; }
    .collections-grid { grid-template-columns: 1fr; gap: 20px; }
    .collection-card { border-radius: 22px; }
    .collection-card__menu { top: 15px; right: 15px; width: 40px; height: 40px; }
    .collection-play { right: 17px; bottom: 17px; width: 54px; height: 54px; }
    .collection-card__info { min-height: 42%; padding: 18px; }
    .collection-card__text h3 { font-size: 27px; }
    .collection-card__description { max-width: 165px; font-size: 8.5px; }
    .collections-next { display: none; }

    .collection-video-modal { padding: 15px; }
    .collection-video-modal__card { width: 94vw; aspect-ratio: 9 / 14; border-radius: 18px; }
    .collection-video-modal__close { top: 10px; right: 10px; width: 38px; height: 38px; }
    .collection-video-modal__title { left: 14px; bottom: 14px; padding: 7px 12px; font-size: 17px; }
}

@media (max-width: 480px) {
    .collections-section { padding: 40px 0 48px; }
    .collections-heading h2 { font-size: 36px; }
    .collections-heading p { font-size: 6.5px; letter-spacing: 2px; }
    .collection-card { border-radius: 20px; }
    .collection-card__menu { top: 13px; right: 13px; width: 38px; height: 38px; }
    .collection-play { right: 15px; bottom: 15px; width: 52px; height: 52px; }
    .collection-play i { font-size: 14px; }
    .collection-card__info { min-height: 43%; padding: 17px 16px; }
    .collection-card__text h3 { font-size: 24px; }
    .collection-card__text p { font-size: 6.5px; letter-spacing: 1.8px; }
    .collection-card__description { font-size: 8px; line-height: 1.35; }
}

@media (max-width: 360px) {
    .collection-card__text h3 { font-size: 22px; }
}


/* =========================================================================
   ACCESSIBILITY
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}