/* =========================================================
   CINCO DE MAYO theme  (loads after the shared styles)
   The build already flipped the shared dark palette to warm
   off-white (see make_cinco.py). This file handles the spots
   that need a human touch: text on color, photos, the hero.
   ========================================================= */
:root{ --marigold:#e39a00; --paper:#fffaf2; --paper2:#f7efe2; }
html, body{ background:var(--paper); }
body{ background-image:radial-gradient(rgba(194,59,59,.035) 1px, transparent 1px); background-size:18px 18px; }
#mouseFog{ display:none !important; }
h1, h2, .story-h, .mh-title, .order-h{ letter-spacing:.01em; }

/* text that sits on a color stays white */
.btn-solid, .nav-cta, .navpill.nav-cta, .c-next, .mp-cta, .ev-badge, .evf-count,
.pay-pill.paid, .wz-chip.on, .tab-btn.active, .decide-btn, .fav-ribbon, .sold-badge, .st-pill{ color:#fff; }
.btn-marigold, .wz-chip.on, .tab-btn.active{ color:#2b1f14; }
.btn-marigold{ background:#f3a712; }
.tab-btn.active{ background:#c23b3b; color:#fff; border-color:#c23b3b; }
.evf-count{ color:#2b1f14; }
.dish-price-txt, .vi-k, .ft-h, .hrs-row.is-today dt, .hrs-row.is-today dd, .menu-cat-note{ color:#b56d00; }
.eyebrow{ color:#0f8a83; }
.section-head h2, .story-h{ color:#2b1f14; }

/* cards: crisp white on paper */
.dish, .vb, .cx-card, .ev-card, .ev-feature, .fin-card, .wz-inline, .info-card, .order-opt, .modal-box, .join-card, .ev-news, .ft-news{ background-color:#fff; }
.dish{ box-shadow:0 10px 26px -18px rgba(80,50,20,.35); }
.dish-fav{ background:linear-gradient(160deg, #fff6df, #fff); }
.modal-box.glass{ background:rgba(255,253,248,.94); }

/* photos keep white captions on a dark fade */
.fg-tile::after, .vb-photo::after{ background:linear-gradient(0deg, rgba(20,12,6,.82) 0%, rgba(20,12,6,.25) 45%, transparent 75%) !important; }
.fg-cap, .fg-cap b, .fg-desc, .vb-photo figcaption, .vb-photo figcaption b, .vb-photo figcaption p{ color:#fff !important; text-shadow:0 1px 10px rgba(0,0,0,.6); }
.vb-label{ background:rgba(255,255,255,.92); color:#2b1f14; border-color:transparent; }
.cater-band .cb-inner h2{ color:#2b1f14; }
footer, .site-footer{ background:#f6ecdc; border-top:6px solid transparent; border-image:linear-gradient(90deg, #d92b1f, #f2b705, #1f8a3d, #2fb3d9, #7b3fa0, #e8568f) 1; }
.lightbox{ background:rgba(255,250,242,.97); }
.zoom-view{ background:rgba(255,250,242,.97); }
.zoom-view figcaption{ color:#2b1f14; }

/* storefront card with the logo */
.ext-ph{ background:radial-gradient(ellipse at 50% 30%, rgba(243,167,18,.16), transparent 65%), #fffdf8; }

/* nav + papel on a light page */
.navpill{ background:rgba(255,255,255,.88); box-shadow:0 4px 14px -8px rgba(80,50,20,.35); }
#banner-wrap{ background:linear-gradient(180deg, rgba(255,250,242,.96) 0%, rgba(255,250,242,.6) 60%, transparent 100%); }
.flag{ filter:drop-shadow(0 5px 6px rgba(80,50,20,.25)); }

/* ---------- home hero: logo + a fan of photos ---------- */
.hero-cinco{ min-height:auto; padding-bottom:4rem; overflow:hidden; background:radial-gradient(ellipse 70% 60% at 50% 20%, rgba(243,167,18,.16), transparent 70%); }
.hero-cinco .hc-inner{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; text-align:center; padding:calc(var(--banner-h) + 4.4rem) 5vw 0; }
.hc-logo{ margin:.6rem 0 .4rem; line-height:0; }
.hc-logo img{ width:min(640px, 88vw); height:auto; filter:drop-shadow(0 18px 26px rgba(80,50,20,.22)); animation:heroIn 1s .1s both; }
.hero-cinco .hf-desc{ color:#4a3a2a; max-width:46ch; }
.hc-fan{ position:relative; height:300px; margin:2.6rem auto 0; width:min(1000px, 100%); }
.hc-card{ position:absolute; top:20px; left:50%; width:220px; aspect-ratio:1; margin:0; border-radius:20px; overflow:hidden; border:6px solid #fff;
  box-shadow:0 22px 40px -18px rgba(80,50,20,.5); animation:fanFloat 7s ease-in-out infinite; }
.hc-card img{ width:100%; height:100%; object-fit:cover; }
.hc-card.c1{ transform:translateX(-215%) rotate(-12deg); top:44px; animation-delay:-1s; }
.hc-card.c2{ transform:translateX(-128%) rotate(-6deg); top:16px; animation-delay:-2s; }
.hc-card.c3{ transform:translateX(-50%) rotate(0deg); top:0; width:250px; z-index:2; animation-delay:-3s; }
.hc-card.c4{ transform:translateX(28%) rotate(6deg); top:16px; animation-delay:-4s; }
.hc-card.c5{ transform:translateX(115%) rotate(12deg); top:44px; animation-delay:-5s; }
@keyframes fanFloat{ 0%,100%{ translate:0 0; } 50%{ translate:0 -10px; } }
.hero-cinco .hf-scroll{ position:relative; margin-top:1rem; }
@media (max-width:760px){
  .hc-fan{ height:210px; } .hc-card{ width:150px; border-width:4px; } .hc-card.c3{ width:170px; }
  .hc-card.c1, .hc-card.c5{ display:none; }
}
@media (prefers-reduced-motion: reduce){ .hc-card{ animation:none; } }

/* ---------- about ---------- */
.about-cinco{ padding-top:0; }
.ac-grid{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
.ac-photos{ display:grid; grid-template-columns:1.3fr 1fr; grid-template-rows:1fr 1fr; gap:12px; height:460px; }
.ac-photos img{ width:100%; height:100%; object-fit:cover; border-radius:20px; border:5px solid #fff; box-shadow:0 18px 36px -20px rgba(80,50,20,.5); }
.ac-photos img:first-child{ grid-row:1 / span 2; }
.ac-text p{ font-size:1.08rem; line-height:1.75; color:#4a3a2a; margin-bottom:1rem; }
@media (max-width:860px){ .ac-grid{ grid-template-columns:1fr; } .ac-photos{ height:340px; } }

/* no reservations at this location (yet) */
.no-res [onclick^="openReservations"], .no-res .oo-reservations{ display:none !important; }
.mil-badge{ display:none !important; }
.hero-food.hero-cinco{ display:flex; flex-direction:column; align-items:center; justify-content:flex-start; min-height:0; height:auto; text-align:center; }
.hero-cinco .hc-inner{ width:100%; align-items:center; text-align:center; }
.hero-cinco .hf-ctas{ justify-content:center; }
.navpill.nav-cta{ background:#c23b3b; color:#fff; border-color:#c23b3b; }
.navpill.nav-cta:hover{ background:#a92f2f; }

/* ---------- callouts on a light page: pastel tiles, dark readable text ---------- */
body .menu-promo{ animation:none; box-shadow:0 16px 32px -20px rgba(80,50,20,.4); }
body .menu-promo::before{ opacity:.45; }
body .menu-promo .mp-head{ color:#2b1f14; }
body .menu-promo .mp-body{ color:#4a3a2a; }
body .promo-red{ background:linear-gradient(155deg, #ffece8, #ffe0d8); border:1px solid #f1a497; }
body .promo-red .mp-kicker{ color:#b0302b; }   body .promo-red .mp-cta{ background:#c23b3b; border-color:#c23b3b; color:#fff; }
body .promo-green{ background:linear-gradient(155deg, #e8f7ec, #dcf1e3); border:1px solid #94d1a7; }
body .promo-green .mp-kicker{ color:#17733a; } body .promo-green .mp-cta{ background:#1f8a3d; border-color:#1f8a3d; color:#fff; }
body .promo-gold{ background:linear-gradient(155deg, #fff4da, #ffe8c6); border:1px solid #efc26c; }
body .promo-gold .mp-kicker{ color:#9a5800; }  body .promo-gold .mp-cta{ background:#f3a712; border-color:#e39a00; color:#2b1f14; }
body .promo-teal{ background:linear-gradient(155deg, #e6f6fb, #d8f1f3); border:1px solid #8fcfe0; }
body .promo-teal .mp-kicker{ color:#0b6b86; }  body .promo-teal .mp-cta{ background:#12958f; border-color:#12958f; color:#fff; }
body .promo-purple{ background:linear-gradient(155deg, #f4ebfc, #fbe6f0); border:1px solid #caa7e8; }
body .promo-purple .mp-kicker{ color:#6a33a0; } body .promo-purple .mp-cta{ background:#7b3fa0; border-color:#7b3fa0; color:#fff; }
body .promo-rainbow{ border:2px solid transparent; background-image:linear-gradient(#fff, #fff), linear-gradient(120deg, #d92b1f, #f2b705, #1f8a3d, #2fb3d9, #7b3fa0);
  background-origin:border-box; background-clip:padding-box, border-box; }
body .promo-rainbow .mp-kicker{ color:#b0302b; } body .promo-rainbow .mp-cta{ background:#2b1f14; border-color:#2b1f14; color:#fff; }

/* ---------- "Website Powered by Solar Flare" credit on the light footer ---------- */
.sf-credit, .sf-credit span{ color:#4a3a2a !important; }
.sf-credit{ border-color:rgba(43,31,20,.22) !important; background:rgba(43,31,20,.04) !important; }
.sf-credit:hover, .sf-credit:hover span{ color:#c23b3b !important; }
body .promo-rainbow .mp-kicker{ background:none !important; -webkit-text-fill-color:#b0302b; color:#b0302b; }
