/* =======================================================================
   لبخند زیبا · Liquid Glass · Header (FULLY ISOLATED)
   Every rule is scoped under #lz-header so the old theme styles
   (main.css / styles.css / all.css) can never win the cascade, and a
   hard reset below neutralises any inherited layout/plugin styles.
   Loaded LAST. Palette: neutral-light + refined pink + clinical mint.
   ======================================================================= */

/* =======================================================================
   GLOBAL FONT · Dana  (replaces YekanBakh / IRANYekan across the site)
   Dana woff2 live at  public/fonts/Dana/  →  served from  /fonts/Dana/.
   This file loads LAST, so:
     (1) we declare the real `Dana` family (standard weight scale), and
     (2) we RE-DECLARE the theme's own families `yekan-bakh` & `iranyekan`
         to point at Dana glyphs. Because these come after main.css, every
         existing `font-family:'yekan-bakh'`/`iranyekan` rule in the theme
         transparently renders Dana — no per-rule hunting, and icon fonts
         (Material Design Icons, etc.) keep their own family names → safe.
   The yekan-bakh weight map mirrors the theme's original (400/500 were
   SemiBold) so the swap changes the typeface, not the perceived weight.
   ======================================================================= */

/* 1 ── real Dana family (standard weight scale) ───────────────────────── */
@font-face{font-family:'Dana';font-style:normal;font-weight:100;font-display:swap;src:url('/fonts/Dana/Dana-Thin.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:200;font-display:swap;src:url('/fonts/Dana/Dana-UltraLight.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:300;font-display:swap;src:url('/fonts/Dana/Dana-Light.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/Dana/Dana-Regular.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/Dana/Dana-Medium.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/Dana/Dana-DemiBold.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/Dana/Dana-Bold.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:800;font-display:swap;src:url('/fonts/Dana/Dana-ExtraBold.woff2') format('woff2');}
@font-face{font-family:'Dana';font-style:normal;font-weight:900;font-display:swap;src:url('/fonts/Dana/Dana-Black.woff2') format('woff2');}

/* 2 ── re-point the theme's `yekan-bakh` family to Dana (faithful weights) */
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:100;src:url('/fonts/Dana/Dana-Thin.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:200;src:url('/fonts/Dana/Dana-Light.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:300;src:url('/fonts/Dana/Dana-Regular.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:400;src:url('/fonts/Dana/Dana-DemiBold.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:500;src:url('/fonts/Dana/Dana-DemiBold.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:600;src:url('/fonts/Dana/Dana-Bold.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:700;src:url('/fonts/Dana/Dana-ExtraBold.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:800;src:url('/fonts/Dana/Dana-Black.woff2') format('woff2');}
@font-face{font-display:swap;font-family:'yekan-bakh';font-style:normal;font-weight:900;src:url('/fonts/Dana/Dana-Black.woff2') format('woff2');}

/* 3 ── re-point the theme's `iranyekan` family to Dana ─────────────────── */
@font-face{font-display:swap;font-family:iranyekan;font-style:normal;font-weight:300;src:url('/fonts/Dana/Dana-Light.woff2') format('woff2');}
@font-face{font-display:swap;font-family:iranyekan;font-style:normal;font-weight:normal;src:url('/fonts/Dana/Dana-Regular.woff2') format('woff2');}
@font-face{font-display:swap;font-family:iranyekan;font-style:normal;font-weight:bold;src:url('/fonts/Dana/Dana-Bold.woff2') format('woff2');}

/* 4 ── base + the few non-Yekan text rules (Verdana stacks) → Dana ─────── */
html, body{font-family:'yekan-bakh','Dana','IRANYekan',Tahoma,system-ui,sans-serif;}
.profile-navbar h4 span.font-en,
.checkout-alert-highlighted,
.checkout-details-title h4 span,
footer.mini-footer .copy-right-mini-footer{font-family:'Dana','yekan-bakh',Tahoma,sans-serif;}

:root {
    --lz-base:          #F6F8FC;
    --lz-ink:           #14182B;
    --lz-ink-soft:      #5C6275;
    --lz-ink-mute:      #8A90A2;

    --lz-accent:        #E84A8A;
    --lz-accent-strong: #D62F73;
    --lz-accent-soft:   #FFE3EF;
    --lz-mint:          #2FC9BD;
    --lz-mint-deep:     #129A8F;

    --lz-glass-strong:  rgba(255, 255, 255, 0.74);
    --lz-glass-solid:   #FFFFFF;
    --lz-glass-edge:    rgba(255, 255, 255, 0.78);
    --lz-hair:          rgba(20, 24, 43, 0.08);
    --lz-blur:          20px;
    --lz-blur-strong:   30px;
    --lz-saturate:      170%;

    --lz-r-sm:  12px;
    --lz-r:     16px;
    --lz-r-lg:  22px;
    --lz-pill:  999px;

    --lz-sh-sm:    0 4px 16px rgba(20, 24, 43, .06);
    --lz-sh:       0 14px 34px -12px rgba(20, 24, 43, .16), 0 2px 8px rgba(20, 24, 43, .05);
    --lz-sh-pop:   0 22px 50px -16px rgba(20, 24, 43, .22);
    --lz-sh-bar:   0 16px 40px -14px rgba(20, 24, 43, .28), inset 0 1px 0 rgba(255,255,255,.7);
    --lz-sh-accent:0 10px 24px -8px rgba(232, 74, 138, .50);
    --lz-sh-mint:  0 10px 24px -8px rgba(18, 154, 143, .42);

    --lz-ease:  cubic-bezier(.22, 1, .36, 1);
    --lz-fast:  160ms;
    --lz-mid:   280ms;

    --lz-grad-brand: linear-gradient(115deg, #FF5C9E 0%, #E84A8A 45%, #B14BD0 105%);
    --lz-grad-mint:  linear-gradient(120deg, #5FE0D4 0%, #2FC9BD 55%, #129A8F 100%);

    --lz-font: 'Dana', 'yekan-bakh', 'IRANYekan', Tahoma, system-ui, sans-serif;
    --lz-bar-h: 64px;

    --primary-color: var(--lz-accent);
}

/* =======================================================================
   0. HARD RESET (low-specificity via :where, = just #lz-header) so it
   always sits BELOW our styling rules but ABOVE the theme's classes.
   `display` is intentionally NOT reset (protects the cart .dropdown-menu),
   and icon <i> / badge <span> / cart <div> are not matched (icons stay).
   ======================================================================= */
#lz-header :where(.main-menu, .main-menu ul, .main-menu li, .main-menu a, .main-menu .master-menu,
                  .search-area, .search-area form, .search-area input, .search-area button, .search-area .search-result) {
    position: static;
    float: none;
    inset: auto;
    width: auto;
    min-width: 0;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
    list-style: none;
    transform: none;
    transition: none;
    color: inherit;
    text-decoration: none;
    line-height: normal;
    font-family: var(--lz-font);
}
#lz-header, #lz-header *, #lz-header *::before, #lz-header *::after { box-sizing: border-box; }

/* =======================================================================
   1. Floating header shell — fixed, overlaps the section below (hero)
   ======================================================================= */
#lz-header {
    position: fixed;
    top: 0;
    inset-inline: 0;
    z-index: 1000;
    pointer-events: none;
    background: none;
    border: 0;
    box-shadow: none;
    font-family: var(--lz-font);
    -webkit-font-smoothing: antialiased;
}
#lz-header a { text-decoration: none; }
#lz-header .lz-barwrap { padding-top: 14px; padding-inline: 0; pointer-events: none; }

/* content offset so inner pages aren't hidden under the fixed pill.
   Home page keeps padding-top:0 → hero tucks under the pill. */
.wrapper.lz-ua-desktop.lz-inner { padding-top: calc(var(--lz-bar-h) + 30px); }

/* =======================================================================
   2. The single rounded glass pill
   ======================================================================= */
#lz-header .lz-bar {
    position: relative;
    pointer-events: auto;
    display: flex;
    align-items: center;
    gap: 6px 14px;
    height: var(--lz-bar-h);
    padding-inline: 18px 10px;
    border-radius: var(--lz-pill);
    /* glassier: more transparent frosted gradient + stronger blur; flat (no shadow) */
    background: linear-gradient(180deg, rgba(255, 255, 255, .50), rgba(255, 255, 255, .30));
    -webkit-backdrop-filter: blur(36px) saturate(185%);
    backdrop-filter: blur(36px) saturate(185%);
    border: 1px solid var(--lz-glass-edge);
    box-shadow: none;
    transition: background var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease);
}

/* ---- logo ---- */
#lz-header .lz-logo { order: 1; flex: 0 0 auto; display: inline-flex; align-items: center; line-height: 0; }
#lz-header .lz-logo img { height: 40px; width: auto; max-width: 150px; object-fit: contain; }

/* =======================================================================
   3. Compact, centred search
   ======================================================================= */
#lz-header .lz-search { order: 3; margin-inline-start: auto; flex: 0 1 350px; min-width: 130px; }
#lz-header .lz-search .search { position: relative; width: 100%; }
#lz-header .lz-search #search-input {
    width: 100%;
    height: 42px;
    border: 1px solid var(--lz-hair);
    border-radius: var(--lz-pill);
    background: rgba(255, 255, 255, .55);
    padding-inline-start: 46px;
    padding-inline-end: 14px;
    font-size: 13px;
    font-weight: 500;
    color: var(--lz-ink);
    transition: border-color var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), background var(--lz-mid) var(--lz-ease);
}
#lz-header .lz-search #search-input::placeholder { color: var(--lz-ink-mute); }
#lz-header .lz-search #search-input:focus {
    outline: none;
    background: #fff;
    border-color: var(--lz-accent);
    box-shadow: 0 0 0 4px rgba(232, 74, 138, .14);
}
#lz-header .lz-search .lz-search__submit {
    position: absolute;
    inset-inline-start: 5px;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: var(--lz-pill);
    background: var(--lz-grad-brand);
    color: #fff;
    cursor: pointer;
    box-shadow: var(--lz-sh-accent);
    transition: transform var(--lz-fast) var(--lz-ease), filter var(--lz-fast) var(--lz-ease);
}
#lz-header .lz-search .lz-search__submit svg { width: 17px; height: 17px; }
#lz-header .lz-search .lz-search__submit:hover { transform: translateY(-50%) scale(1.06); }
#lz-header .lz-search .lz-search__submit:active { transform: translateY(-50%) scale(.95); }
#lz-header .lz-search .close-search-result {
    position: absolute;
    inset-inline-end: 12px;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 26px;
    display: none;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(20, 24, 43, .07);
    color: var(--lz-ink-soft);
    cursor: pointer;
    z-index: 2;
}
#lz-header .lz-search .close-search-result.show { display: flex; }
#lz-header .lz-search .close-search-result:hover { background: var(--lz-accent-soft); color: var(--lz-accent-strong); }

