/* ===== ANIMATIONS.CSS — Lindem Engenharia e Arquitetura ===== */

/* ===== KEYFRAMES ===== */
@keyframes loaderFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes loaderBar {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@keyframes heroScrollPulse {
  0%   { opacity: 1; transform: scaleY(1); }
  50%  { opacity: 0.25; transform: scaleY(0.5); }
  100% { opacity: 1; transform: scaleY(1); }
}

/* Ken Burns cinematográfico — Hero background */
@keyframes heroBgKenBurns {
  0%   { transform: scale(1) translateY(0); }
  50%  { transform: scale(1.06) translateY(-1%); }
  100% { transform: scale(1) translateY(0); }
}

/* Linha arquitetônica do loader */
@keyframes loaderLineDraw {
  0%   { width: 0; opacity: 0; }
  20%  { opacity: 1; }
  100% { width: 200px; opacity: 1; }
}

/* Clip-path reveal */
@keyframes clipRevealUp {
  from { clip-path: inset(100% 0 0 0); opacity: 0.4; }
  to   { clip-path: inset(0% 0 0 0); opacity: 1; }
}

/* Linha vertical crescendo */
@keyframes lineGrowDown {
  from { height: 0; opacity: 0; }
  to   { height: 60px; opacity: 1; }
}

/* Dot pulse para badges */
@keyframes dotPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%       { transform: scale(1.5); opacity: 0.5; }
}

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

@keyframes fadeInLeft {
  from { opacity: 0; transform: translateX(-30px); }
  to   { opacity: 1; transform: translateX(0); }
}

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

@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}

@keyframes drawLine {
  from { stroke-dashoffset: 1000; }
  to   { stroke-dashoffset: 0; }
}

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}

@keyframes shimmer {
  from { background-position: -200% center; }
  to   { background-position: 200% center; }
}

@keyframes borderGrow {
  from { width: 0; }
  to   { width: 48px; }
}

@keyframes overlaySlide {
  from { transform: scaleX(1); transform-origin: left; }
  to   { transform: scaleX(0); transform-origin: left; }
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ===== LOADER ANIMATIONS ===== */
.site-loader {
  animation: none;
}

.loader-logo {
  opacity: 0;
  animation: loaderFadeIn 0.5s 0.1s var(--ease, cubic-bezier(0.25,0.46,0.45,0.94)) forwards;
}

.loader-bar::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--gold, #C8841A);
  transform: scaleX(0);
  transform-origin: left;
  animation: loaderBar 0.9s 0.3s var(--ease, cubic-bezier(0.25,0.46,0.45,0.94)) forwards;
}

.loader-text {
  opacity: 0;
  animation: loaderFadeIn 0.5s 0.5s ease forwards;
}

/* ===== HERO SCROLL INDICATOR ===== */
.hero-scroll-line {
  animation: heroScrollPulse 2s ease-in-out infinite;
}

/* ===== STAGGER DELAYS ===== */
.stagger-1 { transition-delay: 0.1s !important; }
.stagger-2 { transition-delay: 0.2s !important; }
.stagger-3 { transition-delay: 0.3s !important; }
.stagger-4 { transition-delay: 0.4s !important; }
.stagger-5 { transition-delay: 0.5s !important; }
.stagger-6 { transition-delay: 0.6s !important; }
.stagger-7 { transition-delay: 0.7s !important; }

/* Para animation (não transition) */
.stagger-anim-1 { animation-delay: 0.1s; }
.stagger-anim-2 { animation-delay: 0.2s; }
.stagger-anim-3 { animation-delay: 0.3s; }
.stagger-anim-4 { animation-delay: 0.4s; }
.stagger-anim-5 { animation-delay: 0.5s; }
.stagger-anim-6 { animation-delay: 0.6s; }
.stagger-anim-7 { animation-delay: 0.7s; }

/* ===== SECTION DIVIDER ANIMATION ===== */
.section-divider {
  animation: borderGrow 0.8s var(--ease, ease) forwards;
}

