:root{
  --bg:#060914;
  --bg-2:#0b1220;
  --panel:#101a2c;
  --panel-2:#14243b;
  --line:rgba(255,255,255,.08);
  --text:#f3f6ff;
  --muted:#b7c4db;
  --accent:#d91656;
  --accent-2:#3b82f6;
  --green:#16a34a;
  --shadow:0 18px 48px rgba(0,0,0,.35);
  --radius:22px;
  --max:1280px;
  --titleFont:"BarisCerin","Source Sans 3",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --bodyFont:"Source Sans 3",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

@font-face{
  font-family:"BarisCerin";
  src:url("Baris_Cerin.ttf") format("truetype");
  font-display:swap;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}

body{
  min-height:100vh;
  color:var(--text);
  font-family:var(--bodyFont);
  background:
    radial-gradient(900px 500px at 10% 0%, rgba(217,22,86,.12), transparent 58%),
    radial-gradient(900px 520px at 90% 0%, rgba(59,130,246,.12), transparent 58%),
    linear-gradient(180deg,#04070f 0%, #08111d 100%);
}

a{text-decoration:none;color:inherit}
img{display:block;max-width:100%;height:auto}

.container{
  width:min(var(--max), calc(100% - 36px));
  margin-inline:auto;
}

/* =========================
   TOPBAR
   ========================= */

.topbar{
  position:sticky;
  top:0;
  z-index:100;
  background:rgba(5,8,16,.78);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}

.topbar__inner{
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.brand{
  position:relative;
  display:flex;
  align-items:center;
  min-height:74px;
  padding-left:180px;
}

.brand__logo{
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:170px;
  object-fit:contain;
  filter:brightness(0) invert(1);
}

.brand__text{
  display:flex;
  flex-direction:column;
  line-height:1.1;
}

.brand__text strong{
  font-family:var(--titleFont);
  font-size:1.4rem;
}

.brand__text span{
  color:var(--muted);
  font-size:.86rem;
}

.menu{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.menu a{
  color:var(--muted);
  padding:10px 12px;
  border-radius:12px;
  transition:.2s ease;
}

.menu a:hover{
  color:var(--text);
  background:rgba(255,255,255,.05);
}

/* =========================
   HERO
   ========================= */

.hero{
  padding:34px 0 18px;
}

.hero__grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:18px;
}

.heroCard,
.infoCard,
.newsCard,
.selladoCard{
  background:linear-gradient(180deg, rgba(18,29,47,.96), rgba(10,17,29,.96));
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}

.heroCard,
.infoCard{
  border-radius:28px;
  padding:26px;
}

.heroCard h1{
  margin:16px 0 12px;
  font-size:clamp(2rem,4vw,3.6rem);
  font-family:var(--titleFont);
}

.hero__text{
  color:var(--muted);
  line-height:1.65;
}

.hero__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}

.heroStats{
  margin-top:24px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.heroStat{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  border-radius:18px;
  padding:14px 16px;
}

.heroStat small{
  color:var(--muted);
}

.heroStat strong{
  font-size:1.3rem;
}

/* =========================
   NEWS
   ========================= */

.section{
  padding:22px 0 8px;
}

.sectionHead{
  display:flex;
  justify-content:space-between;
  margin-bottom:16px;
}

.section h2{
  font-family:var(--titleFont);
  font-size:2rem;
}

.section p{
  color:var(--muted);
}

.newsGrid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}

.newsCard{
  border-radius:22px;
  padding:18px;
}

.newsCard h3{
  margin:0 0 8px;
}

/* =========================
   SELLADO
   ========================= */

.selladoGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.selladoCard{
  border-radius:22px;
  padding:18px;
}

/* =========================
   HOME SINGLES
   ========================= */

.homeSinglesGrid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:18px;
}

.singleCard{
  border-radius:24px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:.25s;
}

.singleCard:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 52px rgba(0,0,0,.42);
}

.singleCard__media{
  padding:14px;
}

.singleCard__media img{
  width:100%;
  height:100%;
  object-fit:contain;
  background:#0b0f18;
}

.singleCard__body{
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* =========================
   BOTONES
   ========================= */

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:12px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:var(--text);
  font-weight:800;
  transition:.2s;
}

.btn:hover{
  transform:translateY(-1px);
}

