/* ── TDR Animations v1.1 — keyframes + scroll-reveal classes ── */

/* Standard easing across all TDR animations */
:root {
  --tdr-ease-standard: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --tdr-ease-overshoot: cubic-bezier(0.34, 1.56, 0.64, 1);
  --tdr-ease-enter: cubic-bezier(0.22, 1, 0.36, 1);
  --tdr-ease-exit: cubic-bezier(0.4, 0, 1, 1);

  --tdr-dur-fast: 200ms;
  --tdr-dur-base: 400ms;
  --tdr-dur-slow: 600ms;

  --tdr-stagger-step: 80ms;
}

/* ── Keyframe definitions ──────────────────────────────────────────────── */
@keyframes tdrFadeUp {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: translateY(0); }
}

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

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

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

@keyframes tdrScaleIn {
  from { opacity: 0; transform: scale(0.94); }
  to   { opacity: 1; transform: scale(1); }
}

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

@keyframes tdrScrollMouse {
  0%, 100% { opacity: 1; transform: translateX(-50%) translateY(0); }
  60%       { opacity: 0; transform: translateX(-50%) translateY(12px); }
}

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

/* ── IntersectionObserver scroll-reveal classes ────────────────────────── */
/* All start hidden; JS adds .tdr-visible when in viewport */

.tdr-fade-up {
  opacity: 0;
  transform: translateY(28px);
  transition:
    opacity var(--tdr-dur-base) var(--tdr-ease-standard),
    transform var(--tdr-dur-base) var(--tdr-ease-standard);
  will-change: opacity, transform;
}

.tdr-fade-in {
  opacity: 0;
  transition: opacity var(--tdr-dur-base) var(--tdr-ease-standard);
  will-change: opacity;
}

.tdr-slide-left {
  opacity: 0;
  transform: translateX(32px);
  transition:
    opacity var(--tdr-dur-base) var(--tdr-ease-standard),
    transform var(--tdr-dur-base) var(--tdr-ease-standard);
  will-change: opacity, transform;
}

.tdr-slide-right {
  opacity: 0;
  transform: translateX(-32px);
  transition:
    opacity var(--tdr-dur-base) var(--tdr-ease-standard),
    transform var(--tdr-dur-base) var(--tdr-ease-standard);
  will-change: opacity, transform;
}

/* Scale variant for cards */
.tdr-reveal-scale {
  opacity: 0;
  transform: scale(0.94);
  transition:
    opacity 0.35s var(--tdr-ease-standard),
    transform 0.35s var(--tdr-ease-standard);
  will-change: opacity, transform;
}

/* Legacy .tdr-reveal alias */
.tdr-reveal {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity var(--tdr-dur-base) var(--tdr-ease-standard),
    transform var(--tdr-dur-base) var(--tdr-ease-standard);
  will-change: opacity, transform;
}

/* ── Visible state — toggled by JS ────────────────────────────────────── */
.tdr-fade-up.tdr-visible,
.tdr-fade-in.tdr-visible,
.tdr-slide-left.tdr-visible,
.tdr-slide-right.tdr-visible,
.tdr-reveal-scale.tdr-visible,
.tdr-reveal.tdr-visible {
  opacity: 1;
  transform: none;
}

/* ── Stagger delays (nth-child × 80ms) ────────────────────────────────── */
.tdr-stagger > *:nth-child(1)  { transition-delay: calc(var(--tdr-stagger-step) * 0); }
.tdr-stagger > *:nth-child(2)  { transition-delay: calc(var(--tdr-stagger-step) * 1); }
.tdr-stagger > *:nth-child(3)  { transition-delay: calc(var(--tdr-stagger-step) * 2); }
.tdr-stagger > *:nth-child(4)  { transition-delay: calc(var(--tdr-stagger-step) * 3); }
.tdr-stagger > *:nth-child(5)  { transition-delay: calc(var(--tdr-stagger-step) * 4); }
.tdr-stagger > *:nth-child(6)  { transition-delay: calc(var(--tdr-stagger-step) * 5); }
.tdr-stagger > *:nth-child(7)  { transition-delay: calc(var(--tdr-stagger-step) * 6); }
.tdr-stagger > *:nth-child(8)  { transition-delay: calc(var(--tdr-stagger-step) * 7); }
.tdr-stagger > *:nth-child(9)  { transition-delay: calc(var(--tdr-stagger-step) * 8); }
.tdr-stagger > *:nth-child(10) { transition-delay: calc(var(--tdr-stagger-step) * 9); }
.tdr-stagger > *:nth-child(11) { transition-delay: calc(var(--tdr-stagger-step) * 10); }
.tdr-stagger > *:nth-child(12) { transition-delay: calc(var(--tdr-stagger-step) * 11); }

