/* ===== RESET & BASE ===== */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
body { font-family:'Inter',system-ui,-apple-system,sans-serif; color:#1a1a1a; line-height:1.6; background:#fff; }
h1,h2,h3,h4 { font-family:'Playfair Display',Georgia,serif; }
a { text-decoration:none; color:inherit; }
button { cursor:pointer; border:none; background:none; font:inherit; }
img { max-width:100%; display:block; }

/* ===== VARIABLES ===== */
:root { --red:#DC2626; --red-dark:#B91C1C; --red-light:#FEF2F2; --dark:#1A1A1A; --gray:#6B7280; --gray-light:#F5F5F0; --green:#16A34A; --whatsapp:#25D366; --facebook:#1877F2; --shadow:0 4px 20px rgba(0,0,0,0.08); --shadow-lg:0 8px 30px rgba(0,0,0,0.12); }

/* ===== UTILITIES ===== */
.container { max-width:1200px; margin:0 auto; padding:0 1.25rem; }
.section { padding:5rem 0; }
.section-alt { background:var(--gray-light); }
.section-header { text-align:center; margin-bottom:3rem; }
.section-title { font-size:2.25rem; font-weight:800; color:var(--dark); margin-bottom:1rem; }
.section-subtitle { color:var(--gray); max-width:500px; margin:0 auto; }
.badge { display:inline-flex; align-items:center; gap:.375rem; background:var(--red-light); color:var(--red); padding:.375rem 1rem; border-radius:999px; font-size:.875rem; font-weight:600; margin-bottom:1rem; }
.text-red { color:var(--red); }
.text-gray { color:var(--gray); }
.link { color:var(--red); font-size:.875rem; font-weight:500; }
.link:hover { text-decoration:underline; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem 1.75rem; border-radius:999px; font-weight:600; transition:all .2s; white-space:nowrap; }
.btn:active { transform:scale(.97); }
.btn-primary { background:var(--red); color:#fff; }
.btn-primary:hover { background:var(--red-dark); box-shadow:var(--shadow-lg); }
.btn-white { background:#fff; color:var(--dark); }
.btn-white:hover { background:#f3f4f6; }
.btn-outline { border:1px solid #e5e7eb; color:var(--gray); }
.btn-outline:hover { background:#f9fafb; }
.btn-whatsapp { background:var(--whatsapp); color:#fff; }
.btn-whatsapp:hover { background:#128C7E; }
.btn-sm { padding:.5rem 1.25rem; font-size:.875rem; }
.btn-full { width:100%; }
.grid-4 { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.5rem; }
.grid-3 { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.5rem; }

/* ===== HEADER ===== */
.header { position:fixed; top:0; left:0; right:0; z-index:100; transition:all .3s; }
.header.scrolled { background:rgba(255,255,255,.95); backdrop-filter:blur(10px); box-shadow:0 1px 10px rgba(0,0,0,.08); }
.header.scrolled .nav-link { color:var(--dark); }
.header.scrolled .logo-img { filter:none; }
.header.scrolled .cart-btn { color:var(--dark); }
.header.scrolled .menu-toggle { color:var(--dark); }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:72px; }
.logo-img { height:48px; width:auto; transition:filter .3s; }
.header.scrolled .logo-img { height:40px; }
.nav-desktop { display:none; align-items:center; gap:2rem; }
.nav-link { color:#fff; font-size:.875rem; font-weight:500; transition:color .2s; }
.nav-link:hover { color:var(--red); }
.header-actions { display:flex; align-items:center; gap:.75rem; }
.cart-btn { position:relative; padding:.5rem; color:#fff; transition:color .3s; }
.cart-count { position:absolute; top:0; right:0; background:var(--red); color:#fff; font-size:.65rem; font-weight:700; width:18px; height:18px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.status-badge { display:none; align-items:center; gap:.375rem; padding:.375rem .75rem; background:rgba(255,255,255,.15); color:#fff; border-radius:999px; font-size:.75rem; font-weight:600; }
.status-dot { width:8px; height:8px; border-radius:50%; background:var(--green); }
.status-dot.closed { background:#ef4444; }
.menu-toggle { display:block; padding:.5rem; color:#fff; }

/* ===== MOBILE MENU ===== */
.mobile-menu { position:fixed; inset:0; background:#fff; z-index:200; padding:1.5rem; transform:translateX(100%); transition:transform .3s ease; }
.mobile-menu.open { transform:translateX(0); }
.mobile-menu-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:2rem; }
.menu-close { padding:.5rem; }
.mobile-nav { display:flex; flex-direction:column; gap:1rem; }
.mobile-nav-link { font-size:1.25rem; font-weight:500; padding:.75rem 0; border-bottom:1px solid #f3f4f6; }

/* ===== HERO ===== */
.hero { position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-bg { position:absolute; inset:0; }
.hero-img { width:100%; height:100%; object-fit:cover; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(to bottom,rgba(0,0,0,.65),rgba(0,0,0,.5),rgba(0,0,0,.7)); }
.hero-content { position:relative; z-index:2; text-align:center; padding:6rem 1.25rem 3rem; max-width:700px; }
.hero-badge { display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1.25rem; border-radius:999px; font-size:.875rem; font-weight:600; margin-bottom:1.5rem; backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.2); }
.hero-badge.open { background:rgba(34,197,94,.2); color:#86efac; }
.hero-badge.closed { background:rgba(239,68,68,.2); color:#fca5a5; }
.hero-badge-dot { width:8px; height:8px; border-radius:50%; }
.hero-badge.open .hero-badge-dot { background:#4ade80; animation:pulse 2s infinite; }
.hero-badge.closed .hero-badge-dot { background:#f87171; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.5} }
.hero-tag { color:#facc15; font-size:.875rem; font-weight:600; text-transform:uppercase; letter-spacing:1px; margin-bottom:1rem; }
.hero-title { font-size:3rem; font-weight:800; color:#fff; line-height:1.1; margin-bottom:1.25rem; }
.hero-subtitle { color:rgba(255,255,255,.85); font-size:1.125rem; margin-bottom:2rem; max-width:500px; margin-left:auto; margin-right:auto; }
.hero-buttons { display:flex; flex-direction:column; gap:1rem; align-items:center; }
.hero-scroll { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.6); animation:bounce 2s infinite; z-index:2; }
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(8px)} }

/* ===== DESTAQUES ===== */
.product-card { background:#fff; border-radius:1rem; overflow:hidden; box-shadow:var(--shadow); border:1px solid #f3f4f6; transition:all .3s; }
.product-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.product-img { aspect-ratio:1; overflow:hidden; }
.product-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.product-card:hover .product-img img { transform:scale(1.05); }
.product-body { padding:1.25rem; }
.product-name { font-family:'Inter',sans-serif; font-weight:700; font-size:1.1rem; margin-bottom:.25rem; }
.product-desc { font-size:.8rem; color:var(--gray); margin-bottom:.75rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.product-footer { display:flex; align-items:center; justify-content:space-between; }
.product-price { font-size:1.25rem; font-weight:800; color:var(--red); }
.add-btn { display:flex; align-items:center; gap:.25rem; background:var(--red); color:#fff; padding:.5rem 1rem; border-radius:999px; font-size:.8rem; font-weight:600; transition:all .2s; border:none; cursor:pointer; }
.add-btn:hover { background:var(--red-dark); }
.add-btn svg { width:14px; height:14px; }

/* ===== MENU TABS ===== */
.menu-tabs { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-bottom:2rem; position:sticky; top:72px; z-index:50; background:var(--gray-light); padding:.75rem; border-radius:1rem; }
.menu-tab { padding:.5rem 1rem; border-radius:999px; font-size:.8rem; font-weight:600; background:#fff; color:var(--gray); border:1px solid #e5e7eb; cursor:pointer; transition:all .2s; }
.menu-tab:hover { background:#fef2f2; color:var(--red); border-color:var(--red); }
.menu-tab.active { background:var(--red); color:#fff; border-color:var(--red); box-shadow:var(--shadow); }

/* ===== MENU GRID ===== */
.menu-grid { display:grid; grid-template-columns:1fr; gap:1rem; }
.menu-item { display:flex; gap:1rem; background:#fff; padding:1rem; border-radius:.75rem; border:1px solid #f3f4f6; box-shadow:var(--shadow); }
.menu-item-img { width:72px; height:72px; border-radius:.5rem; overflow:hidden; flex-shrink:0; }
.menu-item-img img { width:100%; height:100%; object-fit:cover; }
.menu-item-body { flex:1; min-width:0; }
.menu-item-name { font-family:'Inter',sans-serif; font-weight:700; font-size:1rem; margin-bottom:.25rem; }
.menu-item-desc { font-size:.8rem; color:var(--gray); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.menu-prices { display:flex; flex-wrap:wrap; gap:.375rem; margin-top:.5rem; }
.menu-price-btn { display:flex; align-items:center; gap:.25rem; padding:.375rem .75rem; border-radius:.5rem; font-size:.8rem; font-weight:600; background:#fef2f2; color:var(--red); border:none; cursor:pointer; transition:all .2s; }
.menu-price-btn:hover { background:var(--red); color:#fff; }
.menu-price-btn.size { font-size:.7rem; padding:.25rem .5rem; background:#f3f4f6; color:var(--gray); }
.menu-price-btn.added { background:#dcfce7; color:var(--green); }

/* ===== SOBRE ===== */
.about-grid { display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; }
.about-img-wrap { position:relative; }
.about-img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:1rem; box-shadow:var(--shadow-lg); }
.about-badge { display:none; }
.about-content .section-title { text-align:left; }
.about-text { color:var(--gray); line-height:1.8; margin-bottom:1.25rem; }
.about-features { display:grid; grid-template-columns:1fr; gap:1rem; margin-top:1.5rem; }
.about-feature { display:flex; align-items:center; gap:.75rem; padding:1rem; background:var(--gray-light); border-radius:.75rem; }
.about-feature-icon { font-size:1.5rem; }

/* ===== REVIEWS ===== */
.rating-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.75rem; }
.stars { display:flex; gap:.125rem; }
.star { width:24px; height:24px; fill:#facc15; color:#facc15; }
.star-empty { fill:none; stroke:#facc15; stroke-width:2; }
.review-card { background:#fff; border-radius:1rem; padding:1.5rem; box-shadow:var(--shadow); border:1px solid #f3f4f6; }
.review-stars { color:#facc15; font-size:1rem; margin-bottom:.75rem; letter-spacing:2px; }
.review-text { color:var(--gray); font-size:.9rem; line-height:1.7; margin-bottom:1rem; font-style:italic; }
.review-author { display:flex; justify-content:space-between; align-items:center; font-size:.8rem; }

/* ===== CONTACTOS ===== */
.info-card { background:var(--gray-light); border-radius:1rem; padding:1.5rem; border:1px solid #f3f4f6; }
.info-icon { font-size:2rem; margin-bottom:.75rem; }
.info-title { font-family:'Inter',sans-serif; font-weight:700; font-size:1.1rem; margin-bottom:.5rem; }
.info-text { color:var(--gray); font-size:.9rem; line-height:1.7; }
.phone-link { color:var(--gray); transition:color .2s; }
.phone-link:hover { color:var(--red); }
.hours-list p { color:var(--gray); font-size:.85rem; margin-bottom:.25rem; }
.summer-note { margin-top:.75rem; padding:.5rem .75rem; background:#fef9c3; border-radius:.5rem; font-size:.75rem; color:#854d0e; }
.btn-row { display:flex; gap:.5rem; margin-top:.75rem; }
.partners { background:var(--gray-light); border-radius:1rem; padding:1.5rem; text-align:center; margin-top:2.5rem; }
.partners-title { font-family:'Inter',sans-serif; font-weight:700; margin-bottom:1rem; }
.partners-row { display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; }
.partner-link { display:flex; align-items:center; gap:.5rem; background:#fff; padding:.75rem 1.25rem; border-radius:.75rem; box-shadow:var(--shadow); font-weight:600; font-size:.9rem; transition:all .2s; border:1px solid #f3f4f6; }
.partner-link:hover { box-shadow:var(--shadow-lg); }

/* ===== CART DRAWER ===== */
.cart-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:150; opacity:0; pointer-events:none; transition:opacity .3s; }
.cart-overlay.show { opacity:1; pointer-events:auto; }
.cart-drawer { position:fixed; top:0; right:0; height:100%; width:100%; max-width:400px; background:#fff; z-index:160; transform:translateX(100%); transition:transform .3s ease; display:flex; flex-direction:column; }
.cart-drawer.show { transform:translateX(0); }
.cart-header { display:flex; align-items:center; justify-content:space-between; padding:1.25rem; border-bottom:1px solid #f3f4f6; }
.cart-header-title { display:flex; align-items:center; gap:.5rem; font-weight:700; }
.cart-count-badge { background:var(--red-light); color:var(--red); padding:.25rem .5rem; border-radius:999px; font-size:.7rem; font-weight:700; }
.cart-close { font-size:1.25rem; padding:.25rem; }
.cart-body { flex:1; overflow-y:auto; padding:1.25rem; }
.cart-empty { text-align:center; padding:2rem 0; }
.cart-item { background:#f9fafb; border-radius:.75rem; padding:1rem; margin-bottom:.75rem; }
.cart-item-header { display:flex; align-items:start; justify-content:space-between; gap:.75rem; }
.cart-item-name { font-weight:600; font-size:.85rem; }
.cart-item-desc { font-size:.7rem; color:var(--gray); margin-top:.125rem; }
.cart-item-remove { padding:.25rem; color:#9ca3af; transition:color .2s; }
.cart-item-remove:hover { color:var(--red); }
.cart-item-footer { display:flex; align-items:center; justify-content:space-between; margin-top:.75rem; }
.cart-qty { display:flex; align-items:center; gap:.5rem; }
.qty-btn { width:28px; height:28px; border-radius:.375rem; background:#fff; border:1px solid #e5e7eb; display:flex; align-items:center; justify-content:center; font-size:1rem; transition:background .2s; }
.qty-btn:hover { background:#f3f4f6; }
.qty-val { font-weight:700; font-size:.9rem; width:24px; text-align:center; }
.cart-item-price { font-weight:700; color:var(--red); font-size:.9rem; }
.cart-footer { padding:1.25rem; border-top:1px solid #f3f4f6; }
.cart-total-row { display:flex; justify-content:space-between; margin-bottom:1rem; font-size:1.1rem; }
.cart-total-price { font-weight:800; }
.cart-actions { display:flex; gap:.5rem; }
.cart-actions .btn { flex:1; }

/* ===== FOOTER ===== */
.footer { background:var(--dark); color:#fff; padding:3rem 0 1.5rem; }
.footer-grid { display:grid; grid-template-columns:1fr; gap:2rem; }
.footer-logo { height:48px; width:auto; filter:brightness(3); margin-bottom:1rem; }
.footer-text { color:#9ca3af; font-size:.85rem; line-height:1.7; }
.footer-title { font-family:'Inter',sans-serif; font-weight:700; margin-bottom:1rem; }
.footer-link { display:block; color:#9ca3af; font-size:.85rem; margin-bottom:.5rem; transition:color .2s; }
.footer-link:hover { color:#fff; }
.footer-socials { display:flex; gap:.75rem; margin-top:1rem; }
.social-btn { width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; color:#fff; transition:opacity .2s; }
.social-whatsapp { background:var(--whatsapp); }
.social-facebook { background:var(--facebook); }
.footer-bottom { border-top:1px solid #333; margin-top:2rem; padding-top:1.5rem; text-align:center; color:#6b7280; font-size:.8rem; }

/* ===== SCROLL ANIMATIONS ===== */
.fade-in { opacity:0; transform:translateY(24px); transition:opacity .6s ease, transform .6s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }

/* ===== RESPONSIVE ===== */
@media (min-width:640px) {
  .hero-title { font-size:3.5rem; }
  .hero-buttons { flex-direction:row; justify-content:center; }
  .menu-grid { grid-template-columns:1fr 1fr; }
  .about-features { grid-template-columns:1fr 1fr 1fr; }
}
@media (min-width:768px) {
  .menu-toggle { display:none; }
  .nav-desktop { display:flex; }
  .status-badge { display:inline-flex; }
  .section-title { font-size:2.5rem; }
  .about-grid { grid-template-columns:1fr 1fr; }
  .about-badge { display:block; position:absolute; bottom:-1.5rem; right:-1.5rem; background:var(--red); color:#fff; padding:1.25rem; border-radius:1rem; box-shadow:var(--shadow-lg); }
  .about-badge-num { font-size:2rem; font-weight:800; display:block; }
  .about-badge-text { font-size:.8rem; opacity:.9; }
  .footer-grid { grid-template-columns:2fr 1fr 1fr; }
}
@media (min-width:1024px) {
  .hero-title { font-size:4.5rem; }
  .section { padding:6rem 0; }
}