/* autocomplete panel */
#lz-header .lz-search .search-result {
    position: absolute;
    top: calc(100% + 14px);
    inset-inline-start: 50%;
    transform: translate(50%, 8px);  /* RTL-safe centring under the field */
    width: 360px;
    max-width: 78vw;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    border-radius: var(--lz-r-lg);
    box-shadow: var(--lz-sh-pop);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--lz-mid) var(--lz-ease), transform var(--lz-mid) var(--lz-ease), visibility var(--lz-mid);
    z-index: 60;
}
#lz-header .lz-search .search-result.open { max-height: 70vh; overflow-y: auto; opacity: 1; visibility: visible; transform: translate(50%, 0); }
#lz-header .lz-search .search-result ul { list-style: none; margin: 0; padding: 6px; }
#lz-header .lz-search .search-result ul li { display: flex; align-items: center; gap: 12px; padding: 10px 12px !important; border-radius: var(--lz-r); transition: background var(--lz-fast) var(--lz-ease); }
#lz-header .lz-search .search-result ul li:hover { background: rgba(232, 74, 138, .08); }
#lz-header .lz-search .search-result ul li img { width: 46px; height: 46px; border-radius: 10px; object-fit: cover; background: #fff; flex: 0 0 auto; }
#lz-header .lz-search .search-result-text { flex: 1 1 auto; min-width: 0; }
#lz-header .lz-search .search-result-body a { display: block; color: var(--lz-ink); font-weight: 600; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#lz-header .lz-search .search-result-body span { font-size: 12px; color: var(--lz-ink-mute); }
#lz-header .lz-search .box-search-price { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
#lz-header .lz-search .box-search-price span { font-weight: 700; font-size: 12.5px; color: var(--lz-accent-strong); }
#lz-header .lz-search .box-search-price .search-icon { color: var(--lz-mint-deep); }

/* =======================================================================
   4. Menu include — flatten so nav + cart order inside the pill
   ======================================================================= */
#lz-header .lz-bar .main-menu { display: contents; }

/* nav links */
#lz-header .lz-bar .main-menu .list.float-right {
    order: 2;
    display: flex;
    align-items: center;
    gap: 1px;
}
#lz-header .lz-bar .main-menu .list > .list-item { position: relative; }
#lz-header .lz-bar .main-menu .list > .list-item > .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 38px;
    padding: 0 12px;
    border-radius: var(--lz-pill);
    color: var(--lz-ink);
    font-weight: 600;
    font-size: 13.5px;
    white-space: nowrap;
    transition: color var(--lz-fast) var(--lz-ease), background var(--lz-fast) var(--lz-ease);
}
#lz-header .lz-bar .main-menu .list > .list-item > .nav-link:hover { color: var(--lz-accent-strong); background: rgba(232, 74, 138, .09); }
#lz-header .lz-bar .main-menu .list > .list-item-has-children > .nav-link::after {
    content: "";
    width: 6px; height: 6px;
    border-inline-end: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-1px);
    opacity: .45;
    transition: transform var(--lz-fast) var(--lz-ease), opacity var(--lz-fast) var(--lz-ease);
}
#lz-header .lz-bar .main-menu .list > .list-item-has-children:hover > .nav-link::after { opacity: 1; transform: rotate(-135deg) translateY(1px); }

/* ---- glass dropdowns ---- */
#lz-header .lz-bar .main-menu .sub-menu {
    display: block;
    position: absolute;
    top: calc(100% + 14px);
    inset-inline-start: 0;
    min-width: 232px;
    padding: 8px;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    border-radius: var(--lz-r-lg);
    box-shadow: var(--lz-sh-pop);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(.98);
    transform-origin: top center;
    transition: opacity var(--lz-mid) var(--lz-ease), transform var(--lz-mid) var(--lz-ease), visibility var(--lz-mid);
    z-index: 80;
}
#lz-header .lz-bar .main-menu .list-item-has-children::before { content: ""; position: absolute; top: 100%; inset-inline: 0; height: 16px; }
#lz-header .lz-bar .main-menu .list-item-has-children:hover > .sub-menu,
#lz-header .lz-bar .main-menu .sub-menu .list-item-has-children:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
#lz-header .lz-bar .main-menu .sub-menu .list-item { position: relative; }
#lz-header .lz-bar .main-menu .sub-menu .nav-link {
    display: flex; align-items: center; justify-content: space-between;
    padding: 9px 13px; border-radius: var(--lz-r-sm);
    color: var(--lz-ink-soft); font-weight: 500; font-size: 13.5px;
    transition: background var(--lz-fast) var(--lz-ease), color var(--lz-fast) var(--lz-ease);
}
#lz-header .lz-bar .main-menu .sub-menu .nav-link:hover { background: rgba(232, 74, 138, .10); color: var(--lz-accent-strong); }
#lz-header .lz-bar .main-menu .sub-menu .sub-menu { top: -9px; inset-inline-start: calc(100% + 8px); }

/* megamenu */
#lz-header .lz-bar .main-menu .list-item.position-static { position: static; }
#lz-header .lz-bar .main-menu .f-menu { inset-inline: 0; width: 100%; display: flex; flex-wrap: wrap; gap: 8px; padding: 14px; }
#lz-header .lz-bar .main-menu .f-menu .master-menu { display: block; padding: 9px 14px; border-radius: var(--lz-r-sm); font-weight: 600; color: var(--lz-ink); }
#lz-header .lz-bar .main-menu .f-menu .master-menu:hover { background: rgba(232, 74, 138, .10); color: var(--lz-accent-strong); }
#lz-header .lz-bar .main-menu .megadrop { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 6px 8px; }
#lz-header .lz-bar .main-menu .megadrop a { color: var(--lz-ink-soft); }
#lz-header .lz-bar .main-menu .megadrop .h5 { font-size: 14px; font-weight: 700; color: var(--lz-ink); margin: 6px 0; }
#lz-header .lz-bar .main-menu .megadrop .h6 { font-size: 13px; font-weight: 500; color: var(--lz-ink-soft); margin: 3px 0; }
#lz-header .lz-bar .main-menu .megadrop a:hover .h5, #lz-header .lz-bar .main-menu .megadrop a:hover .h6 { color: var(--lz-accent-strong); }

/* =======================================================================
   5. Cart — compact white-glass pill (icon + count)
   ======================================================================= */
#lz-header .lz-bar .main-menu .nav.float-left { order: 4; display: flex; align-items: center; }
#lz-header .lz-bar .main-menu .nav.float-left > .nav-item { position: relative; }
#lz-header .lz-bar .main-menu .nav.float-left > .nav-item > .nav-link {
    display: inline-flex; align-items: center; gap: 6px;
    height: 40px; padding: 0 13px;
    border-radius: var(--lz-pill);
    background: rgba(255, 255, 255, .6);
    border: 1px solid var(--lz-hair);
    color: var(--lz-ink); font-weight: 700; font-size: 13px;
    white-space: nowrap;
    box-shadow: var(--lz-sh-sm);
    transition: transform var(--lz-fast) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease);
}
#lz-header .lz-bar .main-menu .nav.float-left > .nav-item > .nav-link:hover { transform: translateY(-2px); box-shadow: var(--lz-sh); }
#lz-header .lz-bar .main-menu .nav.float-left .nav-link i { font-size: 21px; color: var(--lz-mint-deep); }
#lz-header .lz-bar .main-menu .nav.float-left .nav-link .label-dropdown { display: none; }
#lz-header .lz-bar .main-menu .nav.float-left .nav-link .count {
    position: static;
    inset: auto;
    margin: 0;
    min-width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center;
    padding: 0 6px; background: var(--lz-grad-brand); color: #fff; border-radius: var(--lz-pill);
    font-size: 11.5px; font-weight: 800; line-height: 1;
}
#lz-header .lz-bar .main-menu .nav.float-left .dropdown-menu.cart {
    position: absolute;
    inset-inline-end: 0;
    top: calc(100% + 12px);
    border: 1px solid var(--lz-glass-edge); border-radius: var(--lz-r-lg);
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    box-shadow: var(--lz-sh-pop);
    z-index: 90;
}

/* =======================================================================
   6. Account — single merged ورود/ثبت‌نام (or account) button
   ======================================================================= */
#lz-header .lz-actions { order: 5; flex: 0 0 auto; display: flex; align-items: center; }
#lz-header .lz-acct {
    display: inline-flex; align-items: center; gap: 8px;
    height: 42px; padding: 0 18px;
    border-radius: var(--lz-pill);
    background: var(--lz-grad-brand);
    color: #fff; font-weight: 700; font-size: 13.5px;
    box-shadow: var(--lz-sh-accent);
    transition: transform var(--lz-fast) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), filter var(--lz-fast) var(--lz-ease);
}
#lz-header .lz-acct svg { width: 18px; height: 18px; }
#lz-header .lz-acct:hover { transform: translateY(-2px); filter: saturate(1.06); box-shadow: 0 16px 30px -8px rgba(232, 74, 138, .55); }

/* =======================================================================
   7. Hide mobile offcanvas bits inside the pill on wide screens
   ======================================================================= */
#lz-header .lz-bar .btn-menu,
#lz-header .lz-bar .side-menu,
#lz-header .lz-bar .overlay-side-menu,
#lz-header .lz-bar .logo-nav-res { display: none; }
#lz-header .lz-bar .btn-menu .align { display: flex; flex-direction: column; gap: 4px; align-items: center; justify-content: center; width: 100%; height: 100%; }
#lz-header .lz-bar .btn-menu span { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--lz-ink); }
#lz-header .lz-bar .side-menu.open { display: block; }
#lz-header .lz-bar .overlay-side-menu.show { display: block; }

/* =======================================================================
   8. Scrolled state
   ======================================================================= */
#lz-header.lz-scrolled .lz-bar { background: linear-gradient(180deg, rgba(255, 255, 255, .62), rgba(255, 255, 255, .46)); box-shadow: none; }

/* =======================================================================
   9. Responsive
   ======================================================================= */
@media (max-width: 1180px) {
    #lz-header .lz-bar .main-menu .list > .list-item > .nav-link { padding: 0 9px; font-size: 13px; }
    #lz-header .lz-search { flex-basis: 190px; }
}
@media (max-width: 992px) {
    #lz-header .lz-bar .main-menu .list.float-right { display: none; }
    #lz-header .lz-bar .btn-menu { order: 2; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid var(--lz-hair); border-radius: 50%; background: rgba(255,255,255,.6); cursor: pointer; }
    #lz-header .lz-search { flex-basis: 150px; }
}
@media (max-width: 600px) {
    #lz-header .lz-search { display: none; }
}

/* =======================================================================
   10. Accessibility — reduced motion / transparency / no-backdrop
   ======================================================================= */
@media (prefers-reduced-motion: reduce) {
    #lz-header *, #lz-header *::before, #lz-header *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
@media (prefers-reduced-transparency: reduce) {
    #lz-header .lz-bar, #lz-header .lz-search .search-result, #lz-header .lz-bar .main-menu .sub-menu { background: var(--lz-glass-solid); }
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    #lz-header .lz-bar { background: #fff; }
    #lz-header .lz-search .search-result, #lz-header .lz-bar .main-menu .sub-menu, #lz-header .lz-bar .main-menu .nav.float-left .dropdown-menu.cart { background: #fff; }
}


/* =======================================================================
   ============================  FOOTER  =================================
   Dark Liquid-Glass footer · fully isolated under #lz-footer.
   ======================================================================= */
#lz-footer {
    --f-bg1:   #1d2350;
    --f-bg2:   #10132a;
    --f-glass: rgba(255, 255, 255, .055);
    --f-glass2:rgba(255, 255, 255, .10);
    --f-border:rgba(255, 255, 255, .12);
    --f-head:  #ffffff;
    --f-text:  rgba(255, 255, 255, .70);
    --f-mute:  rgba(255, 255, 255, .48);

    position: relative;
    display: block;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    color: var(--f-text);
    font-family: var(--lz-font);
    -webkit-font-smoothing: antialiased;
    line-height: 1.5;
}