/* ── Hero entrance (CSS-driven, no JS needed) ─────────────────────────── */
.tdr-hero__eyebrow  { animation: tdrFadeUp var(--tdr-dur-slow) var(--tdr-ease-enter) 100ms  both; }
.tdr-hero__title    { animation: tdrFadeUp var(--tdr-dur-slow) var(--tdr-ease-enter) 200ms  both; }
.tdr-hero__subtitle { animation: tdrFadeUp var(--tdr-dur-slow) var(--tdr-ease-enter) 350ms  both; }
.tdr-hero__cta      { animation: tdrFadeUp var(--tdr-dur-slow) var(--tdr-ease-enter) 500ms  both; }
.tdr-hero__stats    { animation: tdrFadeIn var(--tdr-dur-slow) var(--tdr-ease-standard) 700ms both; }

/* ── Shimmer skeleton ─────────────────────────────────────────────────── */
.tdr-skeleton {
  background: linear-gradient(
    90deg,
    var(--tdr-slate-100) 25%,
    var(--tdr-slate-50)  50%,
    var(--tdr-slate-100) 75%
  );
  background-size: 200% auto;
  animation: tdrShimmer 1.5s linear infinite;
  border-radius: var(--tdr-radius);
}

/* ── Ink explosion float keyframes ────────────────────────────────────── */
@keyframes tdrInkFloat1 {
  0%, 100% { transform: translate(0px, 0px) rotate(0deg); }
  25%       { transform: translate(9px, -14px) rotate(1.8deg); }
  50%       { transform: translate(-7px, 9px) rotate(-1.2deg); }
  75%       { transform: translate(11px, 5px) rotate(0.9deg); }
}

@keyframes tdrInkFloat2 {
  0%, 100% { transform: translate(0px, 0px) rotate(0deg) scale(1); }
  33%       { transform: translate(-12px, -9px) rotate(-2.2deg) scale(1.035); }
  66%       { transform: translate(9px, 14px) rotate(1.7deg) scale(0.968); }
}

@keyframes tdrInkFloat3 {
  0%, 100% { transform: translate(0px, 0px) rotate(0deg); }
  40%       { transform: translate(7px, -16px) rotate(3.2deg); }
  70%       { transform: translate(-9px, 7px) rotate(-1.8deg); }
}

/* ── Split hero entrance animations ───────────────────────────────────── */
@keyframes tdrBoxEnter {
  from { opacity: 0; transform: translateX(-36px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes tdrInkEnter {
  from { opacity: 0; transform: translateX(40px) scale(0.86); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}

/* Eyebrow: apare de jos, flash auriu, se stabilizează alb */
@keyframes tdrEyebrowReveal {
  0%   { opacity: 0; transform: translateY(14px); color: rgba(255, 208, 0, 0); }
  28%  { opacity: 1; transform: translateY(0);    color: #FFD000;
         text-shadow: 0 0 18px rgba(255, 210, 0, 0.75); }
  62%  { color: #FFD000; text-shadow: 0 0 10px rgba(255, 210, 0, 0.4); }
  100% { opacity: 1; transform: translateY(0);    color: rgba(255, 255, 255, 0.96);
         text-shadow: none; }
}

/* Strip entrance */
.tdr-hero__strip { animation: tdrFadeIn var(--tdr-dur-slow) var(--tdr-ease-standard) 700ms both; }

/* ── prefers-reduced-motion override ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .tdr-fade-up,
  .tdr-fade-in,
  .tdr-slide-left,
  .tdr-slide-right,
  .tdr-reveal-scale,
  .tdr-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    will-change: auto !important;
  }

  .tdr-stagger > * { transition-delay: 0ms !important; }

  .tdr-hero__eyebrow,
  .tdr-hero__title,
  .tdr-hero__subtitle,
  .tdr-hero__cta,
  .tdr-hero__stats,
  .tdr-hero__box,
  .tdr-hero__visual,
  .tdr-hero__strip,
  .tdr-hero__ink-blob,
  .tdr-hero__title-bold,
  .tdr-hero__title-thin,
  .tdr-hero__badge {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .tdr-hero--split .tdr-hero__eyebrow {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    color: rgba(255, 255, 255, 0.96) !important;
    text-shadow: none !important;
  }

  .tdr-skeleton { animation: none; }

  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}