.btn--primary{
  background:linear-gradient(135deg,#d91656,#8b1cff);
}

.btn--whatsapp{
  background:linear-gradient(135deg,#0d7d46,#16a34a);
}

.btn--ghost{
  background:rgba(255,255,255,.04);
}

/* =========================
   FOOTER
   ========================= */

.footer{
  margin-top:28px;
  padding:18px 0 26px;
  border-top:1px solid var(--line);
}

.footer__inner{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  color:var(--muted);
}

/* =========================
   WHATSAPP FLOAT
   ========================= */

.fabWhatsapp{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:120;
  width:58px;
  height:58px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#119b50,#1fc96a);
  box-shadow:0 16px 36px rgba(0,0,0,.4);
  font-size:1.4rem;
}

/* =========================
   RESPONSIVE
   ========================= */

@media (max-width:1180px){

.newsGrid{
grid-template-columns:repeat(2,1fr)
}

.homeSinglesGrid{
grid-template-columns:repeat(3,1fr)
}

}

@media (max-width:980px){

.hero__grid{
grid-template-columns:1fr
}

.selladoGrid{
grid-template-columns:1fr
}

.homeSinglesGrid{
grid-template-columns:repeat(2,1fr)
}

.brand{
padding-left:150px
}

.brand__logo{
width:138px
}

}

@media (max-width:760px){

.topbar__inner{
flex-direction:column;
align-items:flex-start
}

.brand{
padding-left:120px
}

.brand__logo{
width:108px
}

.menu{
width:100%
}

.heroStats{
grid-template-columns:1fr
}

.homeSinglesGrid,
.newsGrid{
grid-template-columns:1fr
}

}

@media (max-width:520px){

.container{
width:min(100% - 20px, var(--max))
}

.brand{
padding-left:98px
}

.brand__logo{
width:88px
}

.brand__text strong{
font-size:1.08rem
}

.section h2{
font-size:1.7rem
}

.singleCard h3{
font-size:1.35rem
}

.heroCard,
.infoCard{
padding:20px
}

.hero__actions{
flex-direction:column
}

.btn{
width:100%
}

}

/* =========================
   CONTACTO GLOBAL
   ========================= */

.top-contact-bar{
  width:100%;
  background:#0f172a;
  color:#ffffff;
  font-size:14px;
  padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.top-contact-bar__inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-align:center;
}

.top-contact-bar a{
  color:#22c55e;
  text-decoration:none;
  font-weight:700;
}

.top-contact-bar a:hover{
  text-decoration:underline;
}

.contact-label{
  font-weight:800;
}

.contact-sep{
  color:rgba(255,255,255,.45);
}

.footer__inner--stack{
  flex-direction:column;
  gap:10px;
  text-align:center;
}

.footerContact{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
}

.footerContact a{
  color:#22c55e;
  text-decoration:none;
  font-weight:700;
}

.footerContact a:hover{
  text-decoration:underline;
}

.btn--buy,
.btn--whatsapp{
  background:linear-gradient(135deg, #22c55e, #16a34a);
  color:#fff;
  border-color:transparent;
}

.btn--buy:hover,
.btn--whatsapp:hover{
  filter:brightness(1.05);
}

@media (max-width: 720px){
  .top-contact-bar{
    font-size:13px;
  }

  .top-contact-bar__inner{
    gap:6px 10px;
  }

  .contact-sep{
    display:none;
  }

  .footerContact{
    flex-direction:column;
    gap:8px;
  }
}


/* --- Added hover card effect --- */

.card{
transition:all .25s ease;
cursor:pointer;
}
.card:hover{
transform:translateY(-6px) scale(1.03);
box-shadow:0 25px 50px rgba(0,0,0,.55);
}
.card img{
transition:transform .3s ease;
}
.card:hover img{
transform:scale(1.08);
}

/* --- Modal --- */
.cardModal{
position:fixed;
inset:0;
background:rgba(0,0,0,.85);
display:flex;
align-items:center;
justify-content:center;
z-index:9999;
padding:20px;
}
.cardModal.hidden{
display:none;
}
.modalContent{
background:#0f172a;
padding:24px;
border-radius:16px;
max-width:900px;
width:100%;
display:flex;
gap:24px;
position:relative;
box-shadow:0 20px 60px rgba(0,0,0,.6);
}
.modalContent img{
max-height:520px;
border-radius:10px;
}
.modalInfo{
flex:1;
color:#e5e7eb;
}
#closeModal{
position:absolute;
top:12px;
right:12px;
background:#ef4444;
border:none;
color:white;
font-size:16px;
padding:6px 10px;
border-radius:6px;
cursor:pointer;
}

/* WhatsApp button */
.buyButton{
display:inline-block;
margin-top:16px;
background:#25D366;
color:white;
font-weight:bold;
padding:12px 20px;
border-radius:8px;
text-decoration:none;
transition:.2s;
}
.buyButton:hover{
background:#1ebe5b;
transform:scale(1.05);
}

.priceCard{
font-size:22px;
font-weight:bold;
color:#22c55e;
margin-top:10px;
}

/* FIX modal hidden */
.cardModal[hidden]{display:none!important;}


.featureGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;}
.featureCard,.miniDexCta{background:#111827;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:20px;box-shadow:0 10px 30px rgba(0,0,0,.18);}
.miniDexCta{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:22px 0 28px;}
.miniDexCta__content{display:flex;flex-direction:column;gap:4px;}
.miniDexCta__content strong{font-size:1.05rem;}
.miniDexCta__content span{opacity:.86;}
.miniDexCta__actions{display:flex;gap:10px;flex-wrap:wrap;}
@media (max-width: 720px){.miniDexCta{flex-direction:column;align-items:flex-start;}}

/* Coleccion Dex - version profesional */
.pageHero--clean{padding-top:28px;}
.collectionHeroPro{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr);gap:20px;align-items:stretch;}
.heroCard--wide{min-width:0;}
.collectionInfoCard{display:flex;flex-direction:column;justify-content:center;}
.infoList--dark li{color:#e5e7eb;}
.trustRow{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;}
.trustPill{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:#e5e7eb;font-size:.92rem;}
.collectionChoiceCard{display:flex;flex-direction:column;gap:12px;}
.collectionChoiceCard .btn{align-self:flex-start;}
.choiceIcon{font-size:2rem;line-height:1;}
.section--soft{padding-top:4px;}
.dexCallout{display:flex;justify-content:space-between;gap:18px;align-items:center;background:linear-gradient(135deg, rgba(59,130,246,.12), rgba(34,197,94,.08));border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:24px;box-shadow:0 10px 30px rgba(0,0,0,.16);}
.dexCallout h2{margin:6px 0 10px;}
.dexCallout p{margin:0;color:#cbd5e1;max-width:760px;}
.dexCallout__actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
@media (max-width: 900px){.collectionHeroPro{grid-template-columns:1fr;}.dexCallout{flex-direction:column;align-items:flex-start;}.dexCallout__actions{justify-content:flex-start;}}


/* =========================
   AVISO DE PRECIOS
   ========================= */

.siteAlertWrap{
  padding:16px 0 6px;
}

.siteAlert{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:16px;
  align-items:center;
  padding:18px 20px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(135deg, rgba(217,22,86,.18), rgba(59,130,246,.14));
  box-shadow:0 16px 42px rgba(0,0,0,.22);
}

.siteAlert__content{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.alertBadge,
.eventsBadge,
.noticeBadge,
.eventMeta__badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.siteAlert h2,
.siteAlert p{
  margin:0;
}

.siteAlert h2{
  font-size:clamp(1.1rem,2.5vw,1.45rem);
}

.siteAlert p{
  color:#edf2ff;
  line-height:1.55;
}

.siteAlert__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.priceNoteInline{
  margin-top:14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.noticePill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.05);
  color:#dbe7ff;
  font-size:.9rem;
  font-weight:700;
}

/* =========================
   BANNER DE EVENTOS
   ========================= */

.eventsBannerSection{
  padding-top:14px;
}

.eventsBanner{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0, 1.45fr) minmax(280px, .7fr);
  gap:20px;
  padding:28px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(600px 220px at 5% 0%, rgba(217,22,86,.18), transparent 55%),
    radial-gradient(520px 240px at 100% 0%, rgba(34,197,94,.12), transparent 55%),
    linear-gradient(145deg, rgba(12,20,34,.98), rgba(10,16,27,.98));
  box-shadow:var(--shadow);
}

.eventsBanner::before,
.eventsBanner::after{
  content:"";
  position:absolute;
  border-radius:999px;
  pointer-events:none;
}

.eventsBanner::before{
  width:220px;
  height:220px;
  right:-70px;
  top:-60px;
  background:radial-gradient(circle, rgba(217,22,86,.18), transparent 70%);
}

.eventsBanner::after{
  width:200px;
  height:200px;
  left:-80px;
  bottom:-80px;
  background:radial-gradient(circle, rgba(59,130,246,.16), transparent 70%);
}

.eventsBanner__content,
.eventsBanner__side{
  position:relative;
  z-index:1;
}

.eventsBanner h2{
  margin:14px 0 10px;
  font-family:var(--titleFont);
  font-size:clamp(1.9rem, 3vw, 3rem);
}

.eventsBanner p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
}

.eventsTags{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.eventsTag{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:#fff;
  font-weight:700;
  font-size:.92rem;
}

.eventsBanner__actions{
  margin-top:22px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.eventsSideCard{
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  padding:18px;
}

.eventsSideCard h3{
  margin:0 0 12px;
  font-size:1.1rem;
}

.eventMetaList{
  display:grid;
  gap:12px;
}

.eventMeta{
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(5,8,16,.42);
}

.eventMeta strong,
.eventMeta span{
  display:block;
}

.eventMeta strong{
  margin-top:8px;
  font-size:1rem;
}

.eventMeta span{
  margin-top:4px;
  color:var(--muted);
  line-height:1.45;
}

.eventMiniGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
  margin-top:18px;
}

.eventMiniCard{
  border-radius:22px;
  padding:18px;
  background:#111827;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 30px rgba(0,0,0,.18);
}

.eventMiniCard h3{
  margin:10px 0 8px;
}

.eventMiniCard p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.eventMiniIcon{
  font-size:1.9rem;
  line-height:1;
}

.eventsPageGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:18px;
}

.organizerCta{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  border-radius:24px;
  padding:24px;
  background:linear-gradient(135deg, rgba(59,130,246,.12), rgba(217,22,86,.14));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 30px rgba(0,0,0,.18);
}

.organizerCta p{
  margin:8px 0 0;
  color:var(--muted);
  max-width:760px;
}

@media (max-width: 980px){
  .siteAlert,
  .eventsBanner,
  .organizerCta{
    grid-template-columns:1fr;
  }

  .siteAlert__actions,
  .organizerCta .hero__actions{
    justify-content:flex-start;
  }
}

@media (max-width: 760px){
  .siteAlert,
  .eventsBanner,
  .organizerCta{
    padding:20px;
  }

  .eventsBanner__actions,
  .siteAlert__actions{
    flex-direction:column;
    align-items:stretch;
  }

  .eventsBanner__actions .btn,
  .siteAlert__actions .btn,
  .organizerCta .btn{
    width:100%;
  }
}


/* =========================
   STORE LANDING 2026
   ========================= */

.hero--store{
  padding-top:22px;
}

.storeHeroLayout{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:22px;
  align-items:stretch;
}

.heroCard--store{
  min-height:100%;
}

.heroStats--4{
  grid-template-columns:repeat(4,1fr);
}

.storeVisualPanel{
  position:relative;
  min-height:520px;
  border-radius:30px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(420px 220px at 15% 10%, rgba(34,197,94,.12), transparent 60%),
    radial-gradient(420px 240px at 88% 12%, rgba(59,130,246,.15), transparent 60%),
    linear-gradient(180deg, rgba(10,15,28,.98), rgba(8,12,23,.98));
  box-shadow:var(--shadow);
}

.storeVisualMain{
  position:absolute;
  inset:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}

.storeVisualMain img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:18px;
  filter:drop-shadow(0 18px 42px rgba(0,0,0,.35));
}

.storeVisualBadge{
  position:absolute;
  top:16px;
  left:16px;
  z-index:2;
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.1);
  color:#fff;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.floatingCard{
  position:absolute;
  width:132px;
  aspect-ratio:63/88;
  border-radius:18px;
  overflow:hidden;
  background:#0b1220;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 18px 42px rgba(0,0,0,.42);
}

