/* ============================================================
   MINIMAL THEME — site-wide visual restyle (colors / spacing / type)
   Loaded AFTER the page's existing stylesheet(s). Layout, markup and
   JS are untouched — this only overrides look & feel via variables
   plus a small set of targeted resets for hard-coded decorative CSS
   (hard shadows, rotations, gradients) that variables can't reach.
   ============================================================ */

/* ---------- 1. Core palette (index.css / custom.css / faq.css /
   invitations.css / licensing.css / printing-guide.css /
   privacy-policy.css / refund-policy.css / gallery.css /
   ai-designs.css / wallpaper-packs.css all share these var names) ---------- */
:root{
  /* strictly white / black / gray — no beige or sandal tones */
  --cream:#ffffff;
  --beige:#f4f4f4;
  --beige2:#eaeaea;
  --surface:#ffffff;
  --card-bg:#ffffff;
  --dark-brown:#0a0a0a;
  --matte-black:#000000;
  --text-primary:#111111;
  --text-secondary:#555555;
  --text-muted:#9a9a9a;
  --white:#ffffff;

  /* single restrained accent (was the loud pink/red) */
  --warm-brown:#1a1a1a;

  /* secondary accents, desaturated so they read as quiet signal colors */
  --accent-rose:#9c5a55;
  --accent-sage:#5c7c68;
  --accent-gold:#a9863f;
  --accent-orange:#a15f3e;
  --riso-blue:#3f5a86;

  /* borders / shadows — thin & quiet instead of thick neubrutalist */
  --border:#e6e4e0;
  --border-light:rgba(20,20,20,0.08);
  --shadow:rgba(20,20,20,0.05);
  --shadow-md:rgba(20,20,20,0.09);
  --nu-light:rgba(255,255,255,0);
  --nu-dark:rgba(20,20,20,0.9);
  --nav-bg:rgba(255,255,255,0.92);
  --hero-overlay:rgba(255,255,255,0.6);

  /* flat, soft shadows replace the old hard-offset "sticker" shadows */
  --nu-raised:0 6px 20px rgba(20,20,20,0.09);
  --nu-pressed:0 2px 6px rgba(20,20,20,0.08);
  --nu-soft:0 2px 10px rgba(20,20,20,0.06);
}

[data-theme=dark]{
  --cream:#121212;
  --beige:#191919;
  --beige2:#212121;
  --surface:#121212;
  --card-bg:#1a1a1a;
  --warm-brown:#f0f0f0;
  --text-primary:#f2f2f2;
  --text-secondary:#b8b8b8;
  --text-muted:#7d7d7d;
  --border:#2a2a2a;
  --border-light:rgba(255,255,255,0.1);
  --shadow:rgba(0,0,0,0.3);
  --shadow-md:rgba(0,0,0,0.45);
  --nav-bg:rgba(18,18,18,0.92);
  --hero-overlay:rgba(18,18,18,0.6);
  --nu-raised:0 6px 20px rgba(0,0,0,0.35);
  --nu-pressed:0 2px 6px rgba(0,0,0,0.3);
  --nu-soft:0 2px 10px rgba(0,0,0,0.25);
}

/* ---------- 2. etsy.css uses a different variable set ---------- */
:root{
  --etsy:#1a1a1a;
  --etsy-dk:#000000;
  --etsy-lt:#f6f5f3;
  --ink:#141414;
  --ink2:#141414;
  --muted:#5b5b5b;
  --muted2:#9a9a9a;
  --rule:#e6e4e0;
  --paper:#ffffff;
  --paper2:#f6f5f3;
  --white:#ffffff;
  --gold:#a9863f;
  --sage:#5c7c68;
  --radius:4px;
}

/* ---------- 2b. admin-sellers.html / seller.html use their own
   inline :root variable set ---------- */
