:root{
  --gold:#f6b600;
  --gold-2:#ffcc33;
  --dark:#0b0f14;
  --dark-2:#111826;
  --card:#0f1623;
}



body{
  background: radial-gradient(1200px 500px at 20% 0%, rgba(246,182,0,.12), transparent 60%),
              radial-gradient(900px 400px at 90% 10%, rgba(255,204,51,.08), transparent 55%),
              var(--dark);
}

.text-gold{ color: var(--gold) !important; }

.nav-glass{
  background: rgba(10, 14, 20, .72);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.brand-badge{
  width: 36px; height: 36px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--gold), #ff8a00);
  color:#111;
  font-weight:900;
  box-shadow: 0 10px 25px rgba(246,182,0,.25);
}

.btn-gold{
  background: linear-gradient(135deg, var(--gold), #ff8a00);
  border: none;
  color:#111;
  font-weight: 700;
  border-radius: 14px;
  padding: .6rem .9rem;
}
.btn-gold:hover{ filter: brightness(1.05); }

.btn-outline-gold{
  border: 1px solid rgba(246,182,0,.55);
  color: var(--gold);
  border-radius: 14px;
}
.btn-outline-gold:hover{
  background: rgba(246,182,0,.12);
  border-color: rgba(246,182,0,.8);
  color: var(--gold-2);
}

.cart-badge{
  position:absolute;
  top:-8px; right:-8px;
  border-radius: 999px;
  border: 1px solid rgba(246,182,0,.35);
  padding: .25rem .45rem;
}

.hero{
  position: relative;
  min-height: 520px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.hero .carousel-item{
  min-height: 520px;
  background-size: cover;
  background-position: center;
}
.hero-overlay{
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.25) 60%, rgba(0,0,0,.85));
}
.hero-content{
  position: relative;
  z-index: 2;
  padding: 80px 0;
}
.hero h1{
  font-size: clamp(2rem, 5vw, 3.6rem);
  font-weight: 900;
  letter-spacing: -0.02em;
}
.hero p{
  max-width: 560px;
  color: rgba(255,255,255,.72);
}

.section-title{
  font-weight: 900;
  letter-spacing: -0.02em;
}

.product-card{
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  overflow: hidden;
  transition: transform .15s ease, border-color .15s ease;
}
.product-card:hover{
  transform: translateY(-2px);
  border-color: rgba(246,182,0,.35);
}
.product-card img{
  width: 100%;
  height: 180px;
  object-fit: cover;
  background: #0a0f16;
}
.product-card .meta{
  color: rgba(255,255,255,.6);
  font-size: .85rem;
}
.price{
  font-weight: 900;
  color: var(--gold);
}

.badge-cat{
  background: rgba(246,182,0,.12);
  border: 1px solid rgba(246,182,0,.25);
  color: var(--gold);
  font-weight: 700;
}

.panel{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
}

.footer-dark{
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.2));
  border-top: 1px solid rgba(255,255,255,.08);
}
.footer-links a{
  color: rgba(255,255,255,.65);
  text-decoration: none;
}
.footer-links a:hover{ color: var(--gold); }

.social{
  width: 40px; height: 40px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius: 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.75);
  text-decoration:none;
}
.social:hover{
  border-color: rgba(246,182,0,.35);
  color: var(--gold);
}

.table-dark-custom{
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  overflow:hidden;
}


.pagination .page-link{
  border-radius: 14px !important;
  margin: 0 .15rem;
}
.pagination .page-item.active .page-link{
  box-shadow: 0 10px 25px rgba(246,182,0,.25);
}

.dropdown-menu .dropdown-divider{ opacity:.25; }

.brand-float{
  position: relative;
  z-index: 5;
}

.brand-logo-wrap{
  position: relative;
  top: 12px;                 /* lo hace sobresalir */
  background: #0b111a;
  padding: 6px 10px;
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
  border: 2px solid rgba(246,182,0,.6);
}

.brand-logo-wrap img{
  height:70px;
  width:auto;
  object-fit:contain;
}

.brand-text{
  font-size:1.3rem;
  letter-spacing:1px;
  text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.brand-logo-wrap{
  background: linear-gradient(145deg,#0b111a,#111);
}

.brand-logo-wrap:after{
  content:'';
  position:absolute;
  inset:-2px;
  border-radius:18px;
  background:linear-gradient(45deg,#f6b600,#ffce3a,#f6b600);
  z-index:-1;
  filter:blur(8px);
  opacity:.6;
}
@media(max-width:768px){
  .brand-logo-wrap img{
    height:52px;
  }
  .brand-text{
    font-size:1rem;
  }
}


.selectptoyec{ color:var(--gold);}