.floatingCard img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.floatingCard--a{ right:26px; top:30px; transform:rotate(8deg); }
.floatingCard--b{ left:20px; bottom:24px; transform:rotate(-10deg); }
.floatingCard--c{ right:130px; bottom:22px; transform:rotate(6deg); }
.floatingCard--d{ left:48px; top:42px; transform:rotate(-6deg); }

.storeStripSection{
  padding-top:8px;
}

.storeStrip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.storeStrip__item{
  border-radius:20px;
  padding:18px;
  background:linear-gradient(180deg, rgba(18,29,47,.96), rgba(10,17,29,.96));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}

.storeStrip__item strong,
.storeStrip__item span{
  display:block;
}

.storeStrip__item strong{
  margin-bottom:6px;
  font-size:1rem;
}

.storeStrip__item span{
  color:var(--muted);
  line-height:1.5;
}

.sealedShowcaseGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;
}

.sealedCard{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(18,29,47,.96), rgba(10,17,29,.96));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}

.sealedCard__media{
  position:relative;
  min-height:240px;
  background:#0b1220;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.sealedCard__media img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:14px;
}

.sealedCard__media--fallback{
  background:
    radial-gradient(200px 140px at 20% 15%, rgba(217,22,86,.2), transparent 60%),
    radial-gradient(220px 160px at 80% 15%, rgba(59,130,246,.18), transparent 60%),
    linear-gradient(180deg,#0b1220,#091019);
}

.sealedFallback{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-align:center;
  padding:20px;
}

.sealedFallback__emoji{
  font-size:3rem;
  line-height:1;
}

.sealedBadge{
  position:absolute;
  left:14px;
  top:14px;
  display:inline-flex;
  align-items:center;
  padding:7px 11px;
  border-radius:999px;
  background:rgba(0,0,0,.6);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
  font-size:.8rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.sealedCard__body{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:18px;
}

.sealedCard__body h3{
  margin:0;
  font-size:1.08rem;
  line-height:1.4;
}

.sealedCard__body p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.sealedPriceRow{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
}

.sealedPriceRow span{
  color:var(--muted);
  font-size:.92rem;
}

.sealedPriceRow strong{
  font-size:1.08rem;
  color:#fff;
}

.premiumSinglesGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:18px;
}

.premiumSingleCard{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(18,29,47,.96), rgba(10,17,29,.96));
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}