/* ===== BUTTON HOVER EFFECTS ===== */
.btn {
  position: relative;
  overflow: hidden;
}

.btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.08);
  transform: translateX(-100%);
  transition: transform 0.4s var(--ease, ease);
}

.btn:hover::after {
  transform: translateX(0);
}

/* Gold button ripple */
.btn-gold::before {
  content: '';
  position: absolute;
  inset: -2px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
  transform: translateX(-100%);
  transition: transform 0.6s ease;
}
.btn-gold:hover::before {
  transform: translateX(100%);
}

/* ===== CARD HOVER ===== */
.card {
  transition:
    transform var(--duration, 0.35s) var(--ease, ease),
    box-shadow var(--duration, 0.35s) var(--ease, ease),
    border-color var(--duration, 0.35s) ease;
}

/* Service card bg */
.service-card-bg img {
  transition: transform 0.7s var(--ease, ease);
}
.service-card:hover .service-card-bg img {
  transform: scale(1.06);
}

.service-card-text {
  transition:
    max-height 0.5s var(--ease, ease),
    opacity 0.4s ease;
}

.service-card-arrow {
  transition: transform 0.3s var(--ease, ease), color 0.2s ease;
}
.service-card:hover .service-card-arrow {
  transform: translateX(6px);
}

/* Touch devices - toggle expand */
.service-card.touch-active .service-card-text {
  max-height: 200px !important;
  opacity: 1 !important;
}

/* ===== PORTFOLIO ITEM ===== */
.portfolio-item-img {
  transition: transform 0.7s var(--ease, ease);
}
.portfolio-item:hover .portfolio-item-img {
  transform: scale(1.05);
}

.portfolio-item-overlay {
  transition: opacity 0.4s ease;
}
.portfolio-item:hover .portfolio-item-overlay {
  opacity: 1;
}

.portfolio-item-info {
  transition: transform 0.4s var(--ease, ease), opacity 0.4s ease;
}
.portfolio-item:hover .portfolio-item-info {
  transform: translateY(0);
  opacity: 1;
}

/* ===== GALLERY ITEM ===== */
.gallery-item img {
  transition: transform 0.6s var(--ease, ease);
}
.gallery-item:hover img {
  transform: scale(1.06);
}

.gallery-item-overlay {
  transition: opacity 0.35s ease;
}
.gallery-item:hover .gallery-item-overlay {
  opacity: 1;
}

/* ===== ABOUT IMAGE ===== */
.about-img-wrap img {
  transition: transform 0.6s var(--ease, ease);
}
.about-img-wrap:hover img {
  transform: scale(1.02);
}

/* ===== LIGHTBOX ===== */
.lightbox {
  transition: opacity 0.35s ease;
}
.lightbox.open {
  opacity: 1;
}

.lightbox-img {
  transition: opacity 0.2s ease;
}

/* ===== BACK TO TOP ===== */
.btn-top {
  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    border-color 0.25s ease,
    color 0.25s ease;
}

/* ===== WHATSAPP BUTTON ===== */
.btn-whatsapp {
  transition:
    transform 0.3s var(--ease, ease),
    box-shadow 0.3s ease;
  animation: float 4s ease-in-out infinite;
  animation-delay: 2s;
}

/* ===== FOOTER SOCIAL ===== */
.footer-social a {
  transition:
    border-color 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease;
}
.footer-social a:hover {
  transform: translateY(-2px);
}

/* ===== NAV LINK UNDERLINE ===== */
.nav-links a {
  position: relative;
}
.nav-links a::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 100%;
  height: 1px;
  background: var(--gold, #C8841A);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease, ease);
}
.nav-links a:hover::after,
.nav-links a.active::after {
  transform: scaleX(1);
}

