/* ===== Coverflow / Infinite Card Slider look ===== */
.coverflow{
  margin-top: 10px;
  border-radius: 26px; 
  padding: 18px 16px 14px;
  left: 5%;
  width: 100%;
  height: 650px;
}

.coverflow__stage{
  position: relative;
  height: 640px;               /* parecido al demo */
  overflow: hidden;
  border-radius: 22px;
  /* fade laterales más agresivo */
  mask-image: linear-gradient(90deg, transparent, #000 20%, #000 80%, transparent);
  perspective: 1200px;
  /* Asegurar que nada se salga del contenedor */
  clip-path: inset(0);
}

.coverflow__track{
  position:absolute;
  inset:0;
  transform-style: preserve-3d;
  overflow: hidden;
}

/* Cards ABS para que GSAP las posicione */
.cfCard{
  position:absolute;
  top: 50%;
  left: 50%;
  width: 580px;
  height: 440px;
  transform-style: preserve-3d;
  cursor: default !important;
  border-radius: 22px;
  padding: 36px;
  border: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
  box-shadow: 0 18px 60px rgba(0,0,0,.50);
  overflow:hidden;
}

.cfCard__badge{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,245,255,.22);
  background: rgba(0,245,255,.10);
  margin-bottom: 10px;
}
.cfCard__badge--alt{
  border-color: rgba(255,208,0,.22);
  background: rgba(255,208,0,.10);
}

.cfCard__title{ margin:0 0 6px; font-size:1.18rem; }
.cfCard__meta{ margin:0 0 14px; }
.cfCard__footer{
  position:absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}
.cfCard__price{ font-weight: 900; font-size: 1.1rem; }

.cfCard__glow{
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    radial-gradient(260px 120px at 20% 20%, rgba(0,245,255,.18), transparent 60%),
    radial-gradient(260px 120px at 80% 30%, rgba(251, 255, 43, 0.14), transparent 62%);
  opacity:.9;
}


/* responsive */
@media (max-width: 980px){
  .coverflow__stage{ height: 380px; }
  .cfCard{ width: 250px; height: 320px; }
}
.coverflow__stage { transform: translateZ(0); }
.cfCard { backface-visibility: hidden; }


.hero-head{
  margin-top: 5%;
}
.hero-title{
  font-size: 3.8rem;
  margin: 0;

}
.pill{
  display: inline-block;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 1.2rem;
  margin-top: 7rem;
}

#Galerie {
  scroll-margin-top: 120px; /* ajusta al alto de tu navbar */
}