/* Custom styles layered on top of Tailwind CDN */
:root { --grain: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>"); }

html { -webkit-font-smoothing: antialiased; }
body { background-image: var(--grain); background-repeat: repeat; }

/* Reveal on scroll */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: .08s; }
.reveal-delay-2 { transition-delay: .16s; }
.reveal-delay-3 { transition-delay: .24s; }

/* Hero overlay gradient */
.hero-overlay { background: linear-gradient(180deg, rgba(26,10,4,0.15) 0%, rgba(26,10,4,0.55) 60%, rgba(26,10,4,0.85) 100%); }

/* Menu category chip active */
.menu-chip.is-active { background: #B23A2A; color: white; border-color: #B23A2A; }

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

/* Fancy underline for links */
.underline-grow { position: relative; }
.underline-grow::after { content:''; position:absolute; left:0; bottom:-2px; width:100%; height:2px; background:#F2A03D; transform:scaleX(0); transform-origin:right; transition:transform .3s ease; }
.underline-grow:hover::after { transform:scaleX(1); transform-origin:left; }

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