/* ============================================================
   Feira Wellness — camada de luz, profundidade e movimento
   Carregada DEPOIS do style.css. Nao muda layout nem cores da marca:
   so acrescenta luz ambiente, sombras em camadas, reflexos e grao.
   Tudo some para quem pede menos movimento (prefers-reduced-motion).
   ============================================================ */

:root {
  --sombra-1: 0 1px 1px rgba(28, 26, 18, 0.04), 0 6px 16px -8px rgba(28, 26, 18, 0.14), 0 26px 52px -34px rgba(28, 26, 18, 0.32);
  --sombra-2: 0 2px 2px rgba(28, 26, 18, 0.05), 0 14px 30px -12px rgba(28, 26, 18, 0.22), 0 44px 80px -44px rgba(28, 26, 18, 0.42);
  --borda-luz: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  --brilho-sage: rgba(176, 190, 106, 0.38);
  --brilho-ambar: rgba(185, 127, 67, 0.2);
}

/* ---------- Grao de papel nobre (quase invisivel) ---------- */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  pointer-events: none;
  opacity: 0.045;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.11 0 0 0 0 0.1 0 0 0 0 0.07 0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");
}

/* ---------- Luz ambiente que respira ---------- */
.glow { animation: luz-flutua 22s ease-in-out infinite alternate; }
.glow-amber { animation-duration: 27s; animation-direction: alternate-reverse; }
.glow-sage { background: var(--brilho-sage); }
@keyframes luz-flutua {
  0%   { transform: translate3d(0, 0, 0) scale(1); }
  50%  { transform: translate3d(60px, 30px, 0) scale(1.12); }
  100% { transform: translate3d(-30px, 50px, 0) scale(0.96); }
}

/* Luz suave atras dos titulos das secoes claras */
.manifesto, .programacao, .marcas, .local, .faq { position: relative; isolation: isolate; }
.manifesto::before, .programacao::before, .marcas::before, .faq::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  top: clamp(40px, 6vw, 90px);
  width: min(720px, 90vw);
  height: 320px;
  transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(221, 226, 182, 0.55), transparent 75%);
  pointer-events: none;
}

/* ---------- Profundidade: sombras em camadas + borda de luz ---------- */
.card, .manifesto-card, .bloco, .rsvp, .marcas-lista li, .faq-item {
  box-shadow: var(--borda-luz), var(--sombra-1);
}
.card { transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease); }
.card:hover { box-shadow: var(--borda-luz), var(--sombra-2); }
.marcas-lista li { transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease); }
.marcas-lista li:hover { transform: translateY(-3px); box-shadow: var(--borda-luz), var(--sombra-2); }
.logos-vitrine { box-shadow: var(--borda-luz), var(--sombra-2); }
.logos img { transition: transform 0.4s var(--ease), filter 0.4s var(--ease); }
.logos li:hover img { transform: translateY(-2px) scale(1.04); }
.hero-media, .estande-media, .final-media, .video-quadro, .estandes-galeria img { box-shadow: var(--sombra-2); }
.porta { box-shadow: var(--sombra-1); }
.porta:hover { box-shadow: var(--sombra-2); }
.porta-marca { box-shadow: inset 0 0 0 1.5px var(--olive-dark), var(--sombra-1); }
.btn-primary { box-shadow: 0 10px 24px -14px rgba(28, 26, 18, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.12); }

/* ---------- Reflexo: luz que passa uma vez, como em vidro ---------- */
.logos-vitrine, .porta, .codigo-box { position: relative; overflow: hidden; }
.logos-vitrine::after, .porta::after {
  content: "";
  position: absolute;
  inset: -20% -60%;
  background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, 0.55) 50%, transparent 58%);
  transform: translateX(-70%);
  pointer-events: none;
}
.logos-vitrine.in::after { animation: reflexo 1.8s 0.5s var(--ease) both; }
.porta:hover::after { animation: reflexo 1.1s var(--ease) both; }
.porta-visitante::after { background: linear-gradient(105deg, transparent 42%, rgba(255, 255, 255, 0.16) 50%, transparent 58%); }
@keyframes reflexo { from { transform: translateX(-70%); } to { transform: translateX(70%); } }

/* ---------- Holofote na secao escura do estande (so com mouse) ---------- */
.estande::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.6s var(--ease);
  background: radial-gradient(520px circle at var(--mx, 50%) var(--my, 40%), rgba(221, 226, 182, 0.13), transparent 62%);
}
.estande.holofote::after { opacity: 1; }

/* ---------- Contagem regressiva com brilho ---------- */
.cd-num { text-shadow: 0 0 22px rgba(221, 226, 182, 0.28); }
.cd-num.tick { animation: tickIn 0.45s var(--ease), cd-brilho 1s var(--ease); }
@keyframes cd-brilho {
  0%   { text-shadow: 0 0 34px rgba(221, 226, 182, 0.7); }
  100% { text-shadow: 0 0 22px rgba(221, 226, 182, 0.28); }
}

/* ---------- Foto do topo: parallax leve (o kenburns do style.css continua) ---------- */
.hero-media.reveal.in, .hero-media { will-change: transform; transform: translate3d(0, var(--parallax, 0px), 0); }

/* ---------- Respeito a quem pede menos movimento ---------- */
@media (prefers-reduced-motion: reduce) {
  .glow, .cd-num.tick { animation: none; }
  .logos-vitrine.in::after, .porta:hover::after { animation: none; }
  .hero-media { transform: none; }
  .estande::after { display: none; }
  .marcas-lista li:hover, .logos li:hover img { transform: none; }
}