/* Shared reusable component blocks */

.wpei-title-divider::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: var(--border-soft-72);
  transform: translateY(-50%);
}

.ei-section-shell {
  padding: var(--section-pad-mobile, var(--space-section-sm) 20px);
  background: var(--section-bg, transparent);
  color: var(--section-text, inherit);
}

.ei-section-container {
  width: min(100%, var(--section-max-width, 1080px));
  margin: 0 auto;
}

[data-ei-surface] {
  position: relative;
  overflow: clip;
  isolation: isolate;
}

[data-ei-surface] > * {
  position: relative;
  z-index: 1;
}

[data-ei-surface]::before {
  content: "";
  position: absolute;
  inset: var(--ei-surface-overlay-inset, 0);
  background: var(--ei-surface-overlay, none);
  filter: blur(var(--ei-surface-overlay-blur, 0px));
  opacity: var(--ei-surface-overlay-opacity, 1);
  pointer-events: none;
  z-index: 0;
  transform: translate3d(0, calc(var(--ei-depth-shift-soft, 0px) * var(--ei-surface-overlay-parallax, 0)), 0);
}

.ei-section-heading {
  max-width: var(--section-heading-max, 680px);
  margin-bottom: var(--section-heading-gap-mobile, var(--section-heading-gap, 32px));
  position: relative;
  z-index: 1;
}

.ei-section-heading--center {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.ei-section-heading__eyebrow,
.ei-section-heading > :is(.ei-rsvp-included__eyebrow) {
  margin: 0 0 8px;
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.1;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--section-eyebrow-color, var(--section-muted, var(--color-text-secondary)));
}

.ei-section-heading__title,
.ei-section-heading > :is(.ei-rsvp-included__title, .ei-buy-process__title, .ei-assistance__section-title) {
  margin: var(--section-title-margin, 0);
  font-family: var(--section-title-font, var(--font-display));
  font-size: var(--section-title-size, var(--type-section));
  line-height: var(--section-title-line-height, 1.05);
  font-weight: var(--section-title-weight, 400);
  letter-spacing: var(--section-title-spacing, 0.01em);
  text-transform: var(--section-title-transform, none);
  color: var(--section-title-color, var(--section-text, inherit));
}

.ei-section-heading__intro,
.ei-section-heading > :is(.ei-rsvp-included__intro, .ei-buy-process__intro, .ei-assistance__section-intro) {
  max-width: var(--section-intro-max, none);
  margin: var(--section-intro-margin, 12px 0 0);
  font-family: var(--font-editorial);
  font-size: var(--section-intro-size, var(--type-body-editorial));
  line-height: var(--section-intro-line-height, 1.68);
  color: var(--section-intro-color, var(--section-muted, var(--color-text-secondary)));
  font-style: italic;
  font-weight: 600;
  text-wrap: balance;
}

[data-ei-reveal="hero"] {
  --ei-motion-distance: var(--motion-distance-xs);
  --ei-motion-duration: var(--motion-duration-md);
  --ei-motion-blur: 0px;
}

[data-ei-reveal="section"] {
  --ei-motion-distance: var(--motion-distance-md);
  --ei-motion-duration: var(--motion-duration-lg);
  --ei-motion-blur: var(--motion-blur-sm);
}

[data-ei-reveal="soft"] {
  --ei-motion-distance: var(--motion-distance-sm);
  --ei-motion-duration: var(--motion-duration-md);
  --ei-motion-blur: 0px;
}

[data-ei-reveal="card"] {
  --ei-motion-distance: 12px;
  --ei-motion-duration: var(--motion-duration-md);
  --ei-motion-blur: 1px;
}

[data-ei-reveal].ei-motion-pending,
[data-ei-reveal].ei-motion-visible {
  transition:
    opacity var(--ei-motion-duration, var(--motion-duration-lg)) var(--motion-ease-soft),
    transform var(--ei-motion-duration, var(--motion-duration-lg)) var(--motion-ease-soft),
    filter var(--ei-motion-duration, var(--motion-duration-lg)) var(--motion-ease-standard);
  transition-delay: var(--ei-motion-delay, 0ms);
}

[data-ei-reveal].ei-motion-pending {
  opacity: 0;
  transform:
    var(--ei-motion-base-transform, translate3d(0, 0, 0))
    translate3d(0, var(--ei-motion-distance, var(--motion-distance-md)), 0);
  filter: blur(var(--ei-motion-blur, 0px));
  will-change: opacity, transform, filter;
}

[data-ei-reveal].ei-motion-visible {
  opacity: 1;
  transform:
    var(--ei-motion-base-transform, translate3d(0, 0, 0))
    translate3d(0, 0, 0);
  filter: blur(0);
  will-change: auto;
}

@media (min-width: 768px) {
  .ei-section-shell {
    padding: var(--section-pad-desktop, var(--space-section-md) 24px);
  }

  .ei-section-heading {
    margin-bottom: var(--section-heading-gap-desktop, var(--section-heading-gap-mobile, var(--section-heading-gap, 32px)));
  }
}


