/* Motion layer — additive animation system, does not modify site.css */

/* ---------- Hero / trust-strip seam ----------
   site.css only pulls the trust card up into the hero (margin-top) but
   leaves its other half hanging below in blank space before "por qué
   elegirnos" starts. Mirroring the same amount as margin-bottom closes
   that gap so the hero meets the image directly and the strip straddles
   the seam. */
.trust-wrap {
  margin-bottom: -54px;
}
@media (width <= 720px) {
  .trust-wrap {
    margin-bottom: -76px;
  }
}

/* ---------- Timeline year numbers ---------- */
.timeline-grid span {
  color: var(--red);
}

/* ---------- WhatsApp floating button ---------- */
.whatsapp-float {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #25d366;
  color: #fff;
  border-radius: 50%;
  box-shadow: 0 14px 30px #0d3b1e4d;
  z-index: 70;
  animation: jym-fab-in .6s cubic-bezier(.2, .72, .2, 1) .4s both,
             jym-fab-pulse 2.6s ease-in-out 1.4s infinite;
  transition: transform .3s cubic-bezier(.2, .72, .2, 1), box-shadow .3s ease;
}
.whatsapp-float svg {
  width: 32px;
  height: 32px;
}
.whatsapp-float:hover,
.whatsapp-float:focus-visible {
  transform: translateY(-4px) scale(1.06);
  box-shadow: 0 18px 36px #0d3b1e5c;
}
@keyframes jym-fab-in {
  from { opacity: 0; transform: scale(.35) translateY(24px); }
  to { opacity: 1; transform: none; }
}
@keyframes jym-fab-pulse {
  0%, 100% { box-shadow: 0 14px 30px #0d3b1e4d, 0 0 0 0 #25d3667a; }
  50% { box-shadow: 0 14px 30px #0d3b1e4d, 0 0 0 14px #25d36600; }
}
@media (max-width: 640px) {
  .whatsapp-float { right: 16px; bottom: 16px; width: 54px; height: 54px; }
  .whatsapp-float svg { width: 28px; height: 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .whatsapp-float { animation: none; }
}

/* ---------- Scroll reveal ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  will-change: transform, opacity;
}
[data-reveal].is-revealed {
  animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) forwards;
  animation-delay: calc(var(--reveal-index, 0) * .1s);
}
@keyframes jym-reveal-up {
  to { opacity: 1; transform: none; }
}

/* ---------- Header on scroll ---------- */
.site-header {
  transition: box-shadow .35s ease, border-color .35s ease;
}
.site-header.is-scrolled {
  box-shadow: 0 16px 32px #07152314;
  border-bottom-color: #0715231f;
}

/* ---------- Hero slide content stagger ---------- */
.hero-slide .eyebrow,
.hero-slide h1,
.hero-slide .hero-copy,
.hero-slide .hero-actions {
  opacity: 0;
  transform: translateY(22px);
}
.hero-slide.is-active .eyebrow { animation: jym-reveal-up .7s cubic-bezier(.2, .72, .2, 1) .12s forwards; }
.hero-slide.is-active h1 { animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) .24s forwards; }
.hero-slide.is-active .hero-copy { animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) .38s forwards; }
.hero-slide.is-active .hero-actions { animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) .5s forwards; }

/* ---------- Page hero (interior pages) stagger ---------- */
.page-hero-content > .eyebrow { opacity: 0; animation: jym-reveal-up .7s cubic-bezier(.2, .72, .2, 1) .1s forwards; }
.page-hero-content > h1 { opacity: 0; animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) .22s forwards; }
.page-hero-content > p:not(.eyebrow) { opacity: 0; animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) .34s forwards; }
.page-hero-content > .button { opacity: 0; animation: jym-reveal-up .8s cubic-bezier(.2, .72, .2, 1) .46s forwards; }
.page-hero-content > * { transform: translateY(22px); }

/* ---------- Card lifts ---------- */
.home-value-grid article,
.distinct-grid article,
.process-four article,
.service-detail,
.trust-item {
  transition: transform .4s cubic-bezier(.2, .72, .2, 1), box-shadow .4s ease;
}
.home-value-grid article:hover,
.distinct-grid article:hover,
.process-four article:hover {
  transform: translateY(-8px);
}
.trust-item:hover { transform: translateY(-4px); }

.distinct-icon,
.process-icon,
.service-icon-badge {
  transition: transform .45s cubic-bezier(.34, 1.56, .64, 1);
}
.distinct-grid article:hover .distinct-icon,
.process-four article:hover .process-icon {
  transform: scale(1.08) rotate(-4deg);
}
.service-detail:hover .service-icon-badge {
  transform: scale(1.08) rotate(4deg);
}

.fleet-list p,
.capability-list span,
.tag-list span {
  transition: transform .3s cubic-bezier(.2, .72, .2, 1), background .25s ease, color .25s ease, border-color .25s ease;
}
.fleet-list p:hover,
.capability-list span:hover,
.tag-list span:hover {
  transform: translateY(-3px);
}

/* ---------- Client logos ---------- */
.client-grid > div img {
  filter: grayscale(1) opacity(.65);
  transition: filter .45s ease, transform .45s ease;
}
.client-grid > div:hover img {
  filter: grayscale(0) opacity(1);
  transform: scale(1.06);
}

/* ---------- Buttons ---------- */
.button {
  position: relative;
  overflow: hidden;
}
.button::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 30%, #ffffff45 50%, transparent 70%);
  transform: translateX(-130%);
  pointer-events: none;
}
.button:hover::before {
  transform: translateX(130%);
  transition: transform .75s ease;
}
.button span[aria-hidden],
.inline-arrow span[aria-hidden] {
  display: inline-block;
  transition: transform .3s cubic-bezier(.2, .72, .2, 1);
}
.button:hover span[aria-hidden],
.inline-arrow:hover span[aria-hidden] {
  transform: translate(3px, -3px);
}

/* ---------- Slider arrows ---------- */
.slider-arrows button {
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.slider-arrows button:hover {
  transform: scale(1.08);
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  .hero-slide .eyebrow,
  .hero-slide h1,
  .hero-slide .hero-copy,
  .hero-slide .hero-actions,
  .page-hero-content > * {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
  .home-value-grid article:hover,
  .distinct-grid article:hover,
  .process-four article:hover,
  .trust-item:hover,
  .distinct-grid article:hover .distinct-icon,
  .process-four article:hover .process-icon,
  .service-detail:hover .service-icon-badge,
  .client-grid > div:hover img,
  .slider-arrows button:hover {
    transform: none;
  }
  .button::before { display: none; }
}