html { scroll-behavior: smooth; }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  }
  body { background-color: #F7F2E7; }

  #preloader {
    transition: opacity .55s ease, visibility .55s ease;
  }

  #preloader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  body.is-loading {
    overflow: hidden;
  }

  #preloader-logo {
    opacity: 0;
    transform: scale(.92);
    animation: preloaderLogoIn .7s cubic-bezier(.2,.8,.2,1) .08s forwards;
  }

  #preloader-ring {
    position: absolute;
    inset: -7px;
    border: 1px solid rgba(176,71,44,.22);
    border-top-color: #B0472C;
    border-radius: 9999px;
    animation: preloaderSpin 1.05s linear infinite;
  }

  @keyframes preloaderLogoIn {
    from { opacity: 0; transform: scale(.92); }
    to { opacity: 1; transform: scale(1); }
  }

  @keyframes preloaderSpin {
    to { transform: rotate(360deg); }
  }

  @media (prefers-reduced-motion: reduce) {
    #preloader-logo {
      animation: none;
      opacity: 1;
      transform: none;
    }
    #preloader-ring {
      animation: none;
    }
  }


  .hero-slide { opacity: 0; transition: opacity 1.2s ease; }
  .hero-slide.is-active { opacity: 1; }
  .hero-slide img { animation: kenburns 9s ease-out forwards; }
  @keyframes kenburns { from { transform: scale(1.1); } to { transform: scale(1); } }

  .nav-link { position: relative; }
  .nav-link::after {
    content: ''; position: absolute; left: 0; bottom: -4px; width: 0; height: 1px;
    background: currentColor; transition: width .3s ease;
  }
  .nav-link:hover::after { width: 100%; }

  .frame-offset { position: relative; }
  .frame-offset::before {
    content: ''; position: absolute; inset: 0; background: #B0472C;
    transform: translate(14px, 14px); z-index: 0;
  }
  @media (min-width: 768px) { .frame-offset::before { transform: translate(20px, 20px); } }
  .frame-offset > .frame-inner { position: relative; z-index: 1; }

  .dish-card img { transition: transform 1s cubic-bezier(.2,.7,.2,1); }
  .dish-card:hover img { transform: scale(1.06); }

  .cat-btn { transition: background-color .25s ease, color .25s ease, border-color .25s ease; }

  .modal-backdrop { backdrop-filter: blur(6px); }
  .modal-panel { transition: transform .35s cubic-bezier(.2,.8,.2,1), opacity .35s ease; }
  #credit-popup.is-visible,
  #credit-wrap.is-open #credit-popup {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
  }

  #credit-popup{
    position: absolute;
    bottom: 30px; right: 0;
  }

  #credit-wrap.is-open #credit-trigger {
    color: #F7F2E7;
    text-decoration-color: #B0472C;
  }

  @media (max-width: 639px) {
    .credit-div { width: 100%; }
    #credit-popup {
      position: absolute;
      right: 5%;
     
      top: auto;
      margin: 0;
      width: 90% !important;
      transform:  scale(.96);
    }

    #credit-popup.is-visible,
    #credit-wrap.is-open #credit-popup {
      transform: scale(1);
    }

    #credit-popup > .absolute {
      display: none;
    }
  }


  #mobile-overlay { transition: opacity .4s ease, visibility .4s ease; }
  #mobile-overlay.is-open .overlay-link { animation: linkIn .5s ease forwards; }
  @keyframes linkIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

  :focus-visible { outline: 2px solid #B0472C; outline-offset: 2px; }
  ::selection { background: #B0472C; color: #F7F2E7; }

  .rule { height: 1px; background: rgba(30,27,23,0.12); }
  .rule-dark { height: 1px; background: rgba(247,242,231,0.14); }

  ::-webkit-scrollbar { width: 10px; }
  ::-webkit-scrollbar-track { background: #F7F2E7; }
  ::-webkit-scrollbar-thumb { background: #d8cbb0; }

  .snap-row { scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
  .snap-item { scroll-snap-align: start; }
  .snap-row::-webkit-scrollbar { display: none; }
  .snap-row { scrollbar-width: none; }

  .num-badge { font-variant-numeric: tabular-nums; }


  .signature{ animation: kenburns 9s ease-out forwards; }
  @keyframes kenburns { from { transform: scale(1.1); } to { transform: scale(1); } }


  /* =========================================================
   QUICK ACTIONS
   ========================================================= */

#quick-actions {
  position: fixed;

  right: 22px;
  bottom: 22px;

  z-index: 40;

  display: flex;
  align-items: center;
  gap: 8px;

  padding: 6px;

  border: 1px solid rgba(247, 242, 231, 0.12);
  border-radius: 9999px;

  background: rgba(30, 27, 23, 0.92);

  box-shadow:
    0 18px 45px rgba(0, 0, 0, 0.22);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform: translateY(14px);

  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    visibility 0.3s ease;
}


/* Visible after hero */

#quick-actions.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform: translateY(0);
}


/* Individual buttons */

.quick-action {
  min-height: 42px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 8px;

  padding: 0 15px;

  border: 1px solid rgba(247, 242, 231, 0.13);
  border-radius: 9999px;

  color: rgba(247, 242, 231, 0.82);

  background: rgba(247, 242, 231, 0.035);

  font-size: 12px !important;
  letter-spacing: 0.02em;

  white-space: nowrap;

  transition:
    color 0.25s ease,
    background-color 0.25s ease,
    border-color 0.25s ease,
    transform 0.25s ease;
}


.quick-action:hover {
  color: #F7F2E7;

  background: rgba(176, 71, 44, 0.14);

  border-color: rgba(176, 71, 44, 0.55);

  transform: translateY(-1px);
}


/* Call */

.quick-action-call:hover {
  color: #F7F2E7;
}


/* WhatsApp */

.quick-action-whatsapp {
  color: #F7F2E7;

  border-color: rgba(176, 71, 44, 0.45);

  background: rgba(176, 71, 44, 0.10);
}


/* Menu */

.quick-action-menu {
  cursor: pointer;

  font: inherit;
}


/* Make sure menu doesn't hide underneath fixed nav */

#menu {
  scroll-margin-top: 92px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 639px) {

  #quick-actions {
    left: 12px;
    right: 12px;

    bottom: max(12px, env(safe-area-inset-bottom));

    justify-content: stretch;

    gap: 6px;

    padding: 5px;
  }


  .quick-action {
    flex: 1 1 0;

    min-width: 0;

    padding: 0 9px;

    gap: 6px;

    font-size: 11px !important;
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  #quick-actions,
  .quick-action {
    transition: none;
  }

}

#visit{
  position:relative;
  z-index: 42;
}

.menu-item-num{
  color:'#fff';
  border-color:rgba(247, 242, 231, 0.12);
}