.fx-installment-strip {
  --fxi-ink: #132039; --fxi-orange: #f78041; --fxi-scene: url('../../images/fabrexa-installment-lounge-v1.webp');
  position: relative; isolation: isolate; width: 100%; color: #fdfaf5;
  border-block: 1px solid #344056;
  background: radial-gradient(ellipse at 50% 80%, #965f3d29, transparent 37%), linear-gradient(115deg, #111d32, #1d2b43 50%, #111d32);
  overflow: clip;
}
.fx-installment-strip__scene { position: absolute; z-index: -2; inset: 0; background-image: var(--fxi-scene); background-size: cover; background-position: center 58%; opacity: .84; pointer-events: none; }
.fx-installment-strip__scene::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #101d32d9 0, #101d325e 43%, #101d3240 68%, #101d3280 100%); }
.fx-installment-strip__watermark { position: absolute; z-index: -1; left: max(26px, calc((100% - 1440px) / 2)); top: 15px; width: clamp(250px, 32vw, 480px); opacity: .045; pointer-events: none; }
.fx-installment-strip__watermark img { display: block; width: 100%; height: auto; }
.fx-installment-strip *, .fx-installment-strip *::before, .fx-installment-strip *::after { box-sizing: border-box; }
.fx-installment-strip::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: repeating-linear-gradient(120deg, transparent 0 10px, #ffffff04 10px 11px);
  mask-image: linear-gradient(90deg, #000, transparent 36%, transparent 64%, #000); pointer-events: none;
}
.fx-installment-strip__inner {
  width: min(100%, 1496px); min-height: 238px; padding: 24px 28px; margin-inline: auto;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .82fr) minmax(0, 1fr); align-items: center; gap: 50px;
}
.fx-installment-strip__copy { min-width: 0; overflow-wrap: anywhere; }
.fx-installment-strip__eyebrow { display: inline-flex; align-items: center; gap: 9px; padding: 5px 9px 5px 0; color: #ffbf91; font-size: 10px; font-weight: 700; line-height: 1.5; letter-spacing: 1.65px; text-transform: uppercase; }
.fx-installment-strip__eyebrow::before { content: ""; width: 22px; height: 1px; background: #ffb185; flex: 0 0 22px; }
.fx-installment-strip__title { display: block; margin-top: 8px; color: #fdfaf5; font-family: var(--fabrexa-font-display, NexaDisplay, SofiaText, Arial, sans-serif); font-size: clamp(28px, 2.25vw, 38px); font-weight: 400; line-height: 1.16; letter-spacing: -1px; }
.fx-installment-strip .fx-installment-strip__title { font-family: var(--fabrexa-font-display, NexaDisplay, SofiaText, Arial, sans-serif) !important; }
.fx-installment-strip__title .fxi-word { display: inline-block; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.fx-installment-strip__title .fxi-word--accent { color: #ffd0a4; }
.fx-installment-strip__description { display: block; max-width: 330px; margin-top: 12px; color: #d2d8e2; font-size: 12px; line-height: 1.65; }
.fx-installment-strip__art { --fxi-card-travel: calc(50vw + 140px); position: relative; display: block; width: 252px; height: 156px; justify-self: center; perspective: 800px; }
.fx-installment-strip__halo { position: absolute; width: 235px; height: 235px; border: 1px solid #ffb18516; border-radius: 50%; left: calc(50% - 117.5px); top: calc(50% - 117.5px); pointer-events: none; }
.fx-installment-strip__halo::before { content: ""; position: absolute; inset: 18px; border: 1px solid #ffb1850c; border-radius: 50%; }
.fx-installment-strip__halo::after { content: ""; position: absolute; inset: 13px; border: 1px solid #ffd2a9; border-radius: 50%; opacity: 0; }
.fx-installment-strip__bloom { position: absolute; inset: -28px -40px; border-radius: 50%; background: radial-gradient(ellipse, #ffd0a585 0, #f6944b38 32%, transparent 66%); opacity: 0; pointer-events: none; }
.fx-installment-strip__trail { position: absolute; top: calc(50% - 24px); width: min(28vw, 360px); height: 48px; border-radius: 50%; background: linear-gradient(90deg, transparent, #ffb67408 45%, #ffcc923d); filter: blur(9px); opacity: 0; pointer-events: none; }
.fx-installment-strip__trail--left { right: 60%; transform-origin: right; }
.fx-installment-strip__trail--right { left: 60%; transform-origin: left; background: linear-gradient(90deg, #ffcc923d, #ffb67408 55%, transparent); }
.fx-installment-strip__back-card, .fx-installment-strip__card { display: block; position: absolute; width: 190px; height: 120px; border-radius: 14px; }
.fx-installment-strip__back-card { inset: 5px auto auto 8px; transform: rotate(-14deg); filter: drop-shadow(0 12px 12px #020c1a55); overflow: hidden; }
.fx-installment-strip__card { inset: 30px 4px auto auto; transform: rotate(7deg); box-shadow: 0 20px 22px -16px #020c1ae6; overflow: hidden; }
.fx-installment-strip__back-card svg, .fx-installment-strip__card svg { width: 100%; height: 100%; display: block; }
.fx-installment-strip__card::after, .fx-installment-strip__back-card::after { content: ""; position: absolute; inset: -35% -60%; background: linear-gradient(110deg, transparent 38%, #fff8e899 47%, #ffffff26 51%, transparent 61%); transform: translateX(-90%); opacity: 0; pointer-events: none; }
.fx-installment-strip__action { position: relative; min-width: 0; max-width: 330px; width: 100%; justify-self: end; padding: 16px; border: 1px solid #dfebff1f; border-radius: 20px; background: linear-gradient(135deg, #172840cf, #142339a1); box-shadow: inset 0 1px #ffffff09, 0 10px 28px #050d1924; }
.fx-installment-strip__action::before, .fx-installment-strip__action::after { content: ""; position: absolute; width: 58%; height: 58%; opacity: 0; pointer-events: none; border-color: #ffd0a49c; border-style: solid; border-width: 0; }
.fx-installment-strip__action::before { inset: -1px auto auto -1px; border-top-width: 1px; border-left-width: 1px; border-radius: inherit; border-bottom-right-radius: 0; border-top-right-radius: 0; border-bottom-left-radius: 0; }
.fx-installment-strip__action::after { inset: auto -1px -1px auto; border-bottom-width: 1px; border-right-width: 1px; border-radius: inherit; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-left-radius: 0; }
.fx-installment-strip__action-note { display: block; margin-bottom: 11px; color: #d5dce6; font-size: 11px; line-height: 1.5; }
.fx-installment-strip__cta, .fx-installment-strip__cta:visited {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; min-height: 56px; padding: 11px 11px 11px 16px;
  border: 1px solid #ffcea6a3; border-radius: 14px; background: linear-gradient(110deg, #ffba7e, #ff9453 52%, #ef7c39); color: #132039; text-decoration: none;
  font-size: 13px; font-weight: 750; line-height: 1.4; box-shadow: inset 0 1px #ffebd74d, 0 8px 18px -10px #f780416b; transition: transform .22s ease, box-shadow .22s ease; overflow: hidden;
}
.fx-installment-strip__cta::after { content: ""; position: absolute; inset: -50% -30%; background: linear-gradient(105deg, transparent 41%, #ffffff38 49%, transparent 58%); transform: translateX(-100%); opacity: 0; pointer-events: none; }
.fx-installment-strip__cta-arrow { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 32px; border-radius: 10px; border: 1px solid #fff2e233; background: #fff1df40; transition: transform .22s ease; }
.fx-installment-strip__cta-arrow svg { display: block; width: 16px; height: 16px; }
.fx-installment-strip__cta:hover { color: #132039; text-decoration: none; transform: translateY(-2px); box-shadow: 0 12px 28px -14px #f7804180; }
.fx-installment-strip__cta:hover .fx-installment-strip__cta-arrow { transform: translateX(2px); }
.fx-installment-strip__cta:focus-visible { outline: 3px solid #fdfaf5; outline-offset: 4px; }
.fx-installment-strip__cta:focus-visible { animation: none !important; opacity: 1; }
.fx-installment-strip__benefits { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; padding-top: 13px; margin: 0; }
.fx-installment-strip__benefit { display: flex; align-items: center; gap: 6px; min-width: 0; }
.fx-installment-strip__icon { display: grid; place-items: center; width: 16px; height: 16px; color: #ffb185; flex: 0 0 16px; }
.fx-installment-strip__icon svg { width: 15px; height: 15px; display: block; }
.fx-installment-strip__benefit > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.fx-installment-strip__benefit b { display: block; color: #dbe1ea; font-size: 10px; line-height: 1.5; font-weight: 500; }
@media (max-width: 1199px) {
  .fx-installment-strip__inner { gap: 24px; grid-template-columns: minmax(0, 1fr) 228px minmax(0, 1fr); }
  .fx-installment-strip__art { width: 228px; height: 146px; }
  .fx-installment-strip__back-card, .fx-installment-strip__card { width: 172px; height: 109px; }
  .fx-installment-strip__card { inset-block-start: 28px; }
  .fx-installment-strip__title { font-size: 29px; }
  .fx-installment-strip__benefits { gap: 10px; }
}
@media (max-width: 991px) and (min-width: 576px) {
  .fx-installment-strip__inner { grid-template-columns: minmax(0, 1fr) 220px; gap: 12px 24px; min-height: 0; padding: 20px 28px; }
  .fx-installment-strip__art { --fxi-card-travel: calc(100vw + 140px); grid-column: 2; grid-row: 1 / 3; }
  .fx-installment-strip__action { grid-row: 2; grid-column: 1; justify-self: start; max-width: 340px; }
  .fx-installment-strip__title { font-size: 28px; }
  .fx-installment-strip__description { margin-top: 6px; }
  .fx-installment-strip__action { padding: 12px; border-radius: 17px; }
  .fx-installment-strip__action-note { display: none; }
}
@media (max-width: 575px) {
  .fx-installment-strip__inner { grid-template-columns: minmax(0, 1fr) 158px; padding: 18px 16px; gap: 12px 10px; min-height: 0; text-align: start; }
  .fx-installment-strip__copy { grid-column: 1; grid-row: 1; }
  .fx-installment-strip__scene { background-position: 68% center; }
  .fx-installment-strip__scene::after { background: linear-gradient(180deg, #101d3266, #101d32c9 60%, #101d32eb); }
  .fx-installment-strip__watermark { width: 240px; left: 16px; top: 12px; opacity: .035; }
  .fx-installment-strip__art { --fxi-card-travel: calc(100vw + 100px); grid-column: 2; grid-row: 1; width: 158px; height: 114px; }
  .fx-installment-strip__back-card, .fx-installment-strip__card { width: 144px; height: 91px; border-radius: 10px; }
  .fx-installment-strip__back-card { inset-inline-start: 3px; }
  .fx-installment-strip__card { inset-block-start: 20px; inset-inline-end: 1px; }
  .fx-installment-strip__halo { width: 150px; height: 150px; left: calc(50% - 75px); top: calc(50% - 75px); }
  .fx-installment-strip__trail { width: 130px; height: 36px; top: calc(50% - 18px); filter: blur(7px); }
  .fx-installment-strip__eyebrow { font-size: 8px; letter-spacing: .9px; gap: 6px; }
  .fx-installment-strip__eyebrow::before { width: 12px; flex-basis: 12px; }
  .fx-installment-strip__title { font-size: clamp(23px, 6.15vw, 27px); margin-top: 4px; letter-spacing: -.65px; }
  .fx-installment-strip__description { font-size: 10px; margin-top: 7px; }
  .fx-installment-strip__action { grid-column: 1 / -1; grid-row: 2; max-width: none; justify-self: stretch; padding: 10px; border-radius: 18px; }
  .fx-installment-strip__action-note { display: none; }
  .fx-installment-strip__cta { min-height: 50px; padding-block: 9px; font-size: 13px; border-radius: 12px; }
  .fx-installment-strip__cta-arrow { height: 28px; width: 28px; flex-basis: 28px; }
  .fx-installment-strip__benefits { justify-content: center; gap: 20px; padding-top: 8px; }
  .fx-installment-strip__benefit b { font-size: 9px; }
}
@media (max-width: 359px) { .fx-installment-strip__title { font-size: 23px; } }
@media (prefers-reduced-motion: no-preference) {
  /* Pre-paint preparation reserves the native layout; timeout/no JS stay fail-open. */
  html.fxi-motion-boot .fx-installment-strip:not(.fxi-animate) :is(.fx-installment-strip__copy, .fx-installment-strip__art, .fx-installment-strip__action, .fx-installment-strip__watermark),
  .fx-installment-strip[data-fxi-state="pending"] :is(.fx-installment-strip__copy, .fx-installment-strip__art, .fx-installment-strip__action, .fx-installment-strip__watermark) { opacity: 0; }
  html.fxi-motion-boot .fx-installment-strip:not(.fxi-animate) .fx-installment-strip__action,
  .fx-installment-strip[data-fxi-state="pending"] .fx-installment-strip__action { pointer-events: none; }
  html.fxi-motion-boot .fx-installment-strip:focus-within :is(.fx-installment-strip__copy, .fx-installment-strip__art, .fx-installment-strip__action),
  .fx-installment-strip[data-fxi-state="pending"]:focus-within :is(.fx-installment-strip__copy, .fx-installment-strip__art, .fx-installment-strip__action) { opacity: 1; }
  html.fxi-motion-boot .fx-installment-strip:focus-within .fx-installment-strip__action,
  .fx-installment-strip[data-fxi-state="pending"]:focus-within .fx-installment-strip__action { pointer-events: auto; }
  /* One finite choreography: counter-motion cards, staggered copy, diagonal assembly. */
  .fxi-animate .fx-installment-strip__watermark { animation: fxi-brand-drift 1.75s .1s ease-out backwards; }
  .fxi-animate .fx-installment-strip__back-card { animation: fxi-card-back .66s cubic-bezier(.22,.78,.24,1) both; }
  .fxi-animate .fx-installment-strip__card { animation: fxi-card-front .72s .025s cubic-bezier(.22,.78,.24,1) both; }
  .fxi-animate .fx-installment-strip__halo { animation: fxi-halo .7s .12s ease-out backwards; }
  .fxi-animate .fx-installment-strip__halo::after { animation: fxi-ring .62s .45s ease-out; }
  .fxi-animate .fx-installment-strip__bloom { animation: fxi-bloom .68s .4s ease-out; }
  .fxi-animate .fx-installment-strip__trail--left { animation: fxi-trail-left .5s .015s ease-out; }
  .fxi-animate .fx-installment-strip__trail--right { animation: fxi-trail-right .5s .035s ease-out; }
  .fxi-animate .fx-installment-strip__back-card::after { animation: fxi-light .54s .7s ease-in-out; }
  .fxi-animate .fx-installment-strip__card::after { animation: fxi-light .54s .76s ease-in-out; }
  .fxi-animate .fx-installment-strip__eyebrow { animation: fxi-copy .3s .74s ease-out backwards; }
  .fxi-animate .fx-installment-strip__title { animation: fxi-copy .38s .8s ease-out backwards; }
  .fxi-animate .fx-installment-strip__title.fxi-words { animation: fxi-title-aura .7s .8s ease-out; }
  .fxi-animate .fx-installment-strip__title .fxi-word { animation: fxi-word .4s calc(.8s + var(--fxi-word-order) * .07s) cubic-bezier(.2,.8,.2,1) backwards; }
  .fxi-animate .fx-installment-strip__description { animation: fxi-copy .32s .97s ease-out backwards; }
  .fxi-animate .fx-installment-strip__action { animation: fxi-panel .56s 1.03s cubic-bezier(.2,.8,.2,1) backwards; }
  .fxi-animate .fx-installment-strip__action::before { animation: fxi-corner-start .56s 1.03s cubic-bezier(.2,.8,.2,1); }
  .fxi-animate .fx-installment-strip__action::after { animation: fxi-corner-end .56s 1.03s cubic-bezier(.2,.8,.2,1); }
  .fxi-animate .fx-installment-strip__action-note { animation: fxi-copy .3s 1.3s ease-out backwards; }
  .fxi-animate .fx-installment-strip__cta { animation: fxi-copy .3s 1.48s ease-out backwards; }
  .fxi-animate .fx-installment-strip__benefits { animation: fxi-copy .29s 1.63s ease-out backwards; }
  .fxi-animate .fx-installment-strip__action:focus-within,
  .fxi-animate .fx-installment-strip__action:focus-within :is(.fx-installment-strip__action-note, .fx-installment-strip__cta, .fx-installment-strip__benefits) { animation: none !important; opacity: 1 !important; clip-path: none !important; transform: none !important; }
}
@keyframes fxi-card-back { 0% { opacity: 0; transform: translate3d(calc(var(--fxi-card-travel) * -1), 10px, 0) rotateY(14deg) rotate(-27deg) scale(.95); } 14% { opacity: 1; } 76% { opacity: 1; transform: translate3d(2px, -1px, 0) rotateY(0deg) rotate(-13.5deg) scale(1.005); } 100% { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0deg) rotate(-14deg) scale(1); } }
@keyframes fxi-card-front { 0% { opacity: 0; transform: translate3d(var(--fxi-card-travel), -10px, 0) rotateY(-14deg) rotate(20deg) scale(.95); } 14% { opacity: 1; } 76% { opacity: 1; transform: translate3d(-2px, 1px, 0) rotateY(0deg) rotate(6.5deg) scale(1.005); } 100% { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0deg) rotate(7deg) scale(1); } }
@keyframes fxi-copy { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fxi-panel { 0% { opacity: 0; clip-path: polygon(0 0, 2% 0, 100% 100%, 98% 100%); transform: translateY(6px) scale(.98); } 48% { opacity: .9; clip-path: polygon(0 0, 75% 0, 100% 100%, 25% 100%); } 80% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } 100% { opacity: 1; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transform: translateY(0) scale(1); } }
@keyframes fxi-corner-start { 0% { opacity: 0; transform: translate(-14px, -9px) scale(.88); } 35% { opacity: .8; } 80% { opacity: .45; transform: translate(0, 0) scale(1); } 100% { opacity: 0; transform: translate(0, 0) scale(1); } }
@keyframes fxi-corner-end { 0% { opacity: 0; transform: translate(14px, 9px) scale(.88); } 35% { opacity: .8; } 80% { opacity: .45; transform: translate(0, 0) scale(1); } 100% { opacity: 0; transform: translate(0, 0) scale(1); } }
@keyframes fxi-word { from { opacity: 0; transform: translate3d(0, 9px, 0); filter: blur(2px); } to { opacity: 1; transform: translate3d(0, 0, 0); filter: blur(0); } }
@keyframes fxi-title-aura { 0%, 100% { text-shadow: none; } 40% { text-shadow: 0 0 16px #ffcd9721; } }
@keyframes fxi-brand-drift { from { opacity: 0; transform: translateX(-22px); } to { transform: translateX(0); } }
@keyframes fxi-halo { from { opacity: 0; transform: scale(.84); } to { opacity: 1; transform: scale(1); } }
@keyframes fxi-light { 0% { opacity: 0; transform: translateX(-90%); } 28%, 62% { opacity: .42; } 100% { opacity: 0; transform: translateX(90%); } }
@keyframes fxi-ring { 0% { opacity: 0; transform: scale(.8); } 18% { opacity: .22; } 100% { opacity: 0; transform: scale(1.16); } }
@keyframes fxi-bloom { 0% { opacity: 0; transform: scale(.8); } 32% { opacity: .45; transform: scale(1); } 100% { opacity: 0; transform: scale(1.12); } }
@keyframes fxi-trail-left { 0% { opacity: 0; transform: translateX(calc(var(--fxi-card-travel) * -.7)) scaleX(.4); } 30% { opacity: .35; } 100% { opacity: 0; transform: translateX(18px) scaleX(1); } }
@keyframes fxi-trail-right { 0% { opacity: 0; transform: translateX(calc(var(--fxi-card-travel) * .7)) scaleX(.4); } 30% { opacity: .35; } 100% { opacity: 0; transform: translateX(-18px) scaleX(1); } }
[dir="rtl"] .fx-installment-strip__cta-arrow svg { transform: scaleX(-1); }
[dir="rtl"] .fx-installment-strip__cta:hover .fx-installment-strip__cta-arrow { transform: translateX(-2px); }
@media (prefers-reduced-motion: reduce) {
  .fx-installment-strip__cta, .fx-installment-strip__cta-arrow { transition: none; }
  .fx-installment-strip__cta:hover, .fx-installment-strip__cta:hover .fx-installment-strip__cta-arrow, [dir="rtl"] .fx-installment-strip__cta:hover .fx-installment-strip__cta-arrow { transform: none; }
}