:root{
  --brown:#1a1a1a;
  --brown-dark:#000000;
  --beige:#f6f5f3;
  --bg:#ffffff;
  --text:#141414;
  --muted:#8a8a8a;
  --border:#e6e4e0;
  --green:#5c7c68;
  --red:#a1453e;
  --card:#ffffff;
  --shadow:0 2px 10px rgba(20,20,20,0.06);
  --shadow-hover:0 6px 20px rgba(20,20,20,0.09);
}
[data-theme=dark]{
  --brown:#f0f0f0;
  --brown-dark:#ffffff;
  --beige:#191919;
  --bg:#121212;
  --text:#f2f2f2;
  --muted:#9a9a9a;
  --border:#2a2a2a;
  --green:#5c7c68;
  --red:#a1453e;
  --card:#1a1a1a;
  --shadow:0 2px 10px rgba(0,0,0,0.3);
  --shadow-hover:0 6px 20px rgba(0,0,0,0.45);
}
.auth-bg-float img{ transform:none !important; animation:none !important; opacity:0.08 !important; }
.btn-primary{ background:var(--brown) !important; box-shadow:none !important; }
.btn-primary:hover{ background:#000 !important; }
.btn-outline{ border-color:var(--brown) !important; color:var(--text) !important; }
.btn{ border-radius:6px !important; }

/* ---------- 3. Global typography / spacing polish ---------- */
body{ letter-spacing:0.005em; }
.section-label,
.filter-btn,
.badge-new,.badge-hot,.badge-soon,.badge-sale,
.footer-col h5,
.nav-links a,
.hero-label,
.marquee-item{
  letter-spacing:0.06em !important;
  font-weight:500 !important;
}
.section-title,.hero-headline,.shop-hero-title,.detail-title,
.blog-title,.newsletter-title,.about-quote,.tstack-quote{
  letter-spacing:-0.01em;
}
.btn-primary,.btn-outline,.filter-btn,.hero-search-btn,
.nav-etsy-btn,.form-submit,.modal-btn,.detail-cta,
.buynow-download-btn,.newsletter-submit{
  border-radius:6px !important;
  font-weight:600 !important;
  letter-spacing:0.03em !important;
}

/* ---------- 3b. Login / auth modal overlay — was a hard-coded
   cream tint (rgba 244,239,225) that showed through as a beige/tan
   wash behind the sign-in card. Neutralize to match the theme. ---------- */
.modal-overlay,#authGate,.review-overlay,.buynow-overlay,
.edit-modal-overlay,#freeDesignPopup{
  background:rgba(255,255,255,0.85) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
[data-theme=dark] .modal-overlay,[data-theme=dark] #authGate,
[data-theme=dark] .review-overlay,[data-theme=dark] .buynow-overlay,
[data-theme=dark] .edit-modal-overlay,[data-theme=dark] #freeDesignPopup{
  background:rgba(10,10,10,0.82) !important;
}
.shop-hero-texture,
body,html,#authGate,.gate-card,.modal-box{
  background-image:none !important;
}
html{ background:var(--cream) !important; }
body{ background-color:var(--cream) !important; }
#authGate,#adminApp{ background:var(--cream) !important; }
.auth-bg-float{ display:none !important; }
.gate-card,.modal-box{
  background:#ffffff !important;
  border-color:#111111 !important;
  box-shadow:0 8px 30px rgba(0,0,0,0.08) !important;
}
.gate-input,.modal-input,#cwTextarea,.form-input{
  background:#ffffff !important;
  border-color:#dddddd !important;
}
.gate-btn,.gate-logo,.gate-sub{ color:#111111; }
.gate-btn{ background:#111111 !important; border-color:#111111 !important; color:#fff !important; }
.gate-btn:hover{ background:#000 !important; }
[data-theme=dark] .gate-card,[data-theme=dark] .modal-box{
  background:var(--card-bg) !important;
  border-color:var(--border) !important;
  color:var(--text-primary) !important;
}
[data-theme=dark] .gate-input,[data-theme=dark] .modal-input,[data-theme=dark] #cwTextarea,[data-theme=dark] .form-input{
  background:var(--surface) !important;
  border-color:var(--border) !important;
  color:var(--text-primary) !important;
}
[data-theme=dark] .gate-btn,[data-theme=dark] .gate-logo,[data-theme=dark] .gate-sub{ color:var(--text-primary) !important; }
[data-theme=dark] .gate-btn{ background:var(--text-primary) !important; border-color:var(--text-primary) !important; color:var(--cream) !important; }

/* ---------- 3c. Admin panel: hard-coded pink accents left over from
   the old palette (badges, active sidebar item, active chart pill,
   avatar gradient) — bring them onto the flat monochrome accent ---------- */
.badge-pill{
  background:rgba(20,20,20,0.08) !important;
  color:var(--text-primary) !important;
}
.nav-item.active,.mob-nav-btn.active{
  background:var(--warm-brown) !important;
  color:#fff !important;
  border-color:var(--warm-brown) !important;
  box-shadow:none !important;
}
[data-theme=dark] .nav-item.active,[data-theme=dark] .mob-nav-btn.active{
  background:var(--warm-brown) !important;
  color:#000 !important;
  border-color:var(--warm-brown) !important;
}
.rv-pill.active{
  background:var(--warm-brown) !important;
  border-color:var(--warm-brown) !important;
  box-shadow:none !important;
}
[data-theme=dark] .stat-card{
  border-color:var(--border) !important;
}
.sl-avatar{
  background:rgba(20,20,20,0.08) !important;
  color:var(--text-primary) !important;
}
.rv-etsy-box{
  border-color:rgba(241,100,30,0.35) !important;
  box-shadow:none !important;
}

/* ---------- 4. Flatten neubrutalist borders / hard shadows ---------- */
.product-card,.blog-card,.value-card,.why-item,.contact-link,
.hero-img-main,.hero-img-float,.shv7-photo,
.about-img-1,.about-img-2,.cs-card,.tstack-card,.tstack-marquee-item,
.cstack-card,.expand-card,.collection-card,.wishlist-panel,
.modal-box,.fdp-box,.buynow-box,.review-box{
  border-width:1px !important;
  box-shadow:var(--nu-soft) !important;
}
.shv7-banner{border:none !important;box-shadow:none !important;background:transparent !important;}
.hero-img-main,.hero-img-float,.shv7-photo,.shv7-banner,
.about-img-1,.about-img-2,.cs-card{
  transform:none !important;
}
#navbar,.marquee-section,footer{ border-width:1px !important; }
footer{ border-top-color:var(--border) !important; }

/* Remove hard "sticker" offset shadows still hard-coded with var(--border) */
.hero-img-main,.hero-img-float,.hero-badge,.about-img-1,.about-img-2,
.cs-card,.shv7-photo,.collection-card{
  box-shadow:var(--nu-soft) !important;
}

/* Kill decorative rotations for a calmer, aligned layout */
.hero-label,.product-badge,.hero-img-main,.hero-img-float,
.about-img-1,.about-img-2,.shv7-photo,.shv7-clip,
.hero-badge,.shop-hero-shape-left,.shop-hero-shape-right{
  transform:none !important;
  animation:none !important;
}

/* ---------- 5. Buttons: replace hard-coded pink gradients with the
   flat monochrome accent ---------- */
.hero-search-btn,.collection-name-arrow,
.user-avatar,.buynow-download-btn{
  background:var(--warm-brown) !important;
  color:var(--white) !important;
}
.nav-etsy-btn{
  background:#ffffff !important;
  color:#111111 !important;
  border:1px solid #111111 !important;
}
.nav-etsy-btn:hover{
  background:#f2f2f2 !important;
  color:#111111 !important;
}
.btn-primary{ background:var(--warm-brown) !important; color:#fff !important; border-color:var(--warm-brown) !important; }
.btn-primary:hover{ background:#000 !important; }
.btn-outline{ background:transparent !important; border-color:var(--border) !important; color:var(--text-primary) !important; }
.btn-outline:hover{ border-color:var(--warm-brown) !important; color:var(--warm-brown) !important; }
.filter-btn.active,.filter-btn:hover{
  background:var(--warm-brown) !important;
  border-color:var(--warm-brown) !important;
  color:#fff !important;
  box-shadow:none !important;
}
.btn-buy-now-new{ background:var(--warm-brown) !important; border-color:var(--warm-brown) !important; }
.btn-buy-now-new:hover{ background:#000 !important; border-color:#000 !important; }
.btn-add-cart{ border-color:var(--warm-brown) !important; color:var(--warm-brown) !important; }
.detail-cta{ background:var(--warm-brown) !important; }
.detail-cta:hover{ background:#000 !important; }
.form-submit{ background:var(--warm-brown) !important; }
.form-submit:hover{ background:#000 !important; }
#loginBtn.modal-btn{
  background:#ffffff !important;
  color:#111111 !important;
  border:1px solid #111111 !important;
}
#loginBtn.modal-btn:hover{
  background:#f2f2f2 !important;
  color:#111111 !important;
}
#loginBtn #loginBtnIcon,#loginBtn #loginBtnText{ color:inherit !important; }
.modal-box .modal-btn{ background:var(--warm-brown) !important; color:#fff !important; }
.modal-box .modal-btn:hover{ background:#000 !important; }

/* ---------- 6. Calm the marquee / dark sections to pure ink ---------- */
.marquee-section,.newsletter-section{ background:var(--matte-black) !important; }
footer{ background:var(--matte-black) !important; border-top-color:var(--matte-black) !important; }
.footer-logo,.newsletter-label{ color:var(--white) !important; }
.social-btn:hover,.footer-col a:hover{ color:var(--white) !important; }

/* ---------- 7. Reduce decorative motion for a quieter feel ---------- */
.fdp-confetti,.badge-pop,.hero-badge,
.product-badge::after,#offerBanner::before{
  animation:none !important;
}

/* ---------- 8. Product / card surfaces ---------- */
.product-card{ border-radius:8px !important; overflow:hidden; }
.product-img{ border-radius:0; }
.product-card:hover{ transform:translateY(-3px) !important; box-shadow:var(--nu-raised) !important; }
.blog-card,.value-card,.why-item,.fd-card{ border-radius:8px !important; }

/* ---------- 9. Sale / promo colors, desaturated ---------- */
.badge-new{ background:var(--accent-sage) !important; color:#fff !important; }
.badge-hot{ background:var(--accent-rose) !important; color:#fff !important; }
.badge-soon{ background:var(--accent-gold) !important; color:#fff !important; }
.badge-sale{ background:var(--matte-black) !important; color:#fff !important; }
.save-pill{ background:rgba(0,0,0,0.06) !important; color:var(--text-primary) !important; }
.fd-free-badge{ background:var(--accent-sage) !important; box-shadow:none !important; }

/* ---------- 10. Scrollbar + selection to match ---------- */
::-webkit-scrollbar-thumb{ background:var(--text-muted) !important; border-color:var(--cream) !important; }
::selection{ background:var(--warm-brown); color:#fff; }

/* ---------- 11. Faint image behind the login-modal pixel grid ---------- */
.modal-bg-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0.45;
  filter:grayscale(1) contrast(1.05);
  pointer-events:none;
  z-index:0;
}
#modalPixelCanvas{ z-index:1 !important; }

/* ---------- Fixes: dark-mode avatar text contrast ---------- */
[data-theme=dark] .user-avatar,
[data-theme=dark] .pr-review-avatar,
[data-theme=dark] .avatar-letter,
[data-theme=dark] .cw-header-av,
[data-theme=dark] .cw-sender-av,
[data-theme=dark] .hero-search-btn,
[data-theme=dark] .collection-name-arrow,
[data-theme=dark] .buynow-download-btn,
[data-theme=dark] .btn-primary,
[data-theme=dark] .filter-btn.active,
[data-theme=dark] .filter-btn:hover,
[data-theme=dark] .btn-buy-now-new,
[data-theme=dark] .stc-cta,
[data-theme=dark] .hero-cta{
  color:#000000 !important;
}

/* ---------- Fixes: dark-mode marquee text contrast ---------- */
[data-theme=dark] .marquee-item{
  color:#ffffff !important;
}
[data-theme=dark] .marquee-dot{
  background:var(--warm-brown) !important;
}

/* ---------- Offer banner: slim full-width top notification strip ---------- */
#offerBanner{
  position:fixed !important;
  top:68px !important;
  left:0 !important;
  right:0 !important;
  bottom:auto !important;
  width:100% !important;
  max-width:100% !important;
  border-radius:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:.5rem !important;
  padding:.5rem 2.5rem !important;
  transform:translateY(-12px) !important;
  opacity:0 !important;
  z-index:800 !important;
  box-shadow:0 2px 10px rgba(0,0,0,.25) !important;
}
#offerBanner:not(.hidden){
  transform:translateY(0) !important;
  opacity:1 !important;
}
#offerBanner::after{
  display:none !important;
}
#offerBanner .offer-banner-icon{
  width:20px !important;
  height:20px !important;
  font-size:.6rem !important;
  margin-top:0 !important;
}
#offerBanner .offer-banner-inner{
  flex:0 1 auto !important;
  flex-direction:row !important;
  align-items:center !important;
  gap:.4rem !important;
  min-width:0 !important;
  padding-top:0 !important;
}
#offerBanner .offer-banner-tag{
  font-size:.62rem !important;
}
#offerBanner #offerBannerText{
  font-size:.72rem !important;
  -webkit-line-clamp:1 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  max-width:52vw !important;
}
#offerBanner .offer-banner-cta{
  padding:.22rem .6rem !important;
  font-size:.62rem !important;
  border-radius:999px !important;
  margin-top:0 !important;
}
#offerBanner .offer-banner-close{
  position:absolute !important;
  top:50% !important;
  right:.7rem !important;
  transform:translateY(-50%) !important;
  margin-left:0 !important;
  width:20px !important;
  height:20px !important;
  font-size:.6rem !important;
}
@media (max-width:640px){
  #offerBanner{
    top:78px !important;
    left:.7rem !important;
    right:.7rem !important;
    width:auto !important;
    max-width:100% !important;
    border-radius:16px !important;
    padding:.7rem 1rem !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    box-shadow:0 10px 30px rgba(0,0,0,.3) !important;
  }
  #offerBanner .offer-banner-close{
    display:none !important;
  }
  #offerBanner .offer-banner-tag{
    display:none !important;
  }
  #offerBanner .offer-banner-inner{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
  #offerBanner #offerBannerText{
    max-width:100% !important;
    white-space:normal !important;
    -webkit-line-clamp:2 !important;
  }
  #offerBanner .offer-banner-cta{
    margin-top:.5rem !important;
  }
}
@media (max-width:640px){
  body.has-offer-banner .hero-content{
    padding-top:8rem !important;
  }
}

