/* ============================================
   SUMMER LOVE — Estilos de la Carta
   ============================================ */
.sl-menu-intro{text-align:center;margin-bottom:2rem}
.sl-menu-intro h1{font-size:clamp(2.5rem,7vw,5rem);letter-spacing:.1em}
.sl-menu-intro p{color:var(--sl-muted);max-width:560px;margin:.75rem auto 0;padding:0 1rem}

.sl-grid{
  display:grid;gap:1.25rem;
  grid-template-columns:1fr;
}
@media(min-width:640px){.sl-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.sl-grid{grid-template-columns:repeat(3,1fr)}}

.sl-card-item{display:flex;flex-direction:column}
.sl-img-bebida{
  aspect-ratio:1/1;width:100%;
  background:#000;object-fit:contain;
}
.sl-img-comida{
  aspect-ratio:4/3;width:100%;object-fit:cover;
}
.sl-img-placeholder{
  display:flex;align-items:center;justify-content:center;
  color:var(--sl-muted);font-family:"Bebas Neue",sans-serif;
  letter-spacing:.25em;font-size:.9rem;
  background:linear-gradient(135deg, rgba(255,43,214,.12), rgba(0,240,255,.1));
}
.sl-img-placeholder.bebida{aspect-ratio:1/1}
.sl-img-placeholder.comida{aspect-ratio:4/3}

.sl-card-body{padding:1.1rem 1.25rem 1.25rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
.sl-card-head{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:baseline;gap:.75rem;
}
.sl-card-name{
  font-family:"Bebas Neue",sans-serif;font-weight:400;
  font-size:1.5rem;letter-spacing:.05em;color:var(--sl-text);
  min-width:0;
}
.sl-card-price{
  font-family:"Monoton",sans-serif;
  color:#ff2bd6;
  text-shadow:0 0 4px rgba(255,43,214,.45), 0 0 10px rgba(255,43,214,.25);
  font-size:1.15rem;white-space:nowrap;flex-shrink:0;
}
.sl-price-alt{
  font-family:"Inter",system-ui,sans-serif;
  font-size:.72rem;font-weight:600;letter-spacing:.02em;
  color:var(--sl-muted);text-shadow:none;
  margin-left:.35rem;
}
.sl-card-desc{color:var(--sl-muted);font-size:.92rem;line-height:1.55}

/* ============ ESPECIALES (3D) ============ */
.sl-especiales-grid{
  display:grid;gap:1.5rem;
  grid-template-columns:1fr;
}
@media(min-width:760px){.sl-especiales-grid{grid-template-columns:1fr 1fr}}

.sl-especial-card{
  border-color:var(--sl-yellow);
  box-shadow:0 0 25px rgba(255,243,92,.22), inset 0 0 18px rgba(255,43,214,.08);
}
.sl-especial-3d{
  width:100%;aspect-ratio:1/1;background:#000;
  display:block;
}
.sl-especial-badge{
  position:absolute;top:.75rem;left:.75rem;z-index:2;
  font-family:"Bebas Neue",sans-serif;letter-spacing:.2em;font-size:.7rem;
  padding:.3rem .65rem;border-radius:999px;
  background:rgba(7,2,13,.7);
  border:1px solid var(--sl-cyan);
  color:var(--sl-cyan);
  text-shadow:0 0 6px rgba(0,240,255,.6);
}
.sl-especial-media{position:relative}

/* Ajustes finos en móvil */
@media (max-width:640px){
  .sl-card-name{font-size:1.35rem}
  .sl-card-price{font-size:1.05rem}
  .sl-card-body{padding:1rem 1.1rem 1.15rem}
}


/* ============ v4: Microinteracciones tarjetas ============ */
.sl-card-item{
  cursor:pointer;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  will-change:transform;
}
.sl-card-item img{
  transition:transform .35s ease, filter .35s ease;
}
.sl-card-item:hover{
  transform:translateY(-5px);
  border-color:rgba(255,43,214,.6);
  box-shadow:
    0 10px 30px rgba(0,0,0,.45),
    0 0 28px rgba(255,43,214,.32),
    0 0 18px rgba(0,240,255,.18),
    inset 0 0 18px rgba(0,240,255,.08);
}
.sl-card-item:hover img{
  transform:scale(1.04);
  filter:brightness(1.08) saturate(1.05);
}
.sl-card-item:focus-visible{
  transform:translateY(-3px);
}

/* ============ v4: Signature — destello dorado recorriendo el marco ============ */
.sl-signature-card{ position:relative; isolation:isolate; }
.sl-signature-card::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius:inherit;
  padding:1.5px;
  background:conic-gradient(from 0deg,
    transparent 0deg,
    rgba(255,215,90,0) 20deg,
    rgba(255,225,120,.95) 45deg,
    rgba(255,255,255,.9) 55deg,
    rgba(255,215,90,.85) 65deg,
    rgba(255,215,90,0) 90deg,
    transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  animation:sl-sheen-rotate 7s linear infinite;
  pointer-events:none;
  opacity:.85;
  z-index:1;
}
.sl-signature-card > *{ position:relative; z-index:2; }
@keyframes sl-sheen-rotate{
  to{ transform:rotate(360deg); }
}
@media (prefers-reduced-motion: reduce){
  .sl-signature-card::before{ animation:none; opacity:.35; }
}

.sl-signature-img{ background:#000; object-fit:cover; }

/* ===== Alérgenos ===== */
.sl-allergens{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:.4rem;
  margin:.75rem 0 0;
  padding:0;
}
.sl-allergen{
  position:relative;
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  color:rgba(255,255,255,.78);
  background:rgba(255,255,255,.04);
  cursor:help;
  transition:color .2s ease,border-color .2s ease,background .2s ease,transform .2s ease;
}
.sl-allergen svg{
  width:15px;
  height:15px;
  display:block;
}
.sl-allergen:hover,
.sl-allergen:focus,
.sl-allergen:focus-visible{
  color:#ff2bd6;
  border-color:#ff2bd6;
  background:rgba(255,43,214,.08);
  outline:none;
  transform:translateY(-1px);
}
.sl-allergen[data-tip]::after{
  content:attr(data-tip);
  position:absolute;
  bottom:calc(100% + 6px);
  left:50%;
  transform:translateX(-50%);
  background:#0a0512;
  color:#fff;
  font:500 11px/1 "Inter",sans-serif;
  letter-spacing:.03em;
  padding:.45rem .6rem;
  border-radius:6px;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
  box-shadow:0 4px 14px rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.1);
  z-index:5;
}
.sl-allergen:hover::after,
.sl-allergen:focus::after,
.sl-allergen:focus-visible::after{
  opacity:1;
}
.sl-allergens-none{
  margin:.75rem 0 0;
  padding:0;
  font:500 11px/1 "Inter",sans-serif;
  color:rgba(255,255,255,.4);
  letter-spacing:.08em;
  text-transform:uppercase;
}