.ei-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 50px;
    width: 100%;
    padding: 0 24px;
    border: 1.5px solid transparent;
    border-radius: var(--radius-pill);
    font-family: var(--font-ui);
    font-size: var(--type-body-ui);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
      transform var(--motion-duration-sm) var(--motion-ease-standard),
      box-shadow var(--motion-duration-sm) var(--motion-ease-standard),
      opacity var(--motion-duration-sm) var(--motion-ease-standard),
      border-color var(--motion-duration-sm) var(--motion-ease-standard),
      background-color var(--motion-duration-sm) var(--motion-ease-standard),
      color var(--motion-duration-sm) var(--motion-ease-standard);
  }

  .ei-button:hover {
    transform: translateY(-1px);
  }

  .ei-button:active {
    transform: translateY(0);
    transition-duration: var(--motion-duration-xs);
  }

  .ei-button:focus-visible {
    outline: 2px solid var(--color-cta);
    outline-offset: 3px;
  }

  .ei-button--primary {
    background: var(--gradient-cta);
    color: var(--color-text-inverse);
    box-shadow: var(--cta-shadow-28);
  }

  .ei-button--primary:hover {
    box-shadow: var(--cta-shadow-36);
    border-color: var(--border-soft-52);
    color: var(--color-text-inverse);
  }

  .ei-button--ghost {
    background: var(--color-surface-white);
    border-color: var(--border-soft-52);
    color: var(--color-text-primary);
    box-shadow: var(--shadow-soft);
  }

  .ei-button--ghost:hover {
    background: var(--color-bg-base);
    border-color: var(--accent-soft-24);
    color: var(--color-text-primary);
  }

  .ei-button--whatsapp {
    background: #25d366;
    color: var(--color-text-inverse);
    box-shadow: 0 4px 18px rgba(37, 211, 102, 0.24);
  }

  .ei-button--whatsapp:hover {
    box-shadow: 0 8px 28px rgba(37, 211, 102, 0.32);
    color: var(--color-text-inverse);
  }

  @media (min-width: 768px) {
    .ei-button {
      width: auto;
    }
  }

.ei-social-payments {
    --bg: var(--color-bg-base);
    --text: var(--color-text-primary);
    --muted: var(--color-text-secondary);
    --line: var(--border-soft-52);
    --line-strong: var(--border-soft-72);
    --soft: var(--editorial-soft-06);

    background: var(--bg);
    padding: 48px 20px 52px;
    color: var(--text);
  }

  .ei-social-payments * {
    box-sizing: border-box;
  }

  .ei-social-payments__inner {
    width: min(100%, 760px);
    margin: 0 auto;
    text-align: center;
  }

  .ei-social-payments__brand-wrap {
    margin-bottom: 22px;
  }

  .ei-social-payments__brand {
      width: 120px
  }

  .ei-social-payments__socials {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 36px;
  }

  .ei-social-payments__social {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    background: var(--surface-white-44);
    box-shadow: var(--shadow-soft);
    text-decoration: none;
    transition:
      transform var(--motion-duration-sm) var(--motion-ease-standard),
      background-color var(--motion-duration-sm) var(--motion-ease-standard),
      border-color var(--motion-duration-sm) var(--motion-ease-standard),
      box-shadow var(--motion-duration-sm) var(--motion-ease-standard);
  }

  .ei-social-payments__social:focus-visible {
    outline: 2px solid var(--color-cta);
    outline-offset: 3px;
  }

  .ei-social-payments__social:active {
    transform: translateY(0);
    background: var(--soft);
    transition-duration: var(--motion-duration-xs);
  }

  .ei-social-payments__social-icon {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
  }

  .ei-social-payments__social-icon--fb { width: 44px; height: 44px; }
  .ei-social-payments__social-icon--ig { width: 44px; height: 44px; }
  .ei-social-payments__social-icon--wh { width: 44px; height: 44px; }
  .ei-social-payments__social-icon--pt { width: 44px; height: 44px; }

  .ei-social-payments__payments-title {
    margin: 0 0 16px;
    font-family: var(--font-editorial);
    font-size: clamp(18px, 4vw, 24px);
    line-height: 1.1;
    letter-spacing: 0.04em;
    color: var(--muted);
  }

  .ei-social-payments__payments {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 18px;
  }

  .ei-social-payments__payment-logo {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    object-fit: contain;
  }

  .ei-social-payments__payment-logo--paypal { width: 82px; }
  .ei-social-payments__payment-logo--mp { width: 48px; }
  .ei-social-payments__payment-logo--spei { width: 54px; }
  .ei-social-payments__payment-logo--visa { width: 60px; }
  .ei-social-payments__payment-logo--mc { width: 44px; }

  @media (hover: hover) and (pointer: fine) {
    .ei-social-payments__social:hover {
      transform: translateY(-2px);
      background: var(--soft);
      border-color: var(--line-strong);
      box-shadow: var(--shadow-md);
    }
  }

  @media (min-width: 768px) {
    .ei-social-payments {
      padding: 60px 24px 64px;
    }

    .ei-social-payments__brand-wrap {
      margin-bottom: 26px;
    }

    .ei-social-payments__socials {
      gap: 16px;
      margin-bottom: 42px;
    }

    .ei-social-payments__social {
      width: 64px;
      height: 64px;
    }

    .ei-social-payments__payments {
      gap: 16px 24px;
    }

    .ei-social-payments__payment-logo--paypal { width: 88px; }
    .ei-social-payments__payment-logo--mp { width: 52px; }
    .ei-social-payments__payment-logo--spei { width: 58px; }
    .ei-social-payments__payment-logo--visa { width: 66px; }
    .ei-social-payments__payment-logo--mc { width: 48px; }
  }

@media (prefers-reduced-motion: reduce) {
  [data-ei-surface]::before,
  [data-ei-reveal].ei-motion-pending,
  [data-ei-reveal].ei-motion-visible,
  .ei-button,
  .ei-social-payments__social {
    transition: none !important;
  }

  [data-ei-surface]::before {
    transform: none !important;
  }

  [data-ei-reveal].ei-motion-pending,
  [data-ei-reveal].ei-motion-visible {
    opacity: 1 !important;
    transform: var(--ei-motion-base-transform, translate3d(0, 0, 0)) !important;
    filter: none !important;
  }
}