/* low-specificity reset for reused/base elements (icons & display untouched) */
#lz-footer :where(.lz-foot, .lz-foot ul, .lz-foot li, .lz-foot a, .lz-foot p,
                  .lz-foot h3, .lz-foot strong, .lz-foot span, .lz-foot form,
                  .lz-foot input, .lz-foot button, .back-to-top) {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    list-style: none;
    float: none;
    text-decoration: none;
    color: inherit;
    font-family: var(--lz-font);
    line-height: inherit;
}
#lz-footer, #lz-footer *, #lz-footer *::before, #lz-footer *::after { box-sizing: border-box; }

/* ---- shell ---- */
#lz-footer { display: block; width: 100%; }
#lz-footer .lz-foot {
    display: block;
    width: 100%;
    position: relative;
    overflow: hidden;
    margin-top: 56px;
    padding: 0 0 0;
    border-radius: 38px 38px 0 0;
    background:
        radial-gradient(120% 90% at 100% 0%, #2a2f63 0%, transparent 55%),
        linear-gradient(170deg, var(--f-bg1) 0%, var(--f-bg2) 70%);
    color: var(--f-text);
}
#lz-footer .lz-foot__glow {
    position: absolute;
    inset: -30% -10% auto -10%;
    height: 60%;
    pointer-events: none;
    background:
        radial-gradient(38% 80% at 84% 0%, rgba(232, 74, 138, .30), transparent 70%),
        radial-gradient(38% 80% at 14% 6%, rgba(47, 201, 189, .26), transparent 72%);
    filter: blur(8px);
    z-index: 0;
}
#lz-footer .lz-foot > .container { position: relative; z-index: 1; }

/* =======================================================================
   services strip
   ======================================================================= */
#lz-footer .lz-foot__services {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    padding: 34px 0;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--f-border);
}
#lz-footer .lz-svc {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border-radius: var(--lz-r);
    background: var(--f-glass);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid var(--f-border);
    transition: transform var(--lz-mid) var(--lz-ease), background var(--lz-mid) var(--lz-ease), border-color var(--lz-mid) var(--lz-ease);
}
#lz-footer .lz-svc:hover { transform: translateY(-4px); background: var(--f-glass2); border-color: rgba(232,74,138,.4); }
#lz-footer .lz-svc__icon {
    flex: 0 0 auto;
    width: 46px; height: 46px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 14px;
    color: #fff;
    background: linear-gradient(135deg, rgba(232,74,138,.9), rgba(47,201,189,.85));
    box-shadow: 0 8px 18px -6px rgba(232,74,138,.5);
}
#lz-footer .lz-svc__icon svg { width: 23px; height: 23px; }
#lz-footer .lz-svc__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
#lz-footer .lz-svc__txt strong { color: var(--f-head); font-weight: 700; font-size: 14px; }
#lz-footer .lz-svc__txt span { color: var(--f-mute); font-size: 12.5px; }

/* =======================================================================
   main grid
   ======================================================================= */
#lz-footer .lz-foot__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 38px 44px;
    padding: 44px 0 40px;
}
#lz-footer .lz-foot__brand { flex: 1 1 300px; max-width: 380px; }
#lz-footer .lz-foot__col   { flex: 1 1 150px; min-width: 140px; }
#lz-footer .lz-foot__aside { flex: 1 1 290px; max-width: 360px; }

/* brand */
#lz-footer .lz-foot__logo {
    display: inline-flex;
    align-items: center;
    margin-bottom: 18px;
    line-height: 0;
}
#lz-footer .lz-foot__logo img { height: 58px; width: auto; max-width: 200px; object-fit: contain; display: block; }
#lz-footer .lz-foot__about { color: var(--f-text); font-size: 13.5px; line-height: 2; margin-bottom: 20px; }
#lz-footer .lz-foot__contact { display: flex; flex-direction: column; gap: 14px; margin-bottom: 22px; }
#lz-footer .lz-foot__contact li { display: flex; align-items: flex-start; gap: 11px; font-size: 13px; color: var(--f-text); line-height: 1.85; }
#lz-footer .lz-foot__contact a { color: var(--f-text); }
#lz-footer .lz-foot__contact a:hover { color: #fff; }
#lz-footer .lz-foot__ci {
    flex: 0 0 auto;
    width: 34px; height: 34px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px;
    color: var(--lz-mint);
    background: var(--f-glass);
    border: 1px solid var(--f-border);
}
#lz-footer .lz-foot__ci svg { width: 17px; height: 17px; }

/* socials */
#lz-footer .lz-foot__socials { display: flex; gap: 10px; flex-wrap: wrap; }
#lz-footer .lz-foot__socials a {
    width: 42px; height: 42px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--f-glass);
    border: 1px solid var(--f-border);
    color: #fff;
    font-size: 21px;
    transition: transform var(--lz-fast) var(--lz-ease), background var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease);
}
#lz-footer .lz-foot__socials a:hover { transform: translateY(-3px); background: var(--lz-grad-brand); box-shadow: var(--lz-sh-accent); }
#lz-footer .lz-foot__socials a i { line-height: 1; }

/* link columns */
#lz-footer .lz-foot__title {
    position: relative;
    color: var(--f-head);
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 20px;
    padding-bottom: 12px;
}
#lz-footer .lz-foot__title::after {
    content: "";
    position: absolute;
    bottom: 0; inset-inline-start: 0;
    width: 32px; height: 3px;
    border-radius: 3px;
    background: var(--lz-grad-brand);
}
#lz-footer .lz-foot__links { display: flex; flex-direction: column; gap: 12px; }
#lz-footer .lz-foot__links a {
    position: relative;
    display: inline-block;
    color: var(--f-text);
    font-size: 13.5px;
    padding-inline-start: 16px;
    transition: color var(--lz-fast) var(--lz-ease), padding var(--lz-fast) var(--lz-ease);
}
#lz-footer .lz-foot__links a::before {
    content: "";
    position: absolute;
    inset-inline-start: 0; top: 50%;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--lz-mint);
    transform: translateY(-50%);
    opacity: .5;
    transition: opacity var(--lz-fast) var(--lz-ease), transform var(--lz-fast) var(--lz-ease);
}
#lz-footer .lz-foot__links a:hover { color: #fff; padding-inline-start: 22px; }
#lz-footer .lz-foot__links a:hover::before { opacity: 1; background: var(--lz-accent); }

/* newsletter + seals */
#lz-footer .lz-news {
    padding: 22px;
    border-radius: var(--lz-r-lg);
    background: linear-gradient(150deg, rgba(232,74,138,.16), rgba(47,201,189,.12));
    border: 1px solid var(--f-border);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
#lz-footer .lz-news__title { color: var(--f-head); font-size: 16px; font-weight: 700; margin-bottom: 8px; }
#lz-footer .lz-news__sub { color: var(--f-text); font-size: 12.8px; line-height: 1.9; margin-bottom: 16px; }
#lz-footer .lz-news__form { position: relative; display: flex; }
#lz-footer .lz-news__form input {
    flex: 1 1 auto;
    width: 100%;
    height: 48px;
    padding-inline: 16px 96px;
    border-radius: var(--lz-pill);
    background: rgba(255,255,255,.10);
    border: 1px solid var(--f-border);
    color: #fff;
    font-size: 13px;
    font-family: var(--lz-font);
}
#lz-footer .lz-news__form input::placeholder { color: var(--f-mute); }
#lz-footer .lz-news__form input:focus { outline: none; border-color: var(--lz-accent); background: rgba(255,255,255,.14); }
#lz-footer .lz-news__form button {
    position: absolute;
    inset-inline-end: 5px;
    top: 5px;
    height: 38px;
    padding: 0 20px;
    border: 0;
    border-radius: var(--lz-pill);
    background: var(--lz-grad-brand);
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    font-family: var(--lz-font);
    cursor: pointer;
    box-shadow: var(--lz-sh-accent);
    transition: transform var(--lz-fast) var(--lz-ease), filter var(--lz-fast) var(--lz-ease);
}
#lz-footer .lz-news__form button:hover { transform: scale(1.03); filter: saturate(1.08); }
#lz-footer .lz-foot__seals { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
#lz-footer .lz-seal {
    background: #fff;
    border-radius: 14px;
    padding: 8px;
    line-height: 0;
    box-shadow: 0 8px 20px -10px rgba(0,0,0,.5);
}
#lz-footer .lz-seal img, #lz-footer .lz-seal a { max-width: 88px; height: auto; border-radius: 8px; }

/* =======================================================================
   bottom bar
   ======================================================================= */
#lz-footer .lz-foot__bottom { border-top: 1px solid var(--f-border); background: rgba(0,0,0,.18); }
#lz-footer .lz-foot__bottominner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 0;
    flex-wrap: wrap;
}
#lz-footer .lz-foot__copy { color: var(--f-mute); font-size: 12.5px; line-height: 1.9; margin: 0; }
#lz-footer .lz-foot__copy a { color: var(--lz-mint); }
#lz-footer .back-to-top.lz-foot__top { position: static; margin: 0; }
#lz-footer .lz-foot__top a {
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--f-glass);
    border: 1px solid var(--f-border);
    color: #fff;
    transition: transform var(--lz-fast) var(--lz-ease), background var(--lz-mid) var(--lz-ease);
}
#lz-footer .lz-foot__top a:hover { transform: translateY(-3px); background: var(--lz-grad-brand); box-shadow: var(--lz-sh-accent); }
#lz-footer .lz-foot__top a svg { width: 20px; height: 20px; }

/* =======================================================================
   responsive
   ======================================================================= */
@media (max-width: 992px) {
    #lz-footer .lz-foot__services { grid-template-columns: repeat(2, 1fr); }
    #lz-footer .lz-foot { border-radius: 28px 28px 0 0; }
}
@media (max-width: 560px) {
    #lz-footer .lz-foot__services { grid-template-columns: 1fr; }
    #lz-footer .lz-foot__grid { gap: 30px; }
    #lz-footer .lz-foot__bottominner { justify-content: center; text-align: center; }
}

/* a11y */
@media (prefers-reduced-motion: reduce) {
    #lz-footer *, #lz-footer *::before, #lz-footer *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    #lz-footer .lz-svc, #lz-footer .lz-news { background: rgba(255,255,255,.08); }
}


/* =======================================================================
   =============================  BLOG  ==================================
   Light Liquid-Glass blog (index / category / single) · isolated #lz-blog
   ======================================================================= */
#lz-blog {
    position: relative;
    display: block;
    padding: 10px 0 56px;
    font-family: var(--lz-font);
    color: var(--lz-ink);
    -webkit-font-smoothing: antialiased;
}
#lz-blog, #lz-blog *, #lz-blog *::before, #lz-blog *::after { box-sizing: border-box; }
#lz-blog a { text-decoration: none; color: inherit; }

/* soft ambient backdrop so the glass reads as glass */
#lz-blog::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 420px;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(40% 60% at 88% 0%, rgba(232,74,138,.10), transparent 70%),
        radial-gradient(40% 60% at 10% 6%, rgba(47,201,189,.10), transparent 72%);
}
#lz-blog > .container { position: relative; z-index: 1; }

/* low-specificity reset for the components we build (NOT article prose / comments) */
#lz-blog :where(.lz-blog__head, .lz-blog__head *, .lz-pcard, .lz-pcard *,
                .lz-side, .lz-side *, .lz-art__meta, .lz-art__meta *,
                .lz-art__share, .lz-art__share *, .lz-blog__pager, .lz-blog__pager *,
                .lz-blog__empty, .lz-blog__empty *) {
    margin: 0; padding: 0; border: 0;
    background: none; box-shadow: none; list-style: none; float: none;
    text-decoration: none; color: inherit;
    font-family: var(--lz-font); line-height: inherit;
}

