/* ── Reset & Base ───────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { min-height: 100vh; }
img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }

/* ── Navbar ──────────────────────────────────────── */
.nav-fixed { color: rgba(253, 251, 247, 0.9); }
.nav-fixed .nav-link { color: rgba(253, 251, 247, 0.75); transition: color 0.3s; }
.nav-fixed .nav-link:hover { color: #f5f0e8; }
.nav-fixed .btn-primary { background: rgba(245, 240, 232, 0.15); border-color: rgba(245, 240, 232, 0.3); color: #f5f0e8; backdrop-filter: blur(8px); }
.nav-fixed .btn-primary:hover { background: rgba(245, 240, 232, 0.25); }
.nav-scrolled { background: rgba(5, 19, 14, 0.95); backdrop-filter: blur(16px); box-shadow: 0 1px 0 rgba(255,255,255,0.05); }
.nav-scrolled .nav-link { color: rgba(245, 240, 232, 0.75); }
.nav-scrolled .nav-link:hover { color: #f5f0e8; }
.nav-scrolled .btn-primary { background: #059669; border-color: #059669; color: #f5f0e8; }
.nav-scrolled .btn-primary:hover { background: #047857; }

/* ── Mobile Menu ─────────────────────────────────── */
.mobile-menu-link { color: #064e3b; text-decoration: none; }
.mobile-menu-link:hover { color: #059669; }
#mobile-menu.open { opacity: 1; pointer-events: auto; }
#mobile-menu.closed { opacity: 0; pointer-events: none; }
.menu-line { background: currentColor; }
.menu-open .menu-line:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.menu-open .menu-line:nth-child(2) { opacity: 0; }
.menu-open .menu-line:nth-child(3) { transform: translateY(-4px) rotate(-45deg); width: 24px; }

/* ── Hero ────────────────────────────────────────── */
.hero-gradient {
    background: radial-gradient(ellipse 80% 60% at 50% 40%, #065f46 0%, #042e23 50%, #020e0b 100%);
}
.hero-pattern {
    background-image: radial-gradient(circle, rgba(245,240,232,0.5) 1px, transparent 1px);
    background-size: 32px 32px;
}
.hero-badge { animation: heroFadeUp 0.8s ease both; }
.hero-content > h1 { animation: heroFadeUp 0.8s 0.1s ease both; }
.hero-content > p { animation: heroFadeUp 0.8s 0.2s ease both; }
.hero-content > div { animation: heroFadeUp 0.8s 0.3s ease both; }
.hero-scroll { animation: heroFadeUp 0.8s 0.5s ease both; }

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

.hero-arrow { animation: heroBounce 2s ease-in-out infinite; }
@keyframes heroBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(5px); }
}

/* ── Buttons ─────────────────────────────────────── */
.btn-primary {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
    padding: 0.75rem 1.75rem; border-radius: 9999px; font-weight: 500;
    text-decoration: none; border: 1.5px solid transparent;
    transition: all 0.3s ease; cursor: pointer;
}
.btn-primary { background: #059669; color: #f5f0e8; border-color: #059669; }
.btn-primary:hover { background: #047857; border-color: #047857; transform: translateY(-1px); box-shadow: 0 8px 24px rgba(5,150,105,0.3); }
.btn-secondary {
    display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
    padding: 0.75rem 1.75rem; border-radius: 9999px; font-weight: 500;
    text-decoration: none; border: 1.5px solid rgba(245,240,232,0.35);
    color: #f5f0e8; background: transparent; transition: all 0.3s ease; cursor: pointer;
}
.btn-secondary:hover { background: rgba(245,240,232,0.1); border-color: rgba(245,240,232,0.6); transform: translateY(-1px); }

/* ── Section Shared ──────────────────────────────── */
.section { position: relative; }
.section-label {
    display: inline-block; font-family: 'Inter', system-ui, sans-serif;
    font-size: 0.7rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
    color: #059669; margin-bottom: 0.75rem;
}
.section-label-light {
    display: inline-block; font-family: 'Inter', system-ui, sans-serif;
    font-size: 0.7rem; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase;
    color: #34d399; margin-bottom: 0.75rem;
}
.section-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.15;
    color: #064e3b;
}
.section-title-light {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(2rem, 4vw, 3rem); font-weight: 700; line-height: 1.15;
    color: #f5f0e8;
}

/* ── Menu Cards ──────────────────────────────────── */
.menu-card {
    background: #f5f0e8; border-radius: 1rem; overflow: hidden;
    border: 1px solid rgba(5,150,105,0.08);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.menu-card:hover { transform: translateY(-4px); box-shadow: 0 20px 50px rgba(5,78,59,0.12); }

/* ── Gallery ─────────────────────────────────────── */
.gallery-item { overflow: hidden; border-radius: 0.75rem; }
.gallery-item img { transition: transform 0.6s ease; }
.gallery-item:hover img { transform: scale(1.05); }

/* ── Form ────────────────────────────────────────── */
.input-field {
    border: 1.5px solid #e5dfd3; border-radius: 0.625rem; padding: 0.75rem 1rem;
    background: #fdfbf7; color: #064e3b; font-size: 0.95rem;
    transition: border-color 0.3s, box-shadow 0.3s; outline: none;
}
.input-field::placeholder { color: #a89f8e; }
.input-field:focus { border-color: #059669; box-shadow: 0 0 0 3px rgba(5,150,105,0.1); }
.input-field.error { border-color: #dc2626; box-shadow: 0 0 0 3px rgba(220,38,38,0.1); }

/* ── Scroll Reveal ───────────────────────────────── */
.reveal {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.hidden-reveal {
    opacity: 0;
    transform: translateY(30px);
}
.reveal.delay-75 { transition-delay: 0.075s; }
.reveal.delay-100 { transition-delay: 0.1s; }
.reveal.delay-150 { transition-delay: 0.15s; }
.reveal.delay-200 { transition-delay: 0.2s; }

/* ── Footer ──────────────────────────────────────── */
footer a { text-decoration: none; }

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 767px) {
    .nav-fixed { padding-top: 0.5rem; padding-bottom: 0.5rem; }
}

@media (prefers-reduced-motion: no-preference) {
    .menu-card { will-change: transform; }
}