/* Mobile nav links */
.mobile-nav-links a {
  transition:
    color 0.25s ease,
    padding-left 0.3s ease,
    opacity 0.4s ease,
    transform 0.4s ease;
}
.mobile-menu .mobile-nav-links a {
  opacity: 0;
  transform: translateX(20px);
}
.mobile-menu.open .mobile-nav-links a {
  opacity: 1;
  transform: translateX(0);
}

/* ===== FORM STATES ===== */
.form-input,
.form-select,
.form-textarea {
  transition:
    border-color 0.25s ease,
    box-shadow 0.25s ease;
}

/* ===== HEADER TRANSITION ===== */
.site-header {
  transition:
    background 0.4s ease,
    backdrop-filter 0.4s ease,
    padding 0.4s ease,
    box-shadow 0.4s ease;
}

/* ===== BIM LAYERS HOVER ===== */
.bim-layer {
  transition:
    background 0.25s ease,
    color 0.25s ease;
  cursor: default;
}
.bim-layer:hover {
  background: rgba(200, 132, 26, 0.1);
}

/* ===== PILLAR BAR ITEMS ===== */
.pillar-item {
  transition: background 0.25s ease, border-color 0.25s ease;
  cursor: default;
}
.pillar-item:hover {
  background: rgba(200, 132, 26, 0.04);
  border-right-color: rgba(200, 132, 26, 0.2);
}

/* ===== ABOUT HIGHLIGHTS ===== */
.about-highlight {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.about-highlight:hover {
  transform: translateX(4px);
}

/* ===== DIFF ITEMS ===== */
.diff-item {
  transition: background 0.25s ease;
}
.diff-item:hover {
  background: rgba(200, 132, 26, 0.03);
}

/* ===== FOOTER LINKS ===== */
.footer-nav a {
  transition: color 0.2s ease, padding-left 0.2s ease;
}
.footer-nav a:hover {
  padding-left: 6px;
}

/* ===== PROCESS STEP ===== */
.step-icon {
  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    color 0.25s ease;
}
.process-step:hover .step-icon {
  background: rgba(200, 132, 26, 0.1);
  border-color: var(--gold, #C8841A);
}

/* ===== FILTER BUTTONS ===== */
.filter-btn {
  transition:
    background 0.25s ease,
    color 0.25s ease,
    border-color 0.25s ease,
    transform 0.2s ease;
}
.filter-btn:hover {
  transform: translateY(-1px);
}
.filter-btn.active {
  transform: none;
}

/* ===== CARD LINK ARROW ===== */
.card-link svg {
  transition: transform 0.3s var(--ease, ease);
}
.card:hover .card-link svg {
  transform: translateX(4px);
}

/* ===== SPINNER (loading state) ===== */
.spinner {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: white;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  display: inline-block;
}

/* ===== HERO ARCH SVG DRAW ===== */
.hero-arch-svg path,
.hero-arch-svg line {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  transition: stroke-dashoffset 1.5s ease;
}

.hero-arch-svg.draw path,
.hero-arch-svg.draw line {
  stroke-dashoffset: 0;
}

/* ===== PAGE TRANSITION ===== */
.page-enter {
  animation: fadeInUp 0.5s var(--ease, ease) forwards;
}

/* ===== CTA SECTION TECH LINE ===== */
.cta-tech-line {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, var(--gold, #C8841A), transparent);
  animation: shimmer 3s linear infinite;
  background-size: 200% auto;
}

/* ===== ABOUT BADGE ===== */
.about-badge {
  animation: float 5s ease-in-out infinite;
  animation-delay: 1s;
}

/* ===== 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;
  }

  .reveal,
  .reveal-left,
  .reveal-right,
  .reveal-scale {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .hero-scroll-line {
    animation: none;
  }

  .btn-whatsapp {
    animation: none;
  }

  .about-badge {
    animation: none;
  }

  /* Ken Burns desativado */
  .hero-bg img {
    animation: none !important;
  }

  .loader-line-arch {
    animation: none !important;
    width: 200px;
    opacity: 1;
  }
}