/* ---- page head ---- */
#lz-blog .lz-blog__head {
    position: relative;
    overflow: hidden;
    padding: 34px 32px;
    margin-bottom: 30px;
    border-radius: var(--lz-r-lg);
    background: linear-gradient(120deg, rgba(232,74,138,.10), rgba(47,201,189,.09)), var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
}
#lz-blog .lz-blog__crumb { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; font-size: 12.5px; color: var(--lz-ink-mute); margin-bottom: 14px; }
#lz-blog .lz-blog__crumb a { color: var(--lz-ink-soft); }
#lz-blog .lz-blog__crumb a:hover { color: var(--lz-accent-strong); }
#lz-blog .lz-blog__crumb span { opacity: .5; }
#lz-blog .lz-blog__title { font-size: clamp(22px, 3vw, 30px); font-weight: 800; color: var(--lz-ink); margin-bottom: 8px; line-height: 1.4; }
#lz-blog .lz-blog__title b { color: var(--lz-accent-strong); font-weight: 800; }
#lz-blog .lz-blog__lead { color: var(--lz-ink-soft); font-size: 14px; line-height: 1.9; max-width: 680px; }

/* ---- layout ---- */
#lz-blog .lz-blog__layout { display: flex; align-items: flex-start; gap: 28px; }
#lz-blog .lz-blog__main { flex: 1 1 auto; min-width: 0; }
#lz-blog .lz-blog__side { flex: 0 0 312px; position: sticky; top: 96px; display: flex; flex-direction: column; gap: 20px; }

/* ---- post card ---- */
#lz-blog .lz-blog__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 24px; }
:is(#lz-blog, #lz-postw) .lz-pcard {
    display: flex;
    flex-direction: column;
    border-radius: var(--lz-r-lg);
    overflow: hidden;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
    transition: transform var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease);
}
:is(#lz-blog, #lz-postw) .lz-pcard:hover { transform: translateY(-6px); box-shadow: var(--lz-sh); }
:is(#lz-blog, #lz-postw) .lz-pcard__media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #eef1f8; }
:is(#lz-blog, #lz-postw) .lz-pcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--lz-mid) var(--lz-ease); }
:is(#lz-blog, #lz-postw) .lz-pcard:hover .lz-pcard__media img { transform: scale(1.06); }
:is(#lz-blog, #lz-postw) .lz-pcard__tag {
    position: absolute;
    inset-block-start: 12px;
    inset-inline-end: 12px;
    padding: 5px 12px;
    border-radius: var(--lz-pill);
    background: rgba(255,255,255,.85);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    color: var(--lz-accent-strong);
    font-size: 11.5px;
    font-weight: 700;
    box-shadow: var(--lz-sh-sm);
}
:is(#lz-blog, #lz-postw) .lz-pcard__body { display: flex; flex-direction: column; gap: 10px; padding: 18px; flex: 1 1 auto; }
:is(#lz-blog, #lz-postw) .lz-pcard__meta { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12px; color: var(--lz-ink-mute); }
:is(#lz-blog, #lz-postw) .lz-pcard__meta span { display: inline-flex; align-items: center; gap: 5px; }
:is(#lz-blog, #lz-postw) .lz-pcard__meta svg { width: 14px; height: 14px; opacity: .8; }
:is(#lz-blog, #lz-postw) .lz-pcard__title { font-size: 15.5px; font-weight: 700; line-height: 1.75; }
:is(#lz-blog, #lz-postw) .lz-pcard__title a { color: var(--lz-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color var(--lz-fast) var(--lz-ease); }
:is(#lz-blog, #lz-postw) .lz-pcard__title a:hover { color: var(--lz-accent-strong); }
:is(#lz-blog, #lz-postw) .lz-pcard__excerpt { font-size: 13px; line-height: 1.95; color: var(--lz-ink-soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
:is(#lz-blog, #lz-postw) .lz-pcard__more { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; padding-top: 6px; color: var(--lz-accent-strong); font-weight: 700; font-size: 13px; }
:is(#lz-blog, #lz-postw) .lz-pcard__more svg { width: 16px; height: 16px; transition: transform var(--lz-fast) var(--lz-ease); }
:is(#lz-blog, #lz-postw) .lz-pcard__more:hover svg { transform: translateX(-4px); }

/* ---- empty state ---- */
#lz-blog .lz-blog__empty { padding: 60px 20px; text-align: center; border-radius: var(--lz-r-lg); background: var(--lz-glass-strong); border: 1px solid var(--lz-glass-edge); color: var(--lz-ink-soft); }
#lz-blog .lz-blog__empty svg { width: 54px; height: 54px; color: var(--lz-ink-mute); margin-bottom: 12px; }

/* ---- pagination ---- */
#lz-blog .lz-blog__pager .pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 34px; padding: 0; }
#lz-blog .lz-blog__pager .pagination a {
    min-width: 42px; height: 42px;
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0 12px;
    border-radius: var(--lz-r-sm);
    background: var(--lz-glass-strong);
    border: 1px solid var(--lz-glass-edge);
    color: var(--lz-ink);
    font-weight: 700; font-size: 13.5px;
    box-shadow: var(--lz-sh-sm);
    transition: transform var(--lz-fast) var(--lz-ease), background var(--lz-mid) var(--lz-ease), color var(--lz-mid) var(--lz-ease);
}
#lz-blog .lz-blog__pager .pagination a:hover { transform: translateY(-2px); color: var(--lz-accent-strong); }
#lz-blog .lz-blog__pager .pagination a.active-page { background: var(--lz-grad-brand); color: #fff; border-color: transparent; box-shadow: var(--lz-sh-accent); }
#lz-blog .lz-blog__pager .pagination a i { font-size: 18px; }

/* ---- sidebar cards ---- */
#lz-blog .lz-side {
    padding: 20px;
    border-radius: var(--lz-r-lg);
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
}
#lz-blog .lz-side__title { position: relative; font-size: 15px; font-weight: 700; color: var(--lz-ink); margin-bottom: 18px; padding-bottom: 12px; }
#lz-blog .lz-side__title::after { content: ""; position: absolute; bottom: 0; inset-inline-start: 0; width: 30px; height: 3px; border-radius: 3px; background: var(--lz-grad-brand); }
#lz-blog .lz-side__list { display: flex; flex-direction: column; gap: 6px; }
#lz-blog .lz-side__item { display: flex; gap: 12px; padding: 10px; border-radius: var(--lz-r); transition: background var(--lz-fast) var(--lz-ease); }
#lz-blog .lz-side__item:hover { background: rgba(232,74,138,.07); }
#lz-blog .lz-side__thumb { flex: 0 0 64px; width: 64px; height: 64px; border-radius: 12px; object-fit: cover; background: #eef1f8; }
#lz-blog .lz-side__body { min-width: 0; display: flex; flex-direction: column; gap: 5px; }
#lz-blog .lz-side__ptitle { font-size: 13px; font-weight: 600; color: var(--lz-ink); line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#lz-blog .lz-side__item:hover .lz-side__ptitle { color: var(--lz-accent-strong); }
#lz-blog .lz-side__excerpt { font-size: 11.5px; color: var(--lz-ink-mute); line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }

/* sidebar CTA */
#lz-blog .lz-side--cta { background: var(--lz-grad-brand); border: 0; color: #fff; box-shadow: var(--lz-sh-accent); }
#lz-blog .lz-side--cta .lz-side__cta-t { font-size: 16px; font-weight: 800; margin-bottom: 6px; }
#lz-blog .lz-side--cta .lz-side__cta-s { font-size: 12.5px; opacity: .92; line-height: 1.8; margin-bottom: 14px; }
#lz-blog .lz-side--cta a { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 18px; border-radius: var(--lz-pill); background: #fff; color: var(--lz-accent-strong); font-weight: 700; font-size: 13px; }
#lz-blog .lz-side--cta a svg { width: 16px; height: 16px; }

/* =======================================================================
   single article
   ======================================================================= */
#lz-blog .lz-art {
    border-radius: var(--lz-r-lg);
    overflow: hidden;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
}
#lz-blog .lz-art__cover { display: block; aspect-ratio: 16 / 8; overflow: hidden; background: #eef1f8; }
#lz-blog .lz-art__cover img { width: 100%; height: 100%; object-fit: cover; }
#lz-blog .lz-art__meta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
#lz-blog .lz-art__meta a, #lz-blog .lz-art__meta span {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 14px;
    border-radius: var(--lz-pill);
    background: var(--lz-glass-strong);
    border: 1px solid var(--lz-glass-edge);
    color: var(--lz-ink-soft);
    font-size: 12.5px; font-weight: 600;
}
#lz-blog .lz-art__meta a:hover { color: var(--lz-accent-strong); }
#lz-blog .lz-art__meta svg { width: 15px; height: 15px; color: var(--lz-accent); }

/* article prose */
#lz-blog .lz-art__content { padding: 28px clamp(20px, 3vw, 36px) 34px; color: var(--lz-ink-soft); font-size: 15px; line-height: 2.1; }
#lz-blog .lz-art__content > *:first-child { margin-top: 0; }
#lz-blog .lz-art__content h1, #lz-blog .lz-art__content h2, #lz-blog .lz-art__content h3, #lz-blog .lz-art__content h4 { color: var(--lz-ink); font-weight: 800; line-height: 1.5; margin: 30px 0 14px; }
#lz-blog .lz-art__content h2 { font-size: 21px; }
#lz-blog .lz-art__content h3 { font-size: 18px; }
#lz-blog .lz-art__content h4 { font-size: 16px; }
#lz-blog .lz-art__content p { margin: 0 0 16px; }
#lz-blog .lz-art__content a { color: var(--lz-accent-strong); font-weight: 600; }
#lz-blog .lz-art__content a:hover { text-decoration: underline; }
#lz-blog .lz-art__content ul, #lz-blog .lz-art__content ol { margin: 0 0 18px; padding-inline-start: 22px; }
#lz-blog .lz-art__content ul li { list-style: none; position: relative; padding-inline-start: 20px; margin-bottom: 9px; }
#lz-blog .lz-art__content ul li::before { content: ""; position: absolute; inset-inline-start: 0; top: 12px; width: 7px; height: 7px; border-radius: 50%; background: var(--lz-mint); }
#lz-blog .lz-art__content ol { list-style: decimal; }
#lz-blog .lz-art__content ol li { margin-bottom: 9px; }
#lz-blog .lz-art__content img { max-width: 100%; height: auto; border-radius: 16px; margin: 20px 0; display: block; }
#lz-blog .lz-art__content blockquote { margin: 20px 0; padding: 16px 20px; border-radius: var(--lz-r); background: rgba(232,74,138,.06); border-inline-start: 4px solid var(--lz-accent); color: var(--lz-ink); }
#lz-blog .lz-art__content table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 13.5px; }
#lz-blog .lz-art__content th, #lz-blog .lz-art__content td { border: 1px solid var(--lz-hair); padding: 10px 12px; text-align: start; }
#lz-blog .lz-art__content th { background: rgba(20,24,43,.04); color: var(--lz-ink); font-weight: 700; }
#lz-blog .lz-art__content iframe, #lz-blog .lz-art__content video { max-width: 100%; border-radius: 16px; margin: 18px 0; }

/* share */
#lz-blog .lz-art__share { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 22px; padding: 16px 20px; border-radius: var(--lz-r); background: var(--lz-glass-strong); border: 1px solid var(--lz-glass-edge); }
#lz-blog .lz-art__share strong { color: var(--lz-ink); font-size: 13.5px; margin-inline-end: 4px; }
#lz-blog .lz-art__share a { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255,255,255,.6); border: 1px solid var(--lz-hair); color: var(--lz-ink); font-size: 19px; transition: transform var(--lz-fast) var(--lz-ease), background var(--lz-mid) var(--lz-ease), color var(--lz-mid) var(--lz-ease); }
#lz-blog .lz-art__share a:hover { transform: translateY(-3px); background: var(--lz-grad-brand); color: #fff; }
#lz-blog .lz-art__comments { margin-top: 26px; }

/* =======================================================================
   responsive
   ======================================================================= */
@media (max-width: 992px) {
    #lz-blog .lz-blog__layout { flex-direction: column; }
    #lz-blog .lz-blog__side { position: static; width: 100%; flex-basis: auto; flex-direction: row; flex-wrap: wrap; }
    #lz-blog .lz-blog__side > * { flex: 1 1 280px; }
}
@media (max-width: 600px) {
    #lz-blog .lz-blog__grid { grid-template-columns: 1fr; }
    #lz-blog .lz-blog__head { padding: 26px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    #lz-blog *, #lz-blog *::before, #lz-blog *::after { transition-duration: .01ms !important; }
}


/* =======================================================================
   ===================  HOME BLOG + FAQ WIDGET  ==========================
   widgets/posts.blade.php · isolated under #lz-postw (reuses .lz-pcard)
   ======================================================================= */
#lz-postw {
    position: relative;
    display: block;
    padding: 26px 0 16px;
    font-family: var(--lz-font);
    color: var(--lz-ink);
    -webkit-font-smoothing: antialiased;
}
#lz-postw, #lz-postw *, #lz-postw *::before, #lz-postw *::after { box-sizing: border-box; }
#lz-postw a { text-decoration: none; color: inherit; }

/* reset (low specificity; covers reused .lz-pcard internals too) */
#lz-postw :where(.lz-faq, .lz-faq *, .lz-postw__head, .lz-postw__head *,
                 .lz-pcard, .lz-pcard *, .lz-postw__more, .lz-postw__more *) {
    margin: 0; padding: 0; border: 0;
    background: none; box-shadow: none; list-style: none; float: none;
    text-decoration: none; color: inherit;
    font-family: var(--lz-font); line-height: inherit;
}

/* ---- FAQ ---- */
#lz-postw .lz-faq {
    position: relative;
    display: grid;
    grid-template-columns: 0.92fr 1.08fr;
    gap: 26px;
    align-items: stretch;
    margin-bottom: 60px;
    padding: 30px;
    border-radius: 30px;
    background:
        radial-gradient(135% 130% at 100% 0%, rgba(255, 92, 158, .10), transparent 55%),
        radial-gradient(125% 130% at 0% 100%, rgba(47, 201, 189, .10), transparent 55%),
        var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh);
    overflow: hidden;
}
#lz-postw .lz-faq__decor {
    position: absolute; z-index: 0; pointer-events: none;
    inset-block-end: -120px; inset-inline-start: -90px;
    width: 320px; height: 320px; border-radius: 50%;
    background: radial-gradient(circle, rgba(177, 75, 208, .20), transparent 70%);
}

/* intro / brand rail */
#lz-postw .lz-faq__intro {
    position: relative; z-index: 1;
    display: flex; flex-direction: column; align-items: center;
    text-align: center;
    padding: 30px 26px 26px;
    border-radius: 24px;
    background:
        radial-gradient(135% 95% at 50% 0%, rgba(255, 92, 158, .16), transparent 62%),
        linear-gradient(180deg, rgba(255, 255, 255, .66), rgba(255, 255, 255, .28));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6), var(--lz-sh-sm);
    overflow: hidden;
}
#lz-postw .lz-faq__badge {
    width: 62px; height: 62px; margin-bottom: 16px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 19px; color: #fff;
    background: var(--lz-grad-brand);
    box-shadow: var(--lz-sh-accent);
}
#lz-postw .lz-faq__badge svg { width: 30px; height: 30px; }
#lz-postw .lz-faq__title { font-size: 25px; font-weight: 800; color: var(--lz-ink); margin-bottom: 8px; }
#lz-postw .lz-faq__title b { color: var(--lz-accent-strong); }
#lz-postw .lz-faq__sub { font-size: 14px; color: var(--lz-ink-soft); line-height: 1.95; max-width: 320px; }
#lz-postw .lz-faq__media { position: relative; width: 100%; margin-top: auto; padding-top: 22px; display: flex; justify-content: center; }
#lz-postw .lz-faq__media::before {
    content: ""; position: absolute; z-index: 0;
    inset-block: 14% -4%; inset-inline: 14%;
    background: radial-gradient(circle at 50% 50%, rgba(232, 74, 138, .30), transparent 70%);
    filter: blur(10px);
}
#lz-postw .lz-faq__img {
    position: relative; z-index: 1;
    max-width: 232px; width: 100%; height: auto; display: block;
    border-radius: var(--lz-r-lg);
    box-shadow: 0 22px 44px -18px rgba(214, 47, 115, .50);
}
#lz-postw .lz-faq__cta {
    position: relative; z-index: 1;
    margin-top: 22px;
    display: inline-flex; align-items: center; gap: 9px;
    padding: 12px 22px; border-radius: var(--lz-pill);
    background: var(--lz-grad-brand); color: #fff;
    font-size: 13.5px; font-weight: 700;
    box-shadow: var(--lz-sh-accent);
    transition: transform var(--lz-fast) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), filter var(--lz-fast) var(--lz-ease);
}
#lz-postw .lz-faq__cta svg { width: 17px; height: 17px; }
#lz-postw .lz-faq__cta:hover { transform: translateY(-2px); filter: saturate(1.06); box-shadow: 0 16px 30px -8px rgba(232, 74, 138, .55); }

