/* Base styles, tactile hovers & accessible scroll choreography - Clínica Deborah Leão */

:root {
  color-scheme: light;
}

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: #FFFFFF;
  color: #242420;
  overflow-x: clip;
}

.font-display {
  font-family: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
}

/* Accessible keyboard focus indicator */
:focus-visible {
  outline: 2px solid #B35B38;
  outline-offset: 3px;
}

/* Top scroll reading progress bar */
#scroll-progress {
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 80ms linear;
  will-change: transform;
}

/* Animated editorial underline for header navigation & scrollspy active state */
.nav-link {
  position: relative;
  padding-bottom: 4px;
}

.nav-link::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  border-radius: 9999px;
  background-color: #B35B38;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.nav-link:hover::after,
.nav-link.is-active::after {
  transform: scaleX(1);
}

.nav-link.is-active {
  color: #97492B;
  font-weight: 600;
}

/* Below-the-fold section scroll reveal (never applied to hero/above-the-fold) */
.reveal-section {
  transition: opacity 560ms cubic-bezier(0.22, 1, 0.36, 1), transform 560ms cubic-bezier(0.22, 1, 0.36, 1);
}

html.js-ready .reveal-section:not(.is-visible) {
  opacity: 0;
  transform: translateY(20px);
}

html.js-ready .reveal-section.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered child items driven by stable parent section observer */
[data-reveal-item] {
  transition:
    opacity 540ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 540ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 300ms ease,
    border-color 300ms ease,
    background-color 300ms ease;
}

html.js-ready .reveal-section:not(.is-visible) [data-reveal-item] {
  opacity: 0;
  transform: translateY(24px);
}

html.js-ready .reveal-section.is-visible [data-reveal-item] {
  opacity: 1;
  transform: translateY(0);
  transition-delay: calc(var(--stagger, 0) * 75ms);
}

/* Clear stagger delay once revealed so interactive hovers stay instant */
html.js-ready .reveal-section.is-revealed [data-reveal-item] {
  transition-delay: 0ms;
}

/* Step progress rail draw animation on scroll */
.steps-rail {
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 850ms cubic-bezier(0.22, 1, 0.36, 1) 180ms;
}

html.js-ready .reveal-section.is-visible .steps-rail {
  transform: scaleX(1);
}

/* Subtle GPU-composited scroll parallax targets */
.parallax-soft {
  will-change: transform;
  transform: translate3d(0, var(--parallax-y, 0px), 0);
  transition: transform 120ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Dynamic team card filtering transition (delay explicitly zeroed via JS) */
.team-card {
  transition:
    opacity 240ms ease,
    transform 300ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 300ms ease,
    border-color 300ms ease;
}

.team-card.is-filtering-out {
  opacity: 0;
  transform: scale(0.97) translateY(6px);
}

/* Interactive editorial card hover lift */
.hover-card {
  transition:
    transform 300ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 300ms ease,
    border-color 300ms ease,
    background-color 300ms ease;
}

@media (hover: hover) {
  .hover-card:hover {
    transform: translateY(-5px);
  }
}

/* Floating WhatsApp scroll CTA */
#floating-whatsapp {
  transition: opacity 280ms ease, transform 280ms cubic-bezier(0.22, 1, 0.36, 1), background-color 220ms ease;
}

#floating-whatsapp.is-hidden-scroll {
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
}

/* FAQ smooth panel disclosure */
.faq-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.faq-item[data-open="true"] .faq-panel {
  grid-template-rows: 1fr;
}

.faq-panel-inner {
  overflow: hidden;
}

.faq-icon {
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.faq-item[data-open="true"] .faq-icon {
  transform: rotate(45deg);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  html.js-ready .reveal-section:not(.is-visible),
  html.js-ready .reveal-section:not(.is-visible) [data-reveal-item] {
    opacity: 1;
    transform: none;
  }

  .steps-rail {
    transform: scaleX(1);
    transition: none;
  }

  .parallax-soft {
    transform: none !important;
    transition: none;
  }

  .reveal-section,
  [data-reveal-item],
  .team-card,
  .hover-card,
  .nav-link::after,
  .faq-panel,
  .faq-icon,
  #scroll-progress,
  #floating-whatsapp {
    transition: none;
  }
}