/* ---------- Force-fix: dark-mode text contrast on light-bg widgets
   (chat header banner + active FAQ tab) — loaded last so it always wins ---------- */
[data-theme=dark] .icw-header,
[data-theme=dark] .icw-header *,
[data-theme=dark] .cw-header,
[data-theme=dark] .cw-header *,
[data-theme=dark] .faq-tab.active{
  color:#000000 !important;
}
[data-theme=dark] .icw-header .icw-hdr-btn,
[data-theme=dark] .icw-header .icw-new-btn,
[data-theme=dark] .cw-header .cw-hdr-btn,
[data-theme=dark] .cw-header .cw-close-btn,
[data-theme=dark] .cw-header .cw-new-btn{
  color:#000000 !important;
  border-color:rgba(0,0,0,.35) !important;
}
[data-theme=dark] .icw-header .icw-hdr-btn:hover,
[data-theme=dark] .icw-header .icw-new-btn:hover,
[data-theme=dark] .cw-header .cw-hdr-btn:hover,
[data-theme=dark] .cw-header .cw-close-btn:hover,
[data-theme=dark] .cw-header .cw-new-btn:hover{
  background:rgba(0,0,0,.12) !important;
  color:#000000 !important;
}

/* OFFER UI minimalist redesign */
#offerBanner{background:var(--card-bg) !important;color:var(--text-primary) !important;border:2px solid var(--border) !important;box-shadow:4px 4px 0 var(--border) !important;}
#offerBanner .offer-banner-icon{background:var(--warm-brown) !important;border:none !important;color:#fff !important;border-radius:3px !important;}
#offerBanner .offer-banner-tag{color:var(--warm-brown) !important;}
#offerBanner .offer-banner-tag .dot{background:var(--warm-brown) !important;animation:none !important;}
#offerBanner #offerBannerText{color:var(--text-secondary) !important;}
#offerBanner .offer-banner-cta{background:var(--dark-brown) !important;color:#fff !important;border-radius:3px !important;}
#offerBanner .offer-banner-cta:hover{background:var(--warm-brown) !important;box-shadow:none !important;}
#offerBanner .offer-banner-close{background:var(--beige) !important;color:var(--text-muted) !important;}
.fdp-box{border-radius:6px !important;border:2.5px solid var(--border) !important;box-shadow:10px 10px 0 var(--border) !important;}
.fdp-confetti{display:none !important;}
.fdp-header{background:var(--cream) !important;padding:2.2rem 2rem 1.4rem !important;}
.fdp-header::after{display:none !important;}
.fdp-icon{background:var(--card-bg) !important;border:2px solid var(--border) !important;color:var(--warm-brown) !important;}
.fdp-icon::before{display:none !important;}
.fdp-tag{background:none !important;border:2px solid var(--warm-brown) !important;color:var(--warm-brown) !important;border-radius:3px !important;}
.fdp-title{color:var(--dark-brown) !important;}
[data-theme=dark] .fdp-title{color:var(--text-primary) !important;}
.fdp-sub{color:var(--text-secondary) !important;}
.fdp-download-btn{background:var(--dark-brown) !important;border-radius:3px !important;}
.fdp-download-btn::before{display:none !important;}
.fdp-download-btn:hover{background:var(--warm-brown) !important;box-shadow:none !important;transform:none !important;}
.fdp-skip{border-radius:3px !important;}
.fdp-preview-item{border-radius:3px !important;border:1.5px solid var(--border) !important;}

