/* PATCH NAVBAR COMPACT SPACING ONLY */
/* Fokus: rapihkan navbar yang tabrakan. Menu pages dikecilkan sedikit,
   jarak disesuaikan, icon/profile tetap di kanan. Tidak mengubah fitur lain. */

.site-header{
    position:sticky !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    z-index:9999 !important;
    height:96px !important;
    background:
        #ffffff !important;
    border-bottom:1px solid rgba(78,118,97,.07) !important;
    box-shadow:none !important;
    overflow:visible !important;
    transition:box-shadow .25s ease !important;
}

.site-header.is-scrolled{
    box-shadow:0 2px 12px rgba(0,0,0,.08) !important;
}

.site-header-inner{
    width:min(1230px, calc(100% - 44px)) !important;
    height:100% !important;
    margin:0 auto !important;
    display:grid !important;
    grid-template-columns:245px minmax(470px, 1fr) 350px !important;
    align-items:center !important;
    gap:18px !important;
}

.site-logo{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    min-width:0 !important;
    text-decoration:none !important;
    color:#333333 !important;
}

.site-logo img{
    width:62px !important;
    height:62px !important;
    min-width:62px !important;
    max-width:62px !important;
    object-fit:contain !important;
    display:block !important;
    filter:none !important;
}

.site-logo strong{
    display:block !important;
    color:#ffffff !important;
    font-size:23px !important;
    line-height:1 !important;
    font-weight:950 !important;
    letter-spacing:-.04em !important;
    white-space:nowrap !important;
}

.site-logo span{
    display:block !important;
    margin-top:7px !important;
    color:rgba(51,51,51,.58) !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:850 !important;
    letter-spacing:.30em !important;
    text-transform:uppercase !important;
    white-space:nowrap !important;
}

.site-nav{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:22px !important;
    min-width:0 !important;
    white-space:nowrap !important;
}

.site-nav a{
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    height:40px !important;
    color:rgba(51,51,51,.74) !important;
    text-decoration:none !important;
    font-size:12px !important;
    line-height:1 !important;
    font-weight:950 !important;
    letter-spacing:.16em !important;
    text-transform:uppercase !important;
    transition:.18s ease !important;
}

