/* ═══════════════════════════════════════════════════════
   PRESENCA.EU — Animations & Keyframes
   ═══════════════════════════════════════════════════════ */

/* ── Scroll-line in hero ────────────────────────────── */
@keyframes scrollLine {
  0%   { top: -100%; }
  50%  { top: 100%; }
  50.01% { top: -100%; }
  100% { top: 100%; }
}

/* ── Reveal states (GSAP will toggle these) ─────────── */
[data-reveal] {
  opacity: 0;
  transform: translateY(30px);
}

[data-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out);
}

/* ── Hero element initial states ────────────────────── */
.hero__eyebrow,
.hero__line,
.hero__sub,
.hero__btn,
.hero__image-wrapper,
.hero__image-label {
  opacity: 0;
}

.hero__eyebrow.is-visible { opacity: 1; }
.hero__line.is-visible { opacity: 1; }
.hero__sub.is-visible { opacity: 1; }
.hero__btn.is-visible { opacity: 1; }
.hero__image-wrapper.is-visible { opacity: 1; }
.hero__image-label.is-visible { opacity: 1; }

/* ── Line expansion ─────────────────────────────────── */
.problem__line,
.phase__line {
  transform-origin: left;
  transform: scaleX(0);
  transition: transform 1s var(--ease-out);
}

.problem__line.is-visible,
.phase__line.is-visible {
  transform: scaleX(1);
}

/* ── Stagger offset via custom property ─────────────── */
[data-reveal] {
  transition-delay: var(--stagger, 0s);
}

/* ── Accordion animation ────────────────────────────── */
.accordion__content {
  overflow: hidden;
}

.accordion__item[open] .accordion__content {
  animation: accordionOpen 0.4s var(--ease-out);
}

@keyframes accordionOpen {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Pillar border expand on reveal ─────────────────── */
.pillar {
  background-image: linear-gradient(var(--accent), var(--accent));
  background-size: 0% 1px;
  background-position: top left;
  background-repeat: no-repeat;
  border-top-color: transparent;
  transition: background-size 1s var(--ease-out);
}

.pillar.is-visible {
  background-size: 100% 1px;
}

/* ── Stats counter placeholder ──────────────────────── */
.stat__value {
  transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out);
}

/* ── Image reveal clip ──────────────────────────────── */
.about__image-wrapper {
  clip-path: inset(100% 0 0 0);
  transition: clip-path 1.2s var(--ease-out);
}

.about__image-wrapper.is-visible {
  clip-path: inset(0 0 0 0);
}

/* ── CTA block animations ───────────────────────────── */
.cta-block__eyebrow,
.cta-block__title,
.cta-block__text,
.cta-block .btn,
.cta-block__phone {
  opacity: 0;
  transform: translateY(20px);
}

/* ── Topbar reveal ──────────────────────────────────── */
.topbar {
  transform: translateY(-100%);
  animation: topbarReveal 0.8s var(--ease-out) 0.5s forwards;
}

@keyframes topbarReveal {
  to {
    transform: translateY(0);
  }
}

/* ── Page load fade ─────────────────────────────────── */
body {
  animation: pageLoad 0.6s var(--ease-out);
}

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