/* ================================================================
   VIRTUOSO CELLO — ANIMATIONS CSS
   Animações artísticas e microinterações elegantes v2.0
================================================================ */

/* ----------------------------------------------------------------
   SCROLL-TRIGGERED ANIMATION CLASSES
---------------------------------------------------------------- */
[data-animate] {
  will-change: transform, opacity;
}

[data-animate="fade-up"] {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-animate="fade-in"] {
  opacity: 0;
  transition: opacity 0.9s ease;
}

[data-animate="fade-left"] {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-animate="fade-right"] {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

[data-animate="scale-up"] {
  opacity: 0;
  transform: scale(0.94);
  transition: opacity 0.7s ease,
              transform 0.7s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* Clip-path reveal — editorial bow movement (horizontal reveal) */
[data-animate="bow-reveal"] {
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1s cubic-bezier(0.77, 0, 0.175, 1);
}

/* Line reveal from bottom */
[data-animate="line-reveal"] {
  overflow: hidden;
}

[data-animate="line-reveal"] > * {
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Timeline item reveal */
[data-animate="timeline-item"] {
  opacity: 0;
  transform: translateX(-16px);
  transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Visible state */
[data-animate].is-visible {
  opacity: 1;
  transform: none;
  clip-path: none;
}

[data-animate="bow-reveal"].is-visible {
  clip-path: inset(0 0% 0 0);
}

[data-animate="line-reveal"].is-visible > * {
  opacity: 1;
  transform: none;
}

/* Stagger delays */
[data-stagger] > *:nth-child(1)  { transition-delay: 0.05s; }
[data-stagger] > *:nth-child(2)  { transition-delay: 0.12s; }
[data-stagger] > *:nth-child(3)  { transition-delay: 0.19s; }
[data-stagger] > *:nth-child(4)  { transition-delay: 0.26s; }
[data-stagger] > *:nth-child(5)  { transition-delay: 0.33s; }
[data-stagger] > *:nth-child(6)  { transition-delay: 0.40s; }
[data-stagger] > *:nth-child(7)  { transition-delay: 0.47s; }
[data-stagger] > *:nth-child(8)  { transition-delay: 0.54s; }

[data-delay="100"] { transition-delay: 0.1s !important; }
[data-delay="200"] { transition-delay: 0.2s !important; }
[data-delay="300"] { transition-delay: 0.3s !important; }
[data-delay="400"] { transition-delay: 0.4s !important; }
[data-delay="500"] { transition-delay: 0.5s !important; }
[data-delay="600"] { transition-delay: 0.6s !important; }
[data-delay="700"] { transition-delay: 0.7s !important; }
[data-delay="800"] { transition-delay: 0.8s !important; }

/* ----------------------------------------------------------------
   HERO TEXT ANIMATIONS — Clip-path editorial reveal
---------------------------------------------------------------- */
.hero-eyebrow {
  animation: heroFadeUp 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s both;
}

.hero-title {
  animation: heroBowReveal 1.1s cubic-bezier(0.77, 0, 0.175, 1) 0.5s both;
}

.hero-description {
  animation: heroFadeUp 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.85s both;
}

.hero-actions {
  animation: heroFadeUp 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.05s both;
}

.hero-scroll {
  animation: heroFadeUp 0.8s ease 1.5s both;
}

@keyframes heroFadeUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Bow-inspired reveal: sweeps from left like a bow stroke */
@keyframes heroBowReveal {
  from {
    clip-path: inset(0 100% 0 0);
    opacity: 0.6;
  }
  to {
    clip-path: inset(0 0% 0 0);
    opacity: 1;
  }
}

/* ----------------------------------------------------------------
   PARALLAX
---------------------------------------------------------------- */
.parallax-bg {
  will-change: transform;
  transition: transform 0.1s linear;
}

/* ----------------------------------------------------------------
   GOLD SHIMMER — 1x per section entry (not infinite)
---------------------------------------------------------------- */
@keyframes goldShimmerOnce {
  0%   { background-position: -200% center; opacity: 0.6; }
  50%  { background-position: 0% center; opacity: 1; }
  100% { background-position: 200% center; opacity: 0.6; }
}

/* Shimmer triggered when section enters viewport */
.title-line.shimmer-active {
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--c-gold-dim) 35%,
    var(--c-gold) 50%,
    var(--c-gold-dim) 65%,
    transparent 100%
  );
  background-size: 200% auto;
  animation: goldShimmerOnce 1.5s ease-out forwards;
}

/* Still shimmer line without animation */
.shimmer-line {
  background: linear-gradient(
    90deg,
    transparent 0%,
    var(--c-gold-dim) 40%,
    var(--c-gold) 50%,
    var(--c-gold-dim) 60%,
    transparent 100%
  );
}

/* ----------------------------------------------------------------
   COPPER GLOW on hover elements
---------------------------------------------------------------- */
.copper-glow {
  transition: box-shadow var(--transition-base);
}

.copper-glow:hover {
  box-shadow: 0 0 24px rgba(168, 102, 63, 0.3);
}

/* ----------------------------------------------------------------
   HOVER CARD GLOW (subtle, not infinite pulse)
---------------------------------------------------------------- */
.service-card:hover,
.repertoire-card:hover,
.av-card:hover {
  box-shadow: 0 8px 40px rgba(197, 164, 104, 0.1), 0 2px 12px rgba(0,0,0,0.4);
}

/* ----------------------------------------------------------------
   F-HOLE SVG DRAW ANIMATION — page loader
---------------------------------------------------------------- */
.fhole-path {
  stroke-dasharray: 400;
  stroke-dashoffset: 400;
  animation: fholeDraw 1.5s ease forwards;
}

@keyframes fholeDraw {
  to { stroke-dashoffset: 0; }
}

/* ----------------------------------------------------------------
   UNDERLINE SLIDE
---------------------------------------------------------------- */
.anim-underline {
  position: relative;
  display: inline;
}

.anim-underline::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: currentColor;
  transition: width 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.anim-underline:hover::after {
  width: 100%;
}

/* ----------------------------------------------------------------
   CARD ENTER
---------------------------------------------------------------- */
@keyframes cardEnter {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* ----------------------------------------------------------------
   IMAGE LOADED FADE-IN
---------------------------------------------------------------- */
img.is-loaded {
  animation: imgFadeIn 0.4s ease;
}

@keyframes imgFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ----------------------------------------------------------------
   PREFERS-REDUCED-MOTION
---------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  [data-animate] {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
  }

  [data-animate="line-reveal"] > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  [data-animate="bow-reveal"] {
    clip-path: none !important;
  }

  .hero-eyebrow,
  .hero-title,
  .hero-description,
  .hero-actions,
  .hero-scroll,
  .parallax-bg {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    clip-path: none !important;
  }

  .timeline-item {
    opacity: 1 !important;
    transform: none !important;
  }

  .page-loader {
    display: none !important;
  }
}

/* ----------------------------------------------------------------
   MOBILE ANIMATIONS — Prevent horizontal overflow during scroll
---------------------------------------------------------------- */
@media (max-width: 768px) {
  [data-animate="fade-left"],
  [data-animate="fade-right"] {
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  [data-animate="fade-up"] {
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  [data-animate="scale-up"] {
    transform: scale(0.97);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  [data-animate].is-visible {
    opacity: 1 !important;
    transform: translate3d(0, 0, 0) !important;
  }
}