/* ============================================================
   PRODUCT CARDS — Etsy-style minimal redesign
============================================================ */
.product-card{
  border:1px solid var(--border-light) !important;
  border-radius:8px !important;
  box-shadow:none !important;
  background:var(--card-bg) !important;
}
.product-card:hover{
  transform:none !important;
  box-shadow:0 4px 14px rgba(0,0,0,.1) !important;
}
.product-img{
  border-radius:8px 8px 0 0 !important;
}
.product-badge{
  transform:none !important;
  box-shadow:none !important;
  border-radius:4px !important;
  font-size:.62rem !important;
  padding:.2rem .55rem !important;
  border:none !important;
}
.product-badge::after{
  display:none !important;
}
.product-dl-count-badge{
  display:none !important;
}
.product-actions-overlay{
  background:none !important;
  align-items:flex-start !important;
  justify-content:flex-end !important;
  padding:.5rem !important;
  opacity:1 !important;
}
.product-actions-overlay .overlay-btn:not(:first-child){
  display:none !important;
}
.overlay-btn{
  width:32px !important;
  height:32px !important;
  box-shadow:0 1px 4px rgba(0,0,0,.18) !important;
}
.product-info{
  padding:.65rem .1rem 0 !important;
}
.product-name{
  font-family:var(--font-sans,"Space Grotesk",sans-serif) !important;
  font-style:normal !important;
  font-weight:500 !important;
  font-size:.86rem !important;
  color:var(--text-primary) !important;
  -webkit-line-clamp:2 !important;
}
.product-category{
  display:none !important;
}
.product-price-row{
  padding-top:.3rem !important;
  gap:.4rem !important;
}
.product-price{
  font-weight:700 !important;
  font-size:.92rem !important;
  color:var(--text-primary) !important;
}
.product-price-old{
  font-size:.78rem !important;
}
.save-pill{
  background:none !important;
  color:var(--accent-sage) !important;
  padding:0 !important;
  font-weight:700 !important;
}
.product-divider{
  display:none !important;
}
.product-rating{
  margin-top:.15rem !important;
}
.product-actions-row{
  display:none !important;
}
.product-card::after{
  content:"" !important;
}

