/*
 * AMEX popover -- Homepage-only positioning adapter.
 * NLC-DEV-20260919-live-dev-pages-correction
 * Loaded only when a page carries BOTH data-nlc-homepage="dev" and
 * data-nlc-amex="on", after amex-popover.css. Every selector is scoped under
 * .nlc-home so it can never affect another page. No !important.
 *
 * Why: Homepage's hero action row (.nlc-hero-actions) has an entrance
 * animation that leaves an identity transform on the ancestor after it
 * completes, which turns that ancestor into the containing block for
 * position: fixed descendants. The module's default <=640px rule
 * (position: fixed) would therefore render off-screen there. Homepage keeps
 * position: absolute at every width, anchored above the trigger, and centers
 * it on small screens using the hero's measured 1.5rem side padding.
 */
.nlc-home .nlc-amex-popover {
  position: absolute;
  top: auto;
  bottom: calc(100% + 1rem);
  left: 0;
}

@media (max-width: 767px) {
  .nlc-home .nlc-amex-popover {
    left: calc(50vw - 1.5rem);
    transform: translateX(-50%);
  }
}

/* Vertical flip (see amex-popover.js place()); keeps the adapter 1rem gap. */
.nlc-home .nlc-amex-popover[data-amex-placement="below"] {
  bottom: auto;
  top: calc(100% + 1rem);
}

.nlc-home .nlc-amex-popover[data-amex-placement="above"] {
  bottom: calc(100% + 1rem);
  top: auto;
}