.site-nav a:hover,
.site-nav a.active{
    color:var(--primary, #333333) !important;
}

.site-nav a:after{
    content:'' !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    height:2px !important;
    background:var(--primary, #4A7A3A) !important;
    transform:scaleX(0) !important;
    transform-origin:center !important;
    transition:.18s ease !important;
}

.site-nav a:hover:after,
.site-nav a.active:after{
    transform:scaleX(1) !important;
}

.site-actions{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    min-width:0 !important;
}

.circle-action{
    position:relative !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    border-radius:999px !important;
    border:1px solid rgba(0,0,0,.12) !important;
    background:rgba(0,0,0,.055) !important;
    color:#333333 !important;
    text-decoration:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:20px !important;
    line-height:1 !important;
    cursor:pointer !important;
    transition:.18s ease !important;
}

.circle-action:hover{
    background:var(--primary-soft, rgba(74,122,58,.22)) !important;
    border-color:var(--primary, rgba(74,122,58,.45)) !important;
    transform:translateY(-1px) !important;
}

.circle-action em{
    position:absolute !important;
    right:-4px !important;
    top:-7px !important;
    min-width:21px !important;
    height:21px !important;
    padding:0 6px !important;
    border-radius:999px !important;
    background:var(--primary, #ff3b97) !important;
    color:#ffffff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:11px !important;
    font-style:normal !important;
    font-weight:950 !important;
    box-shadow:none !important;
}

.circle-action em[hidden]{
    display:none !important;
}

.profile-menu{
    position:relative !important;
    display:block !important;
    min-width:0 !important;
}

.profile-trigger{
    height:44px !important;
    width:190px !important;
    max-width:190px !important;
    border-radius:999px !important;
    border:1px solid rgba(0,0,0,.16) !important;
    background:rgba(0,0,0,.07) !important;
    color:#333333 !important;
    display:flex !important;
    align-items:center !important;
    gap:9px !important;
    padding:0 12px 0 7px !important;
    cursor:pointer !important;
    text-transform:uppercase !important;
    overflow:hidden !important;
}

.profile-avatar{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    border-radius:999px !important;
    background:var(--primary, #4e7661) !important;
    color:#ffffff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:13px !important;
    font-weight:950 !important;
    line-height:1 !important;
}

.profile-trigger strong{
    display:block !important;
    flex:1 !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
    color:#333333 !important;
    font-size:12px !important;
    font-weight:950 !important;
    letter-spacing:.07em !important;
}

.profile-trigger i{
    color:rgba(51,51,51,.58) !important;
    font-style:normal !important;
    font-size:12px !important;
}

.profile-dropdown{
    position:absolute !important;
    top:calc(100% + 12px) !important;
    right:0 !important;
    width:210px !important;
    display:none !important;
    padding:10px !important;
    background:#ffffff !important;
    border:1px solid rgba(0,0,0,.08) !important;
    border-radius:18px !important;
    box-shadow:0 28px 70px rgba(0,0,0,.15) !important;
    z-index:10050 !important;
}

.profile-menu.is-open .profile-dropdown{
    display:block !important;
}

.profile-dropdown a,
.profile-dropdown button{
    width:100% !important;
    min-height:40px !important;
    display:flex !important;
    align-items:center !important;
    padding:0 12px !important;
    border:0 !important;
    border-radius:11px !important;
    background:transparent !important;
    color:#6b6580 !important;
    text-decoration:none !important;
    font-size:13px !important;
    font-weight:850 !important;
    text-align:left !important;
    cursor:pointer !important;
    transition:.16s ease !important;
    white-space:normal !important;
}

.profile-dropdown a:hover,
.profile-dropdown button:hover{
    background:var(--primary-pale, rgba(74,122,58,.08)) !important;
    color:var(--primary, #6b6580) !important;
}

.profile-dropdown form{
    margin:0 !important;
}

.auth-actions{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
}

.auth-actions a{
    height:44px !important;
    padding:0 16px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:999px !important;
    border:1px solid var(--primary, #4e7661) !important;
    color:var(--primary, #4e7661) !important;
    text-decoration:none !important;
    font-size:11px !important;
    font-weight:950 !important;
    letter-spacing:.09em !important;
    text-transform:uppercase !important;
    background:transparent !important;
}

.auth-actions a:first-child{
    background:var(--primary, #4e7661) !important;
    border-color:var(--primary, #4e7661) !important;
    color:#ffffff !important;
}

.auth-actions a:first-child:hover{
    background:var(--primary-dark, #3a5948) !important;
    border-color:var(--primary-dark, #3a5948) !important;
}

.auth-actions a:last-child{
    background:transparent !important;
    border-color:var(--primary, #4e7661) !important;
    color:var(--primary, #4e7661) !important;
}

.auth-actions a:last-child:hover{
    background:var(--primary, #4e7661) !important;
    border-color:var(--primary, #4e7661) !important;
    color:#ffffff !important;
}

/* Breakpoint layar 1366 / 1440 supaya tidak tabrakan */
@media(max-width:1360px){
    .site-header-inner{
        width:min(1220px, calc(100% - 34px)) !important;
        grid-template-columns:235px minmax(430px, 1fr) 330px !important;
        gap:14px !important;
    }

    .site-nav{
        gap:18px !important;
    }

    .site-nav a{
        font-size:11px !important;
        letter-spacing:.14em !important;
    }

    .circle-action{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        font-size:18px !important;
    }

    .profile-trigger{
        width:176px !important;
        max-width:176px !important;
    }

    .profile-trigger strong{
        font-size:11px !important;
        letter-spacing:.06em !important;
    }
}

/* Tablet / kecil */
@media(max-width:1080px){
    .site-header{
        height:auto !important;
        min-height:98px !important;
    }

    .site-header-inner{
        width:min(100% - 28px,1210px) !important;
        grid-template-columns:1fr auto !important;
        grid-template-areas:
            "logo actions"
            "nav nav" !important;
        gap:8px 16px !important;
        padding:12px 0 !important;
    }

    .site-logo{ grid-area:logo !important; }
    .site-actions{ grid-area:actions !important; }
    .site-nav{
        grid-area:nav !important;
        justify-content:flex-start !important;
        overflow-x:auto !important;
        padding-bottom:4px !important;
        gap:22px !important;
    }

    .site-logo img{
        width:54px !important;
        height:54px !important;
        min-width:54px !important;
        max-width:54px !important;
    }

    .site-logo strong{
        font-size:20px !important;
    }

    .site-logo span{
        font-size:10px !important;
    }

    .profile-trigger{
        min-width:44px !important;
        width:44px !important;
        padding:0 !important;
        justify-content:center !important;
    }

    .profile-trigger strong,
    .profile-trigger i{
        display:none !important;
    }
}

/* === PATCH NAVBAR SHOP DROPDOWN ONLY === */
.site-nav-shop{
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    height:40px !important;
    isolation:isolate !important;
}

.site-nav-shop-trigger{
    position:relative !important;
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    height:40px !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    color:var(--text-muted, rgba(51,51,51,.74)) !important;
    font-family:inherit !important;
    font-size:12px !important;
    line-height:1 !important;
    font-weight:950 !important;
    letter-spacing:.16em !important;
    text-transform:uppercase !important;
    cursor:pointer !important;
    transition:color .18s ease, transform .18s ease !important;
}

.site-nav-shop-trigger span{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:13px !important;
    line-height:1 !important;
    opacity:.75 !important;
    transform:translateY(-1px) !important;
    transition:transform .22s ease, opacity .22s ease !important;
}

.site-nav-shop-trigger:after{
    content:'' !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    height:2px !important;
    background:var(--primary, #4e7661) !important;
    transform:scaleX(0) !important;
    transform-origin:center !important;
    transition:transform .18s ease !important;
}

.site-nav-shop:hover .site-nav-shop-trigger,
.site-nav-shop.active .site-nav-shop-trigger{
    color:var(--primary, #4e7661) !important;
}

.site-nav-shop:hover .site-nav-shop-trigger:after,
.site-nav-shop.active .site-nav-shop-trigger:after{
    transform:scaleX(1) !important;
}

.site-nav-shop:hover .site-nav-shop-trigger span{
    opacity:1 !important;
    transform:translateY(0) rotate(180deg) !important;
}

.site-nav-shop-dropdown{
    position:absolute !important;
    top:calc(100% + 18px) !important;
    left:50% !important;
    width:286px !important;
    padding:12px !important;
    border-radius:22px !important;
    background:#ffffff !important;
    border:1px solid var(--primary-soft, rgba(78,118,97,.18)) !important;
    box-shadow:0 26px 80px rgba(0,0,0,.12) !important;
    backdrop-filter:blur(18px) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateX(-50%) translateY(12px) scale(.96) !important;
    transform-origin:top center !important;
    transition:opacity .22s ease, visibility .22s ease, transform .22s cubic-bezier(.22,1,.36,1) !important;
    z-index:9999 !important;
}

.site-nav-shop-dropdown:before{
    content:'' !important;
    position:absolute !important;
    top:-8px !important;
    left:50% !important;
    width:16px !important;
    height:16px !important;
    background:#ffffff !important;
    border-left:1px solid var(--primary-soft, rgba(78,118,97,.18)) !important;
    border-top:1px solid var(--primary-soft, rgba(78,118,97,.18)) !important;
    transform:translateX(-50%) rotate(45deg) !important;
}

.site-nav-shop:hover .site-nav-shop-dropdown,
.site-nav-shop:focus-within .site-nav-shop-dropdown{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateX(-50%) translateY(0) scale(1) !important;
}

.site-nav .site-nav-shop-dropdown a{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:5px !important;
    height:auto !important;
    min-height:68px !important;
    padding:14px 44px 14px 16px !important;
    border-radius:16px !important;
    color:#6b6580 !important;
    background:transparent !important;
    text-decoration:none !important;
    transition:background .18s ease, color .18s ease, transform .18s ease !important;
}

.site-nav .site-nav-shop-dropdown a:after{
    content:'→' !important;
    position:absolute !important;
    right:16px !important;
    top:50% !important;
    left:auto !important;
    bottom:auto !important;
    width:auto !important;
    height:auto !important;
    background:transparent !important;
    color:var(--primary, #4e7661) !important;
    opacity:.55 !important;
    transform:translateY(-50%) translateX(-4px) !important;
    transition:opacity .18s ease, transform .18s ease !important;
}

.site-nav .site-nav-shop-dropdown a strong{
    display:block !important;
    color:inherit !important;
    font-size:12px !important;
    line-height:1 !important;
    font-weight:950 !important;
    letter-spacing:.14em !important;
    text-transform:uppercase !important;
}

.site-nav .site-nav-shop-dropdown a small{
    display:block !important;
    color:rgba(42,32,52,.5) !important;
    font-size:11px !important;
    line-height:1.35 !important;
    font-weight:700 !important;
    letter-spacing:.02em !important;
    text-transform:none !important;
}

.site-nav .site-nav-shop-dropdown a:hover,
.site-nav .site-nav-shop-dropdown a.active{
    color:var(--primary, #4e7661) !important;
    background:color-mix(in srgb, var(--primary, #4e7661) 8%, #ffffff) !important;
    transform:translateX(3px) !important;
}

.site-nav .site-nav-shop-dropdown a:hover:after,
.site-nav .site-nav-shop-dropdown a.active:after{
    opacity:1 !important;
    transform:translateY(-50%) translateX(0) !important;
}

.site-nav .site-nav-shop-dropdown a:hover small,
.site-nav .site-nav-shop-dropdown a.active small{
    color:rgba(42,32,52,.65) !important;
}

@media(max-width:1360px){
    .site-nav-shop-trigger{
        font-size:11px !important;
        letter-spacing:.14em !important;
    }
}

@media(max-width:1080px){
    .site-nav-shop{
        height:38px !important;
    }

    .site-nav-shop-trigger{
        height:38px !important;
        font-size:11px !important;
    }

    .site-nav-shop-dropdown{
        left:0 !important;
        transform:translateY(12px) scale(.96) !important;
    }

    .site-nav-shop:hover .site-nav-shop-dropdown,
    .site-nav-shop:focus-within .site-nav-shop-dropdown{
        transform:translateY(0) scale(1) !important;
    }

    .site-nav-shop-dropdown:before{
        left:26px !important;
    }
}

/* === PATCH SHOP MEGA DROPDOWN WIDE + HOVER BRIDGE ONLY === */
.site-nav-shop{
    position:relative !important;
}

.site-nav-shop::before{
    content:'' !important;
    position:absolute !important;
    left:-18px !important;
    right:-18px !important;
    top:100% !important;
    height:26px !important;
    background:transparent !important;
    pointer-events:auto !important;
}

.site-nav-shop-trigger{
    gap:7px !important;
}

.site-nav-shop-trigger span{
    font-size:12px !important;
    transform:translateY(-1px) !important;
}

.site-nav-shop-dropdown{
    position:fixed !important;
    top:96px !important;
    left:50% !important;
    width:min(1180px, calc(100vw - 56px)) !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 0 28px 28px !important;
    background:transparent !important;
    box-shadow:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateX(-50%) translateY(-10px) !important;
    transition:opacity .22s ease, visibility .22s ease, transform .24s cubic-bezier(.2,.8,.2,1) !important;
    z-index:10020 !important;
}

.site-nav-shop-dropdown::before{
    display:none !important;
}

.site-nav-shop:hover .site-nav-shop-dropdown,
.site-nav-shop:focus-within .site-nav-shop-dropdown{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateX(-50%) translateY(0) !important;
}

.shop-mega-panel{
    display:grid !important;
    grid-template-columns:minmax(230px,.8fr) minmax(210px,.7fr) minmax(260px,1fr) minmax(260px,1fr) !important;
    gap:20px !important;
    width:100% !important;
    padding:28px !important;
    background:
        radial-gradient(circle at 78% 14%, rgba(101,162,64,.22), transparent 34%),
        linear-gradient(135deg, rgba(7,21,9,.98), rgba(13,36,14,.98) 48%, rgba(5,12,6,.98)) !important;
    border:1px solid rgba(101,162,64,.34) !important;
    border-top:0 !important;
    border-radius:0 0 28px 28px !important;
    box-shadow:0 32px 90px rgba(0,0,0,.42) !important;
    backdrop-filter:blur(14px) !important;
}

.shop-mega-panel::before{
    content:'' !important;
    position:absolute !important;
    top:-10px !important;
    left:50% !important;
    width:20px !important;
    height:20px !important;
    background:#ffffff !important;
    border-left:1px solid var(--primary-soft, rgba(78,118,97,.18)) !important;
    border-top:1px solid var(--primary-soft, rgba(78,118,97,.18)) !important;
    transform:translateX(-50%) rotate(45deg) !important;
}

.shop-mega-column{
    position:relative !important;
    z-index:1 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:9px !important;
    min-width:0 !important;
}

.shop-mega-eyebrow{
    display:block !important;
    margin:0 0 8px !important;
    color:#777777 !important;
    font-size:11px !important;
    font-weight:950 !important;
    letter-spacing:.24em !important;
    text-transform:uppercase !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link,
.site-nav .site-nav-shop-dropdown .shop-mega-mini{
    position:relative !important;
    display:flex !important;
    min-height:62px !important;
    height:auto !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:5px !important;
    padding:14px 46px 14px 16px !important;
    border-radius:16px !important;
    border:1px solid rgba(42,32,52,.14) !important;
    background:#ffffff !important;
    color:#2a2034 !important;
    text-decoration:none !important;
    letter-spacing:0 !important;
    text-transform:none !important;
    transition:background .18s ease, border-color .18s ease, transform .18s ease, color .18s ease !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link::after,
.site-nav .site-nav-shop-dropdown .shop-mega-mini::after{
    content:'→' !important;
    position:absolute !important;
    right:16px !important;
    top:50% !important;
    width:auto !important;
    height:auto !important;
    background:transparent !important;
    color:#777777 !important;
    opacity:.72 !important;
    transform:translateY(-50%) !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link strong{
    color:inherit !important;
    font-size:14px !important;
    line-height:1.1 !important;
    font-weight:950 !important;
    letter-spacing:.08em !important;
    text-transform:uppercase !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link small{
    color:rgba(42,32,52,.5) !important;
    font-size:12px !important;
    line-height:1.25 !important;
    font-weight:750 !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-mini{
    min-height:48px !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    color:rgba(255,255,255,.72) !important;
    font-size:13px !important;
    font-weight:850 !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link:hover,
.site-nav .site-nav-shop-dropdown .shop-mega-link.active,
.site-nav .site-nav-shop-dropdown .shop-mega-mini:hover{
    color:var(--primary, #4e7661) !important;
    border-color:var(--primary-soft, rgba(78,118,97,.36)) !important;
    background:color-mix(in srgb, var(--primary, #4e7661) 8%, #ffffff) !important;
    transform:translateY(-2px) !important;
}

.shop-mega-card{
    position:relative !important;
    min-height:222px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    gap:10px !important;
    padding:22px !important;
    overflow:hidden !important;
    border-radius:22px !important;
    border:1px solid rgba(42,32,52,.14) !important;
    text-decoration:none !important;
    color:#ffffff !important;
    background:var(--primary, #4e7661) !important;
    transition:transform .2s ease, border-color .2s ease, filter .2s ease !important;
}

.shop-mega-card::before{
    content:'' !important;
    position:absolute !important;
    inset:18px !important;
    border-radius:18px !important;
    border:1px solid rgba(255,255,255,.10) !important;
    pointer-events:none !important;
}

.shop-mega-card-sale{
    background:
        linear-gradient(180deg, rgba(3,8,4,.04), rgba(3,8,4,.84)),
        var(--primary, #4e7661) !important;
}

.shop-mega-card span,
.shop-mega-card em{
    position:relative !important;
    z-index:1 !important;
    color:rgba(255,255,255,.85) !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:950 !important;
    letter-spacing:.18em !important;
    text-transform:uppercase !important;
    font-style:normal !important;
}

.shop-mega-card strong{
    position:relative !important;
    z-index:1 !important;
    max-width:260px !important;
    color:#ffffff !important;
    font-size:22px !important;
    line-height:1.08 !important;
    font-weight:950 !important;
    letter-spacing:-.04em !important;
}

.shop-mega-card:hover{
    transform:translateY(-3px) !important;
    border-color:var(--primary-soft, rgba(78,118,97,.40)) !important;
    filter:brightness(1.06) !important;
}

@media(max-width:1360px){
    .site-nav-shop-dropdown{
        width:min(1080px, calc(100vw - 38px)) !important;
    }

    .shop-mega-panel{
        grid-template-columns:minmax(220px,.9fr) minmax(190px,.7fr) minmax(230px,1fr) minmax(230px,1fr) !important;
        gap:16px !important;
        padding:24px !important;
    }
}

@media(max-width:1080px){
    .site-nav-shop-dropdown{
        position:absolute !important;
        top:calc(100% + 8px) !important;
        left:0 !important;
        width:min(720px, calc(100vw - 32px)) !important;
        transform:translateY(-8px) !important;
    }

    .site-nav-shop:hover .site-nav-shop-dropdown,
    .site-nav-shop:focus-within .site-nav-shop-dropdown{
        transform:translateY(0) !important;
    }

    .shop-mega-panel{
        grid-template-columns:1fr 1fr !important;
        border-radius:22px !important;
    }

    .shop-mega-panel::before{
        left:34px !important;
    }
}

@media(max-width:680px){
    .shop-mega-panel{
        grid-template-columns:1fr !important;
    }

    .shop-mega-card{
        min-height:150px !important;
    }
}


/* === PATCH SHOP MEGA WHITE + IMAGE CARD ONLY === */
.shop-mega-panel{
    background:
        radial-gradient(circle at 82% 16%, rgba(101,162,64,.14), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f7fbf4 100%) !important;
    border:1px solid rgba(61,99,40,.18) !important;
    border-top:0 !important;
    box-shadow:0 34px 90px rgba(12,32,9,.18) !important;
    backdrop-filter:none !important;
}

.shop-mega-panel::before{
    background:#ffffff !important;
    border-left:1px solid rgba(42,32,52,.14) !important;
    border-top:1px solid rgba(42,32,52,.14) !important;
}

.shop-mega-eyebrow{
    color:#777777 !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link,
.site-nav .site-nav-shop-dropdown .shop-mega-mini{
    background:#ffffff !important;
    border-color:rgba(61,99,40,.14) !important;
    color:#6b6580 !important;
    box-shadow:0 10px 24px rgba(61,99,40,.06) !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link small{
    color:rgba(23,57,21,.58) !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link::after,
.site-nav .site-nav-shop-dropdown .shop-mega-mini::after{
    color:#777777 !important;
    opacity:.74 !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link:hover,
.site-nav .site-nav-shop-dropdown .shop-mega-link.active,
.site-nav .site-nav-shop-dropdown .shop-mega-mini:hover{
    color:#6b6580 !important;
    border-color:rgba(101,162,64,.36) !important;
    background:linear-gradient(135deg, rgba(101,162,64,.18), rgba(255,255,255,1)) !important;
    box-shadow:0 14px 34px rgba(61,99,40,.12) !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link:hover small,
.site-nav .site-nav-shop-dropdown .shop-mega-link.active small{
    color:rgba(23,57,21,.66) !important;
}

.shop-mega-card{
    min-height:222px !important;
    padding:0 !important;
    background:#ffffff !important;
    color:#6b6580 !important;
    border-color:rgba(61,99,40,.18) !important;
    box-shadow:0 16px 38px rgba(61,99,40,.10) !important;
}

.shop-mega-card::before{
    content:'' !important;
    position:absolute !important;
    inset:0 !important;
    border:0 !important;
    border-radius:22px !important;
    background:linear-gradient(180deg, rgba(255,255,255,0) 24%, rgba(255,255,255,.92) 69%, #ffffff 100%) !important;
    z-index:1 !important;
    pointer-events:none !important;
}

.shop-mega-card img{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    transform:scale(1.01) !important;
    transition:transform .28s ease, filter .28s ease !important;
}

.shop-mega-card span,
.shop-mega-card em,
.shop-mega-card strong{
    position:relative !important;
    z-index:2 !important;
    margin-left:22px !important;
    margin-right:22px !important;
}

.shop-mega-card span{
    margin-top:auto !important;
    color:rgba(255,255,255,.85) !important;
}

.shop-mega-card strong{
    color:#ffffff !important;
    margin-bottom:0 !important;
}

.shop-mega-card em{
    color:rgba(255,255,255,.65) !important;
    margin-bottom:22px !important;
}

.shop-mega-card:hover{
    border-color:rgba(101,162,64,.48) !important;
    box-shadow:0 22px 48px rgba(61,99,40,.16) !important;
    filter:none !important;
}

.shop-mega-card:hover img{
    transform:scale(1.07) !important;
    filter:saturate(1.04) contrast(1.03) !important;
}

/* === FIX RESTORE NAVBAR SHOP MEGA MENU CLEAN === */
.site-header,
.site-header-inner{
    overflow:visible !important;
}

.site-nav{
    overflow:visible !important;
}

.site-nav-shop{
    position:relative !important;
    isolation:isolate !important;
}

.site-nav-shop-dropdown{
    position:fixed !important;
    top:96px !important;
    left:50% !important;
    right:auto !important;
    width:min(1040px, calc(100vw - 70px)) !important;
    max-width:1040px !important;
    min-width:0 !important;
    height:auto !important;
    max-height:calc(100vh - 125px) !important;
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    overflow:visible !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateX(-50%) translateY(-8px) !important;
    transition:opacity .22s ease, visibility .22s ease, transform .22s ease !important;
    z-index:99999 !important;
}

.site-nav-shop:hover .site-nav-shop-dropdown,
.site-nav-shop:focus-within .site-nav-shop-dropdown{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateX(-50%) translateY(0) !important;
}

.shop-mega-panel{
    position:relative !important;
    display:grid !important;
    grid-template-columns:minmax(245px,1.12fr) minmax(210px,.88fr) minmax(210px,1fr) minmax(210px,1fr) !important;
    align-items:stretch !important;
    gap:16px !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:calc(100vh - 125px) !important;
    padding:24px !important;
    overflow:hidden !important;
    background:linear-gradient(180deg, #ffffff 0%, #f7fbf4 100%) !important;
    border:1px solid rgba(61,99,40,.18) !important;
    border-top:0 !important;
    border-radius:0 0 28px 28px !important;
    box-shadow:0 34px 90px rgba(12,32,9,.18) !important;
}

.shop-mega-panel::before{
    content:'' !important;
    position:absolute !important;
    top:-10px !important;
    left:50% !important;
    width:20px !important;
    height:20px !important;
    background:#ffffff !important;
    border-left:1px solid rgba(61,99,40,.18) !important;
    border-top:1px solid rgba(61,99,40,.18) !important;
    transform:translateX(-50%) rotate(45deg) !important;
}

.shop-mega-column{
    position:relative !important;
    z-index:2 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    min-width:0 !important;
    width:auto !important;
    overflow:visible !important;
}

.shop-mega-eyebrow{
    display:block !important;
    margin:0 0 8px !important;
    color:#777777 !important;
    font-size:11px !important;
    font-weight:950 !important;
    letter-spacing:.24em !important;
    text-transform:uppercase !important;
    white-space:nowrap !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link,
.site-nav .site-nav-shop-dropdown .shop-mega-mini{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;
    gap:5px !important;
    width:100% !important;
    min-width:0 !important;
    min-height:58px !important;
    padding:13px 42px 13px 16px !important;
    background:#ffffff !important;
    border:1px solid rgba(42,32,52,.14) !important;
    border-radius:16px !important;
    color:#2a2034 !important;
    box-shadow:none !important;
    text-decoration:none !important;
    text-transform:none !important;
    letter-spacing:0 !important;
    white-space:normal !important;
    overflow:hidden !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-mini{
    min-height:50px !important;
    font-size:14px !important;
    font-weight:850 !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link strong{
    display:block !important;
    color:#2a2034 !important;
    font-size:15px !important;
    line-height:1.15 !important;
    font-weight:950 !important;
    letter-spacing:-.02em !important;
    text-transform:none !important;
    white-space:normal !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link small{
    display:block !important;
    color:rgba(42,32,52,.5) !important;
    font-size:12px !important;
    line-height:1.25 !important;
    font-weight:750 !important;
    white-space:normal !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link::after,
.site-nav .site-nav-shop-dropdown .shop-mega-mini::after{
    content:'→' !important;
    position:absolute !important;
    top:50% !important;
    right:15px !important;
    width:auto !important;
    height:auto !important;
    background:transparent !important;
    color:#777777 !important;
    opacity:.74 !important;
    transform:translateY(-50%) !important;
}

.site-nav .site-nav-shop-dropdown .shop-mega-link:hover,
.site-nav .site-nav-shop-dropdown .shop-mega-link.active,
.site-nav .site-nav-shop-dropdown .shop-mega-mini:hover{
    color:var(--primary, #4e7661) !important;
    border-color:var(--primary-soft, rgba(78,118,97,.36)) !important;
    background:color-mix(in srgb, var(--primary, #4e7661) 8%, #ffffff) !important;
    box-shadow:none !important;
    transform:translateY(-2px) !important;
}

.shop-mega-card{
    position:relative !important;
    z-index:2 !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:flex-end !important;
    width:100% !important;
    min-width:0 !important;
    min-height:176px !important;
    height:auto !important;
    padding:0 !important;
    overflow:hidden !important;
    border-radius:20px !important;
    border:1px solid rgba(61,99,40,.18) !important;
    background:#ffffff !important;
    color:#6b6580 !important;
    box-shadow:0 16px 38px rgba(61,99,40,.10) !important;
    text-decoration:none !important;
}

.shop-mega-card::before{
    content:'' !important;
    position:absolute !important;
    inset:0 !important;
    z-index:1 !important;
    border:0 !important;
    border-radius:20px !important;
    background:linear-gradient(180deg, rgba(255,255,255,0) 18%, rgba(255,255,255,.92) 68%, #ffffff 100%) !important;
    pointer-events:none !important;
}

.shop-mega-card img{
    position:absolute !important;
    inset:0 !important;
    z-index:0 !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
}

.shop-mega-card span,
.shop-mega-card strong,
.shop-mega-card em{
    position:relative !important;
    z-index:2 !important;
    margin-left:18px !important;
    margin-right:18px !important;
}

.shop-mega-card span{
    color:rgba(255,255,255,.85) !important;
    font-size:10px !important;
    font-weight:950 !important;
    letter-spacing:.18em !important;
    text-transform:uppercase !important;
}

.shop-mega-card strong{
    max-width:220px !important;
    color:#6b6580 !important;
    font-size:18px !important;
    line-height:1.08 !important;
    font-weight:950 !important;
    letter-spacing:-.04em !important;
}

.shop-mega-card em{
    margin-bottom:18px !important;
    color:rgba(255,255,255,.65) !important;
    font-size:11px !important;
    font-style:normal !important;
    font-weight:950 !important;
    letter-spacing:.16em !important;
    text-transform:uppercase !important;
}

@media(max-width:1200px){
    .site-nav-shop-dropdown{
        width:min(900px, calc(100vw - 46px)) !important;
    }
    .shop-mega-panel{
        grid-template-columns:1fr 1fr !important;
        overflow:auto !important;
    }
}

@media(max-width:760px){
    .site-nav-shop-dropdown{
        position:absolute !important;
        top:calc(100% + 10px) !important;
        left:0 !important;
        width:min(360px, calc(100vw - 32px)) !important;
        transform:translateY(-8px) !important;
    }
    .site-nav-shop:hover .site-nav-shop-dropdown,
    .site-nav-shop:focus-within .site-nav-shop-dropdown{
        transform:translateY(0) !important;
    }
    .shop-mega-panel{
        grid-template-columns:1fr !important;
        padding:18px !important;
        border-radius:22px !important;
    }
}


/* === FIX SEARCH ICON CIRCLE NOT GEPENG === */
.site-actions .circle-action[data-search-open],
.site-actions button.circle-action[data-search-open]{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    flex:0 0 44px !important;
    aspect-ratio:1 / 1 !important;
    padding:0 !important;
    box-sizing:border-box !important;
    border-radius:50% !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
}
.site-actions .circle-action[data-search-open] span{
    width:100% !important;
    height:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    line-height:1 !important;
    transform:none !important;
}
@media(max-width:1360px){
    .site-actions .circle-action[data-search-open],
    .site-actions button.circle-action[data-search-open]{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        max-width:42px !important;
        flex-basis:42px !important;
    }
}


/* === FINAL PATCH: SEARCH ICON BULAT + PROFILE IMAGE NAVBAR === */
.site-actions{
    flex-wrap:nowrap !important;
}
.site-actions .circle-action,
.site-actions button.circle-action,
.site-actions .search-circle-action,
.site-actions button.search-circle-action{
    appearance:none !important;
    -webkit-appearance:none !important;
    box-sizing:border-box !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    max-width:44px !important;
    flex:0 0 44px !important;
    aspect-ratio:1 / 1 !important;
    padding:0 !important;
    border-radius:999px !important;
    line-height:1 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:visible !important;
}
.site-actions .circle-action > span,
.site-actions .search-icon-wrap{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    height:100% !important;
    min-width:0 !important;
    line-height:1 !important;
    transform:none !important;
}
.search-icon-svg{
    width:17px !important;
    height:17px !important;
    min-width:17px !important;
    min-height:17px !important;
    display:block !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:2.4 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
    transform:none !important;
}
.profile-avatar{
    overflow:hidden !important;
}
.profile-avatar.has-image{
    background:transparent !important;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.18) !important;
}
.profile-avatar.has-image img{
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:cover !important;
    border-radius:inherit !important;
}
@media(max-width:1360px){
    .site-actions .circle-action,
    .site-actions button.circle-action,
    .site-actions .search-circle-action,
    .site-actions button.search-circle-action{
        width:42px !important;
        height:42px !important;
        min-width:42px !important;
        max-width:42px !important;
        flex-basis:42px !important;
    }
    .search-icon-svg{
        width:16px !important;
        height:16px !important;
        min-width:16px !important;
        min-height:16px !important;
    }
}