@charset "UTF-8";

/* ===== HARDWARE ACCELERATION ===== */
.hw-accelerated {
  will-change: transform, opacity;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

/* ===== FLOAT ANIMATION ===== */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

.float {
  animation: float 5s var(--ease-out-expo) infinite;
}

/* ===== SCROLL REVEAL ANIMATIONS ===== */
.reveal {
  opacity: 0;
  transform: translateY(60px);
  transition: opacity var(--duration-slow) var(--ease-out-expo),
              transform var(--duration-slow) var(--ease-out-expo);
  will-change: opacity, transform;
  backface-visibility: hidden;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-50px);
  transition: opacity var(--duration-slow) var(--ease-out-expo),
              transform var(--duration-slow) var(--ease-out-expo);
  will-change: opacity, transform;
  backface-visibility: hidden;
}

.reveal-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.reveal-right {
  opacity: 0;
  transform: translateX(50px);
  transition: opacity var(--duration-slow) var(--ease-out-expo),
              transform var(--duration-slow) var(--ease-out-expo);
  will-change: opacity, transform;
  backface-visibility: hidden;
}

.reveal-right.visible {
  opacity: 1;
  transform: translateX(0);
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.85);
  transition: opacity var(--duration-slow) var(--ease-out-expo),
              transform var(--duration-slow) var(--ease-out-expo);
  will-change: opacity, transform;
  backface-visibility: hidden;
}

.reveal-scale.visible {
  opacity: 1;
  transform: scale(1);
}

/* ===== PAGE LOAD ANIMATIONS ===== */
@keyframes headerSlideIn {
  0% {
    opacity: 0;
    transform: translateX(-50px) translateY(-10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0) translateY(0);
  }
}

@keyframes contentSlideIn {
  0% {
    opacity: 0;
    transform: translateX(50px) translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0) translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.header-animate {
  animation: headerSlideIn 900ms var(--ease-out-expo) forwards;
}

.content-animate {
  animation: contentSlideIn 900ms var(--ease-out-expo) forwards;
  animation-delay: 300ms;
}

.fade-in-up {
  animation: fadeInUp 700ms var(--ease-out-expo) forwards;
  opacity: 0;
}

/* ===== SYNCHRONIZED SVG/IMAGE HOVER ANIMATIONS ===== */
.estou-fazendo svg,
.estou-fazendo img,
.link-loja svg,
.link-loja img,
.div-info svg,
.div-info img,
.guia-link svg,
.guia-link img {
  transition: all 0.5s var(--ease-out-expo);
  transform: scale(1) translateY(0);
  opacity: 1;
}

.estou-fazendo:hover svg,
.estou-fazendo:hover img {
  transform: scale(1.08) translateY(-4px);
  filter: drop-shadow(0 8px 16px rgba(0, 212, 255, 0.3));
}

.link-loja:hover svg,
.link-loja:hover img {
  transform: scale(1.05) translateY(-3px);
  filter: drop-shadow(0 6px 12px rgba(0, 212, 255, 0.25));
}

.div-info:hover svg,
.div-info:hover img,
.div-info:hover .icon {
  transform: scale(1.12) rotate(-5deg);
}

.guia-link:hover svg,
.guia-link:hover img {
  transform: translateX(6px);
  opacity: 0.9;
}

/* ===== MODERN TYPOGRAPHY (animation-specific only) ===== */
.estou-fazendo h3,
.link-loja h1,
.guia-link h3 {
  transition: color 0.3s var(--ease-out-expo);
}

.estou-fazendo:hover h3,
.link-loja:hover h1,
.guia-link:hover h3 {
  color: var(--accent);
}

/* ===== ACCESSIBILITY ===== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal,
  .reveal-left,
  .reveal-right,
  .reveal-scale,
  .reveal-scale-up {
    opacity: 1;
    transform: none;
  }

  .estou-fazendo svg,
  .estou-fazendo img,
  .link-loja svg,
  .link-loja img {
    transition: none !important;
  }
}