.premiumSingleCard__media{
  aspect-ratio:63/88;
  background:#0b1220;
  overflow:hidden;
}

.premiumSingleCard__media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.premiumSingleCard__body{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:16px;
}

.premiumSingleCard__body h3{
  margin:0;
  font-size:1.08rem;
  line-height:1.4;
}

.premiumSingleCard__chips,
.singleCard__chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.singleChip{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:#e8eefc;
  font-size:.82rem;
  font-weight:700;
}

.qtyChip{
  background:rgba(34,197,94,.12);
  border-color:rgba(34,197,94,.28);
  color:#c9ffd9;
}

.singleMeta{
  margin:0;
  color:var(--muted);
  line-height:1.45;
}

.singlePriceBox{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
}

.singlePriceLabel{
  color:var(--muted);
  font-size:.9rem;
}

.singlePriceBox strong{
  font-size:1.06rem;
  color:#fff;
}

.cardActionRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:auto;
}

.quickSearch--store{
  margin-bottom:18px;
}

.quickSearch--store input{
  width:100%;
  min-height:52px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:#0f172a;
  color:#fff;
  padding:14px 16px;
  font-size:1rem;
  outline:none;
}

.quickSearch--store input:focus{
  border-color:rgba(59,130,246,.55);
  box-shadow:0 0 0 4px rgba(59,130,246,.12);
}

