﻿:root {
  --mg-btn-swap-duration: 0.7s;
}

.oql-hero__title {
  --hero-delay: 0ms;
}

.oql-hero__lead {
  --hero-delay: 120ms;
}

.oql-hero__cta--primary {
  --hero-delay: 240ms;
}

.oql-hero__cta--secondary {
  --hero-delay: 320ms;
}

.oql-hero__video-shell {
  --hero-delay: 220ms;
}

.oql-hero__eyebrow--below {
  --hero-delay: 360ms;
}

.oql-filosofia__title {
  --hero-delay: 440ms;
}

.oql-filosofia__text {
  --hero-delay: 520ms;
}

.oql-filosofia__link {
  --hero-delay: 600ms;
}

.oql-entrega {
  --hero-delay: 500ms;
}

.oql-hero [data-hero-anim],
.oql-filosofia [data-hero-anim] {
  opacity: 0;
  transform: translate3d(0, 22px, 0);
  transition: opacity 0.75s ease, transform 0.75s cubic-bezier(0.2, 0.7, 0.2, 1);
  transition-delay: var(--hero-delay, 0ms);
  will-change: transform, opacity;
}

body.is-loaded .oql-hero [data-hero-anim],
body.is-loaded .oql-filosofia [data-hero-anim] {
  opacity: 1;
  transform: none;
}

.mg-btn {
  position: relative;
}

.mg-btn__inner {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.mg-btn__swap {
  position: relative;
  display: inline-grid;
  overflow: hidden;
}

.mg-btn__swap-text {
  grid-area: 1 / 1;
  transition: transform var(--mg-btn-swap-duration, 0.42s) cubic-bezier(0.2, 0.7, 0.2, 1);
}

.mg-btn__swap-text.is-absolute {
  position: absolute;
  inset: 0;
  transform: translate3d(0, 130%, 0);
}

.mg-btn:hover .mg-btn__swap-text.is-absolute,
.mg-btn:focus-visible .mg-btn__swap-text.is-absolute {
  transform: translate3d(0, 0, 0);
}

.mg-btn:hover .mg-btn__swap-text.is-relative,
.mg-btn:focus-visible .mg-btn__swap-text.is-relative {
  transform: translate3d(0, -130%, 0);
}

.mg-btn__icon {
  grid-area: 1 / 1;
  display: grid;
  place-items: center;
  transition: transform var(--mg-btn-swap-duration, 0.42s) cubic-bezier(0.2, 0.7, 0.2, 1);
}

.mg-btn__icon.is-absolute {
  position: absolute;
  inset: 0;
  transform: translate3d(0, 130%, 0);
}

.mg-btn:hover .mg-btn__icon.is-absolute,
.mg-btn:focus-visible .mg-btn__icon.is-absolute {
  transform: translate3d(0, 0, 0);
}

.mg-btn:hover .mg-btn__icon.is-relative,
.mg-btn:focus-visible .mg-btn__icon.is-relative {
  transform: translate3d(0, -130%, 0);
}

.mg-btn__icon-wrap {
  width: var(--mg-icon-size, 16px);
  height: var(--mg-icon-size, 16px);
}

.mg-btn__icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.oql-hero__cta:focus-visible {
  outline: 3px solid rgba(255, 128, 0, 0.35);
  outline-offset: 3px;
}

.oql-hero__bg {
  transform: translate3d(var(--hero-parallax-x, 0px), var(--hero-parallax-y, 0px), 0) scale(1.04);
  transition: transform 280ms ease;
  will-change: transform;
}

.oql-onde-card {
  position: relative;
}

.oql-onde-card.is-loading::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 124px;
  background: linear-gradient(120deg, rgba(41, 35, 92, 0.08), rgba(41, 35, 92, 0.14), rgba(41, 35, 92, 0.08));
  background-size: 260% 100%;
  animation: oqlCardMediaShimmer 1.3s ease infinite;
  opacity: 0;
  transform: translate3d(0, 0, 0);
  transition: opacity 240ms ease;
  pointer-events: none;
  z-index: 1;
}

.oql-onde-card.is-loading.is-loading--active::before {
  opacity: 1;
}

.oql-onde-card.is-loaded::before {
  display: none;
}

.oql-onde-card__img {
  opacity: 1;
  transition: opacity 220ms ease;
}

.oql-onde-card.is-loading .oql-onde-card__img {
  opacity: 0;
}

@keyframes oqlCardMediaShimmer {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 120% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .oql-hero [data-hero-anim],
  .oql-filosofia [data-hero-anim] {
    transition: none;
    transform: none;
    opacity: 1;
    filter: none;
  }

  .oql-hero__bg {
    transform: none;
    transition: none;
  }

  .oql-onde-card.is-loading::before {
    animation: none;
  }

  .oql-onde-card__img {
    transition: none;
    opacity: 1;
  }
}