/* accordion list */
#lz-postw .lz-faq__list { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
#lz-postw .lz-faq__item {
    position: relative;
    border-radius: var(--lz-r);
    background: rgba(255, 255, 255, .64);
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
    overflow: hidden;
    transition: border-color var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), background var(--lz-mid) var(--lz-ease), transform var(--lz-fast) var(--lz-ease);
}
#lz-postw .lz-faq__item::before {
    content: ""; position: absolute; z-index: 2;
    inset-inline-start: 0; top: 50%; transform: translateY(-50%);
    width: 4px; height: 0; border-radius: var(--lz-pill);
    background: var(--lz-grad-brand);
    transition: height var(--lz-mid) var(--lz-ease);
}
#lz-postw .lz-faq__item:hover { transform: translateY(-1px); box-shadow: var(--lz-sh); }
#lz-postw .lz-faq__item.is-open {
    border-color: rgba(232, 74, 138, .28);
    box-shadow: 0 18px 38px -18px rgba(214, 47, 115, .35);
    background:
        radial-gradient(120% 120% at 100% 0%, rgba(255, 92, 158, .10), transparent 60%),
        rgba(255, 255, 255, .85);
}
#lz-postw .lz-faq__item.is-open::before { height: 54%; }
#lz-postw .lz-faq__q {
    width: 100%;
    display: flex; align-items: center; gap: 14px;
    padding: 17px 20px;
    font-family: var(--lz-font);
    font-size: 15px; font-weight: 700; color: var(--lz-ink);
    text-align: start;
    cursor: pointer;
    transition: color var(--lz-fast) var(--lz-ease);
}
#lz-postw .lz-faq__num {
    flex: 0 0 auto;
    width: 32px; height: 32px; border-radius: 11px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 800;
    color: var(--lz-accent-strong);
    background: var(--lz-accent-soft);
    border: 1px solid rgba(232, 74, 138, .18);
    transition: background var(--lz-mid) var(--lz-ease), color var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), border-color var(--lz-mid) var(--lz-ease);
}
#lz-postw .lz-faq__item.is-open .lz-faq__num { background: var(--lz-grad-brand); color: #fff; border-color: transparent; box-shadow: var(--lz-sh-accent); }
#lz-postw .lz-faq__qt { flex: 1 1 auto; min-width: 0; }
#lz-postw .lz-faq__item:hover .lz-faq__q { color: var(--lz-accent-strong); }
#lz-postw .lz-faq__chev {
    flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--lz-accent); background: rgba(232, 74, 138, .09);
    transition: transform var(--lz-mid) var(--lz-ease), background var(--lz-mid) var(--lz-ease), color var(--lz-mid) var(--lz-ease);
}
#lz-postw .lz-faq__chev svg { width: 16px; height: 16px; }
#lz-postw .lz-faq__item.is-open .lz-faq__chev { transform: rotate(180deg); background: var(--lz-grad-brand); color: #fff; }
#lz-postw .lz-faq__a {
    max-height: 0; overflow: hidden; opacity: 0;
    color: var(--lz-ink-soft); font-size: 14px; line-height: 2.05;
    padding-block: 0; padding-inline: 66px 20px;
    transition: max-height var(--lz-mid) var(--lz-ease), padding-block var(--lz-mid) var(--lz-ease), opacity var(--lz-mid) var(--lz-ease);
}
#lz-postw .lz-faq__item.is-open .lz-faq__a { max-height: 360px; padding-block: 0 18px; opacity: 1; }
#lz-postw .lz-faq__a p { padding-top: 13px; border-top: 1px dashed var(--lz-hair); }

/* ---- section head (single space-between row) ---- */
#lz-postw .lz-postw__head {
    display: flex; align-items: center; justify-content: space-between; gap: 18px;
    margin-bottom: 22px;
}
#lz-postw .lz-postw__heading { display: flex; align-items: center; gap: 14px; min-width: 0; }
#lz-postw .lz-postw__icon {
    flex: 0 0 auto;
    width: 50px; height: 50px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 16px; color: var(--lz-mint-deep);
    background: rgba(47,201,189,.12); border: 1px solid rgba(47,201,189,.25);
}
#lz-postw .lz-postw__icon svg { width: 26px; height: 26px; }
#lz-postw .lz-postw__htext { min-width: 0; }
#lz-postw .lz-postw__htext h2 { font-size: clamp(19px, 2.2vw, 24px); font-weight: 800; color: var(--lz-ink); line-height: 1.3; }
#lz-postw .lz-postw__htext h2 b { color: var(--lz-accent-strong); }
#lz-postw .lz-postw__htext p {
    font-size: 13px; color: var(--lz-ink-soft); line-height: 1.6; margin-top: 4px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* ---- nav arrows (live in the head; RTL inline-end = left) ---- */
#lz-postw .lz-postw__nav { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; }
#lz-postw .lz-postw__nav[hidden] { display: none; }
#lz-postw .lz-postw__arrow {
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(12px) saturate(var(--lz-saturate));
    backdrop-filter: blur(12px) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
    color: var(--lz-ink);
    cursor: pointer;
    transition: transform var(--lz-fast) var(--lz-ease), background var(--lz-mid) var(--lz-ease),
                color var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), border-color var(--lz-mid) var(--lz-ease);
}
#lz-postw .lz-postw__arrow svg { width: 20px; height: 20px; }
#lz-postw .lz-postw__arrow:hover:not(:disabled) { background: var(--lz-grad-brand); color: #fff; border-color: transparent; transform: translateY(-2px); box-shadow: var(--lz-sh-accent); }
#lz-postw .lz-postw__arrow:active:not(:disabled) { transform: scale(.95); }
#lz-postw .lz-postw__arrow:disabled { opacity: .32; cursor: default; box-shadow: none; }

