  /* ───── ANIMATIONS ───── */
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
  }

  /* slideRight removed — hero now uses fadeUp for all elements */

  .hero > * {
    opacity: 0;
    animation: fadeUp 0.8s ease forwards;
  }
  .hero > *:nth-child(1) { animation-delay: 0.15s; }
  .hero > *:nth-child(2) { animation-delay: 0.35s; }
  .hero > *:nth-child(3) { animation-delay: 0.55s; }
  .hero > *:nth-child(4) { animation-delay: 0.7s; }
  .hero > *:nth-child(5) { animation-delay: 0.85s; }
  .hero > *:nth-child(6) { animation-delay: 1.0s; }
  .hero > *:nth-child(7) { animation-delay: 1.15s; }

  .hero-pills .pill {
    opacity: 0;
    animation: fadeUp 0.5s ease forwards;
  }
  .hero-pills .pill:nth-child(1) { animation-delay: 0.7s; }
  .hero-pills .pill:nth-child(2) { animation-delay: 0.8s; }
  .hero-pills .pill:nth-child(3) { animation-delay: 0.9s; }
  .hero-pills .pill:nth-child(4) { animation-delay: 1.0s; }

  /* ───── SCROLL REVEAL ───── */
  .reveal {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }

  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* ───── BORDER-SLIDE REVEAL ───── */
  /* Elements with gold left/right border: line slides in, then text fades */

  .reveal-border {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  /* The gold border line — starts collapsed, expands on reveal */
  .reveal-border::before {
    transition: height 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
  }

  .reveal-border:not(.visible)::before {
    height: 0 !important;
  }

  .reveal-border.visible::before {
    height: 100% !important;
  }

  /* Inner content fades in after the line */
  .reveal-border > *:not(.edge-light) {
    opacity: 0;
    transform: translateX(-16px);
    transition: opacity 0.45s ease 0.35s, transform 0.45s ease 0.35s;
  }

  .reveal-border.visible > *:not(.edge-light) {
    opacity: 1;
    transform: translateX(0);
  }

  /* Right-side border variant — slides from right */
  .reveal-border-right > *:not(.edge-light) {
    transform: translateX(16px);
  }

  .reveal-border-right.visible > *:not(.edge-light) {
    transform: translateX(0);
  }

  /* Alternating children in why-grid: odd from left, even from right */
  .why-item.reveal-border:nth-child(even) > * {
    transform: translateX(16px);
  }

  .why-item.reveal-border.visible:nth-child(even) > * {
    transform: translateX(0);
  }

  /* Why-items: slide-in with side accent line */
  .why-item.reveal-slide {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    border-left: 3px solid transparent;
  }

  .why-item.reveal-slide.visible {
    border-left-color: var(--gold);
    transition: border-left-color 0.4s ease !important;
  }

  .why-item.reveal-slide > * {
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.45s ease 0.25s, transform 0.45s ease 0.25s;
  }

  .why-item.reveal-slide.visible > * {
    opacity: 1;
    transform: translateX(0);
  }

  /* Even why-items: from right */
  .why-item.reveal-slide:nth-child(even) {
    border-left: none;
    border-right: 3px solid transparent;
  }

  .why-item.reveal-slide.visible:nth-child(even) {
    border-right-color: var(--gold);
    transition: border-right-color 0.4s ease !important;
  }

  .why-item.reveal-slide:nth-child(even) > * {
    transform: translateX(20px);
  }

  .why-item.reveal-slide.visible:nth-child(even) > * {
    transform: translateX(0);
  }
