/* MASP — custom styles */
html { scroll-behavior: smooth; }

body {
  font-feature-settings: "ss01", "cv11";
  text-rendering: optimizeLegibility;
}

/* Marquee */
.marquee {
  display: inline-flex;
  animation: marquee 40s linear infinite;
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* Reveal on scroll */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1);
}
.reveal.visible {
  opacity: 1;
  transform: none;
}

/* Custom scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #F2EBDD; }
::-webkit-scrollbar-thumb { background: #0E0E0E; border: 2px solid #F2EBDD; }
::-webkit-scrollbar-thumb:hover { background: #D62518; }

/* Fine focus ring for accessibility */
:focus-visible {
  outline: 2px solid #D62518;
  outline-offset: 3px;
}

/* Utility: editorial number */
.num-editorial {
  font-family: "Fraunces", serif;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 0.85;
}

/* Inputs */
input, select, textarea { font-family: inherit; max-width: 100%; box-sizing: border-box; }

/* Ticket counter */
.qty-btn {
  width: 36px; height: 36px;
  display: grid; place-items: center;
  border: 1px solid rgba(14,14,14,.2);
  transition: all .15s ease;
}
.qty-btn:hover:not(:disabled) { background: #0E0E0E; color: #F2EBDD; border-color: #0E0E0E; }
.qty-btn:disabled { opacity: .3; cursor: not-allowed; }

/* Date input prettier */
input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.3);
  cursor: pointer;
}

/* Subtle grid lines on hover for cards */
.card-art { position: relative; }
.card-art::after {
  content: "";
  position: absolute; inset: 0;
  border: 1px solid transparent;
  transition: border-color .3s;
  pointer-events: none;
}
.card-art:hover::after { border-color: rgba(214, 37, 24, .4); }

/* Stagger reveal helper */
.stagger > * { opacity: 0; transform: translateY(20px); transition: all .8s cubic-bezier(.2,.7,.2,1); }
.stagger.visible > *:nth-child(1) { opacity: 1; transform: none; transition-delay: .05s; }
.stagger.visible > *:nth-child(2) { opacity: 1; transform: none; transition-delay: .15s; }
.stagger.visible > *:nth-child(3) { opacity: 1; transform: none; transition-delay: .25s; }
.stagger.visible > *:nth-child(4) { opacity: 1; transform: none; transition-delay: .35s; }
.stagger.visible > *:nth-child(5) { opacity: 1; transform: none; transition-delay: .45s; }

/* Tag chip */
.chip {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .35rem .7rem; font-size: 11px;
  letter-spacing: .15em; text-transform: uppercase;
  border: 1px solid rgba(14,14,14,.2);
  border-radius: 999px;
}
.chip.active { background: #0E0E0E; color: #F2EBDD; border-color: #0E0E0E; }

@media (prefers-reduced-motion: reduce) {
  .marquee { animation: none; }
  .reveal, .stagger > * { opacity: 1; transform: none; transition: none; }
}