.loyalty-page { background: #f8f4fa; }
.loyalty-header .nav-shell { border-color: rgba(255,255,255,.11); background: rgba(20, 5, 36, .78); box-shadow: 0 18px 50px rgba(6,0,12,.18); }
.loyalty-header .brand span { color: #eeddf5; border-color: rgba(255,255,255,.19); }
.loyalty-header .site-nav > a { color: #d9cee2; }
.loyalty-header .site-nav .nav-cta { color: #170525; background: white; }
.loyalty-header .language-picker { border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06); }
.loyalty-header .language-picker button { color: #bcaec6; }
.loyalty-header .language-picker button:hover { color: white; }
.loyalty-header .menu-button { background: white; }
.loyalty-header .menu-button > span:not(.sr-only) { background: var(--ink); }

.loyalty-hero { min-height: 900px; position: relative; display: flex; align-items: center; color: white; background: #12031f; overflow: hidden; }
.loyalty-hero-image { position: absolute; inset: 0; background: url("loyalty-gym.webp") center / cover no-repeat; }
.loyalty-hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,2,23,.98) 0%, rgba(23,5,39,.93) 28%, rgba(25,5,42,.42) 57%, rgba(10,2,19,.15) 100%), linear-gradient(0deg, rgba(14,2,23,.88), transparent 48%); }
.loyalty-noise { position: absolute; inset: 0; opacity: .15; background-image: radial-gradient(rgba(255,255,255,.4) .6px, transparent .6px); background-size: 5px 5px; mix-blend-mode: overlay; }
.loyalty-hero-content { position: relative; z-index: 2; padding-top: 120px; display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.loyalty-hero-copy { max-width: 690px; }
.loyalty-kicker { margin: 0 0 25px; color: #f1dcec; font-size: 13px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.loyalty-kicker span { font-family: Georgia, serif; color: #ff437b; font-size: 19px; font-style: italic; letter-spacing: -.03em; text-transform: lowercase; }
.loyalty-hero h1 { margin: 0; max-width: 760px; font-size: clamp(66px, 7.2vw, 102px); line-height: .92; letter-spacing: -.068em; font-weight: 680; }
.loyalty-hero h1 em, .loyalty-page h2 em { display: inline; font-family: Georgia, serif; font-weight: 400; color: #ff437b; }
.loyalty-hero-copy > p:not(.loyalty-kicker) { max-width: 620px; margin: 32px 0 0; color: #cdbfd4; font-size: 18px; line-height: 1.65; }
.loyalty-actions { display: flex; align-items: center; gap: 28px; margin-top: 35px; }
.loyalty-button { color: white; background: linear-gradient(130deg, #ed006e, #ff5150); box-shadow: 0 20px 42px rgba(232,0,103,.26); }
.loyalty-button:hover { box-shadow: 0 25px 48px rgba(232,0,103,.34); }
.loyalty-ghost-link { padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,.35); font-size: 13px; font-weight: 800; }
.loyalty-ghost-link span { margin-left: 8px; color: #ff4c78; }
.hero-reward-stack { position: relative; width: 470px; height: 370px; flex: none; margin: 130px -5px 0 -30px; }
.hero-reward-card, .hero-level-card { position: absolute; width: 285px; padding: 24px; border: 1px solid rgba(255,255,255,.24); border-radius: 24px; backdrop-filter: blur(18px); box-shadow: 0 32px 80px rgba(6,0,12,.42); }
.hero-reward-card { z-index: 1; left: 0; top: 0; background: linear-gradient(145deg, rgba(22,5,39,.91), rgba(96,12,99,.82)); transform: rotate(-6deg); }
.reward-card-top { display: flex; justify-content: space-between; color: #bfaac9; font-size: 8px; font-weight: 800; letter-spacing: .15em; }
.reward-card-top i { font-style: normal; letter-spacing: .08em; }
.reward-progress { display: flex; align-items: baseline; gap: 7px; margin: 18px 0; }
.reward-progress strong { font-size: 46px; line-height: 1; }.reward-progress span { color: #cdbfd5; font-size: 12px; }
.reward-stamps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.reward-stamps i { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: #ee006c; background: rgba(255,255,255,.09); font-size: 10px; font-style: normal; }
.reward-stamps i:nth-child(-n+8) { background: white; }
.reward-next { display: flex; align-items: center; justify-content: space-between; margin-top: 23px; padding-top: 17px; border-top: 1px solid rgba(255,255,255,.13); }
.reward-next span { color: #b9a9c2; font-size: 9px; }.reward-next strong { font-size: 12px; }
.hero-level-card { z-index: 2; right: 0; top: 68px; color: #291138; border-color: rgba(255,255,255,.58); background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(247,226,244,.91)); box-shadow: 0 34px 85px rgba(6,0,12,.48); transform: rotate(6deg); }
.level-card-top { display: flex; justify-content: space-between; align-items: center; color: #7d6986; font-size: 8px; font-weight: 850; letter-spacing: .13em; }
.level-card-top i { padding: 5px 8px; border-radius: 20px; color: #8e0c62; background: rgba(205,0,101,.09); font-style: normal; letter-spacing: 0; }
.level-current { margin-top: 30px; }.level-current small, .level-current strong { display: block; }.level-current small { color: #a13676; font-size: 8px; font-weight: 850; letter-spacing: .14em; }.level-current strong { margin-top: 5px; font-family: Georgia, serif; font-size: 31px; font-weight: 400; letter-spacing: -.045em; }
.level-track { height: 8px; margin-top: 22px; overflow: hidden; border-radius: 10px; background: rgba(54,21,69,.1); }.level-track i { display: block; width: 92%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#6827d9,#ed006e,#ff6550); }
.level-next { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-top: 10px; }.level-next span { color: #83718b; font-size: 8px; }.level-next strong { color: #8d0d63; font-size: 10px; }
.level-perks { display: flex; gap: 7px; margin-top: 25px; padding-top: 17px; border-top: 1px solid rgba(53,20,69,.11); }.level-perks span { padding: 6px 9px; border-radius: 20px; color: #5b3a6a; background: rgba(85,33,111,.08); font-size: 8px; font-weight: 750; }
.hero-footnote { position: absolute; z-index: 3; left: 50%; bottom: 25px; transform: translateX(-50%); display: flex; align-items: center; justify-content: space-between; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.18); color: #95849f; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.hero-footnote > span { color: #d9cede; font-weight: 800; }.hero-footnote div { display: flex; gap: 35px; }

.loyalty-eyebrow { margin: 0; display: flex; align-items: center; gap: 10px; color: #68106f; font-size: 11px; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.loyalty-eyebrow > span { width: 21px; height: 2px; background: linear-gradient(90deg, #ec006d, #ff574f); }
.loyalty-eyebrow-light { color: #c9b3d1; }
.statement-grid { display: grid; grid-template-columns: 260px 1fr; gap: 80px; align-items: start; }
.statement-grid h2, .loop-heading h2, .use-heading h2, .platform-copy h2, .loyalty-final h2 { margin: 0; font-size: clamp(53px, 6vw, 80px); line-height: 1.02; letter-spacing: -.06em; }
.statement-grid h2 em { color: #ed006e; }
.statement-grid > div > p { max-width: 690px; margin: 28px 0 0; color: #6d6272; font-size: 18px; }
.loyalty-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 80px; border: 1px solid rgba(40,12,60,.12); border-radius: 22px; background: rgba(40,12,60,.12); overflow: hidden; }
.loyalty-metrics div { min-height: 170px; padding: 30px; background: #fcfafc; }
.loyalty-metrics strong { display: block; color: #e6006b; font-size: 11px; }
.loyalty-metrics p { max-width: 250px; margin: 45px 0 0; font-size: 16px; font-weight: 720; line-height: 1.4; }

.loyalty-loop { position: relative; color: white; background: #160525; overflow: hidden; }
.loyalty-loop::after { content: ""; position: absolute; inset: 0; opacity: .11; background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(to right, black, transparent 75%); }
.loop-glow { position: absolute; width: 550px; height: 550px; right: -280px; top: -150px; border-radius: 50%; background: radial-gradient(circle, rgba(230,0,106,.35), rgba(90,30,210,.12) 50%, transparent 70%); }
.loyalty-loop .shell { position: relative; z-index: 2; }
.loop-heading { max-width: 900px; }
.loop-heading h2 { margin-top: 24px; }
.loop-heading h2 em { background: linear-gradient(90deg, #ff6957, #ed006e, #9d4cff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.loop-steps { list-style: none; margin: 75px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid rgba(255,255,255,.12); border-radius: 24px; overflow: hidden; }
.loop-steps li { min-height: 340px; position: relative; padding: 29px; border-right: 1px solid rgba(255,255,255,.12); background: rgba(28,7,47,.83); }
.loop-steps li:last-child { border: 0; }
.loop-steps li > span { color: #796b83; font-size: 10px; font-weight: 850; }
.loop-steps h3 { margin: 51px 0 11px; font-size: 23px; }.loop-steps p { margin: 0; color: #a99bb1; font-size: 13px; }
.loop-icon { position: absolute; right: 24px; top: 25px; width: 60px; height: 60px; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; }
.visit-icon i { position: absolute; inset: 17px; border: 2px solid #ed006e; border-radius: 50%; }.visit-icon i::after { content: ""; position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #ff6054; left: 9px; top: 9px; }
.earn-icon { display: grid; place-items: center; }.earn-icon i { position: absolute; width: 20px; height: 20px; border-radius: 50%; background: linear-gradient(145deg,#8734ed,#ed006e); border: 2px solid #381052; }.earn-icon i:first-child { transform: translate(-9px,6px); }.earn-icon i:nth-child(2) { transform: translate(9px,6px); }.earn-icon i:nth-child(3) { transform: translateY(-9px); }
.unlock-icon i { position: absolute; width: 24px; height: 20px; left: 18px; top: 24px; border-radius: 5px; background: #ed006e; }.unlock-icon i::before { content: ""; position: absolute; width: 13px; height: 14px; left: 4px; top: -12px; border: 2px solid #a34df0; border-bottom: 0; border-radius: 8px 8px 0 0; }
.return-icon i { position: absolute; width: 27px; height: 27px; left: 16px; top: 16px; border: 2px solid #a34df0; border-left-color: transparent; border-radius: 50%; }.return-icon i::after { content: ""; position: absolute; left: -4px; top: 1px; width: 7px; height: 7px; border-left: 2px solid #ed006e; border-bottom: 2px solid #ed006e; transform: rotate(30deg); }

.use-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 55px; }
.use-heading .loyalty-eyebrow { align-self: start; padding-top: 12px; }.use-heading h2 { text-align: right; }
.use-case { min-height: 560px; position: relative; display: flex; align-items: flex-end; margin-top: 22px; border-radius: 28px; overflow: hidden; box-shadow: 0 28px 70px rgba(34,8,49,.15); }
.use-case > img, .use-case-shade { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.use-case img { transition: transform .7s cubic-bezier(.2,.7,.2,1); }.use-case:hover img { transform: scale(1.025); }
.gym-use .use-case-shade { background: linear-gradient(90deg, rgba(13,3,25,.96), rgba(23,3,37,.75) 45%, transparent 73%); }
.nightlife-use .use-case-shade { background: linear-gradient(270deg, rgba(13,3,25,.96), rgba(23,3,37,.76) 48%, transparent 76%); }
.use-case-copy { position: relative; z-index: 2; width: 48%; padding: 55px; color: white; }
.nightlife-use .use-case-copy { margin-left: auto; }
.use-case-copy > span { color: #f077ab; font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.use-case-copy h3 { margin: 17px 0 15px; font-size: 46px; line-height: 1; letter-spacing: -.05em; }
.use-case-copy p { margin: 0; color: #cbbfd1; font-size: 15px; }
.use-case-copy ul { list-style: none; margin: 25px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.use-case-copy li { padding: 6px 10px; border: 1px solid rgba(255,255,255,.18); border-radius: 20px; background: rgba(255,255,255,.08); font-size: 9px; font-weight: 750; }

.loyalty-platform { position: relative; color: white; background: #150424; overflow: hidden; }
.platform-glow { position: absolute; border-radius: 50%; filter: blur(35px); opacity: .2; }.platform-glow-one { width: 450px; height: 450px; left: -260px; top: 0; background: #ed006e; }.platform-glow-two { width: 550px; height: 550px; right: -330px; bottom: -170px; background: #4434fa; }
.platform-layout { position: relative; z-index: 2; display: grid; grid-template-columns: .75fr 1.25fr; align-items: center; gap: 70px; }
.platform-copy h2 { margin-top: 24px; }.platform-copy h2 em { color: #ee1d79; }
.platform-copy > p:not(.loyalty-eyebrow) { margin: 26px 0 0; color: #ae9bb9; font-size: 16px; }
.platform-features { list-style: none; margin: 36px 0 0; padding: 0; border-top: 1px solid rgba(255,255,255,.11); }
.platform-features li { display: flex; gap: 16px; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.11); }
.platform-features i { color: #ed2a7d; font-size: 9px; font-style: normal; font-weight: 850; }
.platform-features strong, .platform-features span { display: block; }.platform-features strong { font-size: 13px; }.platform-features span { margin-top: 3px; color: #9989a4; font-size: 11px; }
.platform-dashboard { display: flex; min-height: 540px; border: 8px solid #0b0212; border-radius: 24px; color: #28123a; background: #f8f4fa; box-shadow: 0 45px 100px rgba(4,0,8,.5); transform: perspective(1200px) rotateY(-4deg) rotateX(1deg); overflow: hidden; }
.dash-sidebar { width: 62px; padding: 20px 15px; display: flex; align-items: center; flex-direction: column; gap: 31px; background: #1a072b; }
.dash-logo { width: 32px; height: 32px; display: grid; place-items: center; margin-bottom: 15px; border-radius: 9px; color: white; background: linear-gradient(145deg,#ed006e,#5a36f4); font-size: 12px; font-weight: 900; }
.dash-sidebar i { width: 22px; height: 6px; border-radius: 4px; background: rgba(255,255,255,.17); }.dash-sidebar i.active { background: #ed3b84; }
.dash-main { flex: 1; padding: 30px; }
.dash-head { display: flex; justify-content: space-between; align-items: center; }.dash-head small,.dash-head strong { display: block; }.dash-head small { color: #8c7e94; font-size: 8px; font-weight: 850; letter-spacing: .12em; }.dash-head strong { margin-top: 5px; font-size: 20px; }.dash-head > span { padding: 7px 10px; border: 1px solid #ded4e4; border-radius: 8px; font-size: 8px; }
.dash-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 25px 0 14px; }.dash-cards > div { position: relative; padding: 17px; border: 1px solid #e7ddea; border-radius: 13px; background: white; }.dash-cards small,.dash-cards strong { display: block; }.dash-cards small { color: #887b90; font-size: 7px; }.dash-cards strong { margin-top: 6px; font-size: 21px; }.dash-cards span { position: absolute; right: 12px; top: 12px; color: #bf0060; font-size: 7px; font-weight: 800; }
.dash-chart-wrap { padding: 19px; border: 1px solid #e7ddea; border-radius: 13px; background: white; }.dash-chart-head { display: flex; justify-content: space-between; font-size: 9px; }.dash-chart-head small { color: #8b7f91; }
.dash-chart { height: 165px; display: flex; align-items: end; gap: 9px; padding-top: 20px; background: repeating-linear-gradient(to bottom, transparent, transparent 39px, #eee8f1 40px); border-bottom: 1px solid #e9e1ec; }.dash-chart i { flex: 1; height: var(--h); border-radius: 4px 4px 0 0; background: linear-gradient(to top,#6c31d9,#ed006e); }
.dash-campaign { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; padding: 16px 18px; border-radius: 13px; color: white; background: linear-gradient(120deg,#4d126a,#9d075f); }.dash-campaign small,.dash-campaign strong { display: block; }.dash-campaign small { color: #d3afd0; font-size: 6px; letter-spacing: .12em; }.dash-campaign strong { font-size: 13px; }.dash-campaign p { margin: 2px 0 0; color: #d7c4da; font-size: 7px; }.dash-campaign > span { padding: 5px 8px; border-radius: 8px; background: rgba(255,255,255,.12); font-size: 7px; }

.loyalty-final { padding-top: 110px; }
.loyalty-final-card { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: 80px; align-items: end; padding: 75px; border-radius: 30px; color: white; background: radial-gradient(circle at 100% 0,#81105f,transparent 45%), linear-gradient(135deg,#170527,#321052); overflow: hidden; }
.loyalty-final-card::after { content: ""; position: absolute; width: 370px; height: 370px; right: -270px; bottom: -250px; border: 60px solid rgba(255,80,75,.35); border-radius: 50%; }
.loyalty-final h2 { margin-top: 24px; }.loyalty-final h2 em { color: #fb4c85; }
.loyalty-final-card > div { position: relative; z-index: 2; }.loyalty-final-card > div:last-child > p { margin: 0 0 28px; color: #cbbcd2; }.loyalty-button.light { color: #280a3b; background: white; box-shadow: 0 20px 42px rgba(5,0,10,.2); }
.loyalty-footer { padding-top: 65px; }

@media (max-width: 1050px) {
  .loyalty-header .site-nav { gap: 14px; }.loyalty-header .site-nav > a { font-size: 11px; }.loyalty-header .nav-cta { padding-inline: 12px; }
  .loyalty-hero h1 { font-size: 76px; }.hero-reward-stack { width: 400px; margin-right: -25px; transform: scale(.9); transform-origin: center right; }
  .platform-layout { grid-template-columns: 1fr; }.platform-copy { max-width: 650px; }.platform-dashboard { max-width: 850px; }
}

@media (max-width: 820px) {
  .loyalty-header .site-nav { gap: 4px; background: #19072b; }.loyalty-header .site-nav > a { color: #e2d8e7; font-size: 14px; }
  .loyalty-hero { min-height: 1020px; align-items: flex-start; }.loyalty-hero-image { background-position: 63% center; }.loyalty-hero-overlay { background: linear-gradient(90deg,rgba(11,2,20,.97),rgba(18,3,29,.78) 60%,rgba(12,2,22,.32)), linear-gradient(0deg,rgba(12,2,22,.9),transparent 55%); }
  .loyalty-hero-content { padding-top: 180px; align-items: flex-start; }.loyalty-hero h1 { max-width: 620px; font-size: 70px; }.hero-reward-stack { position: absolute; right: 5px; top: 590px; width: 455px; margin: 0; transform: none; }
  .statement-grid { grid-template-columns: 1fr; gap: 28px; }.loyalty-metrics { grid-template-columns: 1fr; }.loyalty-metrics div { min-height: 130px; }.loyalty-metrics p { margin-top: 25px; }
  .loop-steps { grid-template-columns: 1fr 1fr; }.loop-steps li:nth-child(2) { border-right: 0; }.loop-steps li { border-bottom: 1px solid rgba(255,255,255,.12); }
  .use-heading { align-items: start; flex-direction: column; gap: 25px; }.use-heading h2 { text-align: left; }.use-case { min-height: 610px; }.use-case-copy { width: 65%; }.nightlife-use .use-case-copy { width: 58%; }
  .loyalty-final-card { grid-template-columns: 1fr; gap: 40px; padding: 55px; }
}

@media (max-width: 560px) {
  .loyalty-header .brand img { width: 82px; }
  .loyalty-hero { min-height: 1030px; }.loyalty-hero-image { background-position: 72% center; }.loyalty-hero-overlay { background: linear-gradient(180deg,rgba(13,2,23,.95) 0%,rgba(17,3,29,.76) 57%,rgba(13,2,23,.98) 83%); }
  .loyalty-hero-content { padding-top: 145px; }.loyalty-hero h1 { font-size: 55px; }.loyalty-hero-copy > p:not(.loyalty-kicker) { font-size: 15px; }.loyalty-actions { align-items: flex-start; flex-direction: column; gap: 18px; }
  .hero-reward-stack { top: 665px; right: -25px; width: 425px; transform: scale(.83); transform-origin: top right; }.hero-reward-card, .hero-level-card { width: 270px; }.hero-footnote { display: none; }
  .statement-grid h2, .loop-heading h2, .use-heading h2, .platform-copy h2, .loyalty-final h2 { font-size: 43px; }
  .loyalty-metrics { margin-top: 50px; }.loop-steps { grid-template-columns: 1fr; }.loop-steps li { min-height: 265px; border-right: 0; }.loop-steps h3 { margin-top: 38px; }
  .use-case { min-height: 690px; }.use-case img { object-position: 62% center; }.gym-use .use-case-shade,.nightlife-use .use-case-shade { background: linear-gradient(0deg,rgba(12,2,22,.98),rgba(19,3,30,.5) 65%,transparent); }.use-case-copy,.nightlife-use .use-case-copy { width: 100%; padding: 30px; margin: 0; }.use-case-copy h3 { font-size: 38px; }
  .platform-dashboard { min-height: 430px; margin-right: -140px; transform: scale(.8); transform-origin: left center; }.dash-main { padding: 22px; }.dash-cards { gap: 8px; }.dash-cards > div { padding: 10px; }.dash-cards span { display: none; }.dash-chart { height: 120px; }
  .loyalty-final { padding-top: 80px; }.loyalty-final-card { width: 100%; padding: 60px 24px; border-radius: 0; }
}