/* ============================================================
   Studio Beige — shop content ONLY (grid/product/cart/checkout).
   Chrome + fonts + colors come from the site's own CSS (loaded
   ahead of this). We reuse the site's CSS variables so the shop
   is native, not a lookalike. Fallbacks match the site tokens.
   ============================================================ */
:root{
  --sbx-ivory:var(--ivory,#FAF6F0); --sbx-cream:var(--cream,#F5F0E8);
  --sbx-mocha:var(--mocha,#A47764); --sbx-brown:var(--deep-brown,#54463A);
  --sbx-ink:var(--near-black,#2C2420); --sbx-taupe:var(--taupe,#C8B7A6);
  --sbx-gold:var(--gold,#C9A87C); --sbx-warm:var(--warm-beige,#E8E1D4);
  --sbx-soft:var(--soft-white,#FDFCFA);
  --sbx-serif:var(--font-serif,'Cormorant Garamond',Georgia,serif);
  --sbx-sans:var(--font-sans,'DM Sans',-apple-system,sans-serif);
}
.site-content{min-height:60vh;background:var(--sbx-ivory)}
.sb-shop{max-width:1360px;margin:0 auto;padding:clamp(2rem,5vw,4.5rem) clamp(1.2rem,4vw,3rem) 5rem}
/* container guard (ui-ux-pro-max: never let content span full viewport) */
.sb-shop-body .site-content .sb-shop{max-width:1360px;width:100%;margin-left:auto;margin-right:auto;box-sizing:border-box;padding-left:clamp(1.2rem,4vw,3rem);padding-right:clamp(1.2rem,4vw,3rem)}
.sb-shop-body .site-content .single-product .sb-shop{max-width:1320px}
.sb-shop img{max-width:100%;height:auto}

.sb-shop-inner>h1,.woocommerce-products-header__title{font-family:var(--sbx-serif)!important;font-weight:400!important;color:var(--sbx-ink)!important;font-size:clamp(2.6rem,6vw,4.5rem);letter-spacing:1px;margin:0 0 .3rem}
.woocommerce-result-count{font-family:var(--sbx-sans);font-size:.7rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--sbx-taupe);margin:0 0 1.6rem}
.woocommerce-ordering select{font-family:var(--sbx-sans);border:1px solid var(--sbx-warm);border-radius:2px;background:var(--sbx-soft);padding:.55rem .8rem;color:var(--sbx-brown)}
.woocommerce-breadcrumb{display:none}

/* editorial product grid */
ul.products{display:grid!important;grid-template-columns:repeat(3,1fr);gap:clamp(2rem,4vw,3.6rem) clamp(1.4rem,3vw,2.6rem);list-style:none;margin:1.5rem 0 0!important;padding:0}
ul.products li.product{width:auto!important;margin:0!important;float:none!important;text-align:left}
ul.products li.product:nth-child(6n+2){transform:translateY(2.2rem)}
ul.products li.product:nth-child(6n+4){transform:translateY(1.2rem)}
ul.products li.product a img{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--sbx-soft);border-radius:2px;margin:0 0 1rem!important;transition:transform .7s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
ul.products li.product:hover a img{transform:translateY(-6px);box-shadow:0 24px 50px -30px rgba(44,36,32,.5)}
ul.products li.product .woocommerce-loop-product__title{font-family:var(--sbx-serif)!important;font-size:1.4rem!important;line-height:1.15;color:var(--sbx-ink)!important;padding:0 0 .2rem!important;font-weight:500}
ul.products li.product .price{font-family:var(--sbx-sans)!important;font-size:.85rem;color:var(--sbx-mocha)!important;font-weight:400;letter-spacing:.5px}
ul.products li.product .price del{color:var(--sbx-taupe);margin-right:.4em}
.woocommerce span.onsale{background:var(--sbx-gold);color:var(--sbx-soft);border-radius:0;font-family:var(--sbx-sans);font-size:.58rem;letter-spacing:2px;text-transform:uppercase;min-height:0;min-width:0;padding:.35rem .6rem;top:.6rem;left:.6rem}

/* buttons — match the site's ink/mocha language */
.woocommerce a.button,.woocommerce button.button,.woocommerce .button,.woocommerce #respond input#submit,.woocommerce input.button{
  background:var(--sbx-ink)!important;color:var(--sbx-soft)!important;border:none!important;border-radius:2px!important;
  font-family:var(--sbx-sans)!important;font-size:.7rem!important;letter-spacing:2.5px!important;text-transform:uppercase!important;font-weight:400!important;
  padding:.9rem 1.7rem!important;cursor:pointer;transition:background .3s,transform .3s}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover,.woocommerce input.button:hover{background:var(--sbx-mocha)!important;transform:translateY(-2px)}
.woocommerce a.button.alt,.woocommerce button.button.alt,.single_add_to_cart_button{background:var(--sbx-mocha)!important}

/* single product */
.single-product div.product .product_title{font-family:var(--sbx-serif)!important;font-size:clamp(2.4rem,5vw,3.6rem)!important;color:var(--sbx-ink)!important}
.single-product div.product p.price,.single-product div.product span.price{color:var(--sbx-mocha)!important;font-family:var(--sbx-sans)!important;font-size:1.35rem;font-weight:400}
.woocommerce div.product .woocommerce-tabs ul.tabs li a{font-family:var(--sbx-sans);text-transform:uppercase;letter-spacing:2px;font-size:.7rem;color:var(--sbx-taupe)}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{color:var(--sbx-ink)}

/* notices / cart / checkout */
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:var(--sbx-mocha)!important;background:var(--sbx-cream)!important;font-family:var(--sbx-sans);font-size:.85rem}
.woocommerce table.shop_table{border-color:var(--sbx-warm);border-radius:2px}
.woocommerce table.shop_table th{font-family:var(--sbx-sans);text-transform:uppercase;letter-spacing:1.5px;font-size:.68rem;color:var(--sbx-brown)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.select2-container--default .select2-selection--single{border:1px solid var(--sbx-warm)!important;border-radius:2px!important;background:var(--sbx-soft)!important;padding:.7rem .8rem;font-family:var(--sbx-sans)}
.woocommerce h1,.woocommerce h2,.woocommerce h3{font-family:var(--sbx-serif)!important;color:var(--sbx-ink)!important;font-weight:500}

@media(max-width:1024px){ul.products{grid-template-columns:repeat(2,1fr)}ul.products li.product:nth-child(6n+2),ul.products li.product:nth-child(6n+4){transform:none}}
@media(max-width:600px){ul.products{grid-template-columns:repeat(2,1fr);gap:1.6rem 1rem}ul.products li.product .woocommerce-loop-product__title{font-size:1.15rem!important}}

/* ---- NAV: the shop has no dark hero, so pin the site's own "scrolled" (solid)
   nav state permanently (exact values from the site's .nav.scrolled rule). ---- */
.sb-shop-body .nav{background:#faf6f0f5!important;backdrop-filter:saturate(1.3) blur(14px)!important;-webkit-backdrop-filter:saturate(1.3) blur(14px)!important;border-bottom:1px solid var(--warm-beige,#E8E1D4)!important}
.sb-shop-body .nav .nav-logo img{filter:brightness(1)!important;height:38px!important}
.sb-shop-body .nav .nav-links a{color:var(--deep-brown,#54463A)!important}
.sb-shop-body .nav .nav-links a:hover{color:var(--mocha,#A47764)!important}
.sb-shop-body .nav .nav-call{color:var(--mocha,#A47764)!important}
.sb-shop-body .nav .nav-hamburger span{background:var(--near-black,#2C2420)!important}
/* clear the fixed 100px nav so content isn't underneath it */
.sb-shop-body .site-content{padding-top:104px}
/* shop title block */
.woocommerce-products-header{padding-top:.5rem;margin-bottom:.4rem}
.woocommerce-products-header__title{font-size:clamp(2.6rem,6vw,4.6rem)!important}

/* ===================== TIER 1 SHOP UX ===================== */
/* bag in nav */
.sb-shop-body .nav .nav-links a.sb-bag{position:relative;display:inline-flex;align-items:center;color:var(--deep-brown,#54463A)!important;padding:.3rem 0}
.sb-shop-body .nav .nav-links a.sb-bag:hover{color:var(--mocha,#A47764)!important}
.sb-shop-body .nav .nav-links a.sb-bag::after{display:none!important}
.sb-bag-count{position:absolute;top:-7px;right:-10px;min-width:16px;height:16px;padding:0 4px;background:var(--mocha,#A47764);color:#fff;border-radius:999px;font-size:10px;line-height:16px;text-align:center;font-family:var(--font-sans,'DM Sans',sans-serif)}
/* slide-out drawer */
.sb-drawer-scrim{position:fixed;inset:0;background:rgba(44,36,32,.42);z-index:1200;opacity:0;transition:opacity .38s ease}
body.sb-drawer-open .sb-drawer-scrim{opacity:1}
.sb-drawer{position:fixed;top:0;right:0;height:100%;width:min(430px,92vw);background:var(--ivory,#FAF6F0);z-index:1300;transform:translateX(102%);transition:transform .42s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column;box-shadow:-24px 0 70px -34px rgba(44,36,32,.55)}
body.sb-drawer-open .sb-drawer{transform:none}
.sb-drawer-top{display:flex;justify-content:space-between;align-items:center;padding:1.7rem 1.6rem 1.1rem;border-bottom:1px solid var(--warm-beige,#E8E1D4)}
.sb-drawer-title{font-family:var(--font-serif,'Cormorant Garamond',serif);font-size:1.7rem;color:var(--near-black,#2C2420)}
.sb-drawer-x{background:none;border:none;font-size:1.9rem;line-height:1;color:var(--deep-brown,#54463A);cursor:pointer;padding:0 .2rem}
.sb-drawer-body{flex:1;overflow-y:auto;padding:1.3rem 1.6rem 2rem}
.sb-drawer-body .woocommerce-mini-cart__empty-message{color:var(--taupe,#C8B7A6);font-family:var(--font-sans,'DM Sans',sans-serif)}
.sb-drawer-body ul.cart_list li img{width:56px!important;border-radius:2px}
.sb-drawer-body .woocommerce-mini-cart__total{margin:1.2rem 0;padding-top:1rem;border-top:1px solid var(--warm-beige,#E8E1D4);font-family:var(--font-sans,'DM Sans',sans-serif)}
.sb-drawer-body .woocommerce-mini-cart__buttons{display:flex;flex-direction:column;gap:.6rem;margin:0}
.sb-drawer-body .woocommerce-mini-cart__buttons a{width:100%;text-align:center}
.sb-drawer-body .woocommerce-mini-cart__buttons a.checkout{background:var(--mocha,#A47764)!important}
/* hover image-swap (overlays only the image area) */
ul.products li.product a.woocommerce-LoopProduct-link{position:relative;display:block}
.sb-hover-img{position:absolute;top:0;left:0;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:2px;opacity:0;transition:opacity .55s ease;pointer-events:none}
ul.products li.product:hover .sb-hover-img{opacity:1}
/* sticky add-to-cart */
.sb-sticky-atc{position:fixed;left:0;right:0;bottom:0;z-index:1100;background:rgba(250,246,240,.96);backdrop-filter:saturate(1.2) blur(12px);-webkit-backdrop-filter:saturate(1.2) blur(12px);border-top:1px solid var(--warm-beige,#E8E1D4);transform:translateY(102%);transition:transform .35s ease;padding:.75rem 0}
.sb-sticky-atc[aria-hidden="false"]{transform:none}
.sb-sticky-inner{max-width:1200px;margin:0 auto;padding:0 clamp(1.2rem,4vw,3rem);display:flex;align-items:center;gap:1.4rem}
.sb-sticky-name{font-family:var(--font-serif,'Cormorant Garamond',serif);font-size:1.25rem;color:var(--near-black,#2C2420);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-sticky-price{color:var(--mocha,#A47764);font-family:var(--font-sans,'DM Sans',sans-serif);font-size:.95rem}
.sb-sticky-btn{white-space:nowrap}
@media(max-width:600px){.sb-sticky-name{font-size:1rem}.sb-sticky-price{display:none}}

/* ===================== PDP (single product) DESIGN ===================== */
.single-product .sb-shop{max-width:1320px}
.single-product div.product{display:grid;grid-template-columns:1.12fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:start}
.single-product div.product .woocommerce-product-gallery{position:sticky;top:118px;margin:0;width:100%!important;float:none!important}
.single-product div.product .woocommerce-product-gallery img{border-radius:3px;background:var(--sbx-soft)}
.single-product div.product .summary{margin:0!important;width:100%!important;float:none!important;padding-top:.5rem}
.sb-brand-eyebrow{font-family:var(--sbx-sans)!important;font-size:.7rem!important;letter-spacing:3px;text-transform:uppercase;color:var(--sbx-mocha)!important;margin:0 0 .6rem!important}
.single-product div.product .product_title{font-family:var(--sbx-serif)!important;font-size:clamp(2.4rem,4vw,3.4rem)!important;line-height:1.05;color:var(--sbx-ink)!important;margin:0 0 .8rem!important;font-weight:400}
.single-product div.product p.price,.single-product div.product .price{color:var(--sbx-mocha)!important;font-family:var(--sbx-sans)!important;font-size:1.3rem!important;font-weight:400;margin:0 0 1.2rem!important}
.single-product .woocommerce-product-details__short-description{color:var(--sbx-brown);line-height:1.75;font-size:1.02rem;max-width:46ch;margin-bottom:1.4rem}
.single-product .woocommerce-product-details__short-description p{margin:0 0 .8rem}
.sb-local-badge{display:flex;align-items:center;gap:.55rem;font-family:var(--sbx-sans);font-size:.8rem;letter-spacing:.3px;color:var(--sbx-brown);background:var(--sbx-cream);border:1px solid var(--sbx-warm);border-radius:2px;padding:.7rem .9rem;margin:0 0 1.4rem}
.sb-local-badge .sb-dot{width:7px;height:7px;border-radius:50%;background:#5b8a5b;box-shadow:0 0 0 3px rgba(91,138,91,.18);flex:none}
.single-product form.cart{margin:0 0 1.6rem}
.single-product div.product form.cart .quantity input.qty{width:64px;border:1px solid var(--sbx-warm);border-radius:2px;padding:.7rem .3rem;text-align:center;font-family:var(--sbx-sans);background:var(--sbx-soft)}
.single-product .single_add_to_cart_button{padding:1rem 2.4rem!important;font-size:.72rem!important}
.single-product .product_meta{font-family:var(--sbx-sans);font-size:.72rem;letter-spacing:.5px;color:var(--sbx-taupe);border-top:1px solid var(--sbx-warm);padding-top:1.1rem;margin-top:.6rem}
.single-product .product_meta>span{display:block;margin-bottom:.35rem}
.single-product .product_meta a{color:var(--sbx-brown)}
/* tabs full width below */
.single-product div.product .woocommerce-tabs,.single-product div.product .related,.single-product div.product .upsells{grid-column:1 / -1;margin-top:clamp(2.5rem,5vw,4.5rem)}
.woocommerce-tabs ul.tabs.wc-tabs{border:none;padding:0;margin:0 0 1.5rem;display:flex;gap:2rem;border-bottom:1px solid var(--sbx-warm)}
.woocommerce-tabs ul.tabs.wc-tabs::before{display:none}
.woocommerce-tabs ul.tabs.wc-tabs li{background:none;border:none;padding:0 0 .9rem;margin:0}
.woocommerce-tabs ul.tabs.wc-tabs li::before,.woocommerce-tabs ul.tabs.wc-tabs li::after{display:none}
.woocommerce-tabs ul.tabs.wc-tabs li a{font-family:var(--sbx-sans)!important;text-transform:uppercase;letter-spacing:2px;font-size:.72rem;color:var(--sbx-taupe)!important;padding:0!important;font-weight:400}
.woocommerce-tabs ul.tabs.wc-tabs li.active a{color:var(--sbx-ink)!important}
.woocommerce-tabs ul.tabs.wc-tabs li.active{box-shadow:inset 0 -2px 0 var(--sbx-mocha)}
.woocommerce-tabs .panel,.sb-tab-body{font-family:var(--sbx-sans);color:var(--sbx-brown);line-height:1.8;max-width:70ch;font-size:1rem}
.woocommerce-tabs .panel h2{display:none}
.single-product .related>h2,.single-product .upsells>h2{font-family:var(--sbx-serif)!important;font-weight:400!important;font-size:clamp(1.8rem,3vw,2.6rem);color:var(--sbx-ink)!important;margin-bottom:1.5rem}
@media(max-width:820px){.single-product div.product{grid-template-columns:1fr;gap:1.8rem}.single-product div.product .woocommerce-product-gallery{position:static;top:auto}}

/* ===================== PDP "The Look" in-use gallery ===================== */
.single-product div.product .sb-inuse{grid-column:1 / -1;margin-top:clamp(3rem,6vw,5rem)}
.sb-inuse-head{text-align:center;max-width:640px;margin:0 auto 2rem}
.sb-inuse-eyebrow{font-family:var(--sbx-sans);font-size:.68rem;letter-spacing:3px;text-transform:uppercase;color:var(--sbx-mocha)}
.sb-inuse-title{font-family:var(--sbx-serif)!important;font-weight:400!important;font-size:clamp(2rem,4vw,3rem);color:var(--sbx-ink)!important;margin:.4rem 0 .5rem}
.sb-inuse-sub{font-family:var(--sbx-sans);color:var(--sbx-brown);font-size:.95rem}
.sb-inuse-grid{display:grid;gap:clamp(.8rem,1.5vw,1.4rem)}
.sb-inuse-grid figure{margin:0;overflow:hidden;border-radius:3px;background:var(--sbx-soft)}
.sb-inuse-grid img{width:100%;height:100%;object-fit:cover;display:block;aspect-ratio:4/5;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.sb-inuse-grid figure:hover img{transform:scale(1.04)}
/* dynamic layouts by count (never a sparse orphan) */
.sb-inuse-1 .sb-inuse-grid{grid-template-columns:1fr;max-width:760px;margin:0 auto}
.sb-inuse-1 .sb-inuse-grid img{aspect-ratio:16/10}
.sb-inuse-2 .sb-inuse-grid{grid-template-columns:1fr 1fr}
.sb-inuse-3 .sb-inuse-grid{grid-template-columns:repeat(3,1fr)}
.sb-inuse-4 .sb-inuse-grid{grid-template-columns:repeat(2,1fr)}
.sb-inuse-5 .sb-inuse-grid,.sb-inuse-6 .sb-inuse-grid{grid-template-columns:repeat(3,1fr)}
.sb-inuse-5 .sb-inuse-grid figure:first-child{grid-column:span 2;grid-row:span 2}
.sb-inuse-5 .sb-inuse-grid figure:first-child img,.sb-inuse-6 .sb-inuse-grid img{aspect-ratio:auto;height:100%}
@media(max-width:700px){.sb-inuse-3 .sb-inuse-grid,.sb-inuse-5 .sb-inuse-grid,.sb-inuse-6 .sb-inuse-grid{grid-template-columns:1fr 1fr}.sb-inuse-5 .sb-inuse-grid figure:first-child{grid-column:span 2;grid-row:auto}}

/* ===================== PDP: no-tabs flowing layout ===================== */
.woocommerce-tabs{display:none!important} /* belt-and-suspenders: kill any residual tab markup */
.single-product div.product .sb-story{grid-column:1 / -1;max-width:760px;margin:clamp(2.5rem,5vw,4rem) auto 0}
.sb-story-inner{font-family:var(--sbx-sans);color:var(--sbx-brown);line-height:1.85;font-size:1.05rem}
.sb-story-inner p{margin:0 0 1.1rem}
.sb-story-inner h3{font-family:var(--sbx-serif)!important;color:var(--sbx-ink)!important;font-weight:500;font-size:clamp(1.4rem,2.6vw,1.9rem);margin:1.9rem 0 .7rem;letter-spacing:.3px}
.sb-story-inner ul{margin:0 0 1.2rem 1.1rem}.sb-story-inner li{margin:.35rem 0}
.sb-story-inner strong{color:var(--sbx-ink);font-weight:500}
.single-product div.product .sb-details-wrap{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,4rem);max-width:1000px;margin:clamp(2.5rem,5vw,4rem) auto 0;align-items:start}
.sb-block-title{font-family:var(--sbx-serif)!important;font-weight:400!important;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--sbx-ink)!important;margin:0 0 1rem;padding-bottom:.6rem;border-bottom:1px solid var(--sbx-warm)}
.sb-block-body{font-family:var(--sbx-sans);color:var(--sbx-brown);line-height:1.8;font-size:.98rem}
.sb-details-table table{width:100%;border-collapse:collapse}
.sb-details-table th{text-align:left;font-family:var(--sbx-sans);text-transform:uppercase;letter-spacing:1px;font-size:.66rem;color:var(--sbx-taupe);padding:.6rem 1rem .6rem 0;vertical-align:top;white-space:nowrap;width:40%;font-weight:400}
.sb-details-table td{padding:.6rem 0;color:var(--sbx-brown);border-bottom:1px solid var(--sbx-warm)}
.single-product div.product .sb-reviews{grid-column:1 / -1;max-width:760px;margin:clamp(2.5rem,5vw,4rem) auto 0}
@media(max-width:820px){.single-product div.product .sb-details-wrap{grid-template-columns:1fr;gap:2rem}}

/* ===================== PDP credential/trust badges ===================== */
.sb-creds{list-style:none;margin:0 0 1.6rem;padding:1rem 1.1rem;display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1.4rem;background:var(--sbx-cream);border:1px solid var(--sbx-warm);border-radius:2px}
.sb-creds li{display:flex;align-items:center;gap:.55rem;font-family:var(--sbx-sans);font-size:.78rem;letter-spacing:.4px;color:var(--sbx-brown)}
.sb-cred-ic{display:inline-flex;color:var(--sbx-mocha);flex:none}
@media(max-width:600px){.sb-creds{grid-template-columns:1fr}}

/* ===================== PDP ENERGY ===================== */
/* scroll-in motion */
.sb-reveal{opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.sb-reveal.sb-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.sb-reveal{opacity:1!important;transform:none!important;transition:none}}
/* punchier hero + gold accents */
.single-product div.product .product_title{font-size:clamp(2.6rem,4.4vw,3.8rem)!important}
.single-product div.product p.price::after,.single-product div.product .summary>.price::after{content:"";display:block;width:44px;height:2px;background:var(--sbx-gold);margin-top:.7rem}
.sb-block-title{position:relative}
.sb-block-title.sb-center{text-align:center}
.sb-eyebrow2{display:block;font-family:var(--sbx-sans);font-size:.68rem;letter-spacing:3px;text-transform:uppercase;color:var(--sbx-mocha);text-align:center;margin-bottom:.3rem}
.sb-creds li:hover .sb-cred-ic{transform:scale(1.12)}.sb-cred-ic{transition:transform .3s}
/* "The Actives" section */
.single-product div.product .sb-actives{grid-column:1 / -1;max-width:1100px;margin:clamp(2.5rem,5vw,4.5rem) auto 0;padding:clamp(2rem,4vw,3.5rem) clamp(1.2rem,3vw,2.5rem);background:linear-gradient(180deg,var(--sbx-cream),var(--sbx-ivory));border:1px solid var(--sbx-warm);border-radius:3px}
.sb-actives-head{margin-bottom:1.8rem}
.sb-actives-grid{display:grid;gap:clamp(1rem,2vw,1.8rem)}
.sb-actives-2{grid-template-columns:1fr 1fr}.sb-actives-3{grid-template-columns:repeat(3,1fr)}.sb-actives-4{grid-template-columns:repeat(4,1fr)}
.sb-active-card{text-align:center;padding:1.6rem 1rem;background:var(--sbx-soft);border-radius:3px;border:1px solid var(--sbx-warm);transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .5s}
.sb-active-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px -26px rgba(44,36,32,.5)}
.sb-active-ic{display:inline-flex;color:var(--sbx-gold);margin-bottom:.6rem}
.sb-active-card h3{font-family:var(--sbx-serif)!important;color:var(--sbx-ink)!important;font-weight:500;font-size:1.25rem;margin:0 0 .3rem}
.sb-active-card p{font-family:var(--sbx-sans);color:var(--sbx-taupe);font-size:.72rem;letter-spacing:.3px;margin:0;line-height:1.5}
/* card + gallery hover life */
.single-product .woocommerce-product-gallery__image img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.single-product .single_add_to_cart_button{position:relative;overflow:hidden}
.single-product .single_add_to_cart_button::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transform:skewX(-20deg);transition:left .6s}
.single-product .single_add_to_cart_button:hover::after{left:140%}
@media(max-width:820px){.sb-actives-3,.sb-actives-4{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.sb-actives-2,.sb-actives-3,.sb-actives-4{grid-template-columns:1fr}}

/* ==================================================================
   >>> POLISH PASS  <<<  Studio Beige PDP — warm Tulum-chic atelier
   Blume/Recess warmth + Aesop restraint. Replaces this comment to EOF.
   Owns: framed gallery (the void fix) · editorial summary rhythm ·
   quiet trust row · calm below-fold sections · Actives · motion.
   ================================================================== */

/* ---- shared rhythm tokens ---------------------------------------- */
:root{
  --sb-secw:1060px;                 /* wide editorial blocks            */
  --sb-readw:700px;                 /* single-column reading measure    */
  --sb-gap:clamp(2.5rem,5vw,4.25rem);/* one vertical rhythm below fold  */
  --sb-hair:1px solid var(--sbx-warm);
  --sb-panel-shadow:0 18px 44px -26px rgba(44,36,32,.28);
}

/* ==================================================================
   1) THE GALLERY — framed warm panel, FLEXSLIDER-SAFE (v2).
      WC gallery-slider is ON. flexslider wraps the slides in a
      .flex-viewport (overflow:hidden) sized to the column, but does
      NOT put a .flexslider class on the gallery root — so we frame the
      STABLE .flex-viewport itself (exactly column width) and leave the
      slide-width math entirely to flexslider. Slides carry NO padding
      (padding was what left a gap for the neighbour slide to bleed
      through); the product is inset from the frame via max-w/max-h.
   ================================================================== */
.single-product div.product .woocommerce-product-gallery{
  position:sticky;top:118px;margin:0;
  width:100%!important;float:none!important;
  overflow:hidden;                    /* clip any stray slide bleed    */
}

/* THE FRAME — on the flexslider viewport (post-JS) and, as a brief
   pre-JS fallback, on the raw wrapper while it is still a direct child
   of the gallery root (flexslider later moves it inside .flex-viewport
   so this fallback stops matching).                                   */
.single-product .woocommerce-product-gallery .flex-viewport,
.single-product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper{
  background:var(--sbx-soft);          /* warm ground: white bottles now
                                          read against a defined field   */
  border:var(--sb-hair);
  border-radius:4px;
  box-shadow:var(--sb-panel-shadow);
  overflow:hidden;
  transition:transform .5s cubic-bezier(.2,.7,.2,1),
             box-shadow .5s cubic-bezier(.2,.7,.2,1);
}
/* barely-there tactile lift (Blume) on the whole framed panel */
.single-product .woocommerce-product-gallery:hover .flex-viewport,
.single-product .woocommerce-product-gallery:hover > .woocommerce-product-gallery__wrapper{
  transform:translateY(-2px);
  box-shadow:0 24px 50px -24px rgba(44,36,32,.32);
}

/* slides: transparent, generous height, centered, NO padding */
.single-product .woocommerce-product-gallery__image{
  background:transparent!important;border:none!important;box-shadow:none!important;
  padding:0!important;box-sizing:border-box;
  min-height:clamp(360px,52vh,520px);
  display:flex;align-items:center;justify-content:center;
}
.single-product .woocommerce-product-gallery__image > a{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;
}
/* pre-JS fallback only: show ONLY the first image (never the 25% grid).
   Scoped to the un-flexslidered structure (wrapper still direct child). */
.single-product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:not(:first-child){
  display:none!important;
}

/* the product: inset from the frame on ALL sides (max-w/max-h < 100%
   supplies the breathing room instead of slide padding), contained,
   centered, height-capped, never upscaled past native size          */
.single-product div.product .woocommerce-product-gallery__image img{
  width:auto!important;height:auto!important;
  max-width:84%!important;max-height:min(50vh,460px)!important;
  object-fit:contain!important;object-position:center;
  margin:0 auto!important;display:block;
  background:transparent!important;border-radius:0!important;
}

/* soft-white zoom pill on the framed panel */
.single-product .woocommerce-product-gallery__trigger{
  top:14px;right:14px;z-index:3;
  background:var(--sbx-soft);border:var(--sb-hair);border-radius:50%;
  padding:.4rem;box-shadow:0 3px 12px -5px rgba(44,36,32,.35);
  transition:border-color .3s ease,transform .3s ease;
}
.single-product .woocommerce-product-gallery__trigger:hover{
  border-color:var(--sbx-mocha);transform:scale(1.06);
}

/* ---- thumbnail rail: quiet square chips echoing the panel -------- */
.single-product .flex-control-thumbs{
  margin:.9rem 0 0!important;padding:0!important;
  display:flex;flex-wrap:wrap;gap:.55rem;list-style:none;
}
.single-product .flex-control-thumbs li{
  width:auto!important;margin:0!important;list-style:none;
}
.single-product .flex-control-thumbs img{
  width:64px;height:64px;object-fit:contain;
  background:var(--sbx-soft);
  border:var(--sb-hair);border-radius:3px;padding:5px;
  opacity:.55;cursor:pointer;
  transition:opacity .3s ease,border-color .3s ease;
}
.single-product .flex-control-thumbs img:hover,
.single-product .flex-control-thumbs img.flex-active{
  opacity:1;border-color:var(--sbx-mocha);
}

/* ==================================================================
   2) SUMMARY — deliberate editorial rhythm, title as the clear hero
   ================================================================== */
.single-product div.product .summary{padding-top:0!important}
.sb-brand-eyebrow{margin:0 0 .75rem!important}
.single-product div.product .product_title{
  margin:.15rem 0 .9rem!important;line-height:1.04;
}
.single-product div.product p.price,
.single-product div.product .price{
  font-size:1.28rem!important;margin:0 0 1.35rem!important;
}
/* refined gold underline accent under the price */
.single-product div.product p.price::after{
  content:"";display:block;width:42px;height:1.5px;
  background:var(--sbx-gold);margin-top:.75rem;
}
.single-product .woocommerce-product-details__short-description{
  max-width:48ch;line-height:1.7;font-size:1.02rem;
  color:var(--sbx-brown);margin:0 0 1.55rem;
}

/* in-stock line — quiet, subtle green dot kept */
.sb-local-badge{
  background:none!important;border:none!important;border-radius:0!important;
  padding:0!important;margin:0 0 1.3rem!important;
  font-size:.82rem;color:var(--sbx-brown);
}

/* ---- trust row: quiet hairline-framed 2x2, considered + aligned -- */
.sb-creds{
  background:none!important;border:none!important;border-radius:0!important;
  border-top:var(--sb-hair)!important;border-bottom:var(--sb-hair)!important;
  padding:1.2rem .1rem!important;margin:0 0 1.7rem!important;
  gap:.9rem 1.9rem!important;align-items:center;
}
.sb-creds li{
  font-size:.77rem;line-height:1.35;color:var(--sbx-brown);
  letter-spacing:.2px;align-items:center;
}
.sb-cred-ic{color:var(--sbx-mocha);flex:none;width:16px;height:16px}
.sb-cred-ic svg{width:100%;height:100%;display:block}

/* ---- cart + meta spacing ---------------------------------------- */
.single-product form.cart{margin:1.4rem 0 1.5rem!important}
.single-product div.product form.cart .quantity input.qty{
  background:var(--sbx-soft);border:var(--sb-hair);
}
.single-product .product_meta{margin-top:1.4rem;padding-top:1.15rem}

/* ==================================================================
   3) BELOW-FOLD SECTIONS — one shared rhythm, calm editorial blocks
   ================================================================== */
.single-product div.product .sb-story,
.single-product div.product .sb-reviews{
  max-width:var(--sb-readw)!important;margin-top:var(--sb-gap)!important;
}
.single-product div.product .sb-details-wrap,
.single-product div.product .sb-inuse,
.single-product div.product .related,
.single-product div.product .upsells{
  max-width:var(--sb-secw)!important;margin-top:var(--sb-gap)!important;
}
.sb-block-title{
  font-size:clamp(1.5rem,2.6vw,2rem)!important;padding-bottom:.55rem;
}
.single-product div.product .sb-details-wrap{
  gap:clamp(2.5rem,5vw,5rem)!important;
}

/* ---- The Actives — light, de-boxed band; airy soft-white cards.
   ONE clean gap above (the centred "What's Inside / The Actives" head
   is the separator) — no floating hairline, no doubled padding.     --- */
.single-product div.product .sb-actives{
  max-width:var(--sb-secw)!important;margin-top:var(--sb-gap)!important;
  background:none!important;border:none!important;border-radius:0!important;
  padding:0!important;
}
.sb-active-card{
  text-align:center;padding:1.7rem 1rem;
  background:var(--sbx-soft);border:var(--sb-hair);border-radius:3px;
  box-shadow:none;
}
.sb-active-card h3{margin:0 0 .35rem}

/* ==================================================================
   4) MOTION — gentle reveal; fully honored under reduced-motion
   ================================================================== */
.sb-reveal{
  opacity:0;transform:translateY(16px);
  transition:opacity .7s ease,transform .7s ease;
}
.sb-reveal.sb-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .sb-reveal{opacity:1!important;transform:none!important;transition:none}
  .single-product .woocommerce-product-gallery .flex-viewport,
  .single-product .woocommerce-product-gallery:hover .flex-viewport,
  .single-product .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper{
    transition:none;transform:none;
  }
  .single-product .woocommerce-product-gallery__trigger,
  .single-product .flex-control-thumbs img{transition:none}
}

/* ==================================================================
   5) RESPONSIVE — keep the framed panel; drop sticky; single column
   ================================================================== */
@media(max-width:820px){
  .single-product div.product{grid-template-columns:1fr;gap:1.9rem}
  .single-product div.product .woocommerce-product-gallery{
    position:static;top:auto;
  }
  /* keep the frame full-width; taller image cap so it breathes */
  .single-product .woocommerce-product-gallery__image{
    min-height:clamp(320px,64vw,460px);
    padding:clamp(1.25rem,6vw,2.25rem);
  }
  .single-product div.product .woocommerce-product-gallery__image img{
    max-height:62vh!important;
  }
  .single-product div.product .sb-details-wrap{
    grid-template-columns:1fr;gap:2rem!important;
  }
  .sb-actives-3,.sb-actives-4{grid-template-columns:1fr 1fr}
  .single-product .woocommerce-product-details__short-description{
    max-width:none;
  }
  .sb-active-card{padding:1.4rem .9rem}
}
@media(max-width:600px){
  .single-product .woocommerce-product-gallery__image{
    min-height:auto;padding:1.1rem;border-radius:3px;
  }
  .single-product .flex-control-thumbs img{width:54px;height:54px}
  .sb-creds{
    grid-template-columns:1fr 1fr;
    gap:.75rem 1.2rem!important;padding:1rem .1rem!important;
  }
  .sb-actives-2,.sb-actives-3,.sb-actives-4{grid-template-columns:1fr}
  .single-product div.product .product_title{
    font-size:clamp(2rem,8vw,2.6rem)!important;
  }
  .single-product div.product p.price,
  .single-product div.product .price{margin-bottom:1.15rem!important}
}

/* ==================================================================
   6) "YOU MAY ALSO LOVE" / related + upsells — tidy uniform strip.
      These loops inherit ul.products (shop grid) which staggers cards
      and 3-columns them into an orphan row. Override to a centered
      flex row of equal, aligned, framed tiles.
   ================================================================== */
.single-product div.product .related,
.single-product div.product .upsells{ text-align:center; }
.single-product .related>h2,
.single-product .upsells>h2{
  text-align:center;
  margin:0 auto clamp(1.6rem,3vw,2.4rem)!important;
}
/* centered flex row: 1–3 items all sit centred, never an orphan gap */
.single-product .related ul.products,
.single-product .upsells ul.products{
  display:flex!important;flex-wrap:wrap;justify-content:center;align-items:stretch;
  gap:clamp(1.4rem,3vw,2.6rem)!important;
  margin:0 auto!important;padding:0!important;list-style:none;
  max-width:var(--sb-secw);
}
.single-product .related ul.products li.product,
.single-product .upsells ul.products li.product{
  transform:none!important;                 /* kill the shop-grid stagger */
  margin:0!important;float:none!important;
  flex:0 1 300px;max-width:320px;min-width:0;
  display:flex;flex-direction:column;text-align:center;
}
.single-product .related ul.products li.product:hover,
.single-product .upsells ul.products li.product:hover{transform:none!important}
/* uniform framed tile (matches the hero panel language) */
.single-product .related li.product a img,
.single-product .upsells li.product a img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center;
  background:var(--sbx-soft);border:var(--sb-hair);border-radius:4px;
  margin:0 0 1.1rem!important;
  transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .5s;
}
.single-product .related li.product:hover a img,
.single-product .upsells li.product:hover a img{
  transform:translateY(-4px);box-shadow:0 20px 44px -28px rgba(44,36,32,.5);
}
/* title + price centred and aligned; button pinned to the bottom edge */
.single-product .related li.product .woocommerce-loop-product__title,
.single-product .upsells li.product .woocommerce-loop-product__title{
  font-size:1.18rem!important;line-height:1.2;margin:0 0 .3rem!important;padding:0!important;
}
.single-product .related li.product .price,
.single-product .upsells li.product .price{
  display:block;margin:0 0 1rem!important;font-size:.9rem!important;
}
.single-product .related li.product .button,
.single-product .upsells li.product .button{
  margin-top:auto!important;align-self:center;
}
@media(max-width:820px){
  .single-product .related ul.products li.product,
  .single-product .upsells ul.products li.product{flex:0 1 240px}
}
@media(max-width:520px){
  .single-product .related ul.products,
  .single-product .upsells ul.products{gap:1.1rem!important}
  .single-product .related ul.products li.product,
  .single-product .upsells ul.products li.product{flex:1 1 42%;max-width:none}
}