/* ─── Base ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ─── Navbar ───────────────────────────────────────────────────── */
.navbar-inner {
    background: transparent;
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
    transition: background 0.3s ease, backdrop-filter 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.navbar-scrolled .navbar-inner {
    background: rgba(250, 247, 242, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom-color: rgba(196, 98, 45, 0.15) !important;
    box-shadow: 0 1px 20px rgba(44, 26, 14, 0.06);
}

/* Active nav link */
.nav-link.active,
.mobile-scroll-link.active {
    color: #c4622d;
    border-color: rgba(196, 98, 45, 0.35);
}
.nav-link.active {
    background: rgba(196, 98, 45, 0.07);
    border-radius: 6px;
}

/* ─── Hero ─────────────────────────────────────────────────────── */
.hero-bg {
    background:
        radial-gradient(ellipse 90% 70% at 50% 110%, rgba(196, 98, 45, 0.18) 0%, transparent 55%),
        radial-gradient(ellipse 60% 50% at 15% 20%,  rgba(196, 98, 45, 0.10) 0%, transparent 50%),
        radial-gradient(ellipse 50% 40% at 85% 15%,  rgba(139, 53, 32, 0.07) 0%, transparent 50%),
        radial-gradient(ellipse 100% 60% at 50% 0%,  rgba(240, 232, 218, 0.6) 0%, transparent 80%),
        #faf7f2;
}
.hero-overlay {
    background: linear-gradient(
        to bottom,
        rgba(250, 247, 242, 0.0) 0%,
        rgba(250, 247, 242, 0.0) 60%,
        rgba(250, 247, 242, 0.9) 100%
    );
}

/* Hero decorative circles */
.hero-arch-left,
.hero-arch-right {
    opacity: 0.6;
}

/* Hero entrance animation */
.hero-tag   { animation: fadeUp 0.7s ease both 0.15s; }
.hero-title { animation: fadeUp 0.8s ease both 0.30s; }
.hero-line  { animation: fadeUp 0.7s ease both 0.50s; }
.hero-sub   { animation: fadeUp 0.7s ease both 0.65s; }

@keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Menu Cards ───────────────────────────────────────────────── */
.menu-card {
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.menu-card:hover {
    box-shadow: 0 16px 48px -8px rgba(196, 98, 45, 0.15), 0 4px 16px rgba(44, 26, 14, 0.08);
}

.price-badge {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* ─── Section fade-in on scroll ────────────────────────────────── */
.category-section {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.65s ease, transform 0.65s ease;
}
.category-section.visible {
    opacity: 1;
    transform: translateY(0);
}

/* ─── Back to top ──────────────────────────────────────────────── */
#back-to-top.show {
    opacity: 1;
    transform: translateY(0);
}

/* ─── Line-clamp ───────────────────────────────────────────────── */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ─── Smooth scroll ────────────────────────────────────────────── */
html {
    scroll-behavior: smooth;
}

/* ─── Custom scrollbar ─────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f0e8da; }
::-webkit-scrollbar-thumb { background: #c4b09a; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #c4622d; }