/** Shopify CDN: Minification failed

Line 18:7 Expected identifier but found whitespace
Line 18:9 Unexpected "{"
Line 18:19 Expected ":"
Line 19:9 Expected identifier but found whitespace
Line 19:11 Unexpected "{"
Line 19:21 Expected ":"
Line 20:10 Expected identifier but found whitespace
Line 20:12 Unexpected "{"
Line 20:22 Expected ":"
Line 23:11 Expected identifier but found whitespace
... and 2 more hidden warnings

**/

:root{
  --bg: {{ settings.bg_color }};
  --text: {{ settings.text_color }};
  --muted: {{ settings.muted_color }};
  --border: rgba(255,255,255,.10);
  --card: rgba(255,255,255,.04);
  --accent: {{ settings.accent_color }};
  --radius: 18px;
  --shadow: 0 18px 40px rgba(0,0,0,.35);
  color-scheme: dark;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background: var(--bg);
  color: var(--text);
}
a{color:inherit}
img{max-width:100%;height:auto}
.container{max-width:1200px;margin:0 auto;padding:0 16px}
.skip-link{
  position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden;
}
.skip-link:focus{left:16px;top:16px;width:auto;height:auto;background:#fff;color:#000;padding:10px 12px;border-radius:10px;z-index:9999}

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.15);
  text-decoration:none;font-weight:800;background:transparent;cursor:pointer;
}
.btn--primary{background:var(--accent);border-color:transparent;color:#fff}
.btn[disabled]{opacity:.55;cursor:not-allowed}

.grid{display:grid;gap:14px}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:980px){.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.grid--4{grid-template-columns:1fr}}

.card{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  border-radius: 18px;
  box-shadow: var(--shadow);
  overflow:hidden;
}
.muted{color:var(--muted)}
/* =========================================================
   RUGIFUL: Visual upgrade pack (paste at bottom of base.css)
   ========================================================= */

/* ---------- HERO DROP: texture + blob + cinematic glow ---------- */
.hero-drop{
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

/* floating light blob */
.hero-drop::before{
  content:"";
  position:absolute;
  width:600px;
  height:600px;
  top:-220px;
  right:-220px;
  background: radial-gradient(circle, rgba(168,85,247,.25) 0%, transparent 60%);
  filter: blur(60px);
  opacity:.75;
  pointer-events:none;
  z-index: 0;
}

/* subtle grain/noise overlay */
.hero-drop::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index: 1;
  opacity: .08;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence baseFrequency='0.75' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.22'/%3E%3C/svg%3E");
}

/* keep hero content above overlays */
.hero-drop__inner,
.hero-drop__content{
  position: relative;
  z-index: 2;
}

/* cinematic title glow */
.hero-drop__title{
  text-shadow:
    0 0 40px rgba(168,85,247,.22),
    0 20px 60px rgba(0,0,0,.65);
}

/* ---------- SMOOTHER SECTION BLEND INTO BEST SELLERS ---------- */
/* This assumes your section wrapper outputs a class matching the section type */
.featured-immaculate-2x2,
.section-featured-immaculate-2x2,
[data-section-type="featured-immaculate-2x2"]{
  position: relative;
  margin-top: -30px;
  padding-top: 60px;
  background: linear-gradient(180deg, transparent 0%, rgba(11,15,25,1) 30%);
}

/* ---------- MAKE PRODUCT CARDS FEEL HEAVIER / PREMIUM ---------- */
.featured-immaculate-2x2 .card,
.section-featured-immaculate-2x2 .card,
[data-section-type="featured-immaculate-2x2"] .card{
  box-shadow: 0 30px 70px rgba(0,0,0,.55);
  transform: translateZ(0);
}

/* Optional: slightly stronger border on cards for crispness */
.featured-immaculate-2x2 .card,
.section-featured-immaculate-2x2 .card,
[data-section-type="featured-immaculate-2x2"] .card{
  border: 1px solid rgba(255,255,255,.10);
}

/* ---------- MOBILE TUNING ---------- */
@media(max-width: 768px){
  .hero-drop::before{
    width:460px;
    height:460px;
    top:-200px;
    right:-220px;
    opacity:.70;
  }
  .featured-immaculate-2x2,
  .section-featured-immaculate-2x2,
  [data-section-type="featured-immaculate-2x2"]{
    margin-top: -18px;
    padding-top: 44px;
  }
}