/* Shared conversion and interaction refinements for ARV sales and checkout pages. */
:root {
  --focus-ring: #8bdff0;
  --press-scale: 0.97;
}

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

button,
a,
input,
select,
textarea,
summary,
[tabindex] {
  -webkit-tap-highlight-color: transparent;
}

a,
button,
summary,
.file-field {
  touch-action: manipulation;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.file-field:focus-within {
  outline: 3px solid var(--focus-ring);
  outline-offset: 4px;
}

.sales-funnel main,
.sales-funnel section,
.sales-funnel .wrap,
.sales-funnel .hero-grid,
.sales-funnel .hero-center,
.sales-funnel .hero-title,
.sales-funnel .hero-title .mask,
.sales-funnel .hero-title .mask > span,
.sales-funnel .hero-copy,
.sales-funnel .visit-grid,
.sales-funnel .visit-grid > *,
.sales-funnel .visit-copy,
.sales-funnel .offer-grid,
.sales-funnel .ticket-card,
.sales-funnel .ticket-top,
.sales-funnel .ticket-row,
.checkout-page main,
.checkout-page section,
.checkout-page article,
.checkout-page .card,
.checkout-page .section-stack {
  min-width: 0;
}

.sales-funnel .visit-grid,
.sales-funnel .visit-grid > *,
.sales-funnel .visit-copy,
.sales-funnel .offer-grid,
.sales-funnel .ticket-card {
  width: 100%;
  max-width: 100%;
}

.sales-funnel .hero-title,
.sales-funnel .hero-title .mask,
.sales-funnel .hero-title .mask > span,
.sales-funnel .hero-copy {
  width: 100%;
  max-width: 100%;
}

.sales-funnel .hero-title,
.sales-funnel .final-title,
.sales-funnel h2,
.sales-funnel h3,
.checkout-page h1,
.checkout-page h2 {
  font-optical-sizing: auto;
}

.sales-funnel .btn,
.sales-funnel .nav-ticket,
.sales-funnel .ticket-button,
.sales-funnel .bonus-library-cta,
.checkout-page .button,
.checkout-page .platform-button,
.checkout-page .file-field {
  transform-origin: center;
  transition-duration: 180ms;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.sales-funnel .btn:active,
.sales-funnel .nav-ticket:active,
.sales-funnel .ticket-button:active,
.sales-funnel .bonus-library-cta:active,
.checkout-page .button:active,
.checkout-page .platform-button:active,
.checkout-page .file-field:active {
  transform: scale(var(--press-scale));
  transition-duration: 90ms;
}

.sales-funnel .btn,
.sales-funnel .nav-ticket,
.sales-funnel .ticket-button,
.sales-funnel .bonus-library-cta,
.checkout-page .button,
.checkout-page .platform-button {
  min-height: 44px;
}

.sales-funnel .benefit-chips {
  list-style: none;
}

.sales-funnel .benefit-chips .slot {
  cursor: default;
  user-select: none;
}

.sales-funnel .benefit-chips .slot:hover {
  transform: none;
}

.mobile-enroll-bar {
  display: none;
}

@media (max-width: 760px) {
  .sales-funnel {
    padding-bottom: calc(78px + env(safe-area-inset-bottom));
  }

  .sales-funnel .wrap {
    width: 100%;
    max-width: 100%;
  }

  .sales-funnel .hero-title,
  .sales-funnel .hero-title .mask,
  .sales-funnel .hero-title .mask > span,
  .sales-funnel .hero-copy {
    inline-size: 100%;
    min-inline-size: 0;
    overflow-wrap: normal;
    white-space: normal;
  }

  .checkout-page .checkout-shell,
  .checkout-page .checkout-hero,
  .checkout-page .card,
  .checkout-page .section-stack,
  .checkout-page .included,
  .checkout-page .steps,
  .checkout-page .enrollment-steps {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .checkout-page h1,
  .checkout-page h2,
  .checkout-page p,
  .checkout-page li,
  .checkout-page .included-item,
  .checkout-page .step,
  .checkout-page .enrollment-step {
    overflow-wrap: anywhere;
  }

  .mobile-enroll-bar {
    position: fixed;
    z-index: 190;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom));
    left: 12px;
    display: block;
    padding: 6px;
    border: 1px solid rgba(232, 241, 244, 0.2);
    border-radius: 18px;
    background: rgba(2, 8, 18, 0.88);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36);
    backdrop-filter: blur(20px) saturate(150%);
    -webkit-backdrop-filter: blur(20px) saturate(150%);
    transition: opacity 180ms ease, transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .mobile-enroll-bar.is-hidden {
    pointer-events: none;
    opacity: 0;
    transform: translateY(calc(100% + 24px));
  }

  .mobile-enroll-bar a {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 17px;
    border-radius: 13px;
    color: #07101d;
    background: linear-gradient(118deg, #ffe0a6, #f4ad5e 34%, #d87536 72%, #ffd596);
    font-size: 14px;
    font-weight: 700;
  }

  .mobile-enroll-bar a:active {
    transform: scale(var(--press-scale));
  }

  .mobile-enroll-bar strong {
    white-space: nowrap;
    font-size: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sales-funnel .reveal,
  .sales-funnel .mask span {
    opacity: 1 !important;
    transform: none !important;
  }

  .mobile-enroll-bar,
  .mobile-enroll-bar a,
  .sales-funnel .btn,
  .sales-funnel .nav-ticket,
  .sales-funnel .ticket-button,
  .sales-funnel .bonus-library-cta,
  .checkout-page .button,
  .checkout-page .platform-button,
  .checkout-page .file-field {
    animation: none !important;
    transition: none !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .sales-funnel .nav-ticket,
  .sales-funnel .btn-secondary,
  .sales-funnel .ticket-card,
  .mobile-enroll-bar {
    background: #061326 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

@media (prefers-contrast: more) {
  .sales-funnel {
    --muted: rgba(255, 255, 255, 0.88);
    --faint: rgba(255, 255, 255, 0.74);
    --line: rgba(255, 255, 255, 0.46);
  }

  .sales-funnel .btn-secondary,
  .sales-funnel .nav-ticket,
  .sales-funnel .ticket-card,
  .mobile-enroll-bar {
    border-color: currentColor !important;
  }
}

.no-js .sales-funnel .reveal,
.no-js .sales-funnel .mask span {
  opacity: 1 !important;
  transform: none !important;
}
