/* =========================================================
   ESTÉTICA RADIANTE — MOVIMENTO PREMIUM
   Progressive enhancement: estados de entrada só existem
   quando o JavaScript adiciona .motion-ready ao <html>.
========================================================= */

:root {
  --motion-ease: cubic-bezier(.22, .72, .24, 1);
  --motion-fast: 320ms;
  --motion-base: 720ms;
  --motion-slow: 1100ms;
}

html.motion-ready [data-motion] {
  opacity: 0;
  transition:
    opacity var(--motion-base) var(--motion-ease),
    transform var(--motion-base) var(--motion-ease),
    filter var(--motion-base) var(--motion-ease);
  transition-delay: var(--motion-delay, 0ms);
  will-change: opacity, transform;
}

html.motion-ready [data-motion="up"] {
  transform: translate3d(0, 34px, 0);
}

html.motion-ready [data-motion="down"] {
  transform: translate3d(0, -24px, 0);
}

html.motion-ready [data-motion="left"] {
  transform: translate3d(-42px, 0, 0);
}

html.motion-ready [data-motion="right"] {
  transform: translate3d(42px, 0, 0);
}

html.motion-ready [data-motion="scale"] {
  transform: scale(.965);
  filter: saturate(.92);
}

html.motion-ready [data-motion].is-visible {
  opacity: 1;
  transform: none;
  filter: none;
  will-change: auto;
}

/* Hero / carrossel: movimento cinematográfico muito sutil */
.carousel-item.active img {
  animation: erHeroBreath 10s ease-in-out both;
  transform-origin: center center;
}

@keyframes erHeroBreath {
  0% { transform: scale(1.015); }
  50% { transform: scale(1.055); }
  100% { transform: scale(1.025); }
}

/* Menu com detalhe deslizante */
.menu #menu-list > li > a,
.menu .dropbtn,
.menu .gift-menu-trigger {
  position: relative;
}

.menu #menu-list > li > a::after,
.menu .dropbtn::after,
.menu .gift-menu-trigger::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: -7px;
  height: 1px;
  background: #c9a46b;
  transition: left var(--motion-fast) var(--motion-ease), right var(--motion-fast) var(--motion-ease);
}

/* Imagens respiram nos cards sem exagero */
.shop-card .shop-img,
.produto-card .produto-img,
.sobre-depoimentos-img {
  transition: transform 650ms var(--motion-ease), filter 650ms var(--motion-ease);
}

/* cards e superfícies */
.shop-card,
.produto-card,
.metrica-card,
.location-info-item,
.location-hours-block,
.location-map,
.location-card,
.agendamento-shell {
  transition:
    transform 360ms var(--motion-ease),
    box-shadow 360ms var(--motion-ease),
    border-color 360ms var(--motion-ease),
    background-color 360ms var(--motion-ease);
}

/* Botões: resposta tátil discreta */
:is(
  .shop-btn,
  .produto-btn,
  .produtos-ver-todos-btn,
  .btn-sobre-principal,
  .btn-sobre-secundario,
  .btn-agendar,
  .location-btn,
  .location-mini-link,
  .btn-footer,
  .cart-header-btn,
  .floating-cart-btn
) {
  transition:
    transform 260ms var(--motion-ease),
    background-color 260ms var(--motion-ease),
    border-color 260ms var(--motion-ease),
    color 260ms var(--motion-ease),
    box-shadow 260ms var(--motion-ease) !important;
}

/* WhatsApp: presença leve, não pulsação agressiva */
.fab-whats {
  animation: erWhatsBreath 4.5s ease-in-out infinite;
}

@keyframes erWhatsBreath {
  0%, 100% { transform: translateY(0); box-shadow: 0 12px 30px rgba(45, 122, 70, .18); }
  50% { transform: translateY(-3px); box-shadow: 0 17px 34px rgba(45, 122, 70, .25); }
}

/* brilho quase imperceptível nos números quando entram */
.metrica-card.is-visible strong {
  animation: erMetricSettle 720ms var(--motion-ease) both;
  animation-delay: calc(var(--motion-delay, 0ms) + 140ms);
}

@keyframes erMetricSettle {
  0% { opacity: .25; transform: translateY(8px) scale(.97); }
  100% { opacity: 1; transform: none; }
}

@media (hover: hover) and (pointer: fine) {
  .menu #menu-list > li > a:hover::after,
  .menu .dropbtn:hover::after,
  .menu .gift-menu-trigger:hover::after {
    left: 18%;
    right: 18%;
  }

  .shop-card:hover,
  .produto-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 24px 48px rgba(77, 48, 42, .12);
  }

  .shop-card:hover .shop-img,
  .produto-card:hover .produto-img {
    transform: scale(1.045);
  }

  .sobre-depoimentos-media:hover .sobre-depoimentos-img {
    transform: scale(1.012);
  }

  .metrica-card:hover,
  .location-info-item:hover,
  .location-hours-block:hover {
    transform: translateY(-3px);
  }

  .location-map:hover {
    transform: translateY(-3px);
    box-shadow: 0 34px 68px rgba(58, 33, 29, .14);
  }

  :is(
    .shop-btn,
    .produto-btn,
    .produtos-ver-todos-btn,
    .btn-sobre-principal,
    .btn-sobre-secundario,
    .btn-agendar,
    .location-btn,
    .location-mini-link,
    .btn-footer
  ):hover {
    transform: translateY(-2px);
  }
}

/* Acessibilidade: nenhuma animação obrigatória */
@media (prefers-reduced-motion: reduce) {
  html.motion-ready [data-motion],
  html.motion-ready [data-motion].is-visible {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }

  .carousel-item.active img,
  .fab-whats,
  .metrica-card.is-visible strong {
    animation: none !important;
  }

  *, *::before, *::after {
    scroll-behavior: auto !important;
  }
}