/* ============================================================
   Mauli Food — Frontend Stylesheet
   Preserves prototype design, adds responsive/interaction rules.
   ============================================================ */

/* ─── Reset ─── */
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg, #F8F3EA); color: var(--text, #1D1B19); font-family: Manrope, system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
* { box-sizing: border-box; }
a { color: var(--primary, #641A18); }
a:hover { color: var(--secondary, #D71920); }
:focus-visible { outline: 2px solid var(--secondary, #D71920); outline-offset: 3px; border-radius: 6px; }
img { display: block; max-width: 100%; }
input, textarea, select, button { font: inherit; }
::selection { background: var(--accent, #F7C928); color: var(--text, #1D1B19); }

/* ─── Hover effects ─── */
.hover-scale:hover { transform: scale(1.05); }
.nav-link:hover { color: #D71920 !important; border-bottom-color: #D71920 !important; }
.footer-link:hover { color: #F7C928 !important; text-decoration: underline; }
.product-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -26px rgba(100,26,24,.4); }
.work-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -26px rgba(100,26,24,.4); }
.btn-hover-red:hover { background: #B3141A !important; }
.btn-hover-dark:hover { background: #641A18 !important; color: #F8F3EA !important; }
.btn-hover-light:hover { background: #F8F3EA !important; color: #641A18 !important; }
.btn-hover-gold:hover { background: #FFD84A !important; }
.btn-hover-accent:hover { background: #F7C928 !important; color: #641A18 !important; }
.btn-hover-whatsapp:hover { background: #25D366 !important; color: #fff !important; }
.whatsapp-btn:hover { transform: scale(1.1); }

/* ─── Form inputs ─── */
.form-input:focus { border-color: #641A18 !important; outline: none; }

/* ─── data-reveal animation ─── */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
}
[data-reveal].revealed {
  opacity: 1;
  transform: none;
}

/* ─── Flash messages auto-dismiss ─── */
.flash-success, .flash-error {
  animation: flashIn .4s ease, flashOut .4s ease 4s forwards;
}
@keyframes flashIn { from { opacity: 0; transform: translateX(-50%) translateY(20px); } to { opacity: 1; transform: translateX(-50%) translateY(0); } }
@keyframes flashOut { from { opacity: 1; } to { opacity: 0; visibility: hidden; } }

/* ─── Responsive ─── */
@media (max-width: 1079px) {
  .desktop-nav { display: none !important; }
  .mobile-menu-btn { display: block !important; }
}
@media (min-width: 1080px) {
  .mobile-menu-btn { display: none !important; }
}

/* Prevent body scroll when mobile menu or lightbox is open */
body.menu-open, body.lightbox-open {
  overflow: hidden;
}

/* ─── Gallery masonry mobile ─── */
@media (max-width: 600px) {
  #galleryGrid { columns: 2 !important; }
}
@media (max-width: 380px) {
  #galleryGrid { columns: 1 !important; }
}

/* ─── Print ─── */
@media print {
  .site-header, footer, .whatsapp-btn, #searchOverlay, #mobileMenu { display: none !important; }
}