/* ---- slider track (reuses .lz-pcard) — full-bleed to the LEFT only ---- */
#lz-postw .lz-postw__track {
    display: flex;
    gap: 22px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 0 18px;
    /* right edge stays on the container, left edge runs to the screen edge (RTL: inline-end = left) */
    margin-inline-end: calc(50% - 50vw);
    -ms-overflow-style: none;
    scrollbar-width: none;
}
#lz-postw .lz-postw__track::-webkit-scrollbar { display: none; }
#lz-postw .lz-postw__track > .lz-pcard { flex: 0 0 300px; scroll-snap-align: start; }

/* ---- CTA ---- */
#lz-postw .lz-postw__more { display: flex; justify-content: center; margin-top: 26px; }
#lz-postw .lz-postw__more a {
    display: inline-flex; align-items: center; gap: 9px;
    height: 50px; padding: 0 28px;
    border-radius: var(--lz-pill);
    background: var(--lz-grad-brand); color: #fff;
    font-weight: 700; font-size: 14.5px;
    box-shadow: var(--lz-sh-accent);
    transition: transform var(--lz-fast) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), filter var(--lz-fast) var(--lz-ease);
}
#lz-postw .lz-postw__more a svg { width: 20px; height: 20px; transition: transform var(--lz-fast) var(--lz-ease); }
#lz-postw .lz-postw__more a:hover { transform: translateY(-3px); filter: saturate(1.06); box-shadow: 0 18px 34px -10px rgba(232,74,138,.55); }
#lz-postw .lz-postw__more a:hover svg { transform: translateX(-4px); }

/* keep the track's left bleed from creating page-level horizontal scroll */
.wrapper.lz-home { overflow-x: clip; }

/* ---- responsive ---- */
@media (max-width: 860px) {
    #lz-postw .lz-faq { grid-template-columns: 1fr; gap: 20px; padding: 22px; margin-bottom: 44px; border-radius: 24px; }
    #lz-postw .lz-faq__intro { padding: 26px 20px 22px; }
    #lz-postw .lz-faq__sub { max-width: 420px; }
}
@media (max-width: 600px) {
    #lz-postw .lz-postw__head { margin-bottom: 16px; gap: 12px; }
    #lz-postw .lz-postw__icon { width: 44px; height: 44px; border-radius: 14px; }
    #lz-postw .lz-postw__icon svg { width: 22px; height: 22px; }
    #lz-postw .lz-postw__htext p { display: none; }
    #lz-postw .lz-postw__nav { display: none; }
    #lz-postw .lz-postw__track > .lz-pcard { flex-basis: 82%; }
    #lz-postw .lz-faq { padding: 16px; }
    #lz-postw .lz-faq__img { max-width: 180px; }
    #lz-postw .lz-faq__q { padding: 14px; font-size: 14px; gap: 11px; }
    #lz-postw .lz-faq__num { width: 28px; height: 28px; border-radius: 9px; font-size: 13px; }
    #lz-postw .lz-faq__a { padding-inline: 53px 16px; font-size: 13.5px; }
}
@media (prefers-reduced-motion: reduce) {
    #lz-postw *, #lz-postw *::before, #lz-postw *::after { transition-duration: .01ms !important; }
}


/* =======================================================================
   ====================  PRODUCT CARD (.lz-prod)  ========================
   Isolated, unique-class card used by all listings + home carousels.
   Keeps only the functional hooks (.cart / .add-to-cart-single[data-action]).
   ======================================================================= */
.lz-prod {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: var(--lz-r-lg);
    overflow: hidden;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
    font-family: var(--lz-font);
    -webkit-font-smoothing: antialiased;
    transition: transform var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease);
}
.lz-prod, .lz-prod *, .lz-prod *::before, .lz-prod *::after { box-sizing: border-box; }
/* base reset for reused/native elements inside the card */

/* =======================================================================
   لبخند زیبا · Liquid Glass · Floating Contact (FAB + messenger modal)
   FULLY ISOLATED under #lz-contact (rendered OUTSIDE #lz-footer so the dark
   footer styles can never bleed in). Phone-icon FAB → glass popover /
   bottom-sheet of dynamic contact channels (config('front.socials') + options).
   NOTE: every component rule is #lz-contact-scoped (id, specificity >= 1,1,0)
   so it always beats the reset below (1,0,0) AND any theme class (0,1,0).
   Physical right/bottom (not logical inset-inline) -> stays bottom-RIGHT on RTL.
   ======================================================================= */
#lz-contact, #lz-contact * { box-sizing: border-box; }
#lz-contact :where(a, button) {
    margin: 0; border: 0; outline: 0;
    font-family: var(--lz-font); text-decoration: none; color: inherit;
    -webkit-appearance: none; appearance: none; cursor: pointer;
}

/* ---- Floating action button ---- */
#lz-contact .lz-fab {
    position: fixed; right: 22px; bottom: 24px;
    width: 62px; height: 62px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--lz-pill);
    background: var(--lz-grad-brand);
    color: #fff; cursor: pointer;
    box-shadow: var(--lz-sh-accent), 0 10px 28px -10px rgba(20,24,43,.5);
    z-index: 99998;
    transition: transform var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease);
}
#lz-contact .lz-fab:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 18px 40px -10px rgba(232,74,138,.6); }
#lz-contact .lz-fab:active { transform: scale(.96); }
#lz-contact .lz-fab:focus-visible { outline: 3px solid rgba(255,255,255,.9); outline-offset: 3px; }

#lz-contact .lz-fab__pulse {
    position: absolute; inset: 0; border-radius: inherit;
    background: var(--lz-accent); z-index: -1; opacity: .5;
    animation: lz-fab-pulse 2.2s var(--lz-ease) infinite;
}
@keyframes lz-fab-pulse { 0% { transform: scale(1); opacity: .5; } 70% { transform: scale(1.6); opacity: 0; } 100% { opacity: 0; } }

#lz-contact .lz-fab__ic {
    position: absolute; display: flex; align-items: center; justify-content: center;
    transition: opacity var(--lz-mid) var(--lz-ease), transform var(--lz-mid) var(--lz-ease);
}
#lz-contact .lz-fab__ic svg { width: 30px; height: 30px; }
#lz-contact .lz-fab__ic--close { opacity: 0; transform: rotate(-45deg) scale(.5); }
#lz-contact .lz-fab__ic--close svg { width: 26px; height: 26px; }
#lz-contact.is-open .lz-fab__ic--phone { opacity: 0; transform: rotate(45deg) scale(.5); }
#lz-contact.is-open .lz-fab__ic--close { opacity: 1; transform: none; }
#lz-contact.is-open .lz-fab__pulse { animation: none; opacity: 0; }

#lz-contact .lz-fab__tip {
    position: absolute; right: calc(100% + 12px); top: 50%;
    transform: translateY(-50%) translateX(8px);
    white-space: nowrap; font-size: 13px; font-weight: 600; color: var(--lz-ink);
    background: var(--lz-glass-solid); padding: 7px 13px; border-radius: var(--lz-pill);
    box-shadow: var(--lz-sh); opacity: 0; pointer-events: none;
    transition: opacity var(--lz-fast) var(--lz-ease), transform var(--lz-fast) var(--lz-ease);
}
#lz-contact .lz-fab:hover .lz-fab__tip { opacity: 1; transform: translateY(-50%) translateX(0); }
#lz-contact.is-open .lz-fab__tip { opacity: 0 !important; }

/* ---- Overlay (dimmed + blurred, click to close) ---- */
#lz-contact .lz-contact__overlay {
    position: fixed; inset: 0; z-index: 99990;
    background: radial-gradient(120% 90% at 85% 90%, rgba(232,74,138,.16), transparent 55%), rgba(13,16,35,.52);
    -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);
    opacity: 0; visibility: hidden;
    transition: opacity var(--lz-mid) var(--lz-ease), visibility 0s var(--lz-mid);
}
#lz-contact.is-open .lz-contact__overlay {
    opacity: 1; visibility: visible;
    transition: opacity var(--lz-mid) var(--lz-ease), visibility 0s 0s;
}

/* ---- Panel: centered, strongly-elevated glass MODAL ---- */
#lz-contact .lz-contact__panel {
    position: fixed; z-index: 99995;
    top: 50%; left: 50%;
    width: 392px; max-width: calc(100vw - 32px); max-height: min(86vh, 640px);
    display: flex; flex-direction: column; overflow: hidden;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    backdrop-filter: blur(var(--lz-blur-strong)) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    border-radius: 26px;
    box-shadow: var(--lz-sh-pop),
                inset 0 0 0 1px rgba(255,255,255,.35),
                inset 0 1.5px 0 rgba(255,255,255,.85),
                0 30px 80px -28px rgba(177,75,208,.42);
    opacity: 0; visibility: hidden;
    transform: translate(-50%,-50%) translateY(22px) scale(.92);
    transform-origin: bottom right;
    transition: opacity var(--lz-mid) var(--lz-ease), transform var(--lz-mid) var(--lz-ease), visibility 0s var(--lz-mid);
}
#lz-contact .lz-contact__panel:focus,
#lz-contact .lz-contact__panel:focus-visible { outline: none; }
#lz-contact.is-open .lz-contact__panel {
    opacity: 1; visibility: visible; transform: translate(-50%,-50%);
    transition: opacity var(--lz-mid) var(--lz-ease),
                transform 360ms cubic-bezier(.34,1.46,.5,1),
                visibility 0s 0s;
}
/* solid fallback so it never looks washed out without backdrop-filter (covers panel, overlay AND aurora) */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    #lz-contact .lz-contact__panel { background: rgba(255,255,255,.97); }
    #lz-contact .lz-contact__overlay { background: rgba(13,16,35,.62); }
    #lz-contact .lz-aurora { opacity: .5; }
}