/* Product image — square aspect ratio (matches Etsy grid look) */
.product-img{
  aspect-ratio:1/1 !important;
}

/* Product card — full rounded image, transparent card bg (Etsy-style) */
.product-card{
  background:transparent !important;
  border:none !important;
}
.product-card:hover{
  box-shadow:none !important;
}
.product-img{
  border-radius:12px !important;
}
.product-info{
  background:transparent !important;
}

/* Collections carousel — keep only title + Shop Now, drop number tag and description */
.coll-slide-tag{
  display:none !important;
}
.coll-slide-info p{
  display:none !important;
}

/* Ensure product image corners stay rounded on mobile too */
@media (max-width:480px){
  .product-img{
    border-radius:12px !important;
    overflow:hidden !important;
  }
}

/* Fix: preserve-3d on card/image breaks corner clipping on mobile — flatten it */
@media (max-width:768px){
  .product-card,
  .product-card .product-img{
    transform-style:flat !important;
  }
}
.product-img-art{
  border-radius:inherit !important;
}

/* Product image — guarantee equal rounded corners all around, all screen sizes */
.product-card{
  transform-style:flat !important;
}
.product-img{
  border-radius:12px !important;
  overflow:hidden !important;
  isolation:isolate !important;
  transform-style:flat !important;
}
.product-img-art,
.product-img-art img,
.product-img-slider,
.slider-track img{
  border-radius:inherit !important;
}