.stepsGrid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.stepCard{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  padding:24px 20px 20px;
  background:linear-gradient(180deg, rgba(18,29,47,.96), rgba(10,17,29,.96));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}

.stepNumber{
  display:inline-grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:14px;
  background:linear-gradient(135deg,#d91656,#8b1cff);
  color:#fff;
  font-weight:900;
  margin-bottom:14px;
}

.stepCard h3{
  margin:0 0 8px;
}

.stepCard p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

@media (max-width: 1100px){
  .storeHeroLayout{
    grid-template-columns:1fr;
  }

  .storeVisualPanel{
    min-height:460px;
  }

  .heroStats--4{
    grid-template-columns:repeat(2,1fr);
  }

  .storeStrip,
  .stepsGrid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 760px){
  .heroStats--4{
    grid-template-columns:1fr;
  }

  .cardActionRow .btn{
    width:100%;
  }

  .floatingCard{
    width:104px;
    border-radius:14px;
  }

  .storeVisualPanel{
    min-height:380px;
  }

  .storeVisualMain{
    inset:16px;
  }
}

.kicker{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.05);
  color:#dbe7ff;
  font-size:.84rem;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.emptyState{
  margin-top:18px;
  border-radius:18px;
  padding:18px;
  background:#111827;
  border:1px solid rgba(255,255,255,.08);
  color:#cbd5e1;
}


/* =========================
   CARRITO
   ========================= */

.menuCart{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.cartCountBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
  color:#fff;
  font-size:.78rem;
  font-weight:800;
}

.menuCart.has-items .cartCountBadge{
  background:linear-gradient(135deg,#d91656,#8b1cff);
  border-color:transparent;
}

.btn--cart{
  background:linear-gradient(135deg,#1d4ed8,#2563eb);
}

.cartToastWrap{
  position:fixed;
  right:18px;
  bottom:88px;
  z-index:150;
  display:grid;
  gap:10px;
}

.cartToast{
  min-width:260px;
  max-width:min(92vw, 360px);
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(9,14,24,.96);
  color:#fff;
  box-shadow:0 16px 36px rgba(0,0,0,.4);
  transform:translateY(8px);
  opacity:0;
  transition:.22s ease;
}

.cartToast.is-visible{
  transform:translateY(0);
  opacity:1;
}

.cartToast--success{
  border-color:rgba(34,197,94,.35);
}

.cartToast--error{
  border-color:rgba(248,113,113,.35);
}
