/* ── Reset & Base ─────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; }
img, svg { display: block; max-width: 100%; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; margin: 0; padding: 0; }

/* ── Scroll-reveal (progressive enhancement) ─────────────── */
@media (prefers-reduced-motion: no-preference) {
    .reveal { opacity: 1; transform: translateY(0); transition: opacity 0.7s ease, transform 0.7s ease; }
    .reveal.revealed { opacity: 1; transform: translateY(0); }
    .reveal:not(.revealed) { opacity: 0; transform: translateY(28px); }
}

/* ── Navbar ───────────────────────────────────────────────── */
#navbar { background: transparent; }
#navbar.scrolled { background: rgba(28,25,23,0.92); backdrop-filter: blur(14px); box-shadow: 0 1px 0 rgba(255,255,255,0.06); }
.nav-logo { color: #fff; }

/* ── Hero ─────────────────────────────────────────────────── */
.hero-gradient {
    background: linear-gradient(135deg, #b83914 0%, #e8622e 30%, #f07d52 55%, #d4af66 80%, #c49a4e 100%);
}
.hero-img { opacity: 0.28; }
.hero-scrim { background: linear-gradient(180deg, rgba(28,25,23,0.35) 0%, rgba(28,25,23,0.15) 50%, rgba(28,25,23,0.55) 100%); }

.hero-badge { animation: fadeDown 0.8s ease both; }
.hero-title { animation: fadeUp 0.9s ease 0.15s both; }
.hero-subtitle { animation: fadeUp 0.9s ease 0.3s both; }
.hero-ctas { animation: fadeUp 0.9s ease 0.45s both; }
.hero-scroll-indicator { animation: fadeIn 1s ease 1s both; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeDown {
    from { opacity: 0; transform: translateY(-16px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── CTA Buttons ──────────────────────────────────────────── */
.cta-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 14px 32px; border-radius: 9999px;
    background: #fff; color: #b83914;
    font-weight: 600; font-size: 0.95rem;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
    box-shadow: 0 4px 20px rgba(0,0,0,0.18);
}
.cta-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(0,0,0,0.25); background: #fef7f0; }

.cta-secondary {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 14px 32px; border-radius: 9999px;
    background: rgba(255,255,255,0.15); color: #fff;
    font-weight: 600; font-size: 0.95rem;
    border: 1.5px solid rgba(255,255,255,0.35);
    transition: background 0.2s, border-color 0.2s, transform 0.2s;
}
.cta-secondary:hover { background: rgba(255,255,255,0.25); border-color: rgba(255,255,255,0.55); transform: translateY(-2px); }

/* ── Scroll mouse ─────────────────────────────────────────── */
.scroll-mouse { opacity: 0.6; }
.scroll-dot { animation: scrollBounce 1.6s ease-in-out infinite; }
@keyframes scrollBounce {
    0%, 100% { transform: translateY(0); opacity: 1; }
    50% { transform: translateY(6px); opacity: 0.3; }
}

/* ── Menu Labels ──────────────────────────────────────────── */
.menu-label { letter-spacing: 0.12em; }

/* ── Menu Cards ───────────────────────────────────────────── */
.menu-card { transition: transform 0.25s ease, box-shadow 0.25s ease; }
.menu-card:hover { transform: translateY(-4px); }

/* ── Gallery ──────────────────────────────────────────────── */
.gallery-item { overflow: hidden; }
.gallery-img { transition: transform 0.5s ease; }
.gallery-item:hover .gallery-img { transform: scale(1.06); }

/* ── Mobile Menu ──────────────────────────────────────────── */
.mobile-link { border-bottom: 1px solid rgba(255,255,255,0.08); }
.mobile-link:last-child { border-bottom: none; }

/* ── Utility ──────────────────────────────────────────────── */
@media (max-width: 767px) {
    .hero-title { font-size: 2.75rem; }
    .hero-subtitle { font-size: 1.05rem; }
}