/* Opt-in sections only; legacy storefront styling is untouched. */
.cat-flex.home-categories{grid-auto-flow:column;grid-template-rows:repeat(var(--home-rows),auto)!important;overflow-x:auto;overflow-y:hidden;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior-y:auto;align-items:start}
.home-categories.rows-1{--home-rows:1}.home-categories.rows-2{--home-rows:2}.home-categories.rows-3{--home-rows:3}
.home-categories.shape-vertical .cat-box{height:auto;aspect-ratio:3/4}
.home-categories.shape-horizontal .cat-box{height:auto;aspect-ratio:4/3}
.home-categories.shape-circle .cat-box{height:auto;aspect-ratio:1;border-radius:50%;overflow:visible;margin-bottom:44px}
.home-categories.shape-circle .cat-box-overlay{border-radius:50%}
.home-categories.shape-circle .cat-box-name{position:absolute;top:100%;bottom:auto;left:0;right:0;color:var(--bs-body-color,#26334a);text-shadow:none;padding:8px 0 0;font-size:12px;line-height:1.4;min-height:38px}
.home-block{margin:24px 0}.home-block>h5{margin-bottom:14px}.home-banner-image{display:block;width:100%;height:auto;border-radius:16px}
.home-sub-rail,.home-products-rail{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:none;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior-x:contain;overscroll-behavior-y:auto;padding:4px 0 12px;cursor:grab}
.home-sub-rail::-webkit-scrollbar,.home-products-rail::-webkit-scrollbar{display:none}
.home-sub-link{flex:0 0 110px;display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;color:inherit;text-decoration:none;scroll-snap-align:start;font-size:13px}
.home-sub-link img,.home-sub-placeholder{width:100%;aspect-ratio:1;object-fit:cover;border-radius:50%;background:#edf1f6}.home-sub-placeholder{display:grid;place-items:center;font-size:28px}
.home-products-rail>.home-product{flex:0 0 250px;min-width:0;scroll-snap-align:start}
.home-products-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.home-product{min-width:0}.home-product .card{overflow:hidden}
.home-block img{-webkit-user-drag:none}
@media(max-width:767px){.home-sub-link{flex-basis:82px}.home-products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.home-products-rail>.home-product{flex-basis:72%}}

.home-ticker.alert{overflow:hidden;background:var(--ticker-bg);color:var(--ticker-fg);min-height:var(--ticker-height);font-size:var(--ticker-size);direction:rtl;border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:6px 10px;margin-block:20px;box-shadow:0 4px 14px rgba(23,35,61,.06)}
.home-ticker-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:12px;background:rgba(255,255,255,.22);font-size:19px}
.home-ticker-window{flex:1;min-width:0;overflow:hidden;direction:ltr}
.home-ticker-track{width:max-content;min-width:100%;padding:4px 0;white-space:nowrap;direction:rtl;text-align:center;font-weight:600;line-height:1.7}
.home-ticker-track.is-animated{display:flex;direction:ltr;will-change:transform}
.home-ticker-copy{flex:none;direction:rtl;text-align:center;padding-inline:24px;box-sizing:border-box}
.home-ticker-toggle.btn{flex:0 0 44px;width:44px;min-height:44px;padding:0;color:inherit;border:0;border-radius:12px;background:rgba(255,255,255,.18);font-size:20px}
.home-ticker-toggle.btn:hover{background:rgba(255,255,255,.32);color:inherit}
.home-ticker-toggle:focus-visible{outline:2px solid currentColor;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.home-ticker-track{white-space:normal;overflow-wrap:anywhere;width:auto;min-width:0}.home-ticker-toggle{display:none}}

/* Plain announcement strip: no icon controls, corners, border, or exterior gap. */
.home-ticker.alert { border-radius:0; border:0; box-shadow:none; margin-block:0; }
.home-ticker .home-ticker-icon,.home-ticker .home-ticker-toggle { display:none; }
/* Small category collections fill one complete row, including custom layouts. */
.cat-flex:has(> .cat-box:nth-child(2):last-child),
.cat-flex:has(> .cat-box:nth-child(3):last-child){grid-auto-flow:row;grid-template-rows:auto!important;grid-auto-columns:auto}
.cat-flex:has(> .cat-box:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.cat-flex:has(> .cat-box:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}

/* ===== Unified store header image (StoreFront, LikedItems, Purchases, info) =====
   One sizing rule for every store page, plus feathered edges so the artwork
   melts into the header band colour instead of showing hard rectangle edges.
   This file is loaded last on all four pages, so these rules are the source of truth. */
.hero.hero-has-image{ --hero-fade-x:clamp(40px,7%,96px); --hero-fade-y:clamp(28px,12%,56px); }
.hero.hero-has-image .hero-image{
    -webkit-mask-image:
        linear-gradient(to right, transparent 0, rgba(0,0,0,.45) calc(var(--hero-fade-x) * .45), #000 var(--hero-fade-x), #000 calc(100% - var(--hero-fade-x)), rgba(0,0,0,.45) calc(100% - var(--hero-fade-x) * .45), transparent 100%),
        linear-gradient(to bottom, transparent 0, rgba(0,0,0,.45) calc(var(--hero-fade-y) * .45), #000 var(--hero-fade-y), #000 calc(100% - var(--hero-fade-y)), rgba(0,0,0,.45) calc(100% - var(--hero-fade-y) * .45), transparent 100%);
    -webkit-mask-composite: source-in;
            mask-image:
        linear-gradient(to right, transparent 0, rgba(0,0,0,.45) calc(var(--hero-fade-x) * .45), #000 var(--hero-fade-x), #000 calc(100% - var(--hero-fade-x)), rgba(0,0,0,.45) calc(100% - var(--hero-fade-x) * .45), transparent 100%),
        linear-gradient(to bottom, transparent 0, rgba(0,0,0,.45) calc(var(--hero-fade-y) * .45), #000 var(--hero-fade-y), #000 calc(100% - var(--hero-fade-y)), rgba(0,0,0,.45) calc(100% - var(--hero-fade-y) * .45), transparent 100%);
            mask-composite: intersect;
    -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
}
/* Mobile / tablet: full-width artwork at its natural ratio on a brand band. */
@media (max-width: 991.98px){
    .hero.hero-has-image{ height:auto; min-height:0; background:var(--brand); }
    .hero.hero-has-image .hero-image{ width:100%; height:auto; max-height:none; object-fit:contain; }
    .hero.hero-has-image{ --hero-fade-x:clamp(16px,5%,40px); --hero-fade-y:clamp(18px,10%,40px); }
}
/* Desktop: identical fixed band on every page; the image box hugs the artwork
   (not the full row) so the feathered edges sit on the picture itself. */
@media (min-width: 992px){
    .hero.hero-has-image,
    .hero-shell .hero.hero-has-image:has(.hero-text){
        display:flex; align-items:center; justify-content:center;
        height:clamp(220px,36vh,360px); min-height:0; background:var(--brand);
    }
    .hero.hero-has-image .hero-image,
    .hero-shell .hero.hero-has-image:has(.hero-text) .hero-image{
        width:auto; max-width:100%; height:100%; max-height:360px;
        margin-inline:auto; object-fit:contain; object-position:center;
    }
}

/* Content-sized pills grow to fill each row, including the final row. */
.storefront-category-grid .cat-scroll{display:flex!important;flex-flow:row wrap!important;gap:8px!important;align-items:center;justify-content:flex-start;overflow:visible;padding:4px 0 8px;direction:rtl}
.storefront-category-grid .cat-scroll .cat-chip{flex:1 1 auto!important;width:auto!important;max-width:100%;min-width:0;box-shadow:none!important}

.storefront-category-grid .cat-scroll .cat-chip{min-height:44px!important;padding:8px 16px!important;border:1px solid #dcdde1!important;border-radius:999px!important;background:transparent!important;color:var(--bs-body-color,#26334a)!important;font-size:14px!important;line-height:1.5!important;font-weight:400!important;text-decoration:none!important}
.storefront-category-grid .cat-scroll .cat-chip.active{background:var(--brand)!important;color:var(--brand-contrast)!important;border-color:var(--brand)!important}
.storefront-category-grid .cat-scroll .sf-category-icon{display:none!important}
.storefront-category-grid .cat-chip .sf-category-label{text-decoration:none!important;overflow-wrap:normal;word-break:normal}
.home-categories.shape-rectangle{grid-auto-columns:min(var(--category-width,160px),80vw)!important}
#shopBrowse .home-categories.shape-rectangle .cat-box{height:auto!important;aspect-ratio:var(--category-ratio,4/3)!important}
/* The outer shell owns the surface; avoid a pill floating over square corners. */
#shopSearchPanel{border-radius:999px!important;background:#fff;overflow:hidden}
#shopBrowse #shopSearchPanel .shop-search-controls{background:transparent;border-radius:inherit;box-shadow:none}
#shopSearchPanel input,#shopSearchPanel input:focus{background:transparent;box-shadow:none}
#shopSearch{font-size:16px;line-height:1.5;caret-color:var(--brand,#26334a);min-width:0}
@media(max-width:991.98px){
 .trusty-shell .hero.hero-has-image .hero-image,.hero.hero-has-image .hero-image{-webkit-mask-image:none!important;mask-image:none!important;filter:none!important;box-shadow:none!important}
 .cat-box,.home-sub-link img{filter:none!important;box-shadow:none!important}
 .cat-box-overlay{background:none!important}
 .cat-box-name{background:rgba(0,0,0,.65);border-radius:5px;padding:3px 6px!important;text-shadow:none!important}
 .shape-circle .cat-box-name{background:transparent}
}

/* A lone final option stays compact at the RTL start of its row. */
.storefront-category-grid .cat-scroll .cat-chip.is-lone-last{flex-grow:0!important}

/* Full category captions sit below photos, never across product artwork. */
@media(max-width:991.98px){
 #shopBrowse .cat-flex .cat-box{overflow:visible!important;margin-bottom:calc(var(--caption-height,40px) + 8px)!important;align-items:flex-start}
 #shopBrowse .cat-flex .cat-box-name{position:absolute!important;top:100%!important;bottom:auto!important;inset-inline:0!important;padding:8px 2px 0!important;background:transparent!important;color:#26334a!important;text-shadow:none!important;font:600 12px/1.65 Cairo,sans-serif!important;white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;max-width:100%;border-radius:0}
}
#shopBrowse.is-searching > :not(#shopSearchPanel):not(#productGrid):not(#allProductsHeading):not(#searchResultsBar){display:none!important}
#shopBrowse.is-searching #productGrid{display:flex!important}
#shopBrowse.is-searching #allProductsHeading{display:block!important}
#shopBrowse.is-searching #shopSearchPanel{position:sticky;top:8px;z-index:20;margin-bottom:16px!important}
#shopBrowse.is-searching #shopResults{position:static!important;width:auto!important;height:auto!important;clip:auto!important;clip-path:none!important;white-space:normal!important;padding:4px 10px!important;color:#64748b;font:400 12px/1.6 Cairo,sans-serif}

body.store-search-active .store-header-region,body.store-search-active .hero-shell,body.store-search-active .topbar,body.store-search-active .home-ticker{display:none!important}
body.store-search-active #shopBrowse{padding-top:8px!important}

#searchResultsBar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;direction:rtl}
#searchResultsBar .search-results-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
#searchResultsBar #allProductsHeading{margin:0!important;font:600 17px/1.5 Cairo,sans-serif}
#searchResultsBar #shopResults{border-radius:999px;background:#edf1f5;color:#526176;flex-shrink:0}
#searchResultsBar .search-exit{min-height:44px;flex-shrink:0;padding:8px 12px;border:1px solid #dce2e8;border-radius:10px;color:#34445e;background:#fff;font:600 12px/1.5 Cairo,sans-serif}
#searchResultsBar .search-exit:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
#shopBrowse.is-searching #shopSearchPanel{margin-bottom:12px!important}