/* ---- Living aurora bloom drifting BEHIND the frosted glass (on-brand: pink + soft-purple + mint) ---- */
#lz-contact .lz-aurora {
    position: absolute; inset: -40%; z-index: 0; pointer-events: none;
    filter: blur(34px) saturate(130%); opacity: .9;
    background:
        radial-gradient(38% 42% at 22% 26%, #FF5C9E 0%, transparent 62%),
        radial-gradient(40% 44% at 80% 22%, #B14BD0 0%, transparent 60%),
        radial-gradient(46% 50% at 74% 82%, #2FC9BD 0%, transparent 62%),
        radial-gradient(40% 46% at 18% 84%, #E84A8A 0%, transparent 60%),
        radial-gradient(60% 60% at 50% 50%, #B14BD0 0%, transparent 70%);
    background-size: 180% 180%;
    animation: lz-aurora-drift 16s ease-in-out infinite alternate;
}
#lz-contact .lz-aurora::after {
    content: ""; position: absolute; inset: 0;
    background: conic-gradient(from 120deg at 60% 40%,
        rgba(255,92,158,.45), rgba(177,75,208,.45), rgba(47,201,189,.45), rgba(232,74,138,.45), rgba(255,92,158,.45));
    mix-blend-mode: screen; opacity: .3;
    animation: lz-aurora-spin 24s linear infinite;
}
@keyframes lz-aurora-drift {
    0%   { background-position: 0% 50%;   transform: scale(1.05) translate(0,0); }
    50%  { background-position: 100% 30%; transform: scale(1.18) translate(2%,-3%); }
    100% { background-position: 30% 100%; transform: scale(1.08) translate(-2%,2%); }
}
@keyframes lz-aurora-spin { to { transform: rotate(360deg); } }

/* soft scrim over the aurora keeps the frost milky & text AA-legible */
#lz-contact .lz-contact__panel::before {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, rgba(255,255,255,.50), rgba(255,255,255,.38) 40%, rgba(255,255,255,.56));
}
/* thin iridescent specular light running along the TOP edge */
#lz-contact .lz-contact__panel::after {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; z-index: 3; pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.2) 10%, #FFB6D5 28%, #E2B6F0 46%, #A8F0E8 64%, rgba(255,255,255,.2) 90%, transparent);
    background-size: 220% 100%;
    animation: lz-specular 6s linear infinite;
    box-shadow: 0 0 12px rgba(255,255,255,.55);
}
@keyframes lz-specular { to { background-position: -220% 0; } }

/* pause the heavy aurora/specular compositing while the (hidden) modal is closed */
#lz-contact .lz-aurora,
#lz-contact .lz-aurora::after,
#lz-contact .lz-contact__panel::after { animation-play-state: paused; }
#lz-contact.is-open .lz-aurora,
#lz-contact.is-open .lz-aurora::after,
#lz-contact.is-open .lz-contact__panel::after { animation-play-state: running; }

/* keep real content above the aurora + scrim */
#lz-contact .lz-contact__head,
#lz-contact .lz-contact__grid,
#lz-contact .lz-contact__foot { position: relative; z-index: 2; }

/* ---- Head ---- */
#lz-contact .lz-contact__head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    padding: 20px 20px 14px;
    border-bottom: 1px solid var(--lz-hair);
}
#lz-contact .lz-contact__heading { min-width: 0; }
#lz-contact .lz-contact__eyebrow {
    display: inline-flex; align-items: center; gap: 6px; margin: 0 0 7px;
    font-size: 11.5px; font-weight: 700; letter-spacing: .01em;
    color: var(--lz-accent-strong);
    background: rgba(255,255,255,.6); padding: 4px 11px 4px 9px; border-radius: var(--lz-pill);
    border: 1px solid rgba(232,74,138,.18);
}
#lz-contact .lz-contact__eyebrow .dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--lz-mint); box-shadow: 0 0 0 0 rgba(47,201,189,.5);
    animation: lz-live 2s var(--lz-ease) infinite;
}
@keyframes lz-live { 0% { box-shadow: 0 0 0 0 rgba(47,201,189,.5); } 70% { box-shadow: 0 0 0 7px rgba(47,201,189,0); } 100% { box-shadow: 0 0 0 0 rgba(47,201,189,0); } }
#lz-contact .lz-contact__title { margin: 0; font-size: 18px; font-weight: 800; color: var(--lz-ink); letter-spacing: -.01em; }
#lz-contact .lz-contact__sub { margin: 4px 0 0; font-size: 12.5px; color: var(--lz-ink-soft); line-height: 1.7; max-width: 26ch; }
#lz-contact .lz-contact__close {
    position: relative; flex: 0 0 auto; width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; color: var(--lz-ink-soft); cursor: pointer;
    background: rgba(255,255,255,.62); border: 1px solid var(--lz-hair);
    transition: background var(--lz-fast), color var(--lz-fast), transform var(--lz-fast);
}
#lz-contact .lz-contact__close::after { content: ""; position: absolute; inset: -2px; } /* extends hit area to >=44px */
#lz-contact .lz-contact__close:hover { background: var(--lz-accent-soft); color: var(--lz-accent-strong); transform: rotate(90deg); }
#lz-contact .lz-contact__close:focus-visible { outline: 2px solid var(--lz-accent); outline-offset: 2px; }
#lz-contact .lz-contact__close svg { width: 18px; height: 18px; }

/* ---- Channel grid ---- */
#lz-contact .lz-contact__grid {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px;
    padding: 18px; overflow-y: auto; -webkit-overflow-scrolling: touch;
}

#lz-contact .lz-ch {
    position: relative; overflow: hidden;
    display: flex; align-items: center; gap: 12px;
    padding: 13px 14px; text-align: right; min-height: 44px;
    background: rgba(255,255,255,.62);
    border: 1px solid rgba(255,255,255,.75);
    border-radius: var(--lz-r); cursor: pointer;
    box-shadow: var(--lz-sh-sm), inset 0 1px 0 rgba(255,255,255,.7);
    transition: transform var(--lz-fast) var(--lz-ease), box-shadow var(--lz-fast) var(--lz-ease),
                border-color var(--lz-fast), background var(--lz-fast);
}
/* holographic sheen sweep on hover (RTL: travels right -> left) */
#lz-contact .lz-ch::before {
    content: ""; position: absolute; top: 0; bottom: 0; right: -60%; width: 55%; pointer-events: none;
    background: linear-gradient(105deg, transparent, rgba(255,255,255,.85), rgba(232,182,240,.5), transparent);
    transform: skewX(-18deg); opacity: 0;
    transition: opacity var(--lz-fast) ease;
}
#lz-contact .lz-ch:hover {
    transform: translateY(-4px);
    background: rgba(255,255,255,.84);
    box-shadow: var(--lz-sh), inset 0 1px 0 rgba(255,255,255,.9);
    border-color: rgba(255,255,255,.95);
}
#lz-contact .lz-ch:hover::before { opacity: 1; animation: lz-sheen .8s var(--lz-ease); }
@keyframes lz-sheen { 0% { right: -60%; } 100% { right: 115%; } }
#lz-contact .lz-ch:focus-visible { outline: 2px solid var(--lz-accent); outline-offset: 2px; }

#lz-contact .lz-ch__ic {
    position: relative; flex: 0 0 auto;
    width: 46px; height: 46px; display: flex; align-items: center; justify-content: center;
    border-radius: 14px; background: var(--ch, var(--lz-grad-brand));
    box-shadow: 0 8px 18px -7px rgba(20,24,43,.5);
}
#lz-contact .lz-ch__ic::after { /* glossy top highlight on the chip */
    content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: linear-gradient(180deg, rgba(255,255,255,.42), transparent 55%);
}
#lz-contact .lz-ch__ic svg { width: 24px; height: 24px; position: relative; z-index: 1; }
#lz-contact .lz-ch__tx { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
#lz-contact .lz-ch__name { font-size: 13.5px; font-weight: 700; color: var(--lz-ink); }
#lz-contact .lz-ch__hint { font-size: 12px; font-weight: 500; color: var(--lz-ink-soft); }

/* staggered tile entrance (reduced-motion safe — see media query) */
#lz-contact.is-open .lz-ch { animation: lz-tile-in 420ms var(--lz-ease) both; }
#lz-contact.is-open .lz-ch:nth-child(1) { animation-delay: 90ms; }
#lz-contact.is-open .lz-ch:nth-child(2) { animation-delay: 130ms; }
#lz-contact.is-open .lz-ch:nth-child(3) { animation-delay: 170ms; }
#lz-contact.is-open .lz-ch:nth-child(4) { animation-delay: 210ms; }
#lz-contact.is-open .lz-ch:nth-child(5) { animation-delay: 250ms; }
#lz-contact.is-open .lz-ch:nth-child(6) { animation-delay: 290ms; }
#lz-contact.is-open .lz-ch:nth-child(n+7) { animation-delay: 330ms; }
@keyframes lz-tile-in { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }

/* ---- Foot (reassurance line) ---- */
#lz-contact .lz-contact__foot {
    padding: 12px 18px 16px; border-top: 1px solid var(--lz-hair);
    display: flex; align-items: center; justify-content: center; gap: 7px;
    font-size: 12px; font-weight: 600; color: var(--lz-ink-soft);
}
#lz-contact .lz-contact__foot svg { width: 14px; height: 14px; color: var(--lz-mint-deep); flex: 0 0 auto; }

body.lz-contact-lock { overflow: hidden; }

/* ---- responsive ---- */
@media (max-width: 991px) {
    #lz-contact .lz-fab { width: 56px; height: 56px; right: 14px; bottom: 86px; }
    #lz-contact .lz-fab__ic svg { width: 27px; height: 27px; }
}
@media (max-width: 560px) {
    #lz-contact .lz-contact__panel {
        top: auto; left: 0; right: 0; bottom: 0;
        width: auto; max-width: none; max-height: 88vh;
        border-radius: 26px 26px 0 0;
        transform: translateY(100%); transform-origin: bottom center;
    }
    #lz-contact.is-open .lz-contact__panel { transform: translateY(0); }
    #lz-contact .lz-contact__panel::after { border-radius: 26px 26px 0 0; animation: none; }
    #lz-contact .lz-contact__grid { grid-template-columns: 1fr; }
    /* tame the aurora on mobile (GPU + Safari blend cost) */
    #lz-contact .lz-aurora { filter: blur(28px) saturate(122%); animation-duration: 26s; }
    #lz-contact .lz-aurora::after { display: none; }
}

/* ---- reduced motion: freeze aurora + kill transitions/animations ---- */
@media (prefers-reduced-motion: reduce) {
    #lz-contact .lz-fab, #lz-contact .lz-fab__ic, #lz-contact .lz-fab__tip,
    #lz-contact .lz-contact__overlay, #lz-contact .lz-contact__panel,
    #lz-contact .lz-ch, #lz-contact .lz-contact__close {
        transition-duration: .01ms !important;
    }
    #lz-contact .lz-fab__pulse,
    #lz-contact .lz-aurora, #lz-contact .lz-aurora::after,
    #lz-contact .lz-contact__panel::after,
    #lz-contact .lz-contact__eyebrow .dot,
    #lz-contact.is-open .lz-ch { animation: none !important; }
    #lz-contact.is-open .lz-ch { opacity: 1; transform: none; }
}
/* =======================================================================
   widgets/categories.blade.php · isolated under #lz-cats · BENTO GRID
   Glass tiles + full-bleed product image + slim liquid-glass caption.
   3-col grid (one .is-feat 2x2 + uniform .is-cell ~2:1) so the landscape
   product photos stay visible with minimal crop. auto-flow:dense keeps it
   gap-free for any count.
   ======================================================================= */
#lz-cats {
    position: relative;
    display: block;
    padding: 26px 0 16px;
    font-family: var(--lz-font);
    color: var(--lz-ink);
    -webkit-font-smoothing: antialiased;
}
#lz-cats, #lz-cats *, #lz-cats *::before, #lz-cats *::after { box-sizing: border-box; }
#lz-cats a { text-decoration: none; color: inherit; }

/* reset (low specificity = just #lz-cats, sits below our styling, above theme) */
#lz-cats :where(.lz-cats__head, .lz-cats__head *, .lz-cat, .lz-cat *) {
    margin: 0; padding: 0; border: 0;
    background: none; box-shadow: none; list-style: none; float: none;
    text-decoration: none; color: inherit;
    font-family: var(--lz-font); line-height: inherit;
}

/* ---- section head ---- */
#lz-cats .lz-cats__head { text-align: center; margin-bottom: 30px; }
#lz-cats .lz-cats__head .lz-cats__icon {
    width: 56px; height: 56px; margin: 0 auto 14px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 18px; color: var(--lz-accent-strong);
    background: rgba(232, 74, 138, .10);
    border: 1px solid rgba(232, 74, 138, .22);
}
#lz-cats .lz-cats__head .lz-cats__icon svg { width: 28px; height: 28px; }
#lz-cats .lz-cats__head h2 { font-size: clamp(22px, 3vw, 28px); font-weight: 800; color: var(--lz-ink); margin-bottom: 8px; }
#lz-cats .lz-cats__head h2 b { color: var(--lz-accent-strong); }
#lz-cats .lz-cats__head p { font-size: 14px; color: var(--lz-ink-soft); line-height: 1.9; max-width: 460px; margin: 0 auto; }

/* ---- bento grid (3-col: feature 2x2 + uniform landscape cells) ---- */
#lz-cats .lz-cats__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 188px;
    grid-auto-flow: dense;
    gap: 18px;
}
#lz-cats .lz-cat.is-feat { grid-column: span 2; grid-row: span 2; }
#lz-cats .lz-cat.is-cell { grid-column: span 1; grid-row: span 1; }

/* ---- tile ---- */
#lz-cats .lz-cat {
    position: relative;
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 11px;
    overflow: hidden;
    border-radius: var(--lz-r-lg);
    isolation: isolate;
    background:
        radial-gradient(120% 120% at 100% 0%, rgba(255, 92, 158, .14), transparent 58%),
        radial-gradient(120% 120% at 0% 100%, rgba(47, 201, 189, .12), transparent 58%),
        var(--lz-glass-strong);
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
    transition: transform var(--lz-mid) var(--lz-ease),
                box-shadow var(--lz-mid) var(--lz-ease),
                border-color var(--lz-mid) var(--lz-ease);
}
#lz-cats .lz-cat__img {
    position: absolute; inset: 0; z-index: 0;
    width: 100%; height: 100%;
    object-fit: cover; object-position: center;
    transition: transform var(--lz-mid) var(--lz-ease);
}
/* soft scrim only at the very bottom so the product stays visible */
#lz-cats .lz-cat__shade {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(to top, rgba(20, 24, 43, .26) 0%, rgba(20, 24, 43, .02) 30%, transparent 52%);
}

/* ---- slim liquid-glass caption ---- */
#lz-cats .lz-cat__cap {
    position: relative; z-index: 2;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 7px 7px 7px 9px;
    border-radius: 15px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .50), rgba(255, 255, 255, .34));
    -webkit-backdrop-filter: blur(26px) saturate(190%);
    backdrop-filter: blur(26px) saturate(190%);
    border: 1px solid rgba(255, 255, 255, .55);
    box-shadow: 0 8px 22px -10px rgba(20, 24, 43, .30), inset 0 1px 0 rgba(255, 255, 255, .8);
    transition: transform var(--lz-mid) var(--lz-ease);
}
#lz-cats .lz-cat__text { display: flex; flex-direction: column; gap: 1px; min-width: 0; padding-inline-start: 6px; }
#lz-cats .lz-cat__title {
    font-size: 14px; font-weight: 800; color: var(--lz-ink);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#lz-cats .lz-cat__count { font-size: 11px; font-weight: 700; color: var(--lz-accent-strong); }
#lz-cats .lz-cat.is-feat .lz-cat__title { font-size: 18px; }
#lz-cats .lz-cat.is-feat .lz-cat__count { font-size: 12.5px; }
#lz-cats .lz-cat.is-feat .lz-cat__cap { padding: 9px 9px 9px 12px; border-radius: 17px; }

#lz-cats .lz-cat__cta {
    flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: 5px;
    padding: 8px 14px;
    border-radius: var(--lz-pill);
    font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap;
    background: var(--lz-grad-brand);
    box-shadow: var(--lz-sh-accent);
    transition: transform var(--lz-fast) var(--lz-ease);
}
#lz-cats .lz-cat__cta svg { width: 14px; height: 14px; transition: transform var(--lz-fast) var(--lz-ease); }

/* ---- hover ---- */
#lz-cats .lz-cat:hover { transform: translateY(-5px); box-shadow: var(--lz-sh); border-color: rgba(232, 74, 138, .30); }
#lz-cats .lz-cat:hover .lz-cat__img { transform: scale(1.07); }
#lz-cats .lz-cat:hover .lz-cat__cta { transform: translateY(-1px); }
#lz-cats .lz-cat:hover .lz-cat__cta svg { transform: translateX(-3px); }
#lz-cats .lz-cat:focus-visible { outline: 2px solid var(--lz-accent); outline-offset: 3px; }

/* ---- responsive ---- */
@media (max-width: 991.98px) {
    #lz-cats .lz-cats__grid { grid-auto-rows: 168px; gap: 14px; }
}
@media (max-width: 767.98px) {
    #lz-cats .lz-cats__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 156px; }
    #lz-cats .lz-cat.is-feat { grid-column: span 2; grid-row: span 1; }
    #lz-cats .lz-cat.is-cell { grid-column: span 1; grid-row: span 1; }
}
@media (max-width: 479.98px) {
    #lz-cats .lz-cats__grid { grid-template-columns: 1fr; grid-auto-rows: 184px; gap: 12px; }
    #lz-cats .lz-cat.is-feat, #lz-cats .lz-cat.is-cell { grid-column: span 1; grid-row: span 1; }
}

/* ---- no backdrop-filter fallback ---- */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    #lz-cats .lz-cat__cap { background: rgba(255, 255, 255, .92); }
}
@media (prefers-reduced-motion: reduce) {
    #lz-cats .lz-cat, #lz-cats .lz-cat__img, #lz-cats .lz-cat__cta, #lz-cats .lz-cat__cta svg { transition-duration: .01ms; }
    #lz-cats .lz-cat:hover { transform: none; }
    #lz-cats .lz-cat:hover .lz-cat__img { transform: none; }
}


/* =======================================================================
   ====================  PRODUCTS WIDGET (.lz-prodw)  ====================
   Home product carousels (products-default-block). Isolated wrapper with a
   blog-style single-row head + a full-bleed-LEFT scroll-snap track that
   reuses the shared .lz-prod card. Mirrors #lz-postw. The page-scroll guard
   is the shared `.wrapper.lz-home { overflow-x: clip }` rule defined above.
   ======================================================================= */
.lz-prodw { font-family: var(--lz-font); -webkit-font-smoothing: antialiased; color: var(--lz-ink); margin-bottom: 10px; }
.lz-prodw, .lz-prodw *, .lz-prodw *::before, .lz-prodw *::after { box-sizing: border-box; }
.lz-prodw a { text-decoration: none; color: inherit; }

/* reset (low specificity; explicit rules below follow in source order and win) */
.lz-prodw :where(.lz-prodw__head, .lz-prodw__head *) {
    margin: 0; padding: 0; border: 0;
    background: none; box-shadow: none; list-style: none; float: none;
    text-decoration: none; color: inherit;
    font-family: var(--lz-font); line-height: inherit;
}

/* head: single space-between row */
.lz-prodw__head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.lz-prodw__heading { display: flex; align-items: center; gap: 14px; min-width: 0; }
.lz-prodw__icon {
    flex: 0 0 auto; width: 50px; height: 50px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 16px; color: var(--lz-accent-strong);
    background: var(--lz-accent-soft); border: 1px solid rgba(232, 74, 138, .22);
}
.lz-prodw__icon svg { width: 26px; height: 26px; }
.lz-prodw__title { min-width: 0; font-size: clamp(19px, 2.2vw, 24px); font-weight: 800; color: var(--lz-ink); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* tools: arrows + see-all grouped on the RTL end (left) */
.lz-prodw__tools { flex: 0 0 auto; display: flex; align-items: center; gap: 14px; }
.lz-prodw__all { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 700; color: var(--lz-accent-strong); white-space: nowrap; transition: gap var(--lz-fast) var(--lz-ease); }
.lz-prodw__all svg { width: 18px; height: 18px; }
.lz-prodw__all:hover { gap: 11px; }

.lz-prodw__nav { display: flex; align-items: center; gap: 10px; }
.lz-prodw__nav[hidden] { display: none; }
.lz-prodw__arrow {
    width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--lz-glass-strong);
    -webkit-backdrop-filter: blur(12px) saturate(var(--lz-saturate));
    backdrop-filter: blur(12px) saturate(var(--lz-saturate));
    border: 1px solid var(--lz-glass-edge);
    box-shadow: var(--lz-sh-sm);
    color: var(--lz-ink);
    cursor: pointer;
    transition: transform var(--lz-fast) var(--lz-ease), background var(--lz-mid) var(--lz-ease),
                color var(--lz-mid) var(--lz-ease), box-shadow var(--lz-mid) var(--lz-ease), border-color var(--lz-mid) var(--lz-ease);
}
.lz-prodw__arrow svg { width: 20px; height: 20px; }
.lz-prodw__arrow:hover:not(:disabled) { background: var(--lz-grad-brand); color: #fff; border-color: transparent; transform: translateY(-2px); box-shadow: var(--lz-sh-accent); }
.lz-prodw__arrow:active:not(:disabled) { transform: scale(.95); }
.lz-prodw__arrow:disabled { opacity: .32; cursor: default; box-shadow: none; }

/* track: full-bleed to the LEFT only (RTL: inline-end = left) */
.lz-prodw__track {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scroll-behavior: smooth;
    padding: 4px 0 10px;
    margin-inline-end: calc(50% - 50vw);
    -ms-overflow-style: none; scrollbar-width: none;
}
.lz-prodw__track::-webkit-scrollbar { display: none; }
.lz-prodw__track > .item, .lz-prodw__track > .lz-prod { flex: 0 0 220px; min-width: 0; margin: 0; padding: 0; scroll-snap-align: start; }

/* responsive */
@media (max-width: 600px) {
    .lz-prodw__head { margin-bottom: 14px; gap: 12px; }
    .lz-prodw__icon { width: 44px; height: 44px; border-radius: 14px; }
    .lz-prodw__icon svg { width: 22px; height: 22px; }
    .lz-prodw__nav { display: none; }
    .lz-prodw__track > .item, .lz-prodw__track > .lz-prod { flex-basis: 46%; }
}
@media (prefers-reduced-motion: reduce) {
    .lz-prodw *, .lz-prodw *::before, .lz-prodw *::after { transition-duration: .01ms !important; }
}

/* ── Main slider: full-bleed (edge-to-edge, no side gap) ─────────── */
.main-slider-full { max-width: 100%; padding-right: 0; padding-left: 0; }
.main-slider-full .index-main-slider { margin-right: 0; margin-left: 0; }
.main-slider-full .index-main-slider > [class*="col-"] { padding-right: 0; padding-left: 0; }
/* drop the card frame so the slide sits flush against the viewport edges */
.main-slider-full .main-slider.card { border: 0; border-radius: 0; margin: 0; box-shadow: none; }
.main-slider-full .main-slider .carousel-item img,
.main-slider-full .main-slider .carousel-inner img { border-radius: 0; }

/* ── Toman currency symbol — replaces the "تومان" suffix text ───────
   Compact inline SVG currency mark (the official Toman symbol). Inherits
   the price color via currentColor (shown at 50% via the path fill-opacity)
   and scales with the surrounding text.
   Markup: @include('front::partials.toman')  →  <svg class="toman">…    */
.toman{
    display:inline-block;
    width:auto;
    height:1.18em;              /* near-square mark, ~digit height        */
    vertical-align:-.2em;       /* centre on the text                     */
    margin-inline-start:.34em;  /* gap between the number and the mark    */
    flex:0 0 auto;              /* never shrink inside a flex price row    */
    fill:currentColor;
    pointer-events:none;
}
/* struck-through old prices: keep the mark a touch lighter, like the text */
del .toman,.lz-prod__old .toman,.old-cart-product-price .toman{opacity:.9}