:root {
  --navy-900: #0b2f5b;
  --navy-800: #123f73;
  --blue-700: #17699a;
  --cyan-500: #2fb5d4;
  --cyan-100: #e8f8fc;
  --cyan-50: #f4f9fc;
  --white: #ffffff;
  --text-900: #17324d;
  --text-700: #3c5877;
  --text-500: #647b91;
  --line: rgba(23, 50, 77, 0.1);
  --shadow-soft: 0 18px 45px rgba(11, 47, 91, 0.08);
  --shadow-card: 0 12px 34px rgba(17, 63, 115, 0.12);
  --radius-xl: 32px;
  --radius-lg: 22px;
  --radius-md: 16px;
  --container: min(1180px, calc(100% - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
main section[id] { scroll-margin-top: 104px; }
body {
  margin: 0;
  font-family: "Inter", sans-serif;
  color: var(--text-900);
  background: #eaf5fb;
  line-height: 1.6;
  overflow-x: hidden;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid rgba(47, 181, 212, .4); outline-offset: 3px; }
.container { width: var(--container); margin: 0 auto; }
.section { padding: 108px 0; }
.center { text-align: center; }
.section-heading { max-width: 820px; margin: 0 auto 46px; }
.eyebrow {
  display: inline-block;
  font-size: .76rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--blue-700);
  margin-bottom: 18px;
}
.eyebrow-blue { color: var(--blue-700); }
.eyebrow-light { color: rgba(255,255,255,.78); }
h1,h2,h3,p,ul { margin-top: 0; }
h1 { font-size: clamp(2.7rem, 4vw, 5rem); line-height: 1.04; letter-spacing: -.05em; margin-bottom: 20px; }
h2 { font-size: clamp(2.1rem, 3vw, 3.1rem); line-height: 1.15; letter-spacing: -.04em; margin-bottom: 18px; }
h3 { font-size: clamp(1.1rem, 1.4vw, 1.5rem); line-height: 1.25; margin-bottom: 12px; }
p { font-size: 1.05rem; color: var(--text-700); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  font-weight: 700;
  border: 1px solid transparent;
  white-space: nowrap;
  transition: .22s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: linear-gradient(135deg, var(--navy-800), var(--blue-700)); color: #fff; box-shadow: 0 12px 24px rgba(23,105,154,.22); }
.btn-secondary { background: rgba(255,255,255,.78); border-color: rgba(23,105,154,.18); color: var(--navy-900); }
.btn-ghost { background: rgba(47,181,212,.08); border-color: rgba(47,181,212,.2); color: var(--navy-900); }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

/* Header: preserve original theme */
.site-header {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(255,255,255,.58);
  backdrop-filter: blur(20px) saturate(155%);
  -webkit-backdrop-filter: blur(20px) saturate(155%);
  border-bottom: 1px solid rgba(255,255,255,.55); box-shadow: 0 10px 34px rgba(11,47,91,.06);
  transition: .25s ease;
}
.site-header.scrolled { background: rgba(255,255,255,.56); box-shadow: 0 14px 32px rgba(11,47,91,.08); border-color: rgba(255,255,255,.5); }
.header-inner { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.brand { display: inline-flex; align-items: center; position: relative; z-index: 2; }
.brand-logo { display: block; width: 86px; height: 72px; object-fit: contain; background: transparent !important; filter: drop-shadow(0 8px 16px rgba(11,47,91,.12)); }
.main-nav { display: flex; align-items: center; gap: 26px; }
.main-nav a { position: relative; color: var(--text-700); font-weight: 600; font-size: .94rem; transition: color .2s ease; }
.main-nav a::after { content: ""; position: absolute; left: 0; bottom: -9px; width: 100%; height: 2px; background: linear-gradient(90deg,var(--cyan-500),var(--blue-700)); transform: scaleX(0); transition: transform .2s ease; }
.main-nav a:hover,.main-nav a.active { color: var(--navy-900); }
.main-nav a:hover::after,.main-nav a.active::after { transform: scaleX(1); }
.header-actions { display: flex; align-items: center; gap: 12px; }
.mobile-nav-actions { display: none; }
.nav-toggle { display: none; width: 48px; height: 48px; border-radius: 12px; border: 1px solid rgba(255,255,255,.42); background: rgba(255,255,255,.55); padding: 10px 12px; flex-direction: column; justify-content: center; gap: 5px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.nav-toggle span { display: block; height: 2px; width: 100%; border-radius: 999px; background: var(--navy-900); }

/* Realistic thin black phone frame based on attached reference */
.real-phone {
  position: relative;
  width: min(100%, 300px);
  padding: 5px;
  border-radius: 48px;
  background: linear-gradient(145deg, #f1f2f5 0%, #8f949c 14%, #e9eaec 25%, #2d3137 36%, #0a0c0f 62%, #b8bcc2 90%, #f6f7f8 100%);
  box-shadow: 0 32px 60px rgba(9,24,43,.24), 0 0 0 1px rgba(0,0,0,.22);
}
.real-phone::before { content: ""; position: absolute; inset: 2px; border-radius: 46px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.55), inset 0 0 0 2px rgba(0,0,0,.25); pointer-events: none; }
.phone-inner { position: relative; background: #050608; border-radius: 44px; padding: 7px; overflow: hidden; }
.phone-screen { position: relative; aspect-ratio: var(--ratio, 640/1370); border-radius: 37px; overflow: hidden; background: #fff; }
.phone-screen img { width: 100%; height: 100%; object-fit: contain; object-position: top center; background: #ffffff; }
.phone-screen.contain-shot { background: #ffffff; }
.phone-screen.contain-shot img { object-fit: contain; object-position: top center; padding-top: 18px; }
.phone-island {
  position: absolute; top: 7px; left: 50%; transform: translateX(-50%); width: 112px; height: 24px; border-radius: 0 0 15px 15px; background: #050608; z-index: 5;
}
.phone-island span { position: absolute; width: 38px; height: 4px; border-radius: 999px; background: #1b1e23; left: 35px; top: 6px; }
.phone-island i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #2876a7, #071018 60%); right: 18px; top: 5px; box-shadow: 0 0 0 1px #20252c; }
.phone-button { position: absolute; z-index: 6; width: 3px; background: linear-gradient(180deg,#777c84,#30343a); border-radius: 999px; }
.button-left-top { left: -2px; top: 88px; height: 32px; }
.button-left-bottom { left: -2px; top: 132px; height: 62px; }
.button-right { right: -2px; top: 130px; height: 76px; }

/* Hero */
.hero { padding-top: 72px; }
.hero-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,600px); gap: 40px; align-items: center; }
.hero-copy p { max-width: 650px; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }
.value-strip { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }
.value-strip span,.ecosystem-pill { padding: 10px 15px; border-radius: 999px; background: rgba(255,255,255,.82); border: 1px solid rgba(23,105,154,.12); color: var(--navy-800); font-weight: 700; box-shadow: 0 8px 24px rgba(11,47,91,.05); }
.app-showcase { display: flex; flex-direction: column; align-items: center; min-height: 650px; }
.app-carousel-stage { width: min(100%,600px); height: 600px; position: relative; perspective: 1500px; }
.app-carousel-slide { position: absolute; left: 50%; top: 50%; opacity: 0; pointer-events: none; transition: transform .8s cubic-bezier(.22,.72,.21,1), opacity .7s ease, filter .7s ease; }
.app-carousel-slide.is-active { z-index: 5; opacity: 1; transform: translate(-50%,-50%) scale(1); pointer-events: auto; }
.app-carousel-slide.is-prev { z-index: 4; opacity: .78; transform: translate(calc(-50% - 210px),-47%) scale(.86) rotateY(10deg); filter: saturate(.88); }
.app-carousel-slide.is-next { z-index: 4; opacity: .78; transform: translate(calc(-50% + 210px),-47%) scale(.86) rotateY(-10deg); filter: saturate(.88); }
.app-carousel-slide.is-far-prev { z-index: 2; opacity: .28; transform: translate(calc(-50% - 355px),-46%) scale(.66); }
.app-carousel-slide.is-far-next { z-index: 2; opacity: .28; transform: translate(calc(-50% + 355px),-46%) scale(.66); }
.carousel-phone { width: 270px; }
.app-carousel-dots { display: flex; gap: 14px; align-items: center; justify-content: center; margin-top: 0; }
.app-carousel-dot { width: 12px; height: 12px; border-radius: 50%; border: 0; padding: 0; background: #91a4b7; transition: .22s ease; }
.app-carousel-dot.active { background: #111820; transform: scale(1.15); box-shadow: 0 0 0 4px rgba(17,24,32,.08); }
.carousel-helper { font-size: .8rem; color: var(--text-500); margin: 12px 0 0; }

/* About */
.about { background: rgba(255,255,255,.5); }
.about-grid { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(260px,.95fr); gap: 54px; align-items: center; }
.about-copy p { line-height: 1.85; }
.ecosystem-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.about-phone { width: 290px; margin: 0 auto; }

/* Features */
.features-section { background: linear-gradient(180deg,#eaf5fb 0%,#f5fbff 100%); }
.feature-experience:not(.engaged) { grid-template-columns: 1fr; }
.feature-experience:not(.engaged) .feature-rail { grid-template-columns: repeat(4,minmax(0,1fr)); max-height: none; overflow: visible; order: 1; }
.feature-experience:not(.engaged) .feature-choice { padding: 18px 18px; }
.feature-experience:not(.engaged) .feature-choice { min-height: 68px; }
.feature-experience:not(.engaged) .feature-phone-zone { order: 2; }
.feature-experience:not(.engaged) .feature-copy-zone { display: none; }
.feature-experience.engaged .feature-rail { animation: railShift .45s ease both; }
.feature-experience.engaged .feature-copy-zone { animation: copyPop .5s .08s ease both; }
@keyframes railShift { from { opacity:.35; transform:translateX(28px); } to { opacity:1; transform:translateX(0); } }
@keyframes copyPop { from { opacity:0; transform:translateX(36px); } to { opacity:1; transform:translateX(0); } }

.feature-experience::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at top right, rgba(47,181,212,.10), transparent 28%), radial-gradient(circle at bottom left, rgba(23,105,154,.08), transparent 30%); pointer-events:none; }
.feature-experience > * { position: relative; z-index: 1; }

.feature-experience {
  display: grid;
  grid-template-columns: 230px minmax(250px,340px) minmax(0,1fr);
  gap: 26px;
  align-items: center;
  min-height: 680px;
  padding: 30px;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.84));
  border: 1px solid rgba(23,50,77,.08);
  box-shadow: 0 24px 60px rgba(11,47,91,.08);
  position: relative;
  overflow: hidden;
}
.feature-rail { display: grid; gap: 9px; align-self: stretch; max-height: 620px; overflow: auto; padding-right: 4px; scrollbar-width: thin; }
.feature-choice {
  display: grid; grid-template-columns: 38px 1fr; gap: 12px; align-items: center; text-align: left; border: 1px solid rgba(23,50,77,.08); background: rgba(255,255,255,.92); border-radius: 18px; min-height: 60px; padding: 11px 14px; color: var(--text-700); transition: .25s ease;
}
.feature-choice span { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--cyan-50); color: var(--blue-700); font-size: .74rem; font-weight: 800; }
.feature-choice strong { font-size: .88rem; line-height: 1.25; }
.feature-choice:hover,.feature-choice.active { transform: translateX(8px); border-color: rgba(47,181,212,.48); color: var(--navy-900); box-shadow: 0 16px 30px rgba(11,47,91,.10); }
.feature-choice.active { background: linear-gradient(135deg, rgba(232,248,252,.98), #ffffff 62%); }
.feature-phone-zone { position: relative; min-height: 610px; display: grid; place-items: center; }
.feature-screen-item { position: absolute; inset: 0; display: grid; place-items: center; opacity: 0; transform: translateX(28px) scale(.97); transition: .45s cubic-bezier(.22,.72,.21,1); pointer-events: none; }
.feature-screen-item.active { opacity: 1; transform: translateX(0) scale(1); pointer-events: auto; }
.feature-phone { width: 275px; }
.feature-copy-zone { position: relative; min-height: 420px; background: rgba(255,255,255,.78); border: 1px solid rgba(23,50,77,.08); border-radius: 24px; padding: 28px; box-shadow: 0 14px 32px rgba(11,47,91,.06); }
.feature-copy { position: absolute; inset: 28px; opacity: 0; transform: translateX(38px); pointer-events: none; transition: opacity .35s ease, transform .45s cubic-bezier(.22,.72,.21,1); }
.feature-copy.active { opacity: 1; transform: translateX(0); pointer-events: auto; }
.feature-kicker { display: inline-flex; padding: 8px 12px; border-radius: 999px; background: var(--cyan-100); color: var(--blue-700); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.feature-copy h3 { font-size: clamp(1.8rem,2.7vw,2.5rem); margin: 16px 0 12px; }
.feature-copy p { line-height: 1.8; }
.feature-copy ul,.solution-pop ul { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 12px; }
.feature-copy li,.solution-pop li { position: relative; padding-left: 28px; color: var(--text-700); }
.feature-copy li::before,.solution-pop li::before { content: "✓"; position: absolute; left: 0; color: var(--cyan-500); font-weight: 900; }

/* Rewards */
.rewards-section {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #0c3b74 0%, #0b2f5b 100%);
  color: #fff;
}
.rewards-section::before { content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:40px 40px; pointer-events:none; }
.rewards-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1fr) minmax(350px,500px); gap: 56px; align-items: center; }
.rewards-copy h2 { color:#fff; font-size: clamp(2.5rem,4vw,4rem); }
.rewards-copy p { color: rgba(255,255,255,.78); line-height: 1.8; max-width: 660px; }
.rewards-proof-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:28px; }
.rewards-proof-grid article { display:grid; grid-template-columns:42px 1fr; gap:12px; align-items:center; padding:15px; border-radius:16px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.rewards-proof-grid strong { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(145deg,#ffdf79,#dca320); color:#6f4a00; box-shadow: inset 0 2px 4px rgba(255,255,255,.5); }
.rewards-proof-grid span { color:rgba(255,255,255,.88); font-size:.9rem; }
.reward-dummy-brands { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.reward-dummy-brands span { padding:9px 13px; border-radius:999px; border:1px solid rgba(255,255,255,.13); background:rgba(255,255,255,.07); color:rgba(255,255,255,.86); font-size:.82rem; font-weight:700; }
.reward-phone-stage {
  min-height: 670px; position:relative; min-height:690px; display:grid; place-items:center; }
.reward-halo {
  opacity:.9; position:absolute; width:430px; height:430px; border-radius:50%; background:radial-gradient(circle,rgba(255,204,78,.22),rgba(47,181,212,.06) 48%,transparent 72%); filter:blur(5px); }
.rewards-phone {
  width: 310px; width:300px; z-index:2; box-shadow:0 35px 70px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.08); }
.reward-glass-card { position:absolute; width: 230px; padding: 18px 18px 16px; border-radius: 24px; background: rgba(255,255,255,.28); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,.34); box-shadow: 0 16px 34px rgba(0,0,0,.18); z-index: 3; }
.reward-glass-card span,.reward-glass-card small { display:block; color:rgba(255,255,255,.90); }
.reward-glass-card strong { display:block; color:#fff; margin:4px 0; font-size:.95rem; }
.reward-glass-top { right:0; top:90px; }
.reward-glass-bottom { left:0; bottom:90px; }
.coin-rain { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.gold-coin { position:absolute; left:var(--x); top:-80px; width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:radial-gradient(circle at 32% 28%,#fff3b3 0%,#ffd76b 18%,#e6b335 53%,#b97707 78%,#754500 100%); border:2px solid #f8d96f; box-shadow:inset 0 0 0 3px rgba(118,73,3,.26),inset 0 0 0 6px rgba(255,244,179,.16),0 12px 22px rgba(0,0,0,.25); animation:coinFall var(--duration) linear infinite; animation-delay:var(--delay); opacity:.8; }
.gold-coin::before { content:""; position:absolute; inset:7px; border-radius:50%; border:1px solid rgba(116,69,0,.35); box-shadow:inset 0 1px 2px rgba(255,255,255,.5); }
.gold-coin b { position:relative; font-family:Georgia,serif; font-size:1.1rem; color:#7b4d00; text-shadow:0 1px 0 rgba(255,255,255,.45); }
.gold-coin.small { width:38px; height:38px; }
.gold-coin.small b { font-size:.85rem; }
@keyframes coinFall { 0% { transform:translateY(-100px) rotateY(0) rotateZ(0); } 100% { transform:translateY(1200px) rotateY(540deg) rotateZ(180deg); } }

/* Solutions interactive pie */
.solutions-section { background: linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%); }
.solutions-pie-layout { display:grid; grid-template-columns:minmax(320px,.8fr) minmax(0,1.2fr); gap:46px; align-items:center; }
.pie-panel { display:grid; place-items:center; }
.solution-pie { width:min(480px,100%); overflow:visible; filter:drop-shadow(0 24px 30px rgba(11,47,91,.14)); }
.pie-slice { cursor:pointer; stroke:#fff; stroke-width:1.8; transition:transform .3s ease,filter .3s ease,opacity .3s ease; transform-box:fill-box; transform-origin:center; }
.slice-residents { fill:#2fb5d4; }
.slice-management { fill:#17699a; }
.slice-merchants { fill:#0b2f5b; }
.pie-slice:hover,.pie-slice.active { transform:scale(1.055); filter:brightness(1.07); }
.pie-center { fill:#fff; stroke:rgba(11,47,91,.1); stroke-width:1.2; }
.pie-center-title { fill:#0b2f5b; font-size:4px; font-weight:800; }
.pie-center-sub { fill:#647b91; font-size:3.2px; }
.pie-legend { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:18px; }
.solution-legend { display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:999px; border:1px solid var(--line); background:#fff; color:var(--text-700); font-weight:700; }
.solution-legend.active { box-shadow:var(--shadow-card); color:var(--navy-900); }
.dot { width:10px; height:10px; border-radius:50%; }
.residents-dot { background:#2fb5d4; }.management-dot{background:#17699a}.merchants-dot{background:#0b2f5b}
.solution-pop-zone { position:relative; min-height:600px; }
.solution-pop { position:absolute; inset:0; opacity:0; transform:translateX(36px) scale(.98); pointer-events:none; transition:opacity .35s ease,transform .45s cubic-bezier(.22,.72,.21,1); display:grid; grid-template-rows:260px auto; border-radius:28px; overflow:hidden; background:#fff; border:1px solid rgba(23,50,77,.08); box-shadow:var(--shadow-card); }
.solution-pop.active { opacity:1; transform:translateX(0) scale(1); pointer-events:auto; }
.solution-pop img { width:100%; height:100%; object-fit:cover; }
.solution-pop>div { padding:26px; }
.solution-pop>div>span { font-size:.76rem; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:var(--blue-700); }
.solution-pop h3 { font-size:1.8rem; margin:10px 0 8px; }

/* How it works */
.how-section { background:#fff; }
.journey-timeline { position:relative; max-width:960px; margin:0 auto; padding:10px 0 10px; }
.journey-line { position:absolute; left:50%; top:0; bottom:0; width:3px; transform:translateX(-50%); background:linear-gradient(180deg,var(--cyan-500),var(--blue-700),var(--navy-900)); border-radius:999px; }
.journey-row { display:grid; grid-template-columns:1fr 64px 1fr; gap:20px; align-items:center; margin:22px 0; min-height:120px; }
.journey-row.left .journey-card { grid-column:1; }.journey-row.left .journey-node{grid-column:2}.journey-row.left::after{content:"";grid-column:3}
.journey-row.right::before{content:"";grid-column:1}.journey-row.right .journey-node{grid-column:2}.journey-row.right .journey-card{grid-column:3}
.journey-card { background:linear-gradient(180deg,#fff,#f8fbfe); border:1px solid rgba(23,50,77,.08); border-radius:20px; padding:20px 22px; box-shadow:0 12px 28px rgba(11,47,91,.07); }
.journey-card small { color:var(--cyan-500); font-weight:800; letter-spacing:.12em; }
.journey-card h3 { margin:7px 0 7px; }
.journey-card p { margin:0; font-size:.95rem; }
.journey-node { width:54px; height:54px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(145deg,var(--cyan-500),var(--blue-700)); color:#fff; font-weight:900; border:5px solid #fff; box-shadow:0 8px 20px rgba(23,105,154,.25); z-index:2; justify-self:center; }
.reward-step .journey-node { background:linear-gradient(145deg,#f8d46b,#c78c10); color:#6f4c00; }.final-step .journey-node{background:linear-gradient(145deg,var(--blue-700),var(--navy-900))}
.reward-medals { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:58px; }
.medal-card { display:grid; grid-template-columns:130px 1fr; gap:18px; align-items:center; padding:24px; border-radius:24px; background:linear-gradient(180deg,#fff,#f8fbfe); border:1px solid rgba(23,50,77,.08); box-shadow:var(--shadow-soft); }
.medal-card>div:last-child>span { display:block; font-size:.76rem; letter-spacing:.14em; font-weight:900; color:var(--text-500); }
.medal-card h3 { margin:5px 0 6px; }.medal-card p{font-size:.92rem;margin-bottom:12px}
.medal { position:relative; width:104px; height:104px; border-radius:50%; display:grid; place-items:center; box-shadow:0 14px 26px rgba(11,47,91,.16),inset 0 2px 4px rgba(255,255,255,.7); }
.medal::before { content:""; position:absolute; inset:10px; border-radius:50%; border:2px solid rgba(255,255,255,.55); box-shadow:inset 0 0 0 2px rgba(0,0,0,.08); }
.medal span { position:relative; z-index:2; font-size:2.4rem; text-shadow:0 2px 2px rgba(0,0,0,.15); }
.medal i { position:absolute; bottom:-34px; width:30px; height:48px; clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%); z-index:-1; }
.ribbon-left{left:20px;transform:rotate(7deg)}.ribbon-right{right:20px;transform:rotate(-7deg)}
.silver-medal{background:radial-gradient(circle at 35% 28%,#fff,#d9dee5 45%,#9ca4af 78%,#69717c)}.silver-medal i{background:#aab2bd}.silver-medal span{color:#6f7884}
.gold-medal{background:radial-gradient(circle at 35% 28%,#fff5b5,#f2cc55 45%,#d99d13 78%,#986300)}.gold-medal i{background:#d5a21a}.gold-medal span{color:#9e6c04}
.platinum-medal{background:radial-gradient(circle at 35% 28%,#f1f8ff,#a7bdd5 46%,#627d9f 80%,#344b69)}.platinum-medal i{background:#5b7390}.platinum-medal span{color:#344b69}
.merchant-mini { display:flex; flex-wrap:wrap; gap:7px; }.merchant-mini b{font-size:.72rem;padding:6px 8px;border-radius:999px;background:var(--cyan-50);color:var(--blue-700)}

/* Reviews */
.reviews-section { background:linear-gradient(180deg,#f4f9fc 0%,#f9fcff 100%); }
.reviews-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr); gap:28px; align-items:start; }
.review-feed { display:grid; gap:20px; }
.review-overview { display:flex; align-items:center; gap:24px; padding:24px; border-radius:22px; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-soft); }
.review-overview>div:first-child { min-width:120px; text-align:center; border-right:1px solid var(--line); padding-right:22px; }
.review-overview strong { display:block; font-size:3.4rem; line-height:1; color:var(--navy-900); }.review-overview span{color:var(--text-500);font-size:.82rem}.review-overview p{margin:6px 0 0;font-size:.92rem}
.review-stars { color:#f0b230; letter-spacing:.12em; font-size:1.05rem; }
.review-list { display:grid; gap:14px; }
.review-card { padding:22px; border-radius:20px; background:#fff; border:1px solid var(--line); box-shadow:0 10px 24px rgba(11,47,91,.06); }
.review-card-top { display:grid; grid-template-columns:48px 1fr auto; gap:12px; align-items:center; margin-bottom:14px; }.review-card h3{margin:0;font-size:1rem}.review-card-top span{color:var(--text-500);font-size:.86rem}.review-card p{margin:0;line-height:1.75;font-size:.96rem}
.review-avatar { width:48px; height:48px; border-radius:50%; display:grid; place-items:center; color:#fff; font-weight:800; }.blue-avatar{background:linear-gradient(145deg,#2fb5d4,#17699a)}.cyan-avatar{background:linear-gradient(145deg,#3ac1d8,#123f73)}.navy-avatar{background:linear-gradient(145deg,#17699a,#0b2f5b)}
.write-review-card { position:sticky; top:110px; padding:26px; border-radius:24px; background:#fff; border:1px solid var(--line); box-shadow:var(--shadow-card); }
.write-review-label { display:inline-flex; padding:8px 12px; border-radius:999px; background:var(--cyan-100); color:var(--blue-700); font-size:.72rem; letter-spacing:.12em; font-weight:900; }.write-review-card h3{margin:14px 0 18px;font-size:1.7rem}
.write-review-card>label,.review-field label{display:block;font-size:.85rem;font-weight:800;margin-bottom:8px;color:var(--text-700)}
.rating-input { display:flex; gap:7px; margin-bottom:18px; }.rating-input button{width:42px;height:42px;border-radius:12px;border:1px solid rgba(23,50,77,.1);background:#f8fbfe;color:#c8d0d9;font-size:1.35rem;transition:.18s ease}.rating-input button.active,.rating-input button:hover{background:#fff7df;color:#f0b230;border-color:rgba(240,178,48,.35);transform:translateY(-2px)}
.review-field{margin-bottom:14px}.review-field input,.review-field textarea,.review-field select{width:100%;padding:13px 14px;border-radius:14px;border:1px solid rgba(23,50,77,.12);background:#fbfdff;color:var(--text-900)}.review-field input:focus,.review-field textarea:focus,.review-field select:focus{outline:none;border-color:rgba(47,181,212,.55);box-shadow:0 0 0 4px rgba(47,181,212,.11)}
.review-submit{width:100%}.review-form-status{min-height:22px;margin:10px 0 0;font-size:.86rem;color:var(--blue-700)}

/* CTA - no green */
.cta-section { padding-top:80px; }
.cta-box { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:38px 42px; border-radius:30px; background:linear-gradient(110deg,#0b2f5b 0%,#17699a 55%,#2fb5d4 100%); box-shadow:0 24px 42px rgba(11,47,91,.16); color:#fff; }
.cta-box h2{color:#fff;margin-bottom:10px}.cta-box p{color:rgba(255,255,255,.82);margin:0;max-width:720px}.cta-actions{display:flex;gap:12px;flex-wrap:wrap}.cta-primary{background:#fff;color:var(--navy-900)}.cta-secondary{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff}

/* Contact */
.contact-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:32px; align-items:start; }.contact-copy p{line-height:1.8}.contact-list{display:grid;gap:12px;margin-top:24px}.contact-list div{padding:17px 18px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px rgba(11,47,91,.05)}.contact-list span{display:block;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-500);margin-bottom:6px}
.contact-form-wrap{padding:26px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.field label{display:block;margin-bottom:7px;font-weight:700;font-size:.86rem}.field input,.field textarea{width:100%;padding:13px 14px;border-radius:13px;border:1px solid rgba(23,50,77,.12);background:#fbfdff}.field input:focus,.field textarea:focus{outline:none;border-color:rgba(47,181,212,.55);box-shadow:0 0 0 4px rgba(47,181,212,.11)}.field.invalid input,.field.invalid textarea{border-color:#d85b5b}.full-width{grid-column:1/-1}.form-submit{margin-top:18px}.form-status{min-height:22px;margin:10px 0 0}.form-status.error{color:#c14343}.form-status.success{color:#187b8f}

/* Footer - systematic */
.site-footer { background:linear-gradient(180deg,#0b2f5b 0%,#07182e 100%); color:#e6edf7; }
.footer-grid { display:grid; grid-template-columns:1.08fr .68fr 1fr 1.15fr; gap:34px; padding:58px 0 38px; align-items:start; }
.footer-logo { width:250px; max-height:220px; object-fit:contain; object-position:left top; background:transparent !important; filter:none; display:block; }
.footer-brand p{color:rgba(230,237,247,.84);max-width:320px;line-height:1.75;font-size:1rem;margin-top:18px}
.footer-column h3,.footer-map h3{margin:0 0 16px;color:#fff}
.footer-column ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.footer-column a,.footer-column li{color:rgba(230,237,247,.84);font-size:.95rem}
.footer-column a:hover{color:#fff}
.footer-contact li{line-height:1.55}
.footer-map iframe{width:100%;height:225px;border:0;border-radius:20px;box-shadow:0 14px 30px rgba(0,0,0,.2)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08)}
.footer-bottom .container{padding:18px 0 22px}
.footer-bottom p{margin:0;text-align:center;color:rgba(230,237,247,.64);font-size:.92rem}
.back-to-top { position:fixed; right:22px; bottom:22px; width:50px; height:50px; border:0; border-radius:50%; background:linear-gradient(145deg,var(--blue-700),var(--navy-900)); color:#fff; font-size:1.15rem; box-shadow:0 14px 28px rgba(11,47,91,.24); opacity:0; pointer-events:none; transition:.2s ease; z-index:1000 }.back-to-top.visible{opacity:1;pointer-events:auto}

@media (max-width:1120px){
  .main-nav{position:fixed;top:84px;right:20px;width:min(360px,calc(100% - 40px));background:rgba(255,255,255,.97);border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:var(--shadow-card);display:grid;gap:12px;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.2s ease}.main-nav.open{opacity:1;visibility:visible;transform:translateY(0)}.main-nav a::after{display:none}.mobile-nav-actions{display:grid;gap:10px}.header-actions>.btn{display:none}.nav-toggle{display:flex}
  .hero-grid,.about-grid,.rewards-grid,.solutions-pie-layout,.reviews-layout,.contact-grid{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-copy p{margin-left:auto;margin-right:auto}.hero-actions,.value-strip{justify-content:center}.app-showcase{margin-top:10px}.about-copy{text-align:center}.ecosystem-row{justify-content:center}
  .feature-experience{grid-template-columns:210px minmax(240px,310px) minmax(0,1fr);gap:18px;padding:22px}.feature-phone{width:250px}.feature-choice strong{font-size:.8rem}
  .reward-phone-stage{min-height:640px}.solution-pop-zone{min-height:620px}.write-review-card{position:static}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .feature-experience{grid-template-columns:1fr;min-height:auto}.feature-rail{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible}.feature-choice{transform:none!important}.feature-phone-zone{min-height:580px}.feature-copy-zone{min-height:360px}.feature-copy{text-align:center}.feature-copy ul{text-align:left;max-width:560px;margin-left:auto;margin-right:auto}
  .reward-medals{grid-template-columns:1fr}.medal-card{grid-template-columns:120px 1fr}.journey-timeline{padding-left:18px}.journey-line{left:28px;transform:none}.journey-row{grid-template-columns:58px 1fr!important;gap:14px;margin:16px 0}.journey-row::before,.journey-row::after{display:none}.journey-row .journey-node{grid-column:1!important;grid-row:1!important}.journey-row .journey-card{grid-column:2!important;grid-row:1!important}.solution-pop{grid-template-rows:230px auto}.cta-box{flex-direction:column;align-items:flex-start}.form-grid{grid-template-columns:1fr}.full-width{grid-column:auto}
}
@media (max-width:680px){
  :root{--container:min(1180px,calc(100% - 24px))}.section{padding:82px 0}.header-inner{min-height:76px}.brand-logo{width:72px;height:62px}.main-nav{top:76px}.hero{padding-top:48px}.app-showcase{min-height:500px}.app-carousel-stage{height:470px}.carousel-phone{width:220px}.app-carousel-slide.is-prev{transform:translate(calc(-50% - 120px),-47%) scale(.69) rotateY(8deg);opacity:.55}.app-carousel-slide.is-next{transform:translate(calc(-50% + 120px),-47%) scale(.69) rotateY(-8deg);opacity:.55}.app-carousel-slide.is-far-prev,.app-carousel-slide.is-far-next{opacity:0}.real-phone{border-radius:40px}.phone-inner{border-radius:36px}.phone-screen{border-radius:31px}.phone-island{width:90px;height:20px}.phone-island span{left:28px;width:30px}.phone-island i{right:14px}.feature-rail{grid-template-columns:1fr}.feature-phone-zone{min-height:520px}.feature-copy-zone{min-height:430px}.rewards-proof-grid{grid-template-columns:1fr}.reward-phone-stage{min-height:600px}.reward-glass-card{width:190px}.reward-glass-top{right:-10px;top:52px}.reward-glass-bottom{left:-14px;bottom:42px}.solution-pop-zone{min-height:690px}.solution-pop{grid-template-rows:210px auto}.solution-pop>div{padding:22px}.journey-card{padding:17px}.review-overview{flex-direction:column;align-items:flex-start}.review-overview>div:first-child{border-right:0;border-bottom:1px solid var(--line);padding:0 0 14px;width:100%;text-align:left}.review-card-top{grid-template-columns:44px 1fr}.review-card-top .review-stars{grid-column:1/-1}.footer-grid{grid-template-columns:1fr}.footer-logo{width:190px}.flying-logo{width:min(280px,74vw)}
}

@media (max-width:900px){ .feature-experience:not(.engaged) .feature-rail{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:680px){ .feature-experience:not(.engaged) .feature-rail{grid-template-columns:1fr;} }


/* ===== Boss feedback update: rewards, ecosystem, reviews, WhatsApp ===== */
/* Rewards: keep both glass cards to the right of the phone and improve clarity. */
.reward-phone-stage { overflow: visible; padding-right: 82px; }
.reward-glass-card {
  width: 220px;
  padding: 18px 20px;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.72);
  box-shadow: 0 18px 40px rgba(0,0,0,.20);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.reward-glass-card span,
.reward-glass-card small { color: #5d7187; }
.reward-glass-card strong { color: #0b2f5b; font-size: 1rem; }
.reward-glass-top { right: -12px; top: 82px; }
.reward-glass-bottom { left: auto; right: -26px; bottom: 108px; }

/* Ecosystem: automatic rotating card deck, intentionally different from the phone carousel. */
.ecosystem-section { background: linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%); overflow: hidden; }
.ecosystem-card-deck {
  position: relative;
  min-height: 690px;
  max-width: 1120px;
  margin: 0 auto;
  perspective: 1800px;
}
.ecosystem-rotate-card {
  position: absolute;
  top: 24px;
  left: 50%;
  width: min(560px, 72vw);
  min-height: 610px;
  border-radius: 30px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(23,50,77,.08);
  box-shadow: 0 28px 60px rgba(11,47,91,.12);
  transition: transform .75s cubic-bezier(.2,.76,.22,1), opacity .55s ease, filter .55s ease;
  transform-origin: center center;
  cursor: pointer;
}
.ecosystem-rotate-card.is-active {
  z-index: 5;
  opacity: 1;
  transform: translateX(-50%) translateZ(80px) rotateY(0deg) scale(1);
  filter: saturate(1);
}
.ecosystem-rotate-card.is-prev {
  z-index: 3;
  opacity: .78;
  transform: translateX(calc(-50% - 320px)) translateY(44px) rotateY(18deg) scale(.86);
  filter: saturate(.84);
}
.ecosystem-rotate-card.is-next {
  z-index: 3;
  opacity: .78;
  transform: translateX(calc(-50% + 320px)) translateY(44px) rotateY(-18deg) scale(.86);
  filter: saturate(.84);
}
.ecosystem-card-image { height: 260px; overflow: hidden; }
.ecosystem-card-image img { width: 100%; height: 100%; object-fit: cover; }
.ecosystem-card-body { padding: 28px 30px 30px; }
.ecosystem-card-body > span {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--blue-700);
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.ecosystem-card-body h3 { margin: 0 0 18px; font-size: 1.85rem; }
.ecosystem-card-body ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.ecosystem-card-body li { position: relative; padding-left: 28px; color: var(--text-700); line-height: 1.6; }
.ecosystem-card-body li::before { content: "✓"; position: absolute; left: 0; color: var(--cyan-500); font-weight: 900; }
.ecosystem-card-controls { display: flex; justify-content: center; gap: 10px; margin-top: 8px; }
.ecosystem-dot { width: 11px; height: 11px; border: 0; border-radius: 50%; background: #c7d4e2; padding: 0; }
.ecosystem-dot.active { background: var(--navy-900); transform: scale(1.18); }

/* Reviews: moving, pausable, corporate cards. */
.reviews-section { background: linear-gradient(180deg,#f4f9fc 0%,#f9fcff 100%); overflow: hidden; }
.review-carousel { max-width: 1180px; margin: 0 auto; outline: none; }
.review-carousel-viewport { overflow: hidden; padding: 12px 4px 28px; }
.review-carousel-track { display: flex; gap: 20px; transition: transform .65s cubic-bezier(.2,.76,.22,1); will-change: transform; }
.review-slide {
  flex: 0 0 calc((100% - 40px) / 3);
  min-height: 330px;
  padding: 30px 28px 26px;
  border-radius: 26px;
  background: linear-gradient(180deg,#ffffff,#f8fbfe);
  border: 1px solid rgba(23,50,77,.09);
  box-shadow: 0 16px 34px rgba(11,47,91,.08);
  position: relative;
}
.review-quote { position: absolute; right: 24px; top: 14px; font-family: Georgia, serif; font-size: 4.8rem; line-height: 1; color: rgba(23,105,154,.10); }
.review-slide .review-stars { margin-bottom: 20px; }
.review-slide > p { margin: 0; min-height: 150px; color: var(--text-700); line-height: 1.78; font-size: .98rem; }
.review-person { display: flex; align-items: center; gap: 13px; margin-top: 20px; }
.review-person h3 { margin: 0 0 4px; font-size: 1rem; }
.review-person span { color: var(--text-500); font-size: .84rem; }
.review-carousel-controls { display: flex; justify-content: center; gap: 9px; margin-top: 4px; }
.review-dot { width: 10px; height: 10px; border: 0; border-radius: 50%; padding: 0; background: #cbd6e2; }
.review-dot.active { background: var(--navy-900); transform: scale(1.15); }

/* Floating WhatsApp button stays visible during scroll. */
.whatsapp-float {
  position: fixed;
  right: 24px;
  bottom: 86px;
  width: 62px;
  height: 62px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  z-index: 1100;
  filter: drop-shadow(0 14px 24px rgba(15,92,56,.22));
  transition: transform .2s ease;
}
.whatsapp-float:hover { transform: translateY(-3px) scale(1.03); }
.whatsapp-float img { width: 62px; height: 62px; object-fit: contain; }

@media (max-width: 1120px) {
  .ecosystem-rotate-card.is-prev { transform: translateX(calc(-50% - 225px)) translateY(44px) rotateY(15deg) scale(.82); }
  .ecosystem-rotate-card.is-next { transform: translateX(calc(-50% + 225px)) translateY(44px) rotateY(-15deg) scale(.82); }
  .review-slide { flex-basis: calc((100% - 20px) / 2); }
}
@media (max-width: 760px) {
  .reward-phone-stage { padding-right: 0; min-height: 720px; }
  .reward-glass-card { width: 185px; }
  .reward-glass-top { right: 0; top: 64px; }
  .reward-glass-bottom { right: 0; bottom: 74px; }
  .ecosystem-card-deck { min-height: 630px; }
  .ecosystem-rotate-card { width: min(520px, 88vw); min-height: 560px; }
  .ecosystem-rotate-card.is-prev { transform: translateX(calc(-50% - 120px)) translateY(45px) rotateY(12deg) scale(.76); opacity: .42; }
  .ecosystem-rotate-card.is-next { transform: translateX(calc(-50% + 120px)) translateY(45px) rotateY(-12deg) scale(.76); opacity: .42; }
  .ecosystem-card-image { height: 220px; }
  .ecosystem-card-body { padding: 24px; }
  .review-slide { flex-basis: 100%; min-height: 310px; }
  .review-slide > p { min-height: 130px; }
  .whatsapp-float { right: 16px; bottom: 80px; width: 56px; height: 56px; }
  .whatsapp-float img { width: 56px; height: 56px; }
}


/* Latest boss feedback: same top/footer logo appearance, larger WhatsApp contact pill. */
.footer-logo-panel {
  width: 250px;
  max-width: 100%;
  padding: 10px 12px;
  border-radius: 22px;
  background: #eaf5fb;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer-logo-panel .footer-logo {
  width: 100%;
  max-height: 210px;
  object-fit: contain;
  background: transparent !important;
  filter: none !important;
}

.whatsapp-float {
  right: 24px;
  bottom: 84px;
  width: auto;
  min-width: 178px;
  height: 68px;
  padding: 6px 18px 6px 8px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  background: #ffffff;
  box-shadow: 0 16px 34px rgba(17, 89, 55, .20);
  filter: none;
  border: 1px solid rgba(23, 152, 86, .12);
}
.whatsapp-float img { width: 56px; height: 56px; flex: 0 0 56px; object-fit: contain; }
.whatsapp-float span { display: grid; line-height: 1.15; text-align: left; }
.whatsapp-float strong { color: #17324d; font-size: .92rem; font-weight: 800; }
.whatsapp-float small { color: #25a765; font-size: .76rem; font-weight: 700; margin-top: 4px; }
.whatsapp-float:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(17, 89, 55, .25); }

@media (max-width: 760px) {
  .footer-logo-panel { width: 210px; }
  .whatsapp-float { right: 14px; bottom: 76px; min-width: 164px; height: 64px; padding-right: 15px; }
  .whatsapp-float img { width: 52px; height: 52px; flex-basis: 52px; }
}


/* updated about section chips */
.ecosystem-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:28px; }
.ecosystem-pill { position:relative; display:flex; align-items:center; justify-content:center; min-height:86px; padding:16px 18px 16px 62px; border-radius:22px; background:linear-gradient(180deg,#ffffff 0%,#f6fbff 100%); border:1px solid rgba(23,105,154,.14); box-shadow:0 16px 34px rgba(11,47,91,.06); font-size:.98rem; }
.ecosystem-pill::before { content:""; position:absolute; left:16px; width:34px; height:34px; border-radius:12px; background:linear-gradient(135deg,var(--cyan-500),var(--blue-600)); box-shadow:0 10px 22px rgba(23,105,154,.22); }
.ecosystem-pill:nth-child(1)::after { content:"🏠"; }
.ecosystem-pill:nth-child(2)::after { content:"📋"; }
.ecosystem-pill:nth-child(3)::after { content:"🛡"; }
.ecosystem-pill::after { position:absolute; left:24px; top:50%; transform:translateY(-52%); font-size:1rem; }

/* reward section clarity */
.reward-phone-stage{overflow:visible;}
.reward-glass-card { width: 238px; padding: 18px 20px; background: rgba(255,255,255,.94); border: 1px solid rgba(255,255,255,.88); box-shadow: 0 18px 42px rgba(1,16,42,.24); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-radius:24px; }
.reward-glass-card span, .reward-glass-card small { color: #607893; }
.reward-glass-card strong { color: #0b2f5b; font-size: 1.02rem; line-height:1.35; display:block; margin:6px 0; }
.reward-glass-top { right: -36px; top: 88px; }
.reward-glass-bottom { left: auto; right: -52px; bottom: 116px; }
.reward-glass-card small{display:block;line-height:1.45;}

/* ecosystem card deck refinement */
.ecosystem-section { background: linear-gradient(180deg,#f6fbff 0%,#edf6fd 100%); overflow: hidden; }
.ecosystem-card-deck { min-height: 690px; max-width: 1120px; }
.ecosystem-rotate-card { width: min(540px, 72vw); min-height: 610px; background: linear-gradient(180deg,#ffffff 0%,#f7fbff 100%); }
.ecosystem-rotate-card.is-prev { opacity: .80; transform: translateX(calc(-50% - 300px)) translateY(28px) rotateY(14deg) scale(.87); filter: saturate(.92); }
.ecosystem-rotate-card.is-next { opacity: .80; transform: translateX(calc(-50% + 300px)) translateY(28px) rotateY(-14deg) scale(.87); filter: saturate(.92); }
.ecosystem-card-body { background: linear-gradient(180deg,rgba(247,251,255,.98) 0%,rgba(241,248,255,.98) 100%); }
.ecosystem-card-body > span { color: var(--blue-700); }
.ecosystem-card-body h3 { color: var(--navy-900); }
.ecosystem-card-controls { display: flex; justify-content: center; gap: 10px; margin-top: 16px; }
.ecosystem-card-controls + .section-helper, .review-carousel + .section-helper { text-align:center; margin-top:10px; }

/* review section polish */
.review-slide { background: linear-gradient(180deg,#ffffff 0%,#f7fbff 100%); }
.review-quote { color: rgba(23,105,154,.12); }

/* helper text */
.section-helper { color: var(--text-500); }

/* responsive updates */
@media (max-width: 900px){
  .ecosystem-row{grid-template-columns:1fr;}
  .ecosystem-pill{justify-content:flex-start;}
  .reward-glass-card{width:200px;padding:16px 18px;}
  .reward-glass-top{right:-10px;top:66px;}
  .reward-glass-bottom{right:-16px;bottom:86px;}
}
@media (max-width: 1120px){
  .ecosystem-rotate-card.is-prev { transform: translateX(calc(-50% - 115px)) translateY(30px) rotateY(12deg) scale(.8); }
  .ecosystem-rotate-card.is-next { transform: translateX(calc(-50% + 115px)) translateY(30px) rotateY(-12deg) scale(.8); }
}

/* === August 2026 refinement: about section + rewards clarity + custom how it works === */
.about-connect-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin-top:28px; }
.about-connect-card { display:flex; gap:14px; align-items:flex-start; padding:18px 18px 18px 16px; border-radius:22px; background:linear-gradient(180deg,#ffffff 0%,#f5fbff 100%); border:1px solid rgba(23,50,77,.08); box-shadow:0 16px 30px rgba(11,47,91,.07); }
.about-connect-icon { flex:0 0 44px; width:44px; height:44px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,var(--cyan-500),var(--blue-600)); color:#fff; font-size:1.15rem; box-shadow:0 12px 22px rgba(23,105,154,.22); }
.about-connect-card strong { display:block; margin-bottom:6px; font-size:1rem; color:var(--navy-900); }
.about-connect-card p { margin:0; font-size:.94rem; line-height:1.58; color:var(--text-600); }

.reward-phone-stage { min-height: 680px; }
.reward-glass-card {
  width: 242px;
  padding: 18px 20px;
  background: linear-gradient(180deg,rgba(255,255,255,.95) 0%, rgba(245,250,255,.93) 100%);
  border: 1px solid rgba(255,255,255,.92);
  box-shadow: 0 18px 42px rgba(1,16,42,.24);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}
.reward-glass-top { right: -74px; top: 94px; }
.reward-glass-bottom { left: auto; right: -82px; bottom: 150px; }
.reward-glass-card span { font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing:.04em; }
.reward-glass-card small { display:block; line-height:1.45; font-size:.85rem; }
.reward-glass-card strong { line-height:1.35; font-size:1.08rem; display:block; margin:8px 0; }

.ecosystem-rotate-card {
  display:grid;
  grid-template-rows:260px auto;
  background: linear-gradient(180deg,#ffffff 0%,#f2f8ff 100%);
}
.ecosystem-card-image { height:auto; aspect-ratio: 16 / 9; }
.ecosystem-card-body { background:linear-gradient(180deg,rgba(250,252,255,.94) 0%,rgba(242,248,255,.98) 100%); }
.ecosystem-rotate-card.is-prev,
.ecosystem-rotate-card.is-next { transform-origin:center center; }
.ecosystem-rotate-card.is-prev { transform: translateX(calc(-50% - 290px)) translateY(32px) rotateY(14deg) scale(.86); }
.ecosystem-rotate-card.is-next { transform: translateX(calc(-50% + 290px)) translateY(32px) rotateY(-14deg) scale(.86); }

.how-showcase { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); gap:28px; align-items:start; }
.how-flow-panel, .tiers-panel {
  background: linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  border:1px solid rgba(23,50,77,.08);
  border-radius:30px;
  box-shadow:0 22px 48px rgba(11,47,91,.08);
}
.how-flow-panel { padding:28px 26px 28px; }
.tiers-panel { padding:26px 24px 24px; position:sticky; top:96px; }
.flow-mini-title { display:inline-block; font-size:.74rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--blue-700); }
.how-flow-header h3, .tiers-panel-header h3 { margin:8px 0 0; font-size:1.7rem; color:var(--navy-900); }
.how-flow-list { display:grid; gap:10px; margin-top:22px; }
.how-step-card { display:grid; grid-template-columns:56px 56px minmax(0,1fr); gap:16px; align-items:center; padding:18px 18px 18px 16px; border-radius:24px; border:1px solid rgba(23,50,77,.08); box-shadow:0 10px 24px rgba(11,47,91,.05); }
.how-step-card.step-blue { background:linear-gradient(180deg,#ffffff 0%,#f6fbff 100%); }
.how-step-card.step-green { background:linear-gradient(180deg,#ffffff 0%,#f7fcf5 100%); }
.how-step-card.final-step-card { border-color: rgba(45,153,74,.18); box-shadow:0 14px 28px rgba(39,123,63,.09); }
.how-step-badge { width:56px; height:56px; border-radius:18px; background:linear-gradient(135deg,#0a3f87,#1459d6); color:#fff; display:grid; place-items:center; font-weight:900; font-size:1.15rem; }
.how-step-icon { width:56px; height:56px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg,#0c55c7,#0a2f90); color:#fff; font-size:1.45rem; box-shadow:0 10px 22px rgba(10,63,135,.20); }
.step-green .how-step-icon { background:linear-gradient(135deg,#2baf27,#148c29); box-shadow:0 10px 22px rgba(34,141,45,.18); }
.how-step-copy h4 { margin:0 0 6px; font-size:1.05rem; color:var(--navy-900); line-height:1.35; }
.how-step-copy p { margin:0; font-size:.92rem; line-height:1.58; color:var(--text-600); }
.how-step-arrow { text-align:center; font-size:1.8rem; color:var(--blue-700); font-weight:900; line-height:1; padding:2px 0; }
.tiers-panel-header { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.tiers-icon { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,#0c55c7,#0a2f90); color:#fff; font-weight:900; box-shadow:0 10px 22px rgba(10,63,135,.18); }
.tier-showcase { display:grid; grid-template-columns:112px minmax(0,1fr); gap:18px; align-items:center; padding:18px; border-radius:24px; border:1px solid rgba(23,50,77,.09); background:#fff; box-shadow:0 12px 22px rgba(11,47,91,.04); }
.tier-showcase + .tier-showcase { margin-top:14px; }
.featured-tier { background:linear-gradient(180deg,#fffdf6 0%,#fff7d4 100%); border-color:rgba(204,158,36,.28); }
.tier-badge-wrap { display:grid; justify-items:center; gap:10px; text-align:center; }
.tier-badge-wrap strong { font-size:.95rem; letter-spacing:.06em; color:var(--navy-900); }
.tier-medal { position:relative; width:76px; height:76px; border-radius:50%; display:grid; place-items:center; font-size:2rem; color:#fff; box-shadow:inset 0 3px 9px rgba(255,255,255,.35), 0 12px 26px rgba(0,0,0,.12); }
.tier-medal::before, .tier-medal::after { content:""; position:absolute; bottom:-16px; width:20px; height:26px; clip-path:polygon(50% 100%,0 0,100% 0); }
.tier-medal::before { left:17px; }
.tier-medal::after { right:17px; }
.silver-badge { background:radial-gradient(circle at 30% 30%,#f5f7fb 0%,#b9c2d1 52%,#8e98ab 100%); }
.silver-badge::before, .silver-badge::after { background:linear-gradient(180deg,#cfd6e2,#98a5b8); }
.gold-badge { background:radial-gradient(circle at 30% 30%,#fff4ba 0%,#f3c53f 52%,#d59d0d 100%); }
.gold-badge::before, .gold-badge::after { background:linear-gradient(180deg,#f2c64b,#d69b0d); }
.platinum-badge { background:radial-gradient(circle at 30% 30%,#eef4fd 0%,#aac0e0 52%,#7d94b6 100%); }
.platinum-badge::before, .platinum-badge::after { background:linear-gradient(180deg,#b8cae2,#8598b6); }
.tier-info h4 { margin:0 0 6px; font-size:1.02rem; line-height:1.35; color:var(--navy-900); }
.tier-info p { margin:0 0 12px; color:var(--text-600); font-size:.92rem; line-height:1.55; }
.tier-brands { display:flex; flex-wrap:wrap; gap:8px; }
.tier-brands span { padding:8px 11px; border-radius:999px; font-size:.79rem; font-weight:800; background:#eef5fb; color:var(--blue-700); }
.silver-tier .tier-brands span { background:#f1f4f8; color:#677485; }
.gold-tier .tier-brands span { background:#fff3d6; color:#8f6500; }
.platinum-tier .tier-brands span { background:#edf1f8; color:#5e6d87; }

@media (max-width: 1120px) {
  .how-showcase { grid-template-columns:1fr; }
  .tiers-panel { position:static; }
  .ecosystem-rotate-card.is-prev { transform: translateX(calc(-50% - 125px)) translateY(32px) rotateY(12deg) scale(.79); }
  .ecosystem-rotate-card.is-next { transform: translateX(calc(-50% + 125px)) translateY(32px) rotateY(-12deg) scale(.79); }
}
@media (max-width: 900px) {
  .about-connect-grid { grid-template-columns:1fr; }
  .reward-phone-stage { min-height: 640px; }
  .reward-glass-top { right: -8px; top: 66px; }
  .reward-glass-bottom { right: -16px; bottom: 104px; }
}
@media (max-width: 760px) {
  .how-flow-panel, .tiers-panel { border-radius:24px; padding:22px 18px; }
  .how-step-card { grid-template-columns:44px 44px minmax(0,1fr); gap:12px; padding:14px; }
  .how-step-badge, .how-step-icon { width:44px; height:44px; border-radius:14px; font-size:1rem; }
  .how-step-icon { border-radius:50%; font-size:1.15rem; }
  .tier-showcase { grid-template-columns:1fr; text-align:center; }
  .tier-info { text-align:center; }
  .tier-brands { justify-content:center; }
  .reward-phone-stage { min-height: 610px; }
  .reward-glass-card { width: 182px; padding: 14px 15px; }
  .reward-glass-top { right: -4px; top: 92px; }
  .reward-glass-bottom { right: -6px; bottom: 90px; }
}

/* === v5 refinement: compact About tiles + refreshed How It Works === */
.about-connect-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:28px;
}
.about-connect-tile {
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 20px;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff 0%,#f6fbff 100%);
  border:1px solid rgba(23,50,77,.08);
  box-shadow:0 14px 28px rgba(11,47,91,.06);
  min-height:92px;
}
.about-tile-icon {
  flex:0 0 54px;
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#ffffff 0%,#eff7ff 100%);
  border:1px solid rgba(20,84,163,.09);
  box-shadow:0 12px 22px rgba(17,77,146,.10);
  color:var(--blue-700);
  font-size:1.35rem;
  font-weight:900;
}
.about-tile-copy { display:flex; flex-direction:column; gap:3px; }
.about-tile-copy strong { font-size:1.2rem; line-height:1.2; color:var(--navy-900); }
.about-tile-copy span { font-size:.95rem; line-height:1.4; color:var(--text-500); }

.how-redesign-shell {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:28px;
  align-items:start;
}
.how-journey-panel,
.reward-tiers-board {
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  border:1px solid rgba(23,50,77,.08);
  border-radius:30px;
  box-shadow:0 22px 48px rgba(11,47,91,.08);
}
.how-journey-panel { padding:28px 26px; }
.reward-tiers-board { padding:26px 24px; }
.how-journey-header h3,
.reward-tiers-header h3 { margin:8px 0 0; font-size:1.7rem; color:var(--navy-900); }
.how-journey-list {
  position:relative;
  display:grid;
  gap:16px;
  margin-top:26px;
  padding:6px 0;
}
.how-journey-list::before {
  content:"";
  position:absolute;
  left:50%;
  top:10px;
  bottom:10px;
  width:3px;
  transform:translateX(-50%);
  background:linear-gradient(180deg,rgba(27,102,191,.20) 0%,rgba(42,166,55,.22) 100%);
}
.journey-step {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 76px;
  align-items:center;
  gap:18px;
}
.journey-step.right-step { grid-template-columns:76px minmax(0,1fr); }
.journey-step.right-step .journey-card { order:2; }
.journey-step.right-step .journey-node { order:1; }
.journey-step.right-step .journey-card { margin-left:0; margin-right:26px; }
.journey-step.left-step .journey-card { margin-right:0; margin-left:26px; }
.journey-step.left-step .journey-card { justify-self:start; }
.journey-step.right-step .journey-card { justify-self:end; }
.journey-node {
  width:64px; height:64px; border-radius:50%; display:grid; place-items:center;
  font-size:1.18rem; font-weight:900; color:#fff; position:relative; z-index:2;
  box-shadow:0 12px 26px rgba(10,63,135,.18);
}
.blue-node { background:linear-gradient(135deg,#0c55c7,#0a2f90); }
.green-node { background:linear-gradient(135deg,#31b330,#1d8d25); }
.journey-card {
  width:100%;
  max-width:420px;
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:14px;
  align-items:start;
  padding:18px 18px 18px 16px;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%);
  border:1px solid rgba(23,50,77,.08);
  box-shadow:0 10px 24px rgba(11,47,91,.05);
}
.final-journey-step .journey-card { border-color:rgba(35,143,50,.18); box-shadow:0 12px 28px rgba(24,120,46,.08); }
.journey-card-icon {
  width:54px; height:54px; border-radius:18px; display:grid; place-items:center;
  background:linear-gradient(135deg,#eef5ff 0%,#ffffff 100%);
  color:var(--blue-700); font-size:1.4rem; border:1px solid rgba(22,73,148,.07);
}
.journey-card-copy h4 { margin:0 0 6px; font-size:1.03rem; line-height:1.35; color:var(--navy-900); }
.journey-card-copy p { margin:0; font-size:.92rem; line-height:1.58; color:var(--text-600); }

.reward-tiers-header { display:flex; align-items:center; gap:14px; margin-bottom:18px; }
.tier-board-row {
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:18px;
  align-items:center;
  padding:18px;
  border-radius:24px;
  border:1px solid rgba(23,50,77,.08);
  background:#fff;
  box-shadow:0 12px 22px rgba(11,47,91,.04);
}
.tier-board-row + .tier-board-row { margin-top:14px; }
.featured-row { background:linear-gradient(180deg,#fffdf5 0%,#fff7d8 100%); border-color:rgba(209,164,37,.24); }
.tier-badge-cluster { display:grid; justify-items:center; gap:10px; text-align:center; }
.tier-badge-cluster strong { font-size:.96rem; letter-spacing:.06em; color:var(--navy-900); }
.tier-board-copy h4 { margin:0 0 8px; font-size:1rem; line-height:1.35; color:var(--navy-900); }
.tier-board-copy p { margin:0 0 10px; font-size:.91rem; line-height:1.5; color:var(--text-600); }
.tier-brand-list { display:flex; flex-wrap:wrap; gap:8px; }
.tier-brand-list span { padding:8px 11px; border-radius:999px; font-size:.78rem; font-weight:800; background:#edf5ff; color:var(--blue-700); }
.featured-row .tier-brand-list span { background:#fff0c5; color:#946800; }
.reward-tiers-board .tier-board-row:last-child .tier-brand-list span { background:#f1f4f8; color:#667389; }

@media (max-width: 1120px) {
  .how-redesign-shell { grid-template-columns:1fr; }
}
@media (max-width: 900px) {
  .about-connect-grid { grid-template-columns:1fr; }
  .journey-step,
  .journey-step.right-step { grid-template-columns:58px minmax(0,1fr); }
  .how-journey-list::before { left:28px; transform:none; }
  .journey-step.left-step .journey-card,
  .journey-step.right-step .journey-card { margin-left:0; margin-right:0; justify-self:stretch; }
  .journey-step.right-step .journey-card { order:2; }
  .journey-step.right-step .journey-node { order:1; }
}
@media (max-width: 760px) {
  .about-connect-tile { min-height:84px; padding:16px; }
  .about-tile-icon { width:46px; height:46px; border-radius:15px; font-size:1.1rem; }
  .about-tile-copy strong { font-size:1.05rem; }
  .how-journey-panel,
  .reward-tiers-board { border-radius:24px; padding:22px 18px; }
  .journey-card { grid-template-columns:44px minmax(0,1fr); padding:15px 14px; gap:12px; }
  .journey-card-icon { width:44px; height:44px; border-radius:14px; font-size:1.12rem; }
  .journey-node { width:50px; height:50px; font-size:1rem; }
  .tier-board-row { grid-template-columns:1fr; text-align:center; }
  .tier-board-copy { text-align:center; }
  .tier-brand-list { justify-content:center; }
}


/* ===== Final boss-feedback refinements ===== */
.about-connect-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  align-items:stretch;
}
.about-connect-tile{
  min-height:108px;
  padding:18px 18px;
  border-radius:26px;
  display:flex;
  align-items:center;
  gap:14px;
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%);
  border:1px solid rgba(20,62,108,.08);
  box-shadow:0 16px 30px rgba(12,47,91,.06);
}
.about-tile-icon{
  width:56px;height:56px;border-radius:18px;flex:0 0 56px;
  display:grid;place-items:center;
  background:linear-gradient(180deg,#ffffff 0%,#eff7ff 100%);
  border:1px solid rgba(20,84,163,.10);
  color:#236aa1;box-shadow:0 10px 22px rgba(25,92,150,.10);
}
.about-tile-icon svg{width:24px;height:24px;display:block}
.about-tile-copy{display:flex;align-items:center;min-width:0}
.about-tile-copy strong{font-size:1.16rem;line-height:1.2;white-space:nowrap;color:var(--navy-900)}

.phone-screen.safe-top{background:#fff;padding-top:16px}
.phone-screen.safe-top.safe-top-deep{padding-top:22px}
.phone-screen.safe-top img{height:calc(100% - 16px);object-fit:contain;object-position:top center}
.phone-screen.safe-top.safe-top-deep img{height:calc(100% - 22px)}

.reward-phone-stage{min-height:680px}
.reward-glass-card{
  width:250px;
  background:linear-gradient(180deg,rgba(255,255,255,.92) 0%,rgba(242,248,255,.90) 100%);
  border:1px solid rgba(255,255,255,.78);
  box-shadow:0 22px 45px rgba(7,27,58,.24);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.reward-glass-top{right:-56px;top:82px}
.reward-glass-bottom{right:-68px;bottom:112px;left:auto}
.reward-glass-card strong{font-size:1.1rem}

.ecosystem-section .section-heading p{max-width:760px;margin-inline:auto}
.ecosystem-card-deck{position:relative;height:610px;perspective:1300px;margin-top:20px}
.ecosystem-rotate-card{
  position:absolute;left:50%;top:0;width:min(500px,72vw);height:560px;
  transform:translateX(-50%);
  border-radius:30px;
  overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0%,#f5f9ff 100%);
  border:1px solid rgba(22,73,148,.08);
  box-shadow:0 22px 46px rgba(11,47,91,.10);
  transition:transform .65s ease, opacity .65s ease, box-shadow .65s ease;
}
.ecosystem-rotate-card.is-active{z-index:3;opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
.ecosystem-rotate-card.is-prev{z-index:2;opacity:.74;transform:translateX(calc(-50% - 255px)) translateY(26px) scale(.90)}
.ecosystem-rotate-card.is-next{z-index:2;opacity:.74;transform:translateX(calc(-50% + 255px)) translateY(26px) scale(.90)}
.ecosystem-card-image{height:190px;overflow:hidden}
.ecosystem-card-image img{width:100%;height:100%;object-fit:cover;display:block}
.ecosystem-card-body{padding:24px 26px 28px;display:flex;flex-direction:column;height:calc(100% - 190px)}
.ecosystem-card-body span{font-size:.92rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#4a7ca6;margin-bottom:10px}
.ecosystem-card-body h3{margin:0 0 14px;font-size:2rem;line-height:1.15;color:var(--navy-900)}
.ecosystem-card-body ul{margin:0;padding-left:20px;display:grid;gap:12px;color:var(--text-600);line-height:1.6;font-size:.98rem}
.ecosystem-card-controls{margin-top:8px}

.how-redesign-shell{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(320px,.94fr);gap:28px;align-items:start}
.how-process-panel,.reward-tiers-board{background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);border:1px solid rgba(20,62,108,.08);border-radius:30px;box-shadow:0 22px 48px rgba(11,47,91,.08)}
.how-process-panel{padding:28px 26px}
.how-process-header h3{margin:8px 0 0;font-size:1.72rem;color:var(--navy-900)}
.how-process-flow{margin-top:26px;display:grid;gap:10px}
.process-row{display:grid;grid-template-columns:74px minmax(0,1fr);gap:16px;align-items:center}
.process-badge{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:900;font-size:1.25rem;box-shadow:0 14px 30px rgba(10,63,135,.18);position:relative}
.blue-step .process-badge{background:linear-gradient(145deg,#0a4cc2 0%,#092d84 100%)}
.green-step .process-badge{background:linear-gradient(145deg,#37b739 0%,#1f8f29 100%)}
.process-badge::before{content:"";position:absolute;inset:8px;border-radius:50%;border:1px solid rgba(255,255,255,.26)}
.process-card{min-height:92px;padding:18px 20px;border-radius:24px;background:#fff;border:1px solid rgba(18,60,104,.08);box-shadow:0 12px 24px rgba(11,47,91,.05)}
.process-card h4{margin:0 0 7px;font-size:1.05rem;line-height:1.35;color:var(--navy-900)}
.process-card p{margin:0;color:var(--text-600);font-size:.93rem;line-height:1.58}
.process-arrow{justify-self:center;font-size:1.75rem;font-weight:900;color:#163f8f;line-height:1;opacity:.85}
.final-process-row .process-card{border-color:rgba(35,143,50,.18);box-shadow:0 14px 28px rgba(24,120,46,.08)}
.reward-tiers-refresh{padding:26px 24px}
.reward-tiers-header{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.tiers-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,#103983,#0a2460);color:#fff;font-size:1.25rem;box-shadow:0 12px 24px rgba(9,39,104,.18)}
.tier-board-row{display:grid;grid-template-columns:126px minmax(0,1fr);gap:18px;align-items:center;padding:18px;border-radius:24px;border:1px solid rgba(23,50,77,.08);background:#fff;box-shadow:0 12px 22px rgba(11,47,91,.04)}
.tier-board-row + .tier-board-row{margin-top:14px}
.tier-badge-cluster{display:grid;justify-items:center;gap:10px;text-align:center}
.tier-badge-cluster strong{font-size:1rem;letter-spacing:.07em;color:var(--navy-900)}
.tier-medal{position:relative;width:82px;height:82px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:2rem;font-weight:900;box-shadow:inset 0 5px 14px rgba(255,255,255,.38),0 12px 28px rgba(0,0,0,.12)}
.tier-medal::before,.tier-medal::after{content:"";position:absolute;bottom:-18px;width:23px;height:32px;clip-path:polygon(50% 100%,0 0,100% 0)}
.tier-medal::before{left:18px}.tier-medal::after{right:18px}
.silver-badge{background:linear-gradient(145deg,#f4f5f8 0%,#bcc6d2 62%,#9ba8b6 100%);color:#fff}
.silver-badge::before,.silver-badge::after{background:linear-gradient(180deg,#d8dee6 0%,#aab5c1 100%)}
.gold-badge{background:linear-gradient(145deg,#fff2a9 0%,#f5c42a 55%,#d99b00 100%);color:#fff}
.gold-badge::before,.gold-badge::after{background:linear-gradient(180deg,#ffd96a 0%,#df9f12 100%)}
.platinum-badge{background:linear-gradient(145deg,#dce9fb 0%,#88a7d0 45%,#6883aa 100%);color:#fff}
.platinum-badge::before,.platinum-badge::after{background:linear-gradient(180deg,#9fb6d9 0%,#6b84ad 100%)}
.tier-board-copy h4{margin:0 0 8px;font-size:1rem;line-height:1.35;color:var(--navy-900)}
.tier-board-copy p{margin:0 0 10px;font-size:.91rem;color:var(--text-600);line-height:1.55}
.tier-brand-list{display:flex;flex-wrap:wrap;gap:8px}
.tier-brand-list span{padding:8px 11px;border-radius:999px;font-size:.78rem;font-weight:800;background:#edf5ff;color:#2b5f98}
.featured-row{background:linear-gradient(180deg,#fffdf5 0%,#fff7d8 100%);border-color:rgba(209,164,37,.24)}
.featured-row .tier-brand-list span{background:#fff0c5;color:#946800}
.reward-tiers-board .tier-board-row:last-child .tier-brand-list span{background:#f1f4f8;color:#667389}

@media (max-width:1180px){
  .ecosystem-rotate-card{width:min(460px,76vw)}
  .ecosystem-rotate-card.is-prev{transform:translateX(calc(-50% - 210px)) translateY(22px) scale(.88)}
  .ecosystem-rotate-card.is-next{transform:translateX(calc(-50% + 210px)) translateY(22px) scale(.88)}
}
@media (max-width:900px){
  .about-connect-grid{grid-template-columns:1fr}
  .about-tile-copy strong{white-space:normal}
  .reward-phone-stage{min-height:620px}
  .reward-glass-card{width:210px}
  .reward-glass-top{right:-6px;top:72px}
  .reward-glass-bottom{right:-12px;bottom:92px}
  .ecosystem-card-deck{height:560px}
  .ecosystem-rotate-card{width:min(520px,88vw);height:520px}
  .ecosystem-rotate-card.is-prev{transform:translateX(calc(-50% - 120px)) translateY(22px) scale(.79)}
  .ecosystem-rotate-card.is-next{transform:translateX(calc(-50% + 120px)) translateY(22px) scale(.79)}
  .ecosystem-card-image{height:170px}
  .ecosystem-card-body{height:calc(100% - 170px)}
  .how-redesign-shell{grid-template-columns:1fr}
}
@media (max-width:760px){
  .how-process-panel,.reward-tiers-board{padding:22px 18px;border-radius:24px}
  .process-row{grid-template-columns:58px minmax(0,1fr);gap:12px}
  .process-badge{width:58px;height:58px;font-size:1rem}
  .process-card{min-height:84px;padding:15px 15px 15px 16px}
  .process-card h4{font-size:.97rem}
  .process-card p{font-size:.88rem}
  .tier-board-row{grid-template-columns:1fr;text-align:center}
  .tier-board-copy{text-align:center}
  .tier-brand-list{justify-content:center}
}

/* ============================================================
   FINAL RESPONSIVE PASS
   Keeps approved desktop design intact and makes mobile/tablet fit cleanly.
   ============================================================ */
html,body{width:100%;max-width:100%;overflow-x:hidden}
body,main,section,header,footer,.container{min-width:0}
h1,h2,h3,h4,p,li,a,span,strong,label{overflow-wrap:break-word;word-break:normal}
input,textarea,select{max-width:100%}

@media (max-width:1120px){
  :root{--container:min(100% - 32px,920px)}
  .section{padding:88px 0}
  .header-inner{gap:12px}.main-nav{gap:16px}.main-nav a{font-size:.88rem}.header-actions .btn{padding-inline:16px}
  .hero-grid,.about-grid,.rewards-grid,.contact-grid{grid-template-columns:1fr}
  .hero-copy,.about-copy{text-align:center}.hero-copy p,.about-copy p{margin-left:auto;margin-right:auto}
  .hero-actions,.value-strip{justify-content:center}
  .app-showcase{min-height:560px;width:100%}.app-carousel-stage{height:520px;max-width:720px}
  .feature-experience{grid-template-columns:190px minmax(230px,290px) minmax(0,1fr);gap:18px;padding:24px}
  .feature-phone{width:240px}
  .rewards-grid{gap:32px}.rewards-copy{text-align:center}.rewards-proof-grid,.reward-dummy-brands{justify-content:center}
  .reward-phone-stage{width:min(100%,560px);margin-inline:auto}
  .how-redesign-shell{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:900px){
  :root{--container:calc(100% - 28px)}
  .section{padding:72px 0}.section-heading{margin-bottom:34px}
  h1{font-size:clamp(2.25rem,10vw,3.7rem)}h2{font-size:clamp(1.8rem,7vw,2.65rem)}p{font-size:1rem}
  .header-inner{min-height:74px}.brand-logo{width:68px;height:58px}.header-actions>.btn{display:none}.nav-toggle{display:flex}
  .main-nav{position:fixed;top:74px;left:14px;right:14px;z-index:1001;display:grid;gap:0;padding:14px;border-radius:22px;background:rgba(255,255,255,.96);border:1px solid rgba(23,50,77,.08);box-shadow:0 24px 60px rgba(11,47,91,.16);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);opacity:0;visibility:hidden;transform:translateY(-12px);transition:.24s ease;max-height:calc(100vh - 94px);overflow-y:auto}
  .main-nav.open{opacity:1;visibility:visible;transform:translateY(0)}
  .main-nav>a{padding:13px 12px;border-radius:12px;font-size:.96rem}.main-nav a::after{display:none}.main-nav>a:hover,.main-nav>a.active{background:rgba(47,181,212,.08)}
  .mobile-nav-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
  .hero{padding-top:44px}.hero-grid{gap:24px}.hero-copy{max-width:720px;margin-inline:auto}.hero-actions{gap:10px}.hero-actions .btn{flex:1 1 190px}.value-strip{gap:8px}.value-strip span{font-size:.88rem}
  .app-showcase{min-height:500px;overflow:hidden}.app-carousel-stage{width:100%;height:455px}.carousel-phone{width:min(220px,58vw)}
  .app-carousel-slide.is-prev{transform:translate(calc(-50% - 105px),-47%) scale(.72) rotateY(8deg);opacity:.5}
  .app-carousel-slide.is-next{transform:translate(calc(-50% + 105px),-47%) scale(.72) rotateY(-8deg);opacity:.5}
  .app-carousel-slide.is-far-prev,.app-carousel-slide.is-far-next{opacity:0}
  .about-grid{gap:32px}.about-connect-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}.about-connect-tile{width:100%}.about-phone{width:min(290px,78vw)}
  .feature-experience{grid-template-columns:1fr;min-height:auto;padding:22px;gap:28px}
  .feature-rail{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible;order:1}.feature-choice{min-width:0;transform:none!important}.feature-choice strong{font-size:.9rem}
  .feature-phone-zone{order:2;min-height:560px;width:100%}.feature-phone{width:min(255px,70vw)}
  .feature-copy-zone{order:3;min-height:350px;width:100%}.feature-copy{text-align:center}.feature-copy ul{max-width:540px;margin-left:auto;margin-right:auto;text-align:left}
  .rewards-section{overflow:hidden}.rewards-grid{grid-template-columns:1fr}.reward-phone-stage{min-height:610px;max-width:520px}.rewards-phone{width:min(300px,76vw);margin-inline:auto}
  .reward-glass-card{width:205px;padding:15px 16px}.reward-glass-top{right:0;top:72px}.reward-glass-bottom{right:0;bottom:86px;left:auto}
  .ecosystem-card-deck{height:550px;min-height:550px;overflow:hidden}.ecosystem-rotate-card{width:min(500px,86vw);height:510px}.ecosystem-rotate-card.is-prev{transform:translateX(calc(-50% - 112px)) translateY(20px) scale(.8);opacity:.38}.ecosystem-rotate-card.is-next{transform:translateX(calc(-50% + 112px)) translateY(20px) scale(.8);opacity:.38}.ecosystem-card-image{height:168px}.ecosystem-card-body{height:calc(100% - 168px);padding:22px 22px 24px}.ecosystem-card-body h3{font-size:1.55rem}.ecosystem-card-body ul{gap:9px;font-size:.92rem}
  .process-row{grid-template-columns:58px minmax(0,1fr);gap:12px}.process-badge{width:58px;height:58px;font-size:1rem}.process-card{min-width:0}
  .review-carousel-viewport{width:100%}.review-slide{min-width:0}
  .cta-box{flex-direction:column;align-items:flex-start;padding:32px 26px}.cta-actions{width:100%}.cta-actions .btn{flex:1 1 180px}
  .form-grid{grid-template-columns:1fr}.full-width{grid-column:auto}
  .footer-grid{grid-template-columns:1fr;gap:28px}.footer-brand,.footer-column,.footer-map{min-width:0}.footer-logo{width:min(220px,72vw)}.footer-map iframe{width:100%}
}

@media (max-width:760px){
  :root{--container:calc(100% - 24px)}
  .section{padding:62px 0}.section-heading{margin-bottom:28px}.eyebrow{letter-spacing:.13em}.hero{padding-top:34px}
  .hero-actions,.cta-actions{display:grid;grid-template-columns:1fr;width:100%}.hero-actions .btn,.cta-actions .btn{width:100%}.value-strip{justify-content:center}
  .app-showcase{min-height:455px}.app-carousel-stage{height:405px}.carousel-phone{width:min(205px,61vw)}
  .app-carousel-slide.is-prev{transform:translate(calc(-50% - 80px),-47%) scale(.68) rotateY(6deg);opacity:.42}.app-carousel-slide.is-next{transform:translate(calc(-50% + 80px),-47%) scale(.68) rotateY(-6deg);opacity:.42}
  .app-carousel-dots{gap:10px}.app-carousel-dot{width:11px;height:11px}.carousel-helper{text-align:center;padding-inline:8px}
  .about-connect-tile{min-height:82px;padding:15px 16px;border-radius:21px}.about-tile-icon{width:48px;height:48px;flex-basis:48px;border-radius:15px}.about-tile-copy strong{font-size:1.04rem}
  .feature-experience{padding:18px;border-radius:24px}.feature-rail{grid-template-columns:1fr}.feature-choice{min-height:58px;border-radius:16px}.feature-phone-zone{min-height:500px}.feature-copy-zone{min-height:390px;padding:22px 18px}.feature-copy{inset:22px 18px}.feature-copy h3{font-size:1.55rem}.feature-copy li{font-size:.94rem}
  .reward-phone-stage{min-height:570px}.rewards-phone{width:min(270px,72vw)}.reward-glass-card{width:180px;padding:13px 14px;border-radius:20px}.reward-glass-card strong{font-size:.95rem}.reward-glass-card span,.reward-glass-card small{font-size:.76rem}.reward-glass-top{right:2px;top:82px}.reward-glass-bottom{right:2px;bottom:76px}
  .ecosystem-card-deck{height:520px;min-height:520px}.ecosystem-rotate-card{width:min(465px,90vw);height:485px;border-radius:25px}.ecosystem-rotate-card.is-prev,.ecosystem-rotate-card.is-next{opacity:.18;transform:translateX(-50%) translateY(18px) scale(.94)}.ecosystem-rotate-card.is-prev{margin-left:-24px}.ecosystem-rotate-card.is-next{margin-left:24px}.ecosystem-card-image{height:155px}.ecosystem-card-body{height:calc(100% - 155px);padding:20px}.ecosystem-card-body h3{font-size:1.4rem}.ecosystem-card-body ul{font-size:.88rem;line-height:1.48}
  .how-process-panel,.reward-tiers-board{padding:20px 16px;border-radius:24px}.how-process-header h3,.reward-tiers-header h3{font-size:1.45rem}.process-row{grid-template-columns:50px minmax(0,1fr);gap:10px}.process-badge{width:50px;height:50px;font-size:.92rem}.process-card{padding:14px 14px 14px 15px;border-radius:18px}.process-card h4{font-size:.94rem}.process-card p{font-size:.84rem}.process-arrow{font-size:1.35rem}.tier-board-row{grid-template-columns:1fr;text-align:center}.tier-board-copy{text-align:center}.tier-brand-list{justify-content:center}
  .review-slide{border-radius:22px;padding:22px 20px}.review-slide p{font-size:.96rem}
  .cta-box{padding:28px 22px;border-radius:24px}.contact-list div{padding:15px}.footer-grid{padding-top:46px}
  .whatsapp-float{right:12px;bottom:70px;min-width:0;width:62px;height:62px;padding:4px;border-radius:999px}.whatsapp-float img{width:54px;height:54px;flex-basis:54px}.whatsapp-float span{display:none}
}

@media (max-width:430px){
  :root{--container:calc(100% - 20px)}
  .section{padding:54px 0}h1{font-size:clamp(2rem,11vw,2.8rem)}h2{font-size:clamp(1.65rem,8vw,2.15rem)}.btn{min-height:46px;padding-inline:18px}
  .app-showcase{min-height:425px}.app-carousel-stage{height:380px}.carousel-phone{width:min(190px,61vw)}.app-carousel-slide.is-prev{transform:translate(calc(-50% - 63px),-47%) scale(.64);opacity:.32}.app-carousel-slide.is-next{transform:translate(calc(-50% + 63px),-47%) scale(.64);opacity:.32}
  .real-phone{border-radius:36px}.phone-inner{border-radius:32px;padding:6px}.phone-screen{border-radius:27px}.phone-island{width:82px;height:19px}.phone-island span{width:27px;left:25px}.phone-island i{right:12px}
  .about-phone,.feature-phone{width:min(235px,69vw)}.feature-phone-zone{min-height:470px}.feature-copy-zone{min-height:420px}
  .rewards-phone{width:min(248px,70vw)}.reward-phone-stage{min-height:535px}.reward-glass-card{width:160px;padding:12px}.reward-glass-top{top:70px}.reward-glass-bottom{bottom:68px}
  .ecosystem-card-deck{height:500px;min-height:500px}.ecosystem-rotate-card{width:calc(100% - 12px);height:465px}.ecosystem-card-image{height:145px}.ecosystem-card-body{height:calc(100% - 145px);padding:18px}.ecosystem-card-body span{font-size:.72rem}.ecosystem-card-body h3{font-size:1.25rem}.ecosystem-card-body ul{font-size:.82rem;padding-left:18px;gap:7px}
  .process-row{grid-template-columns:44px minmax(0,1fr)}.process-badge{width:44px;height:44px}.process-card h4{font-size:.9rem}.process-card p{font-size:.81rem}.tier-medal{width:72px;height:72px}
  .review-slide{padding:20px 18px}.contact-list strong,.footer-contact a,.footer-contact li{overflow-wrap:anywhere}
}

@media (max-width:360px){
  :root{--container:calc(100% - 16px)}
  .brand-logo{width:60px;height:52px}.header-inner{min-height:68px}.main-nav{top:68px;left:8px;right:8px}
  .app-showcase{min-height:405px}.app-carousel-stage{height:360px}.carousel-phone{width:180px}.app-carousel-slide.is-prev{transform:translate(calc(-50% - 54px),-47%) scale(.61)}.app-carousel-slide.is-next{transform:translate(calc(-50% + 54px),-47%) scale(.61)}
  .feature-experience{padding:14px}.feature-copy-zone{min-height:445px}.reward-glass-card{width:148px}.ecosystem-card-body h3{font-size:1.16rem}.ecosystem-card-body ul{font-size:.78rem}.process-card{padding:12px}.process-card h4{font-size:.86rem}.process-card p{font-size:.78rem}
}


/* ==========================================================
   BOSS FEEDBACK FINAL OVERRIDES
   ========================================================== */

/* Persistent glass header, including while scrolling */
.site-header,
.site-header.scrolled {
  position: sticky !important;
  top: 0;
  z-index: 2000;
  background: rgba(238,248,253,.48) !important;
  border-bottom: 1px solid rgba(255,255,255,.72) !important;
  box-shadow: 0 10px 28px rgba(11,47,91,.06) !important;
  backdrop-filter: blur(22px) saturate(165%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(165%) !important;
}

/* About: three equal floating tiles, no text escaping the boxes */
.about-connect-grid {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 14px !important;
  width: 100%;
  max-width: 690px;
  margin: 30px auto 0 !important;
  align-items: stretch;
}
.about-connect-tile {
  min-width: 0;
  min-height: 92px !important;
  padding: 16px 14px !important;
  border-radius: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center;
  gap: 10px !important;
  background: linear-gradient(180deg,rgba(255,255,255,.96),rgba(247,252,255,.90)) !important;
  border: 1px solid rgba(29,103,158,.12) !important;
  box-shadow: 0 18px 34px rgba(11,47,91,.08) !important;
  animation: aboutTileFloat 5.8s ease-in-out infinite;
}
.about-connect-tile:nth-child(2){animation-delay:-1.7s}
.about-connect-tile:nth-child(3){animation-delay:-3.4s}
@keyframes aboutTileFloat {0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.about-tile-icon {
  width: 44px !important;
  height: 44px !important;
  flex: 0 0 44px !important;
  border-radius: 14px !important;
}
.about-tile-icon svg { width: 21px; height: 21px; }
.about-tile-copy { min-width: 0; display:block !important; }
.about-tile-copy strong {
  display:block;
  font-size: clamp(.86rem,1.15vw,1.02rem) !important;
  line-height:1.15 !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

/* Features: no scrollbar, no selector movement, no clipping on click */
.feature-experience { overflow: visible !important; }
.feature-rail {
  max-height: none !important;
  overflow: visible !important;
  padding-right: 0 !important;
  scrollbar-width: none !important;
  align-self: center !important;
}
.feature-rail::-webkit-scrollbar { display:none !important; }
.feature-choice,
.feature-choice:hover,
.feature-choice.active {
  transform: none !important;
}
.feature-experience.engaged .feature-rail { animation: none !important; }
.feature-choice { width:100%; min-width:0; }
.feature-choice strong { min-width:0; overflow-wrap:anywhere; }

/* Rewards: phone and two separate chat bubbles, never overlapping */
.reward-phone-stage {
  display: grid !important;
  grid-template-columns: minmax(270px,320px) minmax(210px,250px) !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 28px !important;
  width: min(100%,650px) !important;
  min-height: 660px !important;
  padding: 0 8px !important;
  margin-inline: auto;
  overflow: visible !important;
}
.reward-phone-stage .rewards-phone { grid-column:1; justify-self:center; }
.reward-chat-stack {
  grid-column:2;
  position:relative;
  z-index:4;
  display:grid;
  gap:22px;
  align-content:center;
}
.reward-chat-bubble {
  position:relative;
  width:100%;
  padding:18px 19px 17px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(238,247,254,.94));
  border:1px solid rgba(255,255,255,.95);
  box-shadow:0 18px 38px rgba(4,25,58,.21);
  color:#0b2f5b;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.reward-chat-bubble::before {
  content:"";
  position:absolute;
  left:-14px;
  top:34px;
  width:28px;
  height:28px;
  background:inherit;
  transform:rotate(45deg);
  border-left:1px solid rgba(255,255,255,.9);
  border-bottom:1px solid rgba(255,255,255,.9);
  border-radius:0 0 0 6px;
}
.reward-chat-bubble span,
.reward-chat-bubble small { display:block; color:#607893; }
.reward-chat-bubble span { font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.reward-chat-bubble strong { display:block; margin:7px 0 6px; color:#0b2f5b; font-size:1.08rem; line-height:1.3; }
.reward-chat-bubble small { font-size:.86rem; line-height:1.48; }

/* Ecosystem: all three cards stay fully inside the section on desktop */
.ecosystem-section { overflow:hidden !important; }
.ecosystem-card-deck {
  height:590px !important;
  min-height:590px !important;
  max-width:1180px;
  margin: 18px auto 0;
  overflow: visible !important;
}
.ecosystem-rotate-card {
  width: 450px !important;
  height: 550px !important;
  min-height: 550px !important;
  border-radius:28px !important;
}
.ecosystem-rotate-card.is-active {
  transform:translateX(-50%) translateY(0) scale(1) !important;
}
.ecosystem-rotate-card.is-prev {
  transform:translateX(calc(-50% - 335px)) translateY(24px) scale(.92) !important;
  opacity:.72 !important;
}
.ecosystem-rotate-card.is-next {
  transform:translateX(calc(-50% + 335px)) translateY(24px) scale(.92) !important;
  opacity:.72 !important;
}
.ecosystem-card-image { height:190px !important; background:#eef7fd; }
.ecosystem-card-image img { width:100%; height:100%; object-fit:cover !important; object-position:center !important; }
.ecosystem-card-body { height:calc(100% - 190px) !important; padding:22px 24px !important; overflow:hidden; }
.ecosystem-card-body h3 { font-size:1.72rem !important; }
.ecosystem-card-body ul { font-size:.92rem !important; gap:9px !important; line-height:1.48 !important; }

/* Reward tiers: medal/ribbon design closer to boss reference */
.tier-medal {
  width:92px !important;
  height:92px !important;
  border-radius:50% !important;
  position:relative;
  display:grid !important;
  place-items:center !important;
  border:5px solid rgba(255,255,255,.55) !important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.35), inset 0 -10px 18px rgba(0,0,0,.10), 0 14px 28px rgba(0,0,0,.14) !important;
  overflow:visible !important;
}
.tier-medal::before,
.tier-medal::after {
  content:"";
  position:absolute;
  z-index:-1;
  bottom:-24px !important;
  width:27px !important;
  height:39px !important;
  clip-path:polygon(0 0,100% 0,82% 100%,50% 72%,18% 100%) !important;
  border-radius:4px;
}
.tier-medal::before { left:15px !important; transform:rotate(8deg); }
.tier-medal::after { right:15px !important; transform:rotate(-8deg); }
.tier-medal .medal-face {
  width:66px;
  height:66px;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:2.15rem;
  color:rgba(255,255,255,.96);
  border:2px solid rgba(255,255,255,.55);
  text-shadow:0 2px 6px rgba(0,0,0,.18);
  box-shadow:inset 0 5px 12px rgba(255,255,255,.30), inset 0 -6px 12px rgba(0,0,0,.08);
}
.silver-badge { background:radial-gradient(circle at 35% 28%,#ffffff 0%,#e4e7eb 30%,#aeb8c4 70%,#8995a4 100%) !important; }
.silver-badge .medal-face { background:linear-gradient(145deg,#f1f3f6,#aab5c1); }
.silver-badge::before,.silver-badge::after { background:linear-gradient(180deg,#d9dee5,#9ca8b7) !important; }
.gold-badge { background:radial-gradient(circle at 35% 28%,#fffbd0 0%,#ffd85c 35%,#f0b414 72%,#c98700 100%) !important; }
.gold-badge .medal-face { background:linear-gradient(145deg,#ffe786,#e5a60d); }
.gold-badge::before,.gold-badge::after { background:linear-gradient(180deg,#fbd35f,#d29407) !important; }
.platinum-badge { background:radial-gradient(circle at 35% 28%,#f3f8ff 0%,#c4d6ee 32%,#8fa9ca 70%,#617a9d 100%) !important; }
.platinum-badge .medal-face { background:linear-gradient(145deg,#dce9fb,#7d98bd); }
.platinum-badge::before,.platinum-badge::after { background:linear-gradient(180deg,#b5cae3,#7189ab) !important; }
.tier-badge-cluster { padding-bottom:18px; }

/* Footer: one even, lighter blue surface for the transparent logo */
.site-footer {
  background:#d9edf8 !important;
  color:#204767 !important;
}
.footer-logo-panel {
  width:250px !important;
  padding:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.footer-logo-panel .footer-logo { background:transparent !important; }
.footer-brand p,
.footer-column a,
.footer-column li { color:#315b79 !important; }
.footer-column h3,
.footer-map h3 { color:#0b2f5b !important; }
.footer-column a:hover { color:#0d5d91 !important; }
.footer-bottom { border-top:1px solid rgba(11,47,91,.12) !important; }
.footer-bottom p { color:#466b85 !important; }

/* WhatsApp: icon only */
.whatsapp-float,
.whatsapp-float:hover {
  right:20px !important;
  bottom:24px !important;
  width:62px !important;
  height:62px !important;
  min-width:62px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  box-shadow:0 14px 30px rgba(14,106,66,.20) !important;
  display:grid !important;
  place-items:center !important;
}
.whatsapp-float img { width:62px !important; height:62px !important; object-fit:contain !important; }
.whatsapp-float span { display:none !important; }

@media (max-width:1180px){
  .ecosystem-rotate-card{width:420px !important;height:530px !important;min-height:530px !important}
  .ecosystem-rotate-card.is-prev{transform:translateX(calc(-50% - 270px)) translateY(22px) scale(.90) !important}
  .ecosystem-rotate-card.is-next{transform:translateX(calc(-50% + 270px)) translateY(22px) scale(.90) !important}
}
@media (max-width:900px){
  .about-connect-grid{grid-template-columns:1fr !important;max-width:430px !important}
  .about-connect-tile{animation:none !important;justify-content:flex-start !important;padding-inline:20px !important}
  .about-tile-copy strong{font-size:1.02rem !important}
  .feature-experience{overflow:hidden !important}
  .feature-rail{overflow:visible !important}
  .reward-phone-stage{
    grid-template-columns:1fr !important;
    min-height:auto !important;
    gap:22px !important;
    padding-bottom:10px !important;
  }
  .reward-phone-stage .rewards-phone{grid-column:1;grid-row:1;margin-inline:auto}
  .reward-chat-stack{grid-column:1;grid-row:2;grid-template-columns:1fr 1fr;width:min(100%,520px);margin-inline:auto}
  .reward-chat-bubble::before{top:-11px;left:48%;transform:translateX(-50%) rotate(45deg)}
  .ecosystem-card-deck{height:520px !important;min-height:520px !important;overflow:hidden !important}
  .ecosystem-rotate-card{width:min(470px,88vw) !important;height:490px !important;min-height:490px !important}
  .ecosystem-rotate-card.is-prev,.ecosystem-rotate-card.is-next{opacity:0 !important;pointer-events:none}
  .ecosystem-card-image{height:165px !important}
  .ecosystem-card-body{height:calc(100% - 165px) !important}
}
@media (max-width:620px){
  .reward-chat-stack{grid-template-columns:1fr !important;width:min(100%,340px)}
  .reward-chat-bubble::before{left:50%}
  .ecosystem-card-deck{height:500px !important;min-height:500px !important}
  .ecosystem-rotate-card{height:470px !important;min-height:470px !important}
  .ecosystem-card-body h3{font-size:1.35rem !important}
  .ecosystem-card-body ul{font-size:.84rem !important}
  .tier-medal{width:82px !important;height:82px !important}
  .tier-medal .medal-face{width:58px;height:58px;font-size:1.9rem}
  .whatsapp-float,.whatsapp-float:hover{right:14px !important;bottom:18px !important;width:56px !important;height:56px !important;min-width:56px !important}
  .whatsapp-float img{width:56px !important;height:56px !important}
}

/* === v9 quick fixes: stronger glass header + cleaner ecosystem cards + updated support email === */
html { scroll-padding-top: 110px; }
body { padding-top: 96px; }
main section[id] { scroll-margin-top: 110px; }

.site-header,
.site-header.scrolled {
  position: fixed !important;
  inset: 0 0 auto 0;
  background: linear-gradient(180deg, rgba(247,252,255,.84), rgba(232,244,251,.66)) !important;
  border-bottom: 1px solid rgba(255,255,255,.82) !important;
  box-shadow: 0 14px 34px rgba(11,47,91,.10) !important;
  backdrop-filter: blur(18px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%) !important;
}
.site-header .container { position: relative; }
.header-inner { min-height: 86px !important; }
.brand-logo { filter: drop-shadow(0 8px 18px rgba(8,54,92,.10)); }

/* Email styling consistency */
.contact-list a[href^="mailto:"],
.footer-contact a[href^="mailto:"] { word-break: break-word; }

/* Ecosystem section refinement */
.ecosystem-section { padding-top: 92px; padding-bottom: 92px; }
.ecosystem-section .section-heading { max-width: 840px; margin-inline: auto; }
.ecosystem-card-deck {
  height: 660px !important;
  min-height: 660px !important;
  max-width: 1280px !important;
  margin: 22px auto 0 !important;
  overflow: visible !important;
}
.ecosystem-rotate-card {
  width: 500px !important;
  height: 585px !important;
  min-height: 585px !important;
  overflow: hidden !important;
  border-radius: 30px !important;
  background: linear-gradient(180deg,#ffffff 0%, #f7fbff 100%) !important;
  box-shadow: 0 24px 46px rgba(11,47,91,.10) !important;
}
.ecosystem-rotate-card.is-active {
  z-index: 4 !important;
  transform: translateX(-50%) translateY(0) scale(1) !important;
  opacity: 1 !important;
}
.ecosystem-rotate-card.is-prev {
  z-index: 2 !important;
  opacity: .78 !important;
  transform: translateX(calc(-50% - 295px)) translateY(28px) scale(.88) !important;
}
.ecosystem-rotate-card.is-next {
  z-index: 2 !important;
  opacity: .78 !important;
  transform: translateX(calc(-50% + 295px)) translateY(28px) scale(.88) !important;
}
.ecosystem-card-image { height: 180px !important; }
.ecosystem-card-image img {
  width: 100%; height: 100%; object-fit: cover !important; object-position: center !important;
}
.ecosystem-card-body {
  height: calc(100% - 180px) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 24px 26px 26px !important;
  overflow: hidden !important;
}
.ecosystem-card-body > span {
  font-size: .86rem !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
  color: #5c87af !important;
}
.ecosystem-card-body h3 {
  font-size: 1.34rem !important;
  line-height: 1.22 !important;
  margin: 0 !important;
  color: #143b66 !important;
}
.ecosystem-card-body ul {
  margin: 2px 0 0 !important;
  padding: 0 0 0 2px !important;
  gap: 10px !important;
  font-size: .93rem !important;
  line-height: 1.54 !important;
}
.ecosystem-card-body li {
  padding-left: 24px !important;
  color: #506a84 !important;
}
.ecosystem-card-body li::before { left: 0 !important; }
.ecosystem-card-controls { margin-top: 22px !important; }
.ecosystem-dot { width: 12px !important; height: 12px !important; }

@media (max-width: 1280px) {
  .ecosystem-card-deck { max-width: 1120px !important; }
  .ecosystem-rotate-card { width: 450px !important; height: 565px !important; min-height: 565px !important; }
  .ecosystem-rotate-card.is-prev { transform: translateX(calc(-50% - 238px)) translateY(24px) scale(.86) !important; }
  .ecosystem-rotate-card.is-next { transform: translateX(calc(-50% + 238px)) translateY(24px) scale(.86) !important; }
}
@media (max-width: 980px) {
  body { padding-top: 86px; }
  .header-inner { min-height: 78px !important; }
  .ecosystem-card-deck { height: 560px !important; min-height: 560px !important; overflow: hidden !important; }
  .ecosystem-rotate-card { width: min(470px, 88vw) !important; height: 520px !important; min-height: 520px !important; }
  .ecosystem-rotate-card.is-prev,
  .ecosystem-rotate-card.is-next { opacity: .12 !important; pointer-events: none; }
  .ecosystem-card-image { height: 165px !important; }
  .ecosystem-card-body { height: calc(100% - 165px) !important; padding: 22px !important; }
  .ecosystem-card-body h3 { font-size: 1.26rem !important; }
  .ecosystem-card-body ul { font-size: .88rem !important; gap: 8px !important; }
}
@media (max-width: 640px) {
  body { padding-top: 80px; }
  .ecosystem-card-deck { height: 530px !important; min-height: 530px !important; }
  .ecosystem-rotate-card { width: min(450px, 92vw) !important; height: 490px !important; min-height: 490px !important; }
  .ecosystem-card-image { height: 150px !important; }
  .ecosystem-card-body { height: calc(100% - 150px) !important; padding: 19px 18px 20px !important; }
  .ecosystem-card-body h3 { font-size: 1.16rem !important; }
  .ecosystem-card-body > span { font-size: .75rem !important; }
  .ecosystem-card-body ul { font-size: .82rem !important; line-height: 1.46 !important; gap: 7px !important; }
}

/* === v10 fixes: ecosystem text visibility + reward tier order/colors === */
.ecosystem-card-deck{
  height: 700px !important;
  min-height: 700px !important;
  overflow: visible !important;
}
.ecosystem-rotate-card{
  display:flex !important;
  flex-direction:column !important;
  width: 520px !important;
  height: 640px !important;
  min-height: 640px !important;
}
.ecosystem-card-image{
  height: 195px !important;
  flex: 0 0 195px !important;
}
.ecosystem-card-body{
  flex:1 1 auto !important;
  height:auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  justify-content:flex-start !important;
  gap: 14px !important;
  padding: 24px 28px 28px !important;
}
.ecosystem-card-body h3{
  font-size: 1.95rem !important;
  line-height: 1.16 !important;
  margin: 0 !important;
}
.ecosystem-card-body ul{
  display:grid !important;
  margin: 0 !important;
  padding-left: 0 !important;
  list-style: none !important;
  gap: 12px !important;
  font-size: 1rem !important;
  line-height: 1.58 !important;
}
.ecosystem-card-body li{
  position: relative;
  padding-left: 24px !important;
}
.ecosystem-card-body li::before{
  content: "✓";
  position:absolute;
  left:0;
  top:0;
  color: var(--cyan-500);
  font-weight: 800;
}
.ecosystem-rotate-card.is-prev{
  transform: translateX(calc(-50% - 300px)) translateY(34px) scale(.86) !important;
}
.ecosystem-rotate-card.is-next{
  transform: translateX(calc(-50% + 300px)) translateY(34px) scale(.86) !important;
}

/* Reward tier row backgrounds by medal */
.tier-board-row.platinum-row{
  background: linear-gradient(180deg,#f5f9ff 0%,#e8f1fd 100%) !important;
  border-color: rgba(111,145,190,.28) !important;
}
.tier-board-row.gold-row{
  background: linear-gradient(180deg,#fffdf2 0%,#fff5cd 100%) !important;
  border-color: rgba(217,155,13,.26) !important;
}
.tier-board-row.silver-row{
  background: linear-gradient(180deg,#fbfcfd 0%,#f0f3f7 100%) !important;
  border-color: rgba(164,174,189,.25) !important;
}
.tier-board-row.platinum-row .tier-brand-list span{
  background:#dfeaf9 !important; color:#476387 !important;
}
.tier-board-row.gold-row .tier-brand-list span{
  background:#fff0c5 !important; color:#946800 !important;
}
.tier-board-row.silver-row .tier-brand-list span{
  background:#edf1f5 !important; color:#667389 !important;
}

@media (max-width: 1280px){
  .ecosystem-card-deck{height: 660px !important; min-height:660px !important;}
  .ecosystem-rotate-card{width: 480px !important; height: 610px !important; min-height:610px !important;}
  .ecosystem-rotate-card.is-prev{transform: translateX(calc(-50% - 255px)) translateY(28px) scale(.85) !important;}
  .ecosystem-rotate-card.is-next{transform: translateX(calc(-50% + 255px)) translateY(28px) scale(.85) !important;}
}
@media (max-width: 980px){
  .ecosystem-card-deck{height: 590px !important; min-height:590px !important; overflow:hidden !important;}
  .ecosystem-rotate-card{width:min(500px,88vw) !important; height:560px !important; min-height:560px !important;}
  .ecosystem-card-image{height:170px !important; flex-basis:170px !important;}
  .ecosystem-card-body{padding:22px 22px 24px !important;}
  .ecosystem-card-body h3{font-size:1.48rem !important;}
  .ecosystem-card-body ul{font-size:.9rem !important; gap:9px !important;}
}
@media (max-width: 640px){
  .ecosystem-card-deck{height: 560px !important; min-height:560px !important;}
  .ecosystem-rotate-card{width:min(460px,92vw) !important; height:525px !important; min-height:525px !important;}
  .ecosystem-card-image{height:155px !important; flex-basis:155px !important;}
  .ecosystem-card-body h3{font-size:1.26rem !important;}
  .ecosystem-card-body ul{font-size:.82rem !important; line-height:1.42 !important; gap:7px !important;}
}

/* === v11 badges + whatsapp polish === */
.tier-badge-cluster{
  align-content:start !important;
  gap:0 !important;
}
.tier-badge-cluster .badge-art{
  width: 122px !important;
  max-width: 100% !important;
  height: auto !important;
  display:block !important;
  filter: drop-shadow(0 8px 16px rgba(17,44,76,.10));
}
.tier-badge-cluster strong,
.tier-badge-cluster .tier-medal,
.tier-badge-cluster .medal-face{
  display:none !important;
}
.tier-board-row{
  align-items:center !important;
}
.tier-board-row.platinum-row{background: linear-gradient(180deg,#eef5ff 0%, #e3edf9 100%) !important;}
.tier-board-row.gold-row{background: linear-gradient(180deg,#fff6d8 0%, #fff1b8 100%) !important;}
.tier-board-row.silver-row{background: linear-gradient(180deg,#f7f8fb 0%, #eef1f5 100%) !important;}

.whatsapp-float,
.whatsapp-float:hover{
  width:64px !important;
  height:64px !important;
  min-width:64px !important;
  border-radius:999px !important;
  padding:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
  right:18px !important;
  bottom:18px !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
}
.whatsapp-float img{
  width:64px !important;
  height:64px !important;
  object-fit:cover !important;
  border-radius:999px !important;
  display:block !important;
}
.whatsapp-float span,
.whatsapp-float strong,
.whatsapp-float small{
  display:none !important;
}
@media (max-width: 767px){
  .whatsapp-float,.whatsapp-float:hover{
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    right:14px !important;
    bottom:14px !important;
  }
  .whatsapp-float img{
    width:58px !important;
    height:58px !important;
  }
  .tier-badge-cluster .badge-art{
    width:98px !important;
  }
}


/* === v13 final refinements: badge sizing, no WhatsApp, subtle feature shimmer === */
.whatsapp-float{display:none !important;}

/* Reward tier badges */
.tier-badge-cluster{
  min-width: 150px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding: 8px 0 14px !important;
}
.tier-badge-cluster .badge-art{
  width:auto !important;
  height:126px !important;
  max-width:none !important;
  object-fit:contain !important;
  filter: drop-shadow(0 10px 18px rgba(17,44,76,.12)) !important;
}
.tier-board-row.platinum-row .badge-art{ height: 140px !important; }
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{ height: 122px !important; }
.tier-board-row.silver-row{
  background: linear-gradient(180deg,#f5f7fa 0%,#e6ebf1 100%) !important;
  border-color: rgba(140,151,166,.34) !important;
}
.tier-board-row.silver-row .tier-board-copy p{ color:#6d7888 !important; }
.tier-board-row.silver-row .tier-brand-list span{ background:#e8edf3 !important; color:#667489 !important; }

/* Make rewards boxes clearly feel like chat bubbles */
.reward-chat-bubble{
  position:relative !important;
  border-radius:24px !important;
}
.reward-chat-bubble::after{
  content:"";
  position:absolute;
  left:-10px;
  top:50%;
  width:18px;
  height:18px;
  transform:translateY(-50%) rotate(45deg);
  background: inherit;
  border-left: inherit;
  border-bottom: inherit;
  box-shadow: -10px 10px 22px rgba(1,16,42,.08);
}

/* Subtle blue wave + glitter for features section only */
.feature-experience{
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(248,252,255,.9)) !important;
  overflow:hidden !important;
  isolation:isolate;
}
.feature-experience::before{
  content:"";
  position:absolute;
  left:-8%;
  bottom:-18%;
  width:42%;
  height:135%;
  border-radius:58% 42% 62% 38% / 36% 52% 48% 64%;
  background:
    radial-gradient(circle at 68% 30%, rgba(255,255,255,.38) 0 7%, transparent 8%),
    linear-gradient(180deg, rgba(102,197,231,.18) 0%, rgba(63,175,214,.12) 48%, rgba(15,110,170,.04) 100%);
  filter: blur(2px);
  opacity:.82;
  animation: featureWaveFloat 12s ease-in-out infinite;
  z-index:0;
  pointer-events:none;
}
.feature-experience::after{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(circle at 14% 72%, rgba(255,255,255,.45) 0 1.5px, transparent 2px),
    radial-gradient(circle at 20% 84%, rgba(47,181,212,.18) 0 1.5px, transparent 2px),
    radial-gradient(circle at 26% 63%, rgba(255,255,255,.32) 0 1px, transparent 1.8px),
    radial-gradient(circle at 90% 18%, rgba(255,255,255,.22) 0 1px, transparent 1.7px);
  opacity:.55;
  z-index:0;
  pointer-events:none;
}
.feature-experience > *{ position:relative; z-index:1; }
@keyframes featureWaveFloat{
  0%,100%{ transform: translateY(0) translateX(0) rotate(0deg); }
  50%{ transform: translateY(-18px) translateX(8px) rotate(-3deg); }
}

@media (max-width: 767px){
  .tier-badge-cluster{ min-width:0 !important; padding-bottom:10px !important; }
  .tier-badge-cluster .badge-art{ height:96px !important; }
  .tier-board-row.platinum-row .badge-art{ height:106px !important; }
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{ height:94px !important; }
  .feature-experience::before{ width:60%; left:-16%; bottom:-16%; opacity:.7; }
}


/* === v14 fixes: cleaner feature background, equal badges, whatsapp icon, download apps section === */
.feature-experience::before,
.feature-experience::after{
  display:none !important;
}
.feature-experience{
  background: linear-gradient(180deg, rgba(255,255,255,.97), rgba(250,252,255,.95)) !important;
}

.tier-board-row{
  align-items:center !important;
}
.tier-badge-cluster{
  min-width:150px !important;
  padding:10px 0 !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:128px !important;
  height:128px !important;
  object-fit:contain !important;
}
.tier-board-row.platinum-row{
  background: linear-gradient(180deg,#edf4ff 0%,#ddebf8 100%) !important;
  border-color: rgba(123,150,185,.32) !important;
}
.tier-board-row.gold-row{
  background: linear-gradient(180deg,#fff8de 0%,#f9edb8 100%) !important;
  border-color: rgba(219,185,76,.34) !important;
}
.tier-board-row.silver-row{
  background: linear-gradient(180deg,#f7f8fb 0%,#e3e8ef 100%) !important;
  border-color: rgba(156,166,178,.30) !important;
}

.whatsapp-float,
.whatsapp-float:hover{
  display:flex !important;
  position:fixed !important;
  right:18px !important;
  bottom:20px !important;
  width:66px !important;
  height:66px !important;
  min-width:66px !important;
  border-radius:999px !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  background: transparent !important;
  box-shadow:none !important;
  z-index:1200 !important;
}
.whatsapp-float img{
  width:66px !important;
  height:66px !important;
  object-fit:contain !important;
  filter: drop-shadow(0 10px 18px rgba(10,85,40,.18));
}
.whatsapp-float span,
.whatsapp-float strong,
.whatsapp-float small{
  display:none !important;
}

.download-apps-section{
  padding-top:70px;
}
.download-apps-box{
  text-align:center;
  color:#fff;
  padding:54px 36px;
  border-radius:34px;
  background:
    linear-gradient(135deg, rgba(31,57,128,.96) 0%, rgba(72,83,180,.93) 48%, rgba(95,116,211,.92) 100%);
  box-shadow:0 24px 46px rgba(36,49,117,.24);
}
.download-apps-box .eyebrow,
.download-apps-box h2,
.download-apps-box p{
  color:#fff;
}
.download-apps-box p{
  max-width:780px;
  margin-left:auto;
  margin-right:auto;
  color:rgba(255,255,255,.9);
}
.download-store-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:18px;
  margin-top:28px;
}
.store-badge{
  min-width:220px;
  padding:18px 22px;
  border-radius:18px;
  background:rgba(255,255,255,.96);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 14px 24px rgba(18,28,75,.16);
  text-align:left;
  transition:transform .2s ease, box-shadow .2s ease;
}
.store-badge:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 30px rgba(18,28,75,.20);
}
.store-top{
  display:block;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.04em;
  color:#4f5f7c;
  text-transform:uppercase;
}
.store-badge strong{
  display:block;
  margin-top:4px;
  font-size:1.5rem;
  line-height:1.1;
  color:#202f50;
}

@media (max-width: 767px){
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:104px !important;
    height:104px !important;
  }
  .download-apps-box{
    padding:42px 22px;
    border-radius:26px;
  }
  .store-badge{
    min-width:unset;
    width:100%;
    text-align:center;
  }
  .whatsapp-float,
  .whatsapp-float:hover{
    width:60px !important;
    height:60px !important;
    min-width:60px !important;
    right:14px !important;
    bottom:16px !important;
  }
  .whatsapp-float img{
    width:60px !important;
    height:60px !important;
  }
}

/* === v15 ecosystem carousel geometry fix ===
   Active card is straight and fully readable.
   Side cards keep the same full card size but sit slightly angled.
   No inner scrolling/cut-off; automatic rotation still uses the same JS timing. */
.ecosystem-section{
  overflow:hidden !important;
}
.ecosystem-card-deck{
  position:relative !important;
  width:100% !important;
  max-width:1180px !important;
  height:690px !important;
  min-height:690px !important;
  margin:22px auto 0 !important;
  overflow:visible !important;
  perspective:1600px !important;
}
.ecosystem-rotate-card{
  position:absolute !important;
  left:50% !important;
  top:0 !important;
  width:560px !important;
  height:640px !important;
  min-height:640px !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  border-radius:30px !important;
  transform-origin:center center !important;
  backface-visibility:hidden !important;
  transition:transform .72s cubic-bezier(.22,.72,.21,1), opacity .62s ease, filter .62s ease, box-shadow .62s ease !important;
}
.ecosystem-card-image{
  width:100% !important;
  height:185px !important;
  flex:0 0 185px !important;
  overflow:hidden !important;
}
.ecosystem-card-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}
.ecosystem-card-body{
  flex:1 1 auto !important;
  height:auto !important;
  min-height:0 !important;
  padding:24px 28px 26px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  gap:10px !important;
  overflow:visible !important;
}
.ecosystem-card-body > span{
  margin:0 !important;
  font-size:.82rem !important;
  line-height:1.25 !important;
  letter-spacing:.075em !important;
}
.ecosystem-card-body h3{
  margin:0 0 4px !important;
  font-size:1.55rem !important;
  line-height:1.18 !important;
}
.ecosystem-card-body ul{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  gap:8px !important;
  font-size:.90rem !important;
  line-height:1.46 !important;
}
.ecosystem-card-body li{
  position:relative !important;
  padding-left:24px !important;
  overflow:visible !important;
}
.ecosystem-card-body li::before{
  content:"✓" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
}
.ecosystem-rotate-card.is-active{
  z-index:5 !important;
  opacity:1 !important;
  filter:none !important;
  transform:translateX(-50%) translateY(0) rotateY(0deg) scale(1) !important;
  box-shadow:0 28px 58px rgba(11,47,91,.16) !important;
}
.ecosystem-rotate-card.is-prev{
  z-index:2 !important;
  opacity:.68 !important;
  filter:saturate(.90) brightness(.99) !important;
  transform:translateX(calc(-50% - 350px)) translateY(30px) rotateY(11deg) scale(.86) !important;
  box-shadow:0 20px 42px rgba(11,47,91,.10) !important;
}
.ecosystem-rotate-card.is-next{
  z-index:2 !important;
  opacity:.68 !important;
  filter:saturate(.90) brightness(.99) !important;
  transform:translateX(calc(-50% + 350px)) translateY(30px) rotateY(-11deg) scale(.86) !important;
  box-shadow:0 20px 42px rgba(11,47,91,.10) !important;
}
.ecosystem-card-controls{
  margin-top:8px !important;
}

@media (max-width:1200px){
  .ecosystem-card-deck{
    max-width:1040px !important;
    height:660px !important;
    min-height:660px !important;
  }
  .ecosystem-rotate-card{
    width:510px !important;
    height:615px !important;
    min-height:615px !important;
  }
  .ecosystem-card-image{height:175px !important;flex-basis:175px !important;}
  .ecosystem-rotate-card.is-prev{
    transform:translateX(calc(-50% - 295px)) translateY(28px) rotateY(10deg) scale(.85) !important;
  }
  .ecosystem-rotate-card.is-next{
    transform:translateX(calc(-50% + 295px)) translateY(28px) rotateY(-10deg) scale(.85) !important;
  }
}

@media (max-width:900px){
  .ecosystem-card-deck{
    max-width:100% !important;
    height:610px !important;
    min-height:610px !important;
    overflow:hidden !important;
  }
  .ecosystem-rotate-card{
    width:min(500px,86vw) !important;
    height:575px !important;
    min-height:575px !important;
  }
  .ecosystem-card-image{height:165px !important;flex-basis:165px !important;}
  .ecosystem-card-body{padding:22px 22px 24px !important;}
  .ecosystem-card-body h3{font-size:1.38rem !important;}
  .ecosystem-card-body ul{font-size:.86rem !important;gap:7px !important;}
  .ecosystem-rotate-card.is-prev{
    opacity:.16 !important;
    pointer-events:none !important;
    transform:translateX(calc(-50% - 105px)) translateY(20px) rotateY(8deg) scale(.88) !important;
  }
  .ecosystem-rotate-card.is-next{
    opacity:.16 !important;
    pointer-events:none !important;
    transform:translateX(calc(-50% + 105px)) translateY(20px) rotateY(-8deg) scale(.88) !important;
  }
}

@media (max-width:600px){
  .ecosystem-card-deck{
    height:565px !important;
    min-height:565px !important;
  }
  .ecosystem-rotate-card{
    width:min(450px,92vw) !important;
    height:535px !important;
    min-height:535px !important;
    border-radius:25px !important;
  }
  .ecosystem-card-image{height:150px !important;flex-basis:150px !important;}
  .ecosystem-card-body{padding:18px 18px 20px !important;gap:8px !important;}
  .ecosystem-card-body > span{font-size:.72rem !important;}
  .ecosystem-card-body h3{font-size:1.18rem !important;}
  .ecosystem-card-body ul{font-size:.79rem !important;line-height:1.42 !important;gap:6px !important;}
  .ecosystem-rotate-card.is-prev,
  .ecosystem-rotate-card.is-next{
    opacity:.08 !important;
  }
}


/* === v16: plain Features background + equal badges + clean WhatsApp + HomeCloudAsia app-download banner === */

/* Features: no side wave / no glitter. Keep the approved page background. */
.features-section{
  background: linear-gradient(180deg,#eaf5fb 0%,#f5fbff 100%) !important;
}
.feature-experience,
.feature-experience:not(.engaged),
.feature-experience.engaged{
  background: rgba(255,255,255,.70) !important;
  overflow:hidden !important;
}
.feature-experience::before,
.feature-experience::after{
  content:none !important;
  display:none !important;
  background:none !important;
  animation:none !important;
}

/* All three badges use the exact same display box. */
.tier-badge-cluster{
  width:150px !important;
  min-width:150px !important;
  height:150px !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:140px !important;
  height:140px !important;
  max-width:140px !important;
  max-height:140px !important;
  object-fit:contain !important;
  display:block !important;
}
.tier-board-row.platinum-row{
  background:linear-gradient(180deg,#eef5ff 0%,#ddeaf8 100%) !important;
}
.tier-board-row.gold-row{
  background:linear-gradient(180deg,#fff8df 0%,#f9edbc 100%) !important;
}
.tier-board-row.silver-row{
  background:linear-gradient(180deg,#f8f9fb 0%,#e5e9ef 100%) !important;
}

/* WhatsApp: one clean green circular icon, fixed while scrolling. */
.whatsapp-float,
.whatsapp-float:hover{
  position:fixed !important;
  right:20px !important;
  bottom:20px !important;
  z-index:1300 !important;
  display:grid !important;
  place-items:center !important;
  width:64px !important;
  height:64px !important;
  min-width:64px !important;
  min-height:64px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:transparent !important;
  box-shadow:0 14px 28px rgba(17,116,62,.20) !important;
  overflow:visible !important;
  transform:none !important;
}
.whatsapp-icon{
  width:64px !important;
  height:64px !important;
  display:block !important;
  filter:none !important;
}
.whatsapp-float img,
.whatsapp-float span,
.whatsapp-float strong,
.whatsapp-float small{
  display:none !important;
}

/* Download section inspired by the iCare layout, but using HomeCloudAsia assets. */
.download-apps-section{
  padding:72px 0 88px !important;
  overflow:hidden;
}
.download-apps-box{
  position:relative;
  width:min(1080px,100%);
  min-height:410px;
  margin-inline:auto;
  padding:54px 36px !important;
  border-radius:30px !important;
  overflow:hidden;
  isolation:isolate;
  color:#fff;
  background:linear-gradient(115deg,#263f95 0%,#4d58b2 50%,#6673c8 100%) !important;
  box-shadow:0 24px 50px rgba(36,49,117,.20) !important;
}
.download-bg-art{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}
.download-bg-art::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(26,39,106,.28),rgba(44,52,126,.46) 42%,rgba(51,57,121,.34));
}
.download-logo-watermark{
  position:absolute;
  left:12%;
  top:50%;
  width:235px;
  transform:translateY(-50%);
  opacity:.15;
  filter:brightness(0) invert(1);
}
.download-phone-art{
  position:absolute;
  width:210px;
  padding:9px;
  border-radius:34px;
  background:#10151f;
  border:1px solid rgba(255,255,255,.26);
  box-shadow:0 20px 36px rgba(7,12,45,.28);
  overflow:hidden;
}
.download-phone-art img{
  width:100%;
  height:auto;
  border-radius:25px;
  display:block;
}
.download-phone-left{
  left:-55px;
  bottom:-125px;
  transform:rotate(-18deg) scale(1.15);
  opacity:.64;
}
.download-phone-right{
  right:-55px;
  bottom:-138px;
  transform:rotate(16deg) scale(1.16);
  opacity:.62;
}
.download-phone-top{
  right:116px;
  top:-170px;
  transform:rotate(8deg) scale(.92);
  opacity:.42;
}
.download-apps-content{
  position:relative;
  z-index:2;
  max-width:760px;
  margin:0 auto;
  text-align:center;
}
.download-apps-content .eyebrow,
.download-apps-content h2,
.download-apps-content p{
  color:#fff !important;
}
.download-apps-content h2{
  margin-bottom:14px;
  font-size:clamp(2.25rem,4vw,3.6rem);
}
.download-apps-content p{
  max-width:700px;
  margin:0 auto;
  color:rgba(255,255,255,.88) !important;
}
.download-store-row{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px;
  margin-top:28px;
}
.store-badge{
  display:flex !important;
  align-items:center;
  gap:14px;
  width:248px;
  min-width:0 !important;
  padding:14px 18px !important;
  border-radius:14px !important;
  text-align:left !important;
  color:#202f50;
  background:rgba(255,255,255,.96) !important;
  border:1px solid rgba(255,255,255,.65) !important;
  box-shadow:0 12px 26px rgba(18,28,75,.14) !important;
}
.store-icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  color:#20252d;
}
.apple-icon{
  position:relative;
  color:transparent;
}
.apple-icon::before{
  content:"";
  width:27px;
  height:31px;
  background:#262a31;
  border-radius:45% 45% 50% 50% / 58% 58% 44% 44%;
  transform:rotate(-4deg);
}
.apple-icon::after{
  content:"";
  position:absolute;
  width:10px;
  height:7px;
  border-radius:80% 0 80% 0;
  background:#262a31;
  top:2px;
  left:24px;
  transform:rotate(-38deg);
}
.play-icon::before{
  content:"";
  display:block;
  width:0;
  height:0;
  border-top:20px solid transparent;
  border-bottom:20px solid transparent;
  border-left:34px solid #343941;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.08));
}
.store-copy{
  display:block;
  min-width:0;
}
.store-top{
  display:block;
  margin:0 0 2px;
  font-size:.72rem !important;
  line-height:1.15;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#59677c !important;
}
.store-badge strong{
  display:block;
  margin:0 !important;
  font-size:1.55rem !important;
  line-height:1.08 !important;
  color:#202f50 !important;
}

@media (max-width:900px){
  .download-apps-box{
    width:100%;
    min-height:390px;
    padding:46px 24px !important;
  }
  .download-phone-left{left:-92px;bottom:-145px;transform:rotate(-16deg) scale(1.0)}
  .download-phone-right{right:-92px;bottom:-150px;transform:rotate(15deg) scale(1.0)}
  .download-phone-top{display:none}
  .download-logo-watermark{width:190px;left:8%}
}
@media (max-width:640px){
  .tier-badge-cluster{
    width:124px !important;
    min-width:124px !important;
    height:124px !important;
  }
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:116px !important;
    height:116px !important;
    max-width:116px !important;
    max-height:116px !important;
  }
  .download-apps-section{padding:54px 0 68px !important}
  .download-apps-box{
    min-height:430px;
    padding:42px 18px !important;
    border-radius:24px !important;
  }
  .download-phone-left{left:-110px;bottom:-115px;width:185px;opacity:.38}
  .download-phone-right{right:-110px;bottom:-120px;width:185px;opacity:.38}
  .download-logo-watermark{left:50%;top:53%;transform:translate(-50%,-50%);width:170px;opacity:.11}
  .download-store-row{display:grid;grid-template-columns:1fr;max-width:310px;margin:26px auto 0}
  .store-badge{width:100% !important;justify-content:flex-start}
  .whatsapp-float,
  .whatsapp-float:hover{
    width:58px !important;height:58px !important;min-width:58px !important;min-height:58px !important;right:14px !important;bottom:16px !important;
  }
  .whatsapp-icon{width:58px !important;height:58px !important}
}

/* === v17 final polish: silver glitter + smaller ecosystem cards + cloud chat bubbles + medium badges + wider download banner === */
html,body{overflow-x:hidden !important;}
body{
  background:
    radial-gradient(circle at 14% 18%, rgba(255,255,255,.78) 0 1.4px, transparent 1.6px),
    radial-gradient(circle at 82% 26%, rgba(255,255,255,.52) 0 1px, transparent 1.2px),
    radial-gradient(circle at 24% 72%, rgba(255,255,255,.48) 0 1.1px, transparent 1.3px),
    radial-gradient(circle at 70% 82%, rgba(255,255,255,.44) 0 1.1px, transparent 1.3px),
    linear-gradient(180deg,#edf4f9 0%,#f4f8fc 38%,#eef5fb 100%) !important;
  background-attachment: fixed;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle at 10% 12%, rgba(255,255,255,.45) 0 2px, transparent 2.4px),
    radial-gradient(circle at 32% 84%, rgba(255,255,255,.34) 0 1.6px, transparent 2px),
    radial-gradient(circle at 60% 14%, rgba(255,255,255,.30) 0 1.8px, transparent 2.2px),
    radial-gradient(circle at 86% 64%, rgba(255,255,255,.36) 0 1.8px, transparent 2.2px);
  opacity:.55;
  animation:silverTwinkle 8s ease-in-out infinite alternate;
}
@keyframes silverTwinkle{
  from{opacity:.32;transform:translateY(0)}
  to{opacity:.6;transform:translateY(-4px)}
}
.site-header,.section,.site-footer,.download-apps-section{position:relative;z-index:1}

/* Rewards cloud bubbles */
.reward-phone-stage{
  grid-template-columns:minmax(280px,325px) minmax(230px,270px) !important;
  width:min(100%,690px) !important;
}
.reward-chat-stack{gap:26px !important;}
.reward-chat-bubble{
  padding:20px 20px 18px !important;
  border-radius:34px 34px 30px 30px / 28px 28px 36px 36px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(239,246,252,.95)) !important;
  box-shadow:0 18px 38px rgba(7,28,66,.18) !important;
}
.reward-chat-bubble::before{
  content:"" !important;
  position:absolute !important;
  left:-12px !important;
  top:34px !important;
  width:30px !important;
  height:30px !important;
  background:inherit !important;
  transform:rotate(45deg) !important;
  border-radius:0 0 0 12px !important;
  border-left:1px solid rgba(255,255,255,.95) !important;
  border-bottom:1px solid rgba(255,255,255,.95) !important;
}
.reward-chat-bubble::after{
  content:"";
  position:absolute;
  left:-4px;
  top:18px;
  width:24px;
  height:24px;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(239,246,252,.92));
  box-shadow:-14px 14px 0 2px rgba(247,251,255,.92);
}
.reward-chat-bubble strong{font-size:1.16rem !important;line-height:1.28 !important;}
.reward-chat-bubble small{font-size:.95rem !important;line-height:1.5 !important;}

/* Ecosystem carousel: all cards fit, center straight, side cards angled */
.ecosystem-card-deck{
  max-width:1060px !important;
  height:620px !important;
  min-height:620px !important;
  overflow:hidden !important;
}
.ecosystem-rotate-card{
  width:360px !important;
  height:510px !important;
  min-height:510px !important;
  border-radius:28px !important;
}
.ecosystem-card-image{
  height:150px !important;
  flex:0 0 150px !important;
}
.ecosystem-card-body{
  padding:20px 22px 22px !important;
  gap:12px !important;
}
.ecosystem-card-body > span{font-size:.82rem !important;line-height:1.2 !important;}
.ecosystem-card-body h3{
  font-size:1.05rem !important;
  line-height:1.22 !important;
}
.ecosystem-card-body ul{
  font-size:.74rem !important;
  line-height:1.45 !important;
  gap:8px !important;
}
.ecosystem-rotate-card.is-active{
  transform:translateX(-50%) translateY(0) rotateY(0deg) scale(1) !important;
  opacity:1 !important;
}
.ecosystem-rotate-card.is-prev{
  transform:translateX(calc(-50% - 255px)) translateY(26px) rotateY(13deg) scale(.86) !important;
  opacity:.72 !important;
}
.ecosystem-rotate-card.is-next{
  transform:translateX(calc(-50% + 255px)) translateY(26px) rotateY(-13deg) scale(.86) !important;
  opacity:.72 !important;
}
@media (max-width:1180px){
  .ecosystem-card-deck{max-width:960px !important;height:590px !important;min-height:590px !important;}
  .ecosystem-rotate-card{width:330px !important;height:490px !important;min-height:490px !important;}
  .ecosystem-rotate-card.is-prev{transform:translateX(calc(-50% - 210px)) translateY(22px) rotateY(11deg) scale(.82) !important;}
  .ecosystem-rotate-card.is-next{transform:translateX(calc(-50% + 210px)) translateY(22px) rotateY(-11deg) scale(.82) !important;}
  .ecosystem-card-body h3{font-size:.98rem !important}
  .ecosystem-card-body ul{font-size:.70rem !important}
}
@media (max-width:980px){
  .ecosystem-card-deck{height:550px !important;min-height:550px !important;}
  .ecosystem-rotate-card{width:min(430px,88vw) !important;height:470px !important;min-height:470px !important;}
  .ecosystem-rotate-card.is-prev,.ecosystem-rotate-card.is-next{opacity:0 !important;pointer-events:none;transform:translateX(-50%) translateY(18px) scale(.96) !important;}
  .ecosystem-card-image{height:145px !important;flex-basis:145px !important}
  .ecosystem-card-body h3{font-size:1.16rem !important}
  .ecosystem-card-body ul{font-size:.84rem !important}
}

/* Reward tiers: medium-sized matching badges */
.tier-board-row{
  align-items:center !important;
  grid-template-columns:160px minmax(0,1fr) !important;
}
.tier-badge-cluster{
  width:160px !important;
  min-width:160px !important;
  padding-bottom:0 !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:132px !important;
  height:132px !important;
  max-width:132px !important;
  max-height:132px !important;
  object-fit:contain !important;
}
.tier-board-row.silver-row{background:linear-gradient(180deg,#f7f9fc 0%,#e7ecf3 100%) !important;}
@media (max-width:640px){
  .tier-board-row{grid-template-columns:1fr !important;}
  .tier-badge-cluster{width:100% !important;min-width:0 !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:120px !important;height:120px !important;max-width:120px !important;max-height:120px !important;
  }
}

/* Full-width app download banner using HomeCloudAsia screenshots */
.download-apps-section{padding:76px 0 90px !important;}
.download-apps-box{
  width:min(1320px,96vw) !important;
  min-height:520px !important;
  padding:64px 40px !important;
  border-radius:32px !important;
  background:linear-gradient(115deg,rgba(35,55,132,.96) 0%,rgba(76,78,171,.95) 52%,rgba(105,114,206,.93) 100%) !important;
}
.download-bg-art::after{
  background:linear-gradient(90deg,rgba(24,35,96,.54) 0%,rgba(36,44,111,.42) 26%,rgba(49,57,126,.40) 58%,rgba(33,40,99,.56) 100%) !important;
}
.download-logo-watermark{width:250px !important;left:50% !important;top:50% !important;transform:translate(-50%,-50%) !important;opacity:.12 !important;}
.download-phone-art{width:235px !important;border-radius:38px !important;padding:10px !important;}
.download-phone-left{left:-38px !important;bottom:-86px !important;transform:rotate(-18deg) scale(1.06) !important;opacity:.86 !important;}
.download-phone-right{right:-42px !important;bottom:-92px !important;transform:rotate(16deg) scale(1.06) !important;opacity:.86 !important;}
.download-phone-top{right:130px !important;top:-88px !important;transform:rotate(10deg) scale(.88) !important;opacity:.74 !important;}
.download-apps-content{max-width:760px !important;}
.download-apps-content h2{font-size:clamp(2.4rem,4vw,4.1rem) !important;}
.download-apps-content p{font-size:1.05rem !important;max-width:760px !important;}
.download-store-row{gap:18px !important;margin-top:34px !important;}
.store-badge{width:262px !important;padding:16px 18px !important;}
@media (max-width:900px){
  .download-apps-box{width:min(100%,96vw) !important;min-height:470px !important;padding:52px 24px !important;}
  .download-phone-left{left:-88px !important;bottom:-118px !important;opacity:.52 !important;}
  .download-phone-right{right:-88px !important;bottom:-118px !important;opacity:.52 !important;}
  .download-phone-top{display:none !important;}
}
@media (max-width:640px){
  .download-apps-box{min-height:430px !important;padding:42px 18px !important;}
  .download-apps-content h2{font-size:2.05rem !important;}
  .download-apps-content p{font-size:.98rem !important;}
  .download-store-row{max-width:320px !important;}
}

/* WhatsApp button: clean reference-style icon button */
.whatsapp-float,
.whatsapp-float:hover{
  width:64px !important;
  height:64px !important;
  min-width:64px !important;
  min-height:64px !important;
  padding:0 !important;
  right:18px !important;
  bottom:20px !important;
  border-radius:50% !important;
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
}
.whatsapp-icon{width:64px !important;height:64px !important;display:block !important;filter:drop-shadow(0 8px 18px rgba(11,47,91,.18));}


/* === v18 features refinement: subtle vertical wave background + floating two-tone feature cards === */
.features-section{
  background: linear-gradient(180deg,#eef5fa 0%,#f6fbff 100%) !important;
}
.feature-experience,
.feature-experience:not(.engaged),
.feature-experience.engaged{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(250,253,255,.90) 100%) !important;
}
.feature-experience::before,
.feature-experience::after{
  content:"" !important;
  position:absolute !important;
  inset:auto !important;
  display:block !important;
  pointer-events:none !important;
}
/* main soft wave flowing top to bottom */
.feature-experience::before{
  top:-8% !important;
  left:-6% !important;
  width:46% !important;
  height:118% !important;
  border-radius:48% 52% 44% 56% / 38% 60% 40% 62% !important;
  background:
    radial-gradient(circle at 24% 18%, rgba(164,220,242,.34) 0%, rgba(164,220,242,.18) 26%, rgba(164,220,242,0) 58%),
    linear-gradient(180deg, rgba(154,212,238,.20) 0%, rgba(130,199,231,.28) 34%, rgba(151,216,240,.14) 72%, rgba(255,255,255,0) 100%) !important;
  transform:rotate(10deg) !important;
  filter:blur(2px) !important;
  opacity:.82 !important;
}
/* extra lighter wave layer */
.feature-experience::after{
  top:-4% !important;
  left:10% !important;
  width:28% !important;
  height:112% !important;
  border-radius:50% 50% 45% 55% / 42% 58% 44% 56% !important;
  background:linear-gradient(180deg, rgba(206,236,247,.22) 0%, rgba(179,226,244,.16) 48%, rgba(255,255,255,0) 100%) !important;
  transform:rotate(-7deg) !important;
  opacity:.75 !important;
}
.feature-experience > *{position:relative;z-index:1 !important;}

.feature-rail{
  gap:14px !important;
}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  position:relative !important;
  border-radius:22px !important;
  min-height:74px !important;
  border:1px solid rgba(160,198,220,.44) !important;
  background:linear-gradient(90deg, rgba(232,245,252,.96) 0 48%, rgba(255,255,255,.97) 48% 100%) !important;
  box-shadow:0 10px 24px rgba(15,46,87,.06), inset 0 1px 0 rgba(255,255,255,.72) !important;
  overflow:hidden !important;
}
.feature-choice::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0));
  pointer-events:none;
}
.feature-choice:hover,
.feature-choice.active{
  transform:translateY(-2px) !important;
  border-color:rgba(92,177,214,.6) !important;
  box-shadow:0 14px 28px rgba(15,46,87,.10), inset 0 1px 0 rgba(255,255,255,.86) !important;
}
.feature-choice span{background:rgba(255,255,255,.58) !important; box-shadow:0 6px 16px rgba(11,47,91,.06);}
.feature-choice strong{font-size:1rem !important; color:#264b73 !important;}

@media (max-width:900px){
  .feature-rail{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    min-height:82px !important;
    border-radius:24px !important;
    background:linear-gradient(90deg, rgba(230,244,251,.98) 0 50%, rgba(255,255,255,.98) 50% 100%) !important;
    box-shadow:0 14px 26px rgba(18,47,82,.08) !important;
  }
  .feature-choice strong{font-size:1.02rem !important;}
}

@media (max-width:640px){
  .feature-experience::before{
    width:64% !important;
    left:-18% !important;
    opacity:.76 !important;
  }
  .feature-experience::after{
    width:42% !important;
    left:18% !important;
    opacity:.62 !important;
  }
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    min-height:84px !important;
    padding:16px 18px !important;
  }
}

/* === v19 refinements: softer mixed feature cards, subtle wave, cloud reward bubbles, larger badges === */

/* Features section: no hard half-half split, soft mixed colors */
.feature-experience{
  background:linear-gradient(180deg,#f7fbfe 0%,#fbfdff 100%) !important;
}
.feature-experience::before,
.feature-experience::after{
  content:"" !important;
  position:absolute !important;
  display:block !important;
  pointer-events:none !important;
}
/* subtle ribbon wave 1 */
.feature-experience::before{
  top:8% !important;
  left:-12% !important;
  width:82% !important;
  height:110px !important;
  border-radius:50% !important;
  background:linear-gradient(90deg, rgba(170,220,242,.14) 0%, rgba(122,196,231,.20) 36%, rgba(178,227,246,.10) 62%, rgba(255,255,255,0) 100%) !important;
  transform:rotate(-7deg) !important;
  filter:blur(1px) !important;
  opacity:.72 !important;
}
/* subtle ribbon wave 2 */
.feature-experience::after{
  top:46% !important;
  left:-4% !important;
  width:76% !important;
  height:98px !important;
  border-radius:50% !important;
  background:linear-gradient(90deg, rgba(188,232,248,.10) 0%, rgba(128,201,233,.16) 42%, rgba(210,239,250,.08) 72%, rgba(255,255,255,0) 100%) !important;
  transform:rotate(6deg) !important;
  opacity:.68 !important;
}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  background:
    radial-gradient(circle at 16% 50%, rgba(255,255,255,.30) 0 12%, rgba(255,255,255,0) 13%),
    linear-gradient(90deg,
      rgba(226,242,250,.98) 0%,
      rgba(236,247,252,.98) 30%,
      rgba(245,250,253,.98) 58%,
      rgba(255,255,255,.98) 100%) !important;
  border:1px solid rgba(165,205,225,.46) !important;
  box-shadow:0 12px 26px rgba(17,51,93,.06), inset 0 1px 0 rgba(255,255,255,.84) !important;
}
.feature-choice span{
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(245,250,253,.94)) !important;
  border:1px solid rgba(224,235,244,.74) !important;
}
.feature-choice strong{color:#385b86 !important;}

/* Rewards bubbles: thought-cloud style */
.reward-chat-stack{gap:22px !important;}
.reward-chat-bubble{
  position:relative !important;
  padding:22px 24px 20px !important;
  border-radius:34px !important;
  background:linear-gradient(180deg,rgba(249,252,255,.96),rgba(238,246,252,.96)) !important;
  border:1px solid rgba(255,255,255,.86) !important;
  box-shadow:0 20px 38px rgba(7,28,66,.18) !important;
}
.reward-chat-bubble::before{
  content:"" !important;
  position:absolute !important;
  left:-22px !important;
  top:30px !important;
  width:28px !important;
  height:28px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,rgba(249,252,255,.96),rgba(238,246,252,.96)) !important;
  box-shadow:
    -14px -11px 0 3px rgba(247,251,255,.96),
    -6px 18px 0 -1px rgba(244,249,253,.96) !important;
  border:1px solid rgba(255,255,255,.82) !important;
}
.reward-chat-bubble::after{
  content:"" !important;
  position:absolute !important;
  left:-40px !important;
  top:55px !important;
  width:14px !important;
  height:14px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,rgba(248,252,255,.96),rgba(240,247,252,.95)) !important;
  border:1px solid rgba(255,255,255,.82) !important;
  box-shadow:none !important;
}
.reward-chat-bubble span{font-size:.84rem !important; letter-spacing:.06em !important;}
.reward-chat-bubble strong{font-size:1.18rem !important;}
.reward-chat-bubble small{font-size:.95rem !important;}

/* Larger, more balanced reward badges */
.tier-board-row{
  grid-template-columns:190px minmax(0,1fr) !important;
}
.tier-badge-cluster{
  width:190px !important;
  min-width:190px !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:162px !important;
  height:162px !important;
  max-width:162px !important;
  max-height:162px !important;
}
.tier-board-row.platinum-row .badge-art{width:168px !important;height:168px !important;max-width:168px !important;max-height:168px !important;}
.tier-board-row.gold-row .badge-art{width:162px !important;height:162px !important;}
.tier-board-row.silver-row .badge-art{width:162px !important;height:162px !important;}

@media (max-width:900px){
  .feature-experience::before{width:88% !important;height:96px !important;left:-18% !important;top:10% !important;}
  .feature-experience::after{width:84% !important;height:88px !important;left:-8% !important;top:52% !important;}
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    background:linear-gradient(90deg,
      rgba(228,243,250,.98) 0%,
      rgba(238,248,252,.98) 38%,
      rgba(247,251,254,.98) 66%,
      rgba(255,255,255,.98) 100%) !important;
  }
}

@media (max-width:640px){
  .feature-experience::before{width:92% !important;height:84px !important;left:-22% !important;top:8% !important;opacity:.60 !important;}
  .feature-experience::after{width:92% !important;height:78px !important;left:-10% !important;top:56% !important;opacity:.55 !important;}
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    background:linear-gradient(90deg,
      rgba(226,242,249,.98) 0%,
      rgba(236,247,252,.98) 42%,
      rgba(246,251,254,.98) 72%,
      rgba(255,255,255,.98) 100%) !important;
  }
  .reward-chat-bubble{padding:18px 20px 18px !important; border-radius:30px !important;}
  .reward-chat-bubble::before{left:-18px !important; width:24px !important; height:24px !important; top:26px !important; box-shadow:-12px -9px 0 2px rgba(247,251,255,.96), -6px 15px 0 -1px rgba(244,249,253,.96) !important;}
  .reward-chat-bubble::after{left:-32px !important; top:50px !important; width:12px !important; height:12px !important;}
  .tier-board-row{grid-template-columns:1fr !important;}
  .tier-badge-cluster{width:100% !important; min-width:0 !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:138px !important;
    height:138px !important;
    max-width:138px !important;
    max-height:138px !important;
  }
  .tier-board-row.platinum-row .badge-art{width:146px !important;height:146px !important;max-width:146px !important;max-height:146px !important;}
}


/* === v20 final fixes: floating feature cards, subtle wave background, cloud reward bubbles, larger equal badges === */
.feature-experience{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,#f7fbfe 0%,#fcfdff 100%) !important;
}
/* user-requested subtle blue wave from top to bottom behind the feature list */
.feature-experience::before{
  content:"" !important;
  position:absolute !important;
  top:-2% !important;
  bottom:-2% !important;
  left:-5% !important;
  width:46% !important;
  background-image:url('assets/graphics/feature-wave-reference.png') !important;
  background-repeat:repeat-y !important;
  background-size:100% auto !important;
  background-position:center top !important;
  opacity:.14 !important;
  transform:none !important;
  border-radius:38px !important;
  pointer-events:none !important;
  filter:saturate(.95) !important;
}
.feature-experience::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.78) 0 12%, rgba(255,255,255,0) 36%),
    radial-gradient(circle at 18% 72%, rgba(255,255,255,.54) 0 10%, rgba(255,255,255,0) 34%);
  pointer-events:none !important;
}

.feature-rail{
  position:relative !important;
  z-index:2 !important;
}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  position:relative !important;
  z-index:1 !important;
  min-height:82px !important;
  border-radius:26px !important;
  border:1px solid rgba(165,204,226,.60) !important;
  background:
    radial-gradient(circle at 16% 50%, rgba(255,255,255,.55) 0 10%, rgba(255,255,255,0) 24%),
    linear-gradient(120deg,
      rgba(228,243,251,.96) 0%,
      rgba(237,247,252,.98) 34%,
      rgba(246,251,254,.98) 64%,
      rgba(255,255,255,.98) 100%) !important;
  box-shadow:0 14px 26px rgba(16,45,86,.08), 0 2px 0 rgba(255,255,255,.75) inset !important;
  transform:translateY(0) !important;
  animation:featureFloat 5.2s ease-in-out infinite !important;
  overflow:hidden !important;
}
.feature-choice:nth-child(2){animation-delay:-.7s !important;}
.feature-choice:nth-child(3){animation-delay:-1.4s !important;}
.feature-choice:nth-child(4){animation-delay:-2.1s !important;}
.feature-choice:nth-child(5){animation-delay:-2.8s !important;}
.feature-choice:nth-child(6){animation-delay:-3.5s !important;}
.feature-choice:nth-child(7){animation-delay:-4.2s !important;}
.feature-choice:nth-child(8){animation-delay:-4.9s !important;}
.feature-choice.active{
  border-color:rgba(83,183,222,.72) !important;
  box-shadow:0 16px 32px rgba(13,49,88,.12), 0 2px 0 rgba(255,255,255,.88) inset !important;
}
.feature-choice:hover{ transform:translateY(-2px) !important; }
.feature-choice span{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(242,248,251,.95)) !important;
  box-shadow:0 8px 18px rgba(14,45,80,.06) !important;
  border:1px solid rgba(232,238,244,.88) !important;
}
.feature-choice strong{ color:#375b87 !important; }
@keyframes featureFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-6px); }
}

/* reward highlight bubbles more cloud-like */
.reward-chat-stack{
  gap:24px !important;
}
.reward-chat-bubble{
  position:relative !important;
  padding:26px 28px 24px !important;
  border-radius:34px 42px 36px 42px !important;
  background:linear-gradient(180deg, rgba(249,252,255,.97), rgba(237,245,252,.97)) !important;
  border:1px solid rgba(255,255,255,.92) !important;
  box-shadow:0 22px 40px rgba(7,28,66,.20) !important;
}
.reward-chat-bubble::before{
  content:"" !important;
  position:absolute !important;
  width:30px !important;
  height:30px !important;
  left:-16px !important;
  top:30px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg, rgba(249,252,255,.98), rgba(237,245,252,.98)) !important;
  border:1px solid rgba(255,255,255,.92) !important;
  box-shadow:
    -22px -12px 0 6px rgba(246,250,254,.98),
    -9px 20px 0 1px rgba(241,247,252,.98),
    8px -18px 0 2px rgba(246,250,254,.96) !important;
}
.reward-chat-bubble::after{
  content:"" !important;
  position:absolute !important;
  width:14px !important;
  height:14px !important;
  left:-38px !important;
  top:57px !important;
  border-radius:50% !important;
  background:linear-gradient(180deg, rgba(248,252,255,.98), rgba(240,247,252,.98)) !important;
  border:1px solid rgba(255,255,255,.92) !important;
}
.reward-chat-bubble span{font-size:.82rem !important; letter-spacing:.08em !important; font-weight:800 !important;}
.reward-chat-bubble strong{font-size:1.2rem !important; line-height:1.26 !important;}
.reward-chat-bubble small{font-size:.95rem !important; line-height:1.5 !important;}

/* larger badges with matching size across all three rows */
.tier-board-row{
  grid-template-columns:210px minmax(0,1fr) !important;
  align-items:center !important;
}
.tier-badge-cluster{
  width:210px !important;
  min-width:210px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:182px !important;
  height:182px !important;
  max-width:182px !important;
  max-height:182px !important;
  object-fit:contain !important;
}

@media (max-width:900px){
  .feature-experience::before{
    width:88% !important;
    left:-14% !important;
    opacity:.12 !important;
  }
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    min-height:84px !important;
  }
}
@media (max-width:640px){
  .feature-experience::before{
    width:96% !important;
    left:-24% !important;
    opacity:.12 !important;
    background-size:100% auto !important;
  }
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    min-height:86px !important;
    animation:featureFloatMobile 5s ease-in-out infinite !important;
  }
  @keyframes featureFloatMobile{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-4px); }
  }
  .reward-chat-bubble{padding:20px 22px 20px !important;}
  .reward-chat-bubble::before{width:24px !important;height:24px !important;left:-14px !important;top:24px !important;box-shadow:-18px -10px 0 5px rgba(246,250,254,.98), -8px 17px 0 1px rgba(241,247,252,.98), 6px -14px 0 2px rgba(246,250,254,.96) !important;}
  .reward-chat-bubble::after{left:-30px !important;top:48px !important;width:12px !important;height:12px !important;}
  .tier-board-row{grid-template-columns:1fr !important;}
  .tier-badge-cluster{width:100% !important; min-width:0 !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:154px !important;
    height:154px !important;
    max-width:154px !important;
    max-height:154px !important;
  }
}

/* ==============================================================
   v21 — VISIBLE FINAL CORRECTIONS ONLY
   Features floating cards + user-reference wave
   Rewards premium thought-cloud bubbles
   Reward tier badges enlarged equally
   ============================================================== */

/* -------- FEATURES -------- */
.feature-experience{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(249,253,255,.96)) !important;
}
/* Disable every older pseudo wave so only the user-reference wave appears. */
.feature-experience::before,
.feature-experience::after{
  content:none !important;
  display:none !important;
}
.feature-wave-layer{
  position:absolute;
  z-index:0;
  top:0;
  bottom:0;
  left:-42px;
  width:360px;
  background:url('assets/graphics/feature-wave-vertical.png') center/100% 100% no-repeat;
  opacity:.24;
  pointer-events:none;
  filter:saturate(.92) brightness(1.04);
}
.feature-rail,
.feature-phone-zone,
.feature-copy-zone{position:relative;z-index:2 !important;}
.feature-rail{gap:17px !important;padding:3px 2px !important;}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  position:relative !important;
  min-height:78px !important;
  border-radius:24px !important;
  border:1px solid rgba(150,199,224,.50) !important;
  /* smooth mix — intentionally NO straight 50/50 division */
  background:
    radial-gradient(circle at 16% 46%,rgba(219,241,251,.85) 0%,rgba(232,246,252,.65) 20%,rgba(255,255,255,0) 45%),
    linear-gradient(112deg,rgba(225,243,251,.96) 0%,rgba(240,249,253,.98) 43%,rgba(255,255,255,.99) 100%) !important;
  box-shadow:
    0 16px 30px rgba(12,49,88,.11),
    0 3px 7px rgba(26,114,157,.05),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
  transform:translate3d(0,0,0) !important;
  animation:hcFeatureFloat 5.4s ease-in-out infinite !important;
  transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease !important;
}
.feature-choice:nth-child(2){animation-delay:-.65s !important}.feature-choice:nth-child(3){animation-delay:-1.3s !important}.feature-choice:nth-child(4){animation-delay:-1.95s !important}.feature-choice:nth-child(5){animation-delay:-2.6s !important}.feature-choice:nth-child(6){animation-delay:-3.25s !important}.feature-choice:nth-child(7){animation-delay:-3.9s !important}.feature-choice:nth-child(8){animation-delay:-4.55s !important}
.feature-choice.active{
  border-color:rgba(48,177,220,.72) !important;
  box-shadow:0 20px 38px rgba(9,64,105,.15),inset 0 1px 0 rgba(255,255,255,1) !important;
}
.feature-choice:hover{transform:translateY(-4px) !important;}
.feature-choice span{
  position:relative;z-index:2;
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(226,238,246,.95) !important;
  box-shadow:0 8px 18px rgba(15,65,99,.07) !important;
}
.feature-choice strong{position:relative;z-index:2;color:#355c88 !important;}
@keyframes hcFeatureFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-7px)}
}

/* -------- REWARDS THOUGHT-CLOUD BUBBLES -------- */
.reward-chat-stack{gap:30px !important;overflow:visible !important;}
.reward-chat-bubble.reward-cloud-bubble{
  position:relative !important;
  overflow:visible !important;
  padding:24px 22px 22px !important;
  min-height:172px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  isolation:isolate;
}
.reward-cloud-content{
  position:relative;
  z-index:3;
  height:100%;
  min-height:126px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:22px 24px;
  border:1px solid rgba(255,255,255,.74);
  border-radius:46% 54% 48% 52% / 40% 44% 56% 60%;
  background:linear-gradient(155deg,rgba(255,255,255,.96),rgba(234,244,252,.92));
  box-shadow:0 22px 44px rgba(2,24,61,.20),inset 0 1px 0 rgba(255,255,255,.98);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.reward-cloud-bubble .cloud-puff{
  position:absolute;
  z-index:2;
  display:block;
  border-radius:50%;
  background:linear-gradient(155deg,rgba(255,255,255,.97),rgba(235,245,252,.94));
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 12px 26px rgba(2,24,61,.10);
}
.reward-cloud-bubble .puff-1{width:70px;height:70px;left:30px;top:6px;}
.reward-cloud-bubble .puff-2{width:82px;height:82px;left:88px;top:-2px;}
.reward-cloud-bubble .puff-3{width:72px;height:72px;right:48px;top:5px;}
.reward-cloud-bubble .puff-4{width:56px;height:56px;right:12px;top:34px;}
.reward-cloud-bubble .cloud-tail{
  position:absolute;
  z-index:2;
  display:block;
  border-radius:50%;
  background:linear-gradient(155deg,rgba(255,255,255,.96),rgba(235,245,252,.94));
  border:1px solid rgba(255,255,255,.76);
  box-shadow:0 8px 16px rgba(2,24,61,.10);
}
.reward-cloud-bubble .tail-1{width:24px;height:24px;left:-5px;bottom:34px;}
.reward-cloud-bubble .tail-2{width:12px;height:12px;left:-23px;bottom:18px;}
/* remove old pseudo tails completely */
.reward-chat-bubble::before,.reward-chat-bubble::after{content:none !important;display:none !important;}
.reward-cloud-content span{display:block;color:#67809a;font-size:.78rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;}
.reward-cloud-content strong{display:block;margin:7px 0 7px;color:#0b2f5b;font-size:1.16rem;line-height:1.28;}
.reward-cloud-content small{display:block;color:#607893;font-size:.88rem;line-height:1.48;}

/* -------- REWARD TIER BADGES -------- */
.tier-board-row{
  grid-template-columns:220px minmax(0,1fr) !important;
  min-height:236px !important;
  align-items:center !important;
}
.tier-badge-cluster{
  width:220px !important;
  min-width:220px !important;
  min-height:205px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  display:block !important;
  width:202px !important;
  height:202px !important;
  max-width:202px !important;
  max-height:202px !important;
  object-fit:contain !important;
  filter:drop-shadow(0 11px 18px rgba(18,46,79,.12)) !important;
}
.tier-board-row.platinum-row{background:linear-gradient(180deg,#edf5ff 0%,#dfeaf7 100%) !important;}
.tier-board-row.gold-row{background:linear-gradient(180deg,#fff9df 0%,#f8edbb 100%) !important;}
.tier-board-row.silver-row{background:linear-gradient(180deg,#f5f7fa 0%,#e0e5ec 100%) !important;}

@media(max-width:900px){
  .feature-wave-layer{left:-18%;width:88%;opacity:.18;background-size:auto 100%;}
  .feature-choice,.feature-choice:hover,.feature-choice.active{min-height:82px !important;}
  .reward-cloud-content{border-radius:42px !important;}
  .tier-board-row{grid-template-columns:1fr !important;min-height:auto !important;}
  .tier-badge-cluster{width:100% !important;min-width:0 !important;min-height:170px !important;}
  .tier-badge-cluster .badge-art,.tier-board-row.platinum-row .badge-art,.tier-board-row.gold-row .badge-art,.tier-board-row.silver-row .badge-art{width:170px !important;height:170px !important;max-width:170px !important;max-height:170px !important;}
}
@media(max-width:640px){
  .feature-wave-layer{left:-28%;width:112%;opacity:.15;}
  .feature-choice,.feature-choice:hover,.feature-choice.active{min-height:84px !important;animation:hcFeatureFloatMobile 5.1s ease-in-out infinite !important;}
  @keyframes hcFeatureFloatMobile{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
  .reward-chat-stack{gap:24px !important;}
  .reward-chat-bubble.reward-cloud-bubble{min-height:158px !important;padding:22px 15px 18px !important;}
  .reward-cloud-content{min-height:116px;padding:20px 21px;border-radius:40px !important;}
  .reward-cloud-bubble .puff-1{width:52px;height:52px;left:26px;top:7px}.reward-cloud-bubble .puff-2{width:60px;height:60px;left:72px;top:1px}.reward-cloud-bubble .puff-3{width:52px;height:52px;right:38px;top:7px}.reward-cloud-bubble .puff-4{width:42px;height:42px;right:8px;top:30px}
  .reward-cloud-bubble .tail-1{width:20px;height:20px;left:-2px;bottom:28px}.reward-cloud-bubble .tail-2{width:10px;height:10px;left:-16px;bottom:13px}
  .tier-badge-cluster{min-height:164px !important;}
  .tier-badge-cluster .badge-art,.tier-board-row.platinum-row .badge-art,.tier-board-row.gold-row .badge-art,.tier-board-row.silver-row .badge-art{width:158px !important;height:158px !important;max-width:158px !important;max-height:158px !important;}
}

/* v21.1 visual QA refinements */
.feature-wave-layer{
  background-image:url('assets/graphics/feature-wave-vertical.svg') !important;
  background-size:100% 100% !important;
  background-repeat:no-repeat !important;
  opacity:.78 !important; /* asset itself is very low-opacity */
  filter:none !important;
}
.tier-board-row{
  min-height:280px !important;
}
.tier-badge-cluster{
  min-height:220px !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:188px !important;
  height:188px !important;
  max-width:188px !important;
  max-height:188px !important;
}
@media(max-width:900px){
  .feature-wave-layer{opacity:.62 !important;}
  .tier-badge-cluster .badge-art,.tier-board-row.platinum-row .badge-art,.tier-board-row.gold-row .badge-art,.tier-board-row.silver-row .badge-art{width:166px !important;height:166px !important;max-width:166px !important;max-height:166px !important;}
}
@media(max-width:640px){
  .feature-wave-layer{opacity:.55 !important;}
  .tier-badge-cluster .badge-art,.tier-board-row.platinum-row .badge-art,.tier-board-row.gold-row .badge-art,.tier-board-row.silver-row .badge-art{width:154px !important;height:154px !important;max-width:154px !important;max-height:154px !important;}
}

/* v22 approved corrections: feature wave placement, reward cloud position, clear equal badges, no green journey steps */

/* ===== FEATURES: subtle vertical wave behind phone + copy only ===== */
.feature-experience{
  position:relative;
}
.feature-wave-layer{
  z-index:0 !important;
  top:16px !important;
  bottom:16px !important;
  left:calc(210px + 24px) !important;
  right:18px !important;
  width:auto !important;
  background-image:url('assets/graphics/feature-wave-vertical.svg') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:100% 100% !important;
  opacity:.26 !important;
  filter:none !important;
  mask-image:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.85) 10%, rgba(0,0,0,.95) 90%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, rgba(0,0,0,.85) 10%, rgba(0,0,0,.95) 90%, transparent 100%);
}
.feature-rail,
.feature-phone-zone,
.feature-copy-zone{
  position:relative;
  z-index:2 !important;
}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  border-radius:24px !important;
  border:1px solid rgba(157,202,227,.62) !important;
  background:
    radial-gradient(circle at 16% 44%, rgba(225,242,251,.92) 0%, rgba(235,247,252,.78) 24%, rgba(255,255,255,0) 48%),
    linear-gradient(105deg, rgba(230,245,252,.96) 0%, rgba(244,250,253,.98) 38%, rgba(255,255,255,.99) 100%) !important;
  box-shadow:
    0 16px 30px rgba(12,49,88,.10),
    0 4px 10px rgba(73,136,177,.05),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
}
.feature-choice:hover,
.feature-choice.active{
  border-color:rgba(70,174,222,.72) !important;
}
.feature-choice span{
  background:rgba(255,255,255,.84) !important;
  border:1px solid rgba(225,237,245,.96) !important;
  box-shadow:0 8px 18px rgba(15,65,99,.06) !important;
}
.feature-choice strong{
  color:#365b87 !important;
}

/* ===== REWARDS: neat premium thought bubbles positioned beside phone ===== */
.reward-phone-stage{
  display:grid !important;
  grid-template-columns:minmax(250px, 320px) minmax(250px, 310px) !important;
  align-items:center !important;
  column-gap:26px !important;
  row-gap:20px !important;
}
.reward-phone-stage .rewards-phone{
  grid-column:1 !important;
  justify-self:center !important;
}
.reward-chat-stack{
  grid-column:2 !important;
  width:100% !important;
  max-width:300px !important;
  margin:0 !important;
  justify-self:start !important;
  align-self:center !important;
  display:flex !important;
  flex-direction:column !important;
  gap:22px !important;
  overflow:visible !important;
}
.reward-chat-bubble.reward-cloud-bubble{
  width:100% !important;
  min-height:0 !important;
  padding:0 !important;
  overflow:visible !important;
  background:transparent !important;
  box-shadow:none !important;
}
.reward-chat-bubble.reward-cloud-bubble:first-child{
  margin-left:10px !important;
}
.reward-chat-bubble.reward-cloud-bubble:last-child{
  margin-left:0 !important;
}
.reward-cloud-content{
  min-height:148px !important;
  padding:22px 24px 22px 28px !important;
  border-radius:34px !important;
  background:linear-gradient(160deg, rgba(252,254,255,.97) 0%, rgba(236,245,251,.92) 100%) !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:0 20px 36px rgba(2,24,61,.18), inset 0 1px 0 rgba(255,255,255,.98) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}
.reward-cloud-bubble .cloud-puff,
.reward-cloud-bubble .cloud-tail{
  background:linear-gradient(160deg, rgba(252,254,255,.97) 0%, rgba(236,245,251,.92) 100%) !important;
  border:1px solid rgba(255,255,255,.74) !important;
  box-shadow:0 10px 20px rgba(2,24,61,.09) !important;
}
.reward-cloud-bubble .puff-1{width:54px !important;height:54px !important;left:24px !important;top:-8px !important;}
.reward-cloud-bubble .puff-2{width:68px !important;height:68px !important;left:74px !important;top:-16px !important;}
.reward-cloud-bubble .puff-3{width:56px !important;height:56px !important;right:48px !important;top:-10px !important;}
.reward-cloud-bubble .puff-4{width:42px !important;height:42px !important;right:10px !important;top:18px !important;}
.reward-cloud-bubble .tail-1{width:18px !important;height:18px !important;left:-10px !important;bottom:34px !important;}
.reward-cloud-bubble .tail-2{width:10px !important;height:10px !important;left:-26px !important;bottom:20px !important;}
.reward-cloud-content span{
  color:#68809a !important;
}
.reward-cloud-content strong{
  font-size:1.08rem !important;
  line-height:1.24 !important;
}
.reward-cloud-content small{
  font-size:.92rem !important;
  line-height:1.46 !important;
}

/* ===== REWARD BADGES: equal, clearer, larger ===== */
.tier-board-row{
  grid-template-columns:212px minmax(0,1fr) !important;
  min-height:252px !important;
  align-items:center !important;
}
.tier-badge-cluster{
  width:212px !important;
  min-width:212px !important;
  min-height:208px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:194px !important;
  height:194px !important;
  max-width:194px !important;
  max-height:194px !important;
  object-fit:contain !important;
  background:transparent !important;
  image-rendering:auto !important;
  filter:drop-shadow(0 10px 18px rgba(17,47,81,.12)) !important;
}
.tier-board-row.platinum-row{background:linear-gradient(180deg,#edf5ff 0%,#e1edf8 100%) !important;}
.tier-board-row.gold-row{background:linear-gradient(180deg,#fff8dd 0%,#f6edbe 100%) !important;}
.tier-board-row.silver-row{background:linear-gradient(180deg,#f5f7fa 0%,#e5e9ef 100%) !important;}

/* ===== HOW IT WORKS: remove green, keep HomeCloudAsia blue family ===== */
.green-step .process-badge{
  background:linear-gradient(145deg,#1ba8da 0%, #0f6fc0 100%) !important;
}

@media (max-width: 980px){
  .feature-wave-layer{
    left:16px !important;
    right:16px !important;
    top:12px !important;
    bottom:12px !important;
    opacity:.18 !important;
  }
  .reward-phone-stage{
    grid-template-columns:1fr !important;
  }
  .reward-phone-stage .rewards-phone,
  .reward-chat-stack{
    grid-column:1 !important;
    justify-self:center !important;
  }
  .reward-chat-stack{
    max-width:320px !important;
  }
  .reward-chat-bubble.reward-cloud-bubble:first-child{
    margin-left:18px !important;
  }
  .tier-board-row{
    grid-template-columns:1fr !important;
    min-height:auto !important;
  }
  .tier-badge-cluster{
    width:100% !important;
    min-width:0 !important;
    min-height:182px !important;
  }
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:172px !important;
    height:172px !important;
    max-width:172px !important;
    max-height:172px !important;
  }
}

@media (max-width: 640px){
  .feature-wave-layer{
    opacity:.14 !important;
  }
  .reward-chat-stack{
    width:min(100%, 300px) !important;
    gap:18px !important;
  }
  .reward-chat-bubble.reward-cloud-bubble:first-child{
    margin-left:12px !important;
  }
  .reward-cloud-content{
    min-height:136px !important;
    padding:20px 22px 20px 24px !important;
  }
  .reward-cloud-bubble .puff-1{width:48px !important;height:48px !important;left:20px !important;top:-7px !important;}
  .reward-cloud-bubble .puff-2{width:58px !important;height:58px !important;left:60px !important;top:-14px !important;}
  .reward-cloud-bubble .puff-3{width:50px !important;height:50px !important;right:40px !important;top:-9px !important;}
  .reward-cloud-bubble .puff-4{width:38px !important;height:38px !important;right:8px !important;top:18px !important;}
  .reward-cloud-bubble .tail-1{width:16px !important;height:16px !important;left:-8px !important;bottom:30px !important;}
  .reward-cloud-bubble .tail-2{width:10px !important;height:10px !important;left:-20px !important;bottom:18px !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:164px !important;
    height:164px !important;
    max-width:164px !important;
    max-height:164px !important;
  }
}

/* ===== FINAL MASTER FIXES — visible requested changes only ===== */

/* subtle silver glitter across the homepage */
html, body { min-height: 100%; }
body { position: relative; }
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .22;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.95) 0 1px, transparent 2px),
    radial-gradient(circle at 82% 12%, rgba(214,222,233,.92) 0 1px, transparent 2px),
    radial-gradient(circle at 28% 74%, rgba(255,255,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 70% 66%, rgba(218,226,236,.85) 0 1px, transparent 2px),
    radial-gradient(circle at 44% 38%, rgba(255,255,255,.78) 0 1.5px, transparent 2.5px),
    linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(208,216,226,.06) 100%);
  background-size: 220px 220px, 260px 260px, 240px 240px, 300px 300px, 340px 340px, 100% 100%;
  mix-blend-mode: screen;
}
.site-header, main, footer { position: relative; z-index: 1; }

/* features section — floating blended buttons + subtle wave only behind phone/copy area */
.feature-experience {
  position: relative !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(247,251,255,.92) 100%) !important;
}
.feature-wave-layer {
  position: absolute !important;
  z-index: 0 !important;
  top: 34px !important;
  bottom: 34px !important;
  left: 31% !important;
  right: 22px !important;
  width: auto !important;
  pointer-events: none !important;
  background-image: url('assets/graphics/feature-wave-reference.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 106% 82% !important;
  opacity: .18 !important;
  filter: saturate(.92) !important;
}
.feature-experience::before { content: none !important; }
.feature-rail, .feature-phone-zone, .feature-copy-zone { position: relative !important; z-index: 2 !important; }
.feature-choice {
  border-radius: 22px !important;
  border: 1px solid rgba(179,214,235,.78) !important;
  background:
    radial-gradient(circle at 14% 48%, rgba(224,241,250,.95) 0%, rgba(236,247,252,.82) 22%, rgba(255,255,255,0) 44%),
    linear-gradient(100deg, rgba(231,245,252,.96) 0%, rgba(244,250,253,.98) 40%, rgba(255,255,255,.98) 100%) !important;
  box-shadow:
    0 14px 28px rgba(13,49,88,.08),
    0 3px 8px rgba(76,140,181,.05),
    inset 0 1px 0 rgba(255,255,255,.96) !important;
  transform: translateX(0) translateY(0) !important;
}
.feature-choice:hover,
.feature-choice.active {
  border-color: rgba(96,187,227,.86) !important;
  box-shadow:
    0 18px 32px rgba(13,49,88,.11),
    0 6px 12px rgba(76,140,181,.08),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
  transform: translateX(7px) translateY(-1px) !important;
}
.feature-choice span {
  background: linear-gradient(180deg, rgba(255,255,255,.94) 0%, rgba(242,248,252,.96) 100%) !important;
  border: 1px solid rgba(225,236,245,.92) !important;
  box-shadow: 0 8px 18px rgba(15,65,99,.06) !important;
}
.feature-choice strong { color: #3f628d !important; }
.feature-copy-zone {
  background: rgba(255,255,255,.78) !important;
  backdrop-filter: blur(3px) !important;
  -webkit-backdrop-filter: blur(3px) !important;
}

/* reward bubble position and appearance */
.reward-phone-stage {
  display: grid !important;
  grid-template-columns: minmax(250px, 320px) minmax(260px, 330px) !important;
  align-items: center !important;
  justify-content: center !important;
  column-gap: 30px !important;
  row-gap: 20px !important;
}
.reward-phone-stage .rewards-phone {
  grid-column: 1 !important;
  justify-self: center !important;
}
.reward-chat-stack {
  grid-column: 2 !important;
  justify-self: start !important;
  align-self: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  width: 100% !important;
  max-width: 320px !important;
  margin: 0 !important;
  overflow: visible !important;
}
.reward-chat-bubble.reward-cloud-bubble {
  position: relative !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.reward-chat-bubble.reward-cloud-bubble:first-child { margin-left: 8px !important; }
.reward-chat-bubble.reward-cloud-bubble:last-child { margin-left: 0 !important; }
.reward-cloud-content {
  position: relative !important;
  z-index: 2 !important;
  min-height: 152px !important;
  padding: 24px 24px 24px 28px !important;
  border-radius: 34px !important;
  background: linear-gradient(165deg, rgba(253,254,255,.97) 0%, rgba(238,246,251,.93) 100%) !important;
  border: 1px solid rgba(255,255,255,.84) !important;
  box-shadow: 0 18px 34px rgba(3,24,58,.17), inset 0 1px 0 rgba(255,255,255,.98) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.reward-cloud-bubble .cloud-puff,
.reward-cloud-bubble .cloud-tail {
  position: absolute !important;
  z-index: 1 !important;
  border-radius: 50% !important;
  background: linear-gradient(165deg, rgba(252,254,255,.95) 0%, rgba(238,246,251,.91) 100%) !important;
  border: 1px solid rgba(255,255,255,.78) !important;
  box-shadow: 0 10px 20px rgba(2,24,61,.08) !important;
}
.reward-cloud-bubble .puff-1 { width: 46px !important; height: 46px !important; left: 22px !important; top: -6px !important; }
.reward-cloud-bubble .puff-2 { width: 58px !important; height: 58px !important; left: 60px !important; top: -14px !important; }
.reward-cloud-bubble .puff-3 { width: 50px !important; height: 50px !important; right: 38px !important; top: -8px !important; }
.reward-cloud-bubble .puff-4 { width: 36px !important; height: 36px !important; right: 8px !important; top: 16px !important; }
.reward-cloud-bubble .tail-1 { width: 16px !important; height: 16px !important; left: -8px !important; bottom: 28px !important; }
.reward-cloud-bubble .tail-2 { width: 10px !important; height: 10px !important; left: -22px !important; bottom: 16px !important; }
.reward-cloud-content span { color: #6a829d !important; font-size: .82rem !important; letter-spacing: .07em !important; }
.reward-cloud-content strong { color: #0f356a !important; font-size: 1.14rem !important; line-height: 1.26 !important; }
.reward-cloud-content small { color: #67809b !important; font-size: .95rem !important; line-height: 1.48 !important; }

/* badge clarity and same visual size */
.tier-board-row {
  grid-template-columns: 210px minmax(0,1fr) !important;
  align-items: center !important;
  min-height: 232px !important;
}
.tier-badge-cluster {
  width: 210px !important;
  min-width: 210px !important;
  min-height: 190px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art {
  width: 184px !important;
  height: 184px !important;
  max-width: 184px !important;
  max-height: 184px !important;
  object-fit: contain !important;
  background: transparent !important;
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
  filter: drop-shadow(0 10px 18px rgba(18,48,81,.11)) saturate(1.02) !important;
}
.tier-board-row.platinum-row { background: linear-gradient(180deg, #edf5ff 0%, #e5eff9 100%) !important; }
.tier-board-row.gold-row { background: linear-gradient(180deg, #fff7dd 0%, #f7edbe 100%) !important; }
.tier-board-row.silver-row { background: linear-gradient(180deg, #f6f7fa 0%, #eaedf2 100%) !important; }

/* keep homecloudasia colour family in journey */
.green-step .process-badge { background: linear-gradient(145deg, #27b0e2 0%, #1462c4 100%) !important; }

@media (max-width: 980px) {
  body::after { opacity: .18; }
  .feature-wave-layer {
    left: 16px !important;
    right: 16px !important;
    top: 16px !important;
    bottom: 16px !important;
    background-size: 115% 78% !important;
    opacity: .14 !important;
  }
  .reward-phone-stage {
    grid-template-columns: 1fr !important;
  }
  .reward-phone-stage .rewards-phone,
  .reward-chat-stack {
    grid-column: 1 !important;
    justify-self: center !important;
  }
  .reward-chat-stack { max-width: 320px !important; }
  .reward-chat-bubble.reward-cloud-bubble:first-child { margin-left: 18px !important; }
  .tier-board-row {
    grid-template-columns: 1fr !important;
    min-height: auto !important;
  }
  .tier-badge-cluster {
    width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 640px) {
  body::after { opacity: .15; }
  .feature-wave-layer {
    background-size: 126% 74% !important;
    opacity: .12 !important;
  }
  .reward-chat-stack {
    width: min(100%, 300px) !important;
    gap: 18px !important;
  }
  .reward-chat-bubble.reward-cloud-bubble:first-child { margin-left: 12px !important; }
  .reward-cloud-content {
    min-height: 136px !important;
    padding: 21px 21px 21px 24px !important;
  }
  .reward-cloud-bubble .puff-1 { width: 42px !important; height: 42px !important; }
  .reward-cloud-bubble .puff-2 { width: 52px !important; height: 52px !important; left: 56px !important; }
  .reward-cloud-bubble .puff-3 { width: 44px !important; height: 44px !important; right: 36px !important; }
  .reward-cloud-bubble .puff-4 { width: 32px !important; height: 32px !important; }
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art {
    width: 164px !important;
    height: 164px !important;
    max-width: 164px !important;
    max-height: 164px !important;
  }
}

/* ===== v24 final touch: true thought bubbles + clearer badges ===== */
.reward-chat-stack{
  gap:28px !important;
  max-width:330px !important;
}
.reward-chat-bubble.reward-cloud-bubble{
  width:100% !important;
  padding:0 !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.reward-chat-bubble.reward-cloud-bubble:first-child{ margin-left:14px !important; }
.reward-chat-bubble.reward-cloud-bubble:last-child{ margin-left:2px !important; }
.reward-cloud-content{
  min-height:165px !important;
  padding:28px 26px 26px 30px !important;
  border-radius:44% 56% 48% 52% / 32% 34% 66% 68% !important;
  background:linear-gradient(160deg, rgba(251,254,255,.98) 0%, rgba(237,245,251,.94) 100%) !important;
  border:1px solid rgba(255,255,255,.82) !important;
  box-shadow:0 18px 34px rgba(3,24,58,.14), inset 0 1px 0 rgba(255,255,255,.98) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
}
.reward-cloud-bubble .cloud-puff,
.reward-cloud-bubble .cloud-tail{
  background:linear-gradient(160deg, rgba(251,254,255,.98) 0%, rgba(237,245,251,.94) 100%) !important;
  border:1px solid rgba(255,255,255,.76) !important;
  box-shadow:0 8px 18px rgba(2,24,61,.07) !important;
}
.reward-cloud-bubble .puff-1{ width:56px !important; height:56px !important; left:18px !important; top:-6px !important; }
.reward-cloud-bubble .puff-2{ width:72px !important; height:72px !important; left:72px !important; top:-18px !important; }
.reward-cloud-bubble .puff-3{ width:60px !important; height:60px !important; right:52px !important; top:-10px !important; }
.reward-cloud-bubble .puff-4{ width:44px !important; height:44px !important; right:10px !important; top:14px !important; }
.reward-cloud-bubble .tail-1{ width:18px !important; height:18px !important; left:-10px !important; bottom:38px !important; }
.reward-cloud-bubble .tail-2{ width:12px !important; height:12px !important; left:-26px !important; bottom:20px !important; }
.reward-cloud-content span{ color:#667f9b !important; font-size:.82rem !important; letter-spacing:.08em !important; }
.reward-cloud-content strong{ color:#113a70 !important; font-size:1.13rem !important; line-height:1.22 !important; }
.reward-cloud-content small{ color:#66809a !important; font-size:.92rem !important; line-height:1.45 !important; }

.tier-board-row{
  grid-template-columns:228px minmax(0,1fr) !important;
  min-height:242px !important;
}
.tier-badge-cluster{
  width:228px !important;
  min-width:228px !important;
  min-height:210px !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:200px !important;
  height:200px !important;
  max-width:200px !important;
  max-height:200px !important;
  object-fit:contain !important;
  image-rendering:-webkit-optimize-contrast !important;
  image-rendering:crisp-edges !important;
  filter:drop-shadow(0 10px 18px rgba(18,48,81,.10)) contrast(1.06) saturate(1.05) !important;
  transform:translateZ(0) !important;
  backface-visibility:hidden !important;
}
@media (max-width: 980px){
  .reward-chat-stack{max-width:320px !important;}
  .reward-cloud-content{min-height:156px !important;}
  .tier-board-row{grid-template-columns:1fr !important;min-height:auto !important;}
  .tier-badge-cluster{width:100% !important;min-width:0 !important;min-height:190px !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:180px !important;height:180px !important;max-width:180px !important;max-height:180px !important;
  }
}
@media (max-width: 640px){
  .reward-chat-bubble.reward-cloud-bubble:first-child{margin-left:10px !important;}
  .reward-chat-stack{gap:20px !important;}
  .reward-cloud-content{min-height:146px !important;padding:24px 22px 22px 24px !important;}
  .reward-cloud-bubble .puff-1{width:48px !important;height:48px !important;left:16px !important;top:-5px !important;}
  .reward-cloud-bubble .puff-2{width:60px !important;height:60px !important;left:58px !important;top:-14px !important;}
  .reward-cloud-bubble .puff-3{width:52px !important;height:52px !important;right:44px !important;top:-8px !important;}
  .reward-cloud-bubble .puff-4{width:38px !important;height:38px !important;right:8px !important;top:14px !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:172px !important;height:172px !important;max-width:172px !important;max-height:172px !important;
  }
}


/* ===== v25 targeted fixes: features wave, reward bubbles, clear badges ===== */
.feature-experience{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;
}
.feature-wave-layer{
  position:absolute !important;
  top:-4% !important;
  bottom:-4% !important;
  left:24% !important;
  right:2.5% !important;
  z-index:0 !important;
  pointer-events:none !important;
  background-image:url('assets/graphics/feature-wave-reference.png') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:100% 100% !important;
  opacity:.28 !important;
  filter:saturate(.95) !important;
}
.feature-rail,
.feature-phone-zone,
.feature-copy-zone{
  position:relative !important;
  z-index:1 !important;
}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  background:linear-gradient(112deg, rgba(230,244,251,.98) 0%, rgba(243,250,254,.99) 46%, rgba(255,255,255,.99) 100%) !important;
  border:1px solid rgba(113,191,222,.38) !important;
  box-shadow:0 15px 34px rgba(18,61,110,.10), inset 0 1px 0 rgba(255,255,255,.9) !important;
  transform:none !important;
}
.feature-choice{
  border-radius:24px !important;
}
.feature-choice::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border-radius:inherit !important;
  background:linear-gradient(90deg, rgba(186,226,244,.16), rgba(255,255,255,0) 55%) !important;
  pointer-events:none !important;
}
.feature-choice:hover,
.feature-choice.active{
  transform:translateY(-3px) !important;
  box-shadow:0 20px 38px rgba(18,61,110,.14), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
.feature-choice span{
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 8px 18px rgba(14,58,105,.08) !important;
}
.feature-choice strong{
  color:#365983 !important;
}

.reward-chat-stack{
  gap:28px !important;
  align-content:center !important;
  justify-items:start !important;
}
.reward-chat-bubble.reward-cloud-bubble{
  position:relative !important;
  width:min(100%, 286px) !important;
  min-height:154px !important;
  padding:34px 28px 26px !important;
  border-radius:42px 44px 36px 40px !important;
  background:linear-gradient(180deg, rgba(249,252,255,.96) 0%, rgba(238,246,252,.95) 100%) !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:0 18px 34px rgba(6,38,80,.19) !important;
  overflow:visible !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
}
.reward-chat-bubble.reward-cloud-bubble:nth-child(1){
  margin-left:18px !important;
}
.reward-chat-bubble.reward-cloud-bubble:nth-child(2){
  margin-left:6px !important;
}
.reward-cloud-content{
  position:relative !important;
  z-index:2 !important;
}
.reward-cloud-bubble .cloud-puff,
.reward-cloud-bubble .cloud-tail{
  display:block !important;
  position:absolute !important;
  border-radius:50% !important;
  background:linear-gradient(180deg, rgba(249,252,255,.96) 0%, rgba(238,246,252,.92) 100%) !important;
  border:1px solid rgba(255,255,255,.72) !important;
  box-shadow:0 10px 24px rgba(8,37,79,.10) !important;
}
.reward-cloud-bubble .puff-1{width:58px !important;height:58px !important;left:24px !important;top:-16px !important;}
.reward-cloud-bubble .puff-2{width:72px !important;height:72px !important;left:88px !important;top:-24px !important;}
.reward-cloud-bubble .puff-3{width:58px !important;height:58px !important;right:38px !important;top:-15px !important;}
.reward-cloud-bubble .puff-4{width:42px !important;height:42px !important;right:10px !important;top:8px !important;}
.reward-cloud-bubble .tail-1{width:18px !important;height:18px !important;left:-14px !important;top:82px !important;}
.reward-cloud-bubble .tail-2{width:10px !important;height:10px !important;left:-28px !important;top:100px !important;}
.reward-chat-bubble::before,
.reward-chat-bubble::after{content:none !important; display:none !important;}
.reward-cloud-content span{
  display:block !important;
  color:#6a8198 !important;
  font-size:.8rem !important;
  font-weight:800 !important;
  letter-spacing:.085em !important;
  text-transform:uppercase !important;
}
.reward-cloud-content strong{
  display:block !important;
  margin:8px 0 7px !important;
  color:#0b2f5b !important;
  font-size:1.08rem !important;
  line-height:1.25 !important;
}
.reward-cloud-content small{
  display:block !important;
  color:#617992 !important;
  font-size:.84rem !important;
  line-height:1.46 !important;
}

.tier-badge-cluster{
  width:100% !important;
  justify-items:center !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:164px !important;
  height:164px !important;
  max-width:164px !important;
  max-height:164px !important;
  object-fit:contain !important;
  image-rendering:auto !important;
  filter:drop-shadow(0 10px 20px rgba(15,49,92,.08)) !important;
}

@media (max-width: 980px){
  .feature-wave-layer{
    left:3% !important;
    right:3% !important;
    opacity:.2 !important;
    background-size:cover !important;
  }
  .reward-chat-stack{
    justify-items:center !important;
  }
  .reward-chat-bubble.reward-cloud-bubble,
  .reward-chat-bubble.reward-cloud-bubble:nth-child(1),
  .reward-chat-bubble.reward-cloud-bubble:nth-child(2){
    margin-left:0 !important;
    width:min(100%, 320px) !important;
  }
}
@media (max-width: 640px){
  .feature-wave-layer{
    opacity:.16 !important;
  }
  .feature-choice,
  .feature-choice:hover,
  .feature-choice.active{
    min-height:88px !important;
  }
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:142px !important;
    height:142px !important;
    max-width:142px !important;
    max-height:142px !important;
  }
  .reward-chat-bubble.reward-cloud-bubble{
    min-height:144px !important;
    padding:32px 24px 24px !important;
  }
}

/* === v26 final user fix: visible top-to-bottom wave, simple chat bubbles, clearer badges === */

/* Features: use the uploaded wave file visibly from top to bottom, behind phone + wording, not behind the button rail */
.features-section{
  background: linear-gradient(180deg,#edf5fa 0%,#f7fbff 100%) !important;
}
.feature-experience,
.feature-experience:not(.engaged),
.feature-experience.engaged{
  position:relative !important;
  overflow:hidden !important;
  background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.94) 100%) !important;
}
.feature-experience::before,
.feature-experience::after{
  content:none !important;
  display:none !important;
  background:none !important;
  animation:none !important;
}
.feature-wave-layer{
  position:absolute !important;
  top:18px !important;
  bottom:18px !important;
  left:26% !important;
  right:18px !important;
  z-index:0 !important;
  pointer-events:none !important;
  background-image:url('assets/graphics/feature-wave-vertical.svg') !important;
  background-repeat:no-repeat !important;
  background-position:center top !important;
  background-size:100% 100% !important;
  opacity:.78 !important;
}
.feature-rail,
.feature-phone-zone,
.feature-copy-zone{
  position:relative !important;
  z-index:1 !important;
}
.feature-choice,
.feature-choice:hover,
.feature-choice.active{
  min-height:82px !important;
  border-radius:24px !important;
  border:1px solid rgba(171,208,227,.55) !important;
  background:linear-gradient(120deg,rgba(231,244,251,.98) 0%,rgba(240,248,252,.98) 34%,rgba(247,251,254,.98) 66%,rgba(255,255,255,.98) 100%) !important;
  box-shadow:0 14px 30px rgba(17,51,93,.08), inset 0 1px 0 rgba(255,255,255,.86) !important;
  transform:none !important;
}
.feature-choice:hover,
.feature-choice.active{
  transform:translateY(-2px) !important;
  border-color:rgba(99,182,216,.62) !important;
  box-shadow:0 18px 36px rgba(17,51,93,.12), inset 0 1px 0 rgba(255,255,255,.94) !important;
}
.feature-choice span{
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(246,250,253,.92)) !important;
  border:1px solid rgba(226,236,244,.82) !important;
  box-shadow:0 8px 18px rgba(11,47,91,.06) !important;
}
.feature-choice strong{color:#3b5f88 !important;}

/* Rewards: remove the odd cloud/rectangle look and use clean premium chat bubbles */
.reward-phone-stage{
  display:grid !important;
  grid-template-columns:minmax(280px,320px) minmax(230px,280px) !important;
  align-items:center !important;
  gap:28px !important;
  width:min(100%,720px) !important;
  overflow:visible !important;
}
.reward-phone-stage .rewards-phone{
  grid-column:1 !important;
  justify-self:center !important;
}
.reward-chat-stack{
  grid-column:2 !important;
  display:grid !important;
  gap:18px !important;
  align-self:center !important;
  width:100% !important;
}
.reward-chat-bubble,
.reward-cloud-bubble{
  position:relative !important;
  padding:22px 24px 20px !important;
  border-radius:30px !important;
  background:linear-gradient(180deg,rgba(252,254,255,.97) 0%,rgba(238,246,252,.96) 100%) !important;
  border:1px solid rgba(255,255,255,.85) !important;
  box-shadow:0 18px 38px rgba(8,28,66,.18) !important;
  overflow:visible !important;
}
.reward-chat-bubble::before,
.reward-cloud-bubble::before{
  content:"" !important;
  position:absolute !important;
  left:-10px !important;
  top:34px !important;
  width:24px !important;
  height:24px !important;
  background:linear-gradient(180deg,rgba(252,254,255,.97) 0%,rgba(238,246,252,.96) 100%) !important;
  transform:rotate(45deg) !important;
  border-left:1px solid rgba(255,255,255,.85) !important;
  border-bottom:1px solid rgba(255,255,255,.85) !important;
  border-radius:0 0 0 8px !important;
  box-shadow:-3px 8px 12px rgba(8,28,66,.04) !important;
}
.reward-chat-bubble::after,
.reward-cloud-bubble::after{
  content:none !important;
  display:none !important;
}
.cloud-puff,
.cloud-tail{
  display:none !important;
}
.reward-cloud-content{position:relative !important;z-index:1 !important;}
.reward-chat-bubble span,
.reward-chat-bubble small,
.reward-cloud-content span,
.reward-cloud-content small{
  display:block !important;
  color:#607893 !important;
}
.reward-chat-bubble span,
.reward-cloud-content span{
  font-size:.82rem !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
}
.reward-chat-bubble strong,
.reward-cloud-content strong{
  display:block !important;
  margin:8px 0 6px !important;
  color:#0b2f5b !important;
  font-size:1.12rem !important;
  line-height:1.28 !important;
}
.reward-chat-bubble small,
.reward-cloud-content small{
  font-size:.92rem !important;
  line-height:1.5 !important;
}

/* Reward badges: same size and clear */
.tier-board-row{
  grid-template-columns:200px minmax(0,1fr) !important;
  align-items:center !important;
}
.tier-badge-cluster{
  width:200px !important;
  min-width:200px !important;
  height:auto !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
}
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:172px !important;
  height:172px !important;
  max-width:172px !important;
  max-height:172px !important;
  object-fit:contain !important;
  image-rendering:auto !important;
  filter:none !important;
  opacity:1 !important;
  transform:translateZ(0) !important;
}

@media (max-width:900px){
  .feature-wave-layer{
    left:18px !important;
    right:18px !important;
    top:200px !important;
    bottom:18px !important;
    opacity:.62 !important;
  }
  .reward-phone-stage{
    grid-template-columns:1fr !important;
    width:min(100%,560px) !important;
  }
  .reward-phone-stage .rewards-phone,
  .reward-chat-stack{
    grid-column:1 !important;
    justify-self:center !important;
  }
  .reward-chat-stack{
    width:min(100%,360px) !important;
  }
}

@media (max-width:640px){
  .feature-wave-layer{
    left:14px !important;
    right:14px !important;
    top:340px !important;
    bottom:14px !important;
    opacity:.54 !important;
  }
  .reward-chat-bubble,
  .reward-cloud-bubble{
    padding:18px 20px 17px !important;
    border-radius:24px !important;
  }
  .reward-chat-bubble::before,
  .reward-cloud-bubble::before{
    width:20px !important;
    height:20px !important;
    left:-8px !important;
    top:28px !important;
  }
  .tier-board-row{
    grid-template-columns:1fr !important;
  }
  .tier-badge-cluster{
    width:100% !important;
    min-width:0 !important;
  }
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:150px !important;
    height:150px !important;
    max-width:150px !important;
    max-height:150px !important;
  }
}

/* === v27 quick cleanup: remove wave background and weird bubble styling === */

/* remove visible wave background in Features area */
.feature-wave-layer {
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}
.feature-experience,
.feature-experience:not(.engaged),
.feature-experience.engaged,
.features-section {
  background-image: none !important;
}

/* simplify rewards boxes to clean premium rounded cards (no bubble tails/cloud puffs) */
.reward-chat-bubble,
.reward-cloud-bubble {
  border-radius: 28px !important;
  padding: 22px 24px 20px !important;
  background: linear-gradient(180deg, rgba(250,253,255,0.98) 0%, rgba(237,245,252,0.96) 100%) !important;
  border: 1px solid rgba(255,255,255,0.78) !important;
  box-shadow: 0 18px 36px rgba(8,28,66,0.16) !important;
  overflow: hidden !important;
}
.reward-chat-bubble::before,
.reward-cloud-bubble::before,
.reward-chat-bubble::after,
.reward-cloud-bubble::after,
.cloud-puff,
.cloud-tail {
  content: none !important;
  display: none !important;
}
.reward-cloud-content {
  position: relative !important;
  z-index: 1 !important;
}


/* === v28 clean reward chat bubbles override === */
.reward-chat-stack{
  display:flex !important;
  flex-direction:column !important;
  gap:24px !important;
}
.reward-chat-bubble.reward-cloud-bubble,
.reward-chat-bubble{
  position:relative !important;
  width:min(290px, 36vw) !important;
  min-height:auto !important;
  padding:22px 24px !important;
  border-radius:28px !important;
  background:linear-gradient(135deg, rgba(247,250,254,.98) 0%, rgba(238,245,252,.98) 100%) !important;
  border:1px solid rgba(173, 202, 227, .48) !important;
  box-shadow:0 18px 36px rgba(9,41,78,.16), 0 5px 14px rgba(10,45,85,.08) !important;
  overflow:visible !important;
  isolation:isolate !important;
}
.reward-chat-bubble.reward-cloud-bubble::before,
.reward-chat-bubble::before{
  content:"" !important;
  position:absolute !important;
  left:-10px !important;
  top:50% !important;
  width:24px !important;
  height:24px !important;
  transform:translateY(-50%) rotate(45deg) !important;
  border-radius:0 0 0 8px !important;
  background:linear-gradient(135deg, rgba(247,250,254,.98) 0%, rgba(238,245,252,.98) 100%) !important;
  border-left:1px solid rgba(173, 202, 227, .48) !important;
  border-bottom:1px solid rgba(173, 202, 227, .48) !important;
  box-shadow:-7px 8px 14px rgba(10,45,85,.08) !important;
  z-index:0 !important;
}
.reward-chat-bubble.reward-cloud-bubble::after,
.reward-chat-bubble::after{
  content:none !important;
  display:none !important;
}
.reward-cloud-bubble .cloud-puff,
.reward-cloud-bubble .cloud-tail{
  display:none !important;
}
.reward-cloud-content{
  position:relative !important;
  z-index:1 !important;
}
.reward-cloud-content span,
.reward-chat-bubble span{
  display:block !important;
  margin-bottom:8px !important;
  font-size:.82rem !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  color:#66809a !important;
}
.reward-cloud-content strong,
.reward-chat-bubble strong{
  display:block !important;
  margin-bottom:8px !important;
  color:#0c3564 !important;
  font-size:1.05rem !important;
  font-weight:800 !important;
  line-height:1.2 !important;
}
.reward-cloud-content small,
.reward-chat-bubble small{
  display:block !important;
  color:#627b96 !important;
  font-size:.86rem !important;
  line-height:1.55 !important;
}
@media (max-width: 991px){
  .reward-chat-bubble.reward-cloud-bubble,
  .reward-chat-bubble{
    width:min(280px, 82vw) !important;
    padding:20px 22px !important;
  }
}
@media (max-width: 767px){
  .reward-chat-stack{
    width:100% !important;
    align-items:flex-end !important;
    padding-right:10px !important;
  }
  .reward-chat-bubble.reward-cloud-bubble,
  .reward-chat-bubble{
    width:min(250px, 76vw) !important;
    padding:18px 20px !important;
  }
  .reward-chat-bubble.reward-cloud-bubble::before,
  .reward-chat-bubble::before{
    width:18px !important;
    height:18px !important;
    left:-7px !important;
  }
  .reward-cloud-content strong,
  .reward-chat-bubble strong{font-size:1rem !important;}
  .reward-cloud-content small,
  .reward-chat-bubble small{font-size:.82rem !important;}
}


/* v29 corrected store logos */
.store-icon{display:flex !important;align-items:center !important;justify-content:center !important;flex:0 0 54px !important;width:54px !important;height:46px !important;color:#22272f !important;}
.store-icon svg{display:block;width:100%;height:100%;}
.apple-icon{color:#20252d !important;}
.apple-icon::before,.apple-icon::after,.play-icon::before,.play-icon::after{content:none !important;display:none !important;}
.play-icon{width:58px !important;flex-basis:58px !important;height:42px !important;}
.store-top{letter-spacing:.03em !important;font-size:.72rem !important;font-weight:700 !important;color:#565d67 !important;text-transform:uppercase !important;}
.store-copy strong{font-size:1.12rem !important;color:#242b33 !important;font-weight:800 !important;}


/* === v30: use the user's exact animated chat GIF for reward highlights === */
.reward-phone-stage{
  display:grid !important;
  grid-template-columns:minmax(280px,320px) minmax(300px,350px) !important;
  align-items:center !important;
  justify-content:center !important;
  column-gap:26px !important;
  overflow:visible !important;
}
.reward-phone-stage .rewards-phone{
  grid-column:1 !important;
  justify-self:center !important;
}
.reward-gif-stack{
  grid-column:2 !important;
  width:100% !important;
  max-width:350px !important;
  display:block !important;
  align-self:center !important;
  justify-self:start !important;
  overflow:visible !important;
}
.reward-gif-wrap{
  position:relative !important;
  width:100% !important;
  aspect-ratio:700 / 680 !important;
  overflow:visible !important;
}
.reward-chat-gif{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
  pointer-events:none !important;
}
.reward-gif-copy{
  position:absolute !important;
  z-index:2 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  text-align:left !important;
  pointer-events:none !important;
}
.reward-gif-copy-top{
  left:10% !important;
  top:13% !important;
  width:45% !important;
  height:27% !important;
  color:#0b365a !important;
}
.reward-gif-copy-bottom{
  left:49% !important;
  top:50% !important;
  width:41% !important;
  height:31% !important;
  color:#ffffff !important;
}
.reward-gif-copy span{
  display:block !important;
  margin-bottom:5px !important;
  font-size:.62rem !important;
  line-height:1.15 !important;
  font-weight:800 !important;
  letter-spacing:.065em !important;
  text-transform:uppercase !important;
  color:inherit !important;
  opacity:.82 !important;
}
.reward-gif-copy strong{
  display:block !important;
  margin:0 0 5px !important;
  font-size:.83rem !important;
  line-height:1.13 !important;
  font-weight:900 !important;
  color:inherit !important;
}
.reward-gif-copy small{
  display:block !important;
  font-size:.61rem !important;
  line-height:1.28 !important;
  font-weight:600 !important;
  color:inherit !important;
  opacity:.86 !important;
}
/* The old CSS bubble shapes are no longer used. */
.reward-cloud-bubble,.cloud-puff,.cloud-tail{display:none !important;}

@media (max-width:980px){
  .reward-phone-stage{
    grid-template-columns:1fr !important;
    row-gap:24px !important;
  }
  .reward-phone-stage .rewards-phone,
  .reward-gif-stack{
    grid-column:1 !important;
    justify-self:center !important;
  }
  .reward-gif-stack{max-width:360px !important;}
}
@media (max-width:640px){
  .reward-gif-stack{max-width:330px !important;}
  .reward-gif-copy span{font-size:.58rem !important;}
  .reward-gif-copy strong{font-size:.76rem !important;}
  .reward-gif-copy small{font-size:.56rem !important;}
}

/* === v31: final GIF reward overlay tuning === */
.reward-gif-copy-top{
  left:9.5% !important;
  top:13.5% !important;
  width:43% !important;
  height:25.5% !important;
  padding:8px 10px !important;
  border-radius:14px !important;
  background:rgb(0,219,185) !important;
  color:#0b365a !important;
}
.reward-gif-copy-bottom{
  left:50% !important;
  top:50.5% !important;
  width:39% !important;
  height:29% !important;
  padding:9px 10px !important;
  border-radius:14px !important;
  background:rgb(0,140,251) !important;
  color:#ffffff !important;
}
.reward-gif-copy span{
  font-size:.59rem !important;
  margin-bottom:4px !important;
}
.reward-gif-copy strong{
  font-size:.80rem !important;
  margin-bottom:4px !important;
}
.reward-gif-copy small{
  font-size:.57rem !important;
  line-height:1.24 !important;
}
@media (max-width:640px){
  .reward-gif-copy-top{padding:7px 8px !important;}
  .reward-gif-copy-bottom{padding:7px 8px !important;}
  .reward-gif-copy span{font-size:.53rem !important;}
  .reward-gif-copy strong{font-size:.70rem !important;}
  .reward-gif-copy small{font-size:.51rem !important;}
}

/* === v32: replace reward cloud blobs with clean separate speech bubbles === */
.reward-phone-stage{
  position:relative !important;
  display:grid !important;
  grid-template-columns: 280px minmax(260px, 360px) !important;
  align-items:center !important;
  column-gap:42px !important;
  min-height:680px !important;
}
.reward-phone-stage .rewards-phone{
  grid-column:1 !important;
  justify-self:start !important;
  position:relative !important;
  z-index:2 !important;
}
.reward-message-stack{
  grid-column:2 !important;
  justify-self:start !important;
  align-self:center !important;
  display:flex !important;
  flex-direction:column !important;
  gap:34px !important;
  width:min(100%,360px) !important;
  position:relative !important;
  z-index:3 !important;
}
.reward-message-card{
  position:relative !important;
  overflow:visible !important;
  padding:24px 28px 24px !important;
  min-height:168px !important;
  border-radius:34px !important;
  box-shadow: 0 20px 44px rgba(5,22,53,.24), inset 0 1px 0 rgba(255,255,255,.28) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
.reward-message-card::after{
  content:"" !important;
  position:absolute !important;
  bottom:-18px !important;
  width:38px !important;
  height:38px !important;
  border-radius:0 0 14px 0 !important;
  transform: rotate(45deg) !important;
  box-shadow: 8px 10px 20px rgba(5,22,53,.12) !important;
}
.reward-message-top{
  align-self:flex-start !important;
  background: linear-gradient(135deg,#8f92ff 0%, #7f88ff 45%, #7d6fff 100%) !important;
}
.reward-message-top::after{
  left:118px !important;
  background: linear-gradient(135deg,#7f88ff 0%, #7d6fff 100%) !important;
}
.reward-message-bottom{
  align-self:flex-end !important;
  background: linear-gradient(135deg,#34d3e8 0%, #23c6e8 46%, #2e9cf8 100%) !important;
}
.reward-message-bottom::after{
  right:118px !important;
  background: linear-gradient(135deg,#23c6e8 0%, #2e9cf8 100%) !important;
}
.reward-message-card span,
.reward-message-card strong,
.reward-message-card small{
  display:block !important;
  position:relative !important;
  z-index:2 !important;
}
.reward-message-card span{
  color:rgba(255,255,255,.82) !important;
  font-size:.78rem !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  font-weight:800 !important;
  margin-bottom:8px !important;
}
.reward-message-card strong{
  color:#ffffff !important;
  font-size:1.52rem !important;
  line-height:1.15 !important;
  margin-bottom:10px !important;
  font-weight:900 !important;
}
.reward-message-card small{
  color:rgba(255,255,255,.92) !important;
  font-size:1rem !important;
  line-height:1.55 !important;
  font-weight:500 !important;
}
/* disable old reward gif/cloud styling */
.reward-gif-wrap,
.reward-chat-gif,
.reward-gif-copy,
.reward-gif-copy-top,
.reward-gif-copy-bottom,
.reward-chat-bubble,
.reward-cloud-content,
.reward-cloud-bubble,
.cloud-puff,
.cloud-tail{
  display:none !important;
}
@media (max-width:980px){
  .reward-phone-stage{
    grid-template-columns:1fr !important;
    row-gap:28px !important;
    min-height:auto !important;
  }
  .reward-phone-stage .rewards-phone,
  .reward-message-stack{
    grid-column:1 !important;
    justify-self:center !important;
  }
  .reward-message-stack{
    width:min(100%,380px) !important;
  }
  .reward-message-top,
  .reward-message-bottom{
    align-self:center !important;
  }
}
@media (max-width:640px){
  .reward-message-stack{width:min(100%,320px) !important; gap:22px !important;}
  .reward-message-card{min-height:148px !important; padding:20px 22px !important; border-radius:28px !important;}
  .reward-message-card strong{font-size:1.28rem !important;}
  .reward-message-card small{font-size:.95rem !important; line-height:1.45 !important;}
  .reward-message-top::after{left:96px !important;}
  .reward-message-bottom::after{right:96px !important;}
}


/* === FINAL USER FIXES: reward bubbles, clearer badges, ecosystem label === */
.ecosystem-helper-label{
  margin: 14px auto 0 !important;
  font-size: 1.02rem !important;
  font-weight: 700 !important;
  letter-spacing: .01em;
  color: var(--navy-900) !important;
}
.ecosystem-helper-label span{
  display:inline-block;
  margin: 0 10px;
  color: #7ea8d8;
  font-weight: 700;
}

.reward-phone-stage{
  grid-template-columns: minmax(270px,320px) minmax(260px,320px) !important;
  gap: 34px !important;
}
.reward-message-stack{
  width: min(100%, 320px) !important;
  gap: 28px !important;
}
.reward-message-card{
  min-height: 190px !important;
  padding: 26px 24px !important;
  border-radius: 34px !important;
  box-shadow: 0 20px 42px rgba(7,35,76,.18) !important;
  overflow: visible !important;
  border: 1px solid rgba(255,255,255,.18) !important;
}
.reward-message-card::before{ display:none !important; }
.reward-message-card::after{
  content:"" !important;
  position:absolute !important;
  width:34px !important;
  height:34px !important;
  left:-13px !important;
  right:auto !important;
  top:calc(50% + 18px) !important;
  bottom:auto !important;
  transform:translateY(-50%) rotate(45deg) !important;
  border-radius: 0 0 10px 0 !important;
  box-shadow: 6px 6px 16px rgba(7,35,76,.10) !important;
}
.reward-message-top{
  align-self: flex-start !important;
  margin-left: 0 !important;
  background: linear-gradient(135deg,#9fd5ff 0%, #7fbfff 42%, #5ea7ff 100%) !important;
}
.reward-message-top::after{
  background: linear-gradient(135deg,#87c6ff 0%, #5ea7ff 100%) !important;
}
.reward-message-bottom{
  align-self: flex-end !important;
  margin-right: 0 !important;
  background: linear-gradient(135deg,#8ae6f4 0%, #64d3f1 45%, #44baef 100%) !important;
}
.reward-message-bottom::after{
  left:-13px !important;
  right:auto !important;
  background: linear-gradient(135deg,#6fd8f3 0%, #44baef 100%) !important;
}
.reward-message-card span{
  color: rgba(255,255,255,.88) !important;
  font-size: .80rem !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
}
.reward-message-card strong{
  color: #ffffff !important;
  font-size: 1.48rem !important;
  line-height: 1.18 !important;
  margin-bottom: 12px !important;
}
.reward-message-card small{
  color: rgba(255,255,255,.95) !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
}

.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width: 164px !important;
  height: 164px !important;
  max-width: 164px !important;
  max-height: 164px !important;
  object-fit: contain !important;
  image-rendering: auto !important;
  filter: none !important;
  transform: none !important;
}

@media (max-width: 980px){
  .reward-message-stack{ width:min(100%,340px) !important; }
  .reward-message-card{ min-height: 176px !important; }
}
@media (max-width: 640px){
  .ecosystem-helper-label{ font-size:.96rem !important; }
  .reward-message-stack{ width:min(100%,320px) !important; gap:22px !important; }
  .reward-message-card{ min-height:164px !important; padding:22px 20px !important; }
  .reward-message-card strong{ font-size:1.26rem !important; }
  .reward-message-card small{ font-size:.95rem !important; }
  .reward-message-card::after{ width:28px !important; height:28px !important; left:-10px !important; }
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{
    width:148px !important;
    height:148px !important;
    max-width:148px !important;
    max-height:148px !important;
  }
}


/* === v34 final polish: reward bubbles + exact clear badges === */
.reward-phone-stage{
  grid-template-columns:minmax(270px,320px) minmax(260px,330px) !important;
  gap:34px !important;
}
.reward-message-stack{
  width:min(100%,320px) !important;
  gap:26px !important;
  justify-self:start !important;
}
.reward-message-card{
  position:relative !important;
  min-height:182px !important;
  padding:24px 26px !important;
  border-radius:30px !important;
  background:linear-gradient(135deg,#f4fbff 0%,#eaf6ff 42%,#ddefff 100%) !important;
  border:1px solid rgba(120,188,232,.42) !important;
  box-shadow:0 18px 34px rgba(11,47,91,.10) !important;
  overflow:visible !important;
}
.reward-message-top,
.reward-message-bottom{
  background:linear-gradient(135deg,#f4fbff 0%,#eaf6ff 42%,#ddefff 100%) !important;
}
.reward-message-card::before{display:none !important;}
.reward-message-card::after{
  content:"" !important;
  position:absolute !important;
  left:-12px !important;
  right:auto !important;
  top:56% !important;
  bottom:auto !important;
  width:28px !important;
  height:28px !important;
  transform:translateY(-50%) rotate(45deg) !important;
  border-radius:0 0 9px 0 !important;
  background:linear-gradient(135deg,#eef8ff 0%,#dcedff 100%) !important;
  border-left:1px solid rgba(120,188,232,.42) !important;
  border-bottom:1px solid rgba(120,188,232,.42) !important;
  box-shadow:0 8px 16px rgba(11,47,91,.08) !important;
}
.reward-message-top::after{ top:64% !important; }
.reward-message-bottom::after{ top:50% !important; }
.reward-message-card span{
  color:#6f89a7 !important;
  font-size:.82rem !important;
  font-weight:800 !important;
  letter-spacing:.06em !important;
  text-transform:uppercase !important;
  margin-bottom:8px !important;
}
.reward-message-card strong{
  color:#123d72 !important;
  font-size:1.44rem !important;
  line-height:1.16 !important;
  font-weight:900 !important;
  margin-bottom:10px !important;
}
.reward-message-card small{
  color:#5e7b9a !important;
  font-size:1rem !important;
  line-height:1.52 !important;
  font-weight:600 !important;
}
.tier-board-row{
  grid-template-columns:132px minmax(0,1fr) !important;
}
.tier-badge-cluster{ gap:0 !important; }
.tier-badge-cluster .badge-art,
.tier-board-row.platinum-row .badge-art,
.tier-board-row.gold-row .badge-art,
.tier-board-row.silver-row .badge-art{
  width:116px !important;
  max-width:116px !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  image-rendering:auto !important;
  filter:none !important;
  transform:none !important;
}
@media (max-width:640px){
  .reward-message-card{min-height:164px !important;padding:22px 20px !important;}
  .reward-message-card strong{font-size:1.28rem !important;}
  .reward-message-card small{font-size:.94rem !important;}
  .tier-board-row{grid-template-columns:120px minmax(0,1fr) !important;}
  .tier-badge-cluster .badge-art,
  .tier-board-row.platinum-row .badge-art,
  .tier-board-row.gold-row .badge-art,
  .tier-board-row.silver-row .badge-art{width:104px !important;max-width:104px !important;}
}

/* === v36 final reward tier badge placement fix === */
.reward-tiers-board .tier-board-row{
  display:grid !important;
  grid-template-columns: 132px minmax(0,1fr) !important;
  gap: 20px !important;
  align-items:center !important;
  min-height: 186px !important;
  padding: 24px 30px !important;
}
.reward-tiers-board .tier-badge-cluster{
  width: 132px !important;
  min-width: 132px !important;
  min-height: 132px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding: 0 !important;
  margin: 0 auto !important;
}
.reward-tiers-board .tier-badge-cluster .badge-art,
.reward-tiers-board .tier-board-row.platinum-row .badge-art,
.reward-tiers-board .tier-board-row.gold-row .badge-art,
.reward-tiers-board .tier-board-row.silver-row .badge-art{
  width: 108px !important;
  height: auto !important;
  max-width: 108px !important;
  max-height: 108px !important;
  object-fit: contain !important;
  background: transparent !important;
  display:block !important;
  filter: drop-shadow(0 6px 12px rgba(17,47,81,.10)) !important;
}
.reward-tiers-board .tier-board-copy{
  align-self:center !important;
}
.reward-tiers-board .tier-board-copy h4{
  margin-top: 0 !important;
}
@media (max-width: 980px){
  .reward-tiers-board .tier-board-row{
    grid-template-columns: 118px minmax(0,1fr) !important;
    gap: 16px !important;
    min-height: 170px !important;
    padding: 20px 18px !important;
  }
  .reward-tiers-board .tier-badge-cluster{
    width: 118px !important;
    min-width: 118px !important;
    min-height: 118px !important;
  }
  .reward-tiers-board .tier-badge-cluster .badge-art,
  .reward-tiers-board .tier-board-row.platinum-row .badge-art,
  .reward-tiers-board .tier-board-row.gold-row .badge-art,
  .reward-tiers-board .tier-board-row.silver-row .badge-art{
    width: 96px !important;
    max-width: 96px !important;
    max-height: 96px !important;
  }
}
@media (max-width: 640px){
  .reward-tiers-board .tier-board-row{
    grid-template-columns: 1fr !important;
    justify-items:center !important;
    text-align:center !important;
    min-height: auto !important;
  }
  .reward-tiers-board .tier-badge-cluster{
    width: 100% !important;
    min-width: 0 !important;
    min-height: 112px !important;
  }
  .reward-tiers-board .tier-badge-cluster .badge-art,
  .reward-tiers-board .tier-board-row.platinum-row .badge-art,
  .reward-tiers-board .tier-board-row.gold-row .badge-art,
  .reward-tiers-board .tier-board-row.silver-row .badge-art{
    width: 100px !important;
    max-width: 100px !important;
    max-height: 100px !important;
  }
  .reward-tiers-board .tier-board-copy,
  .reward-tiers-board .tier-brand-list{
    text-align:center !important;
    justify-content:center !important;
  }
}

/* ==========================================================================
   MOBILE RESPONSIVE SAFETY NET (appended fix — does not modify rules above)
   Purpose: guarantee no element ever forces horizontal overflow/cut-off on
   phones, regardless of any fixed px width set earlier in this file.
   Desktop (min-width:901px) is completely untouched.
   ========================================================================== */
@media (max-width: 900px) {
  html, body {
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }
  *, *::before, *::after {
    box-sizing: border-box !important;
  }
  img, video, svg, iframe, canvas {
    max-width: 100% !important;
    height: auto;
  }
  .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  /* Any element wider than the viewport gets capped instead of clipped */
  section, header, footer, main,
  .hero, .hero *, .section, .section *,
  [class*="card"], [class*="panel"], [class*="grid"], [class*="row"],
  [class*="stage"], [class*="deck"], [class*="rail"], [class*="cluster"] {
    max-width: 100vw;
  }
  table {
    display: block !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  pre, code {
    white-space: pre-wrap !important;
    word-break: break-word !important;
  }
}

@media (max-width: 480px) {
  html { font-size: 15px; }
  .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ==========================================================================
   MOBILE FIX 2 — Rewards phone + bubbles, and WhatsApp button
   Appended after all prior rules so it wins the cascade. Desktop/tablet
   above 900px is untouched; nothing below changes colors, wording,
   the phone screenshot, or the desktop layout/animation.
   ========================================================================== */
@media (max-width: 900px) {
  /* Stack the rewards phone above the two bubbles, centered, nothing
     forced into a fixed-width 2-column grid anymore. */
  .reward-phone-stage{
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-right: 0 !important;
    gap: 28px !important;
  }
  .reward-phone-stage .rewards-phone{
    width: min(260px, 78vw) !important;
    margin: 0 auto !important;
  }
  .reward-message-stack{
    width: min(100%, 360px) !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    justify-self: center !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
  }
  .reward-message-card{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-height: unset !important;
    padding: 18px 20px !important;
  }
  /* Pointer moves to point up toward the phone above, staying inside the bubble */
  .reward-message-card::after{
    left: 32px !important;
    right: auto !important;
    top: -10px !important;
    bottom: auto !important;
    transform: rotate(225deg) !important;
  }
}

@media (max-width: 480px) {
  .reward-phone-stage .rewards-phone{
    width: min(220px, 74vw) !important;
  }
  .reward-message-stack{
    width: 100% !important;
  }
  .reward-message-card strong{ font-size: 1.15rem !important; }
  .reward-message-card small{ font-size: .88rem !important; }
}

/* WhatsApp floating button — smaller and safely tucked on mobile/tablet
   so it stops covering buttons and text. Desktop stays at 64px. */
@media (max-width: 900px) {
  .whatsapp-float,
  .whatsapp-float:hover{
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    right: 14px !important;
    bottom: 14px !important;
  }
  .whatsapp-icon{
    width: 48px !important;
    height: 48px !important;
  }
}
@media (max-width: 480px) {
  .whatsapp-float,
  .whatsapp-float:hover{
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    right: 12px !important;
    bottom: 12px !important;
  }
  .whatsapp-icon{
    width: 44px !important;
    height: 44px !important;
  }
}

/* Back-to-top button — stack it directly above the WhatsApp button on
   mobile/tablet so the two never overlap. Desktop position is untouched. */
@media (max-width: 900px) {
  .back-to-top{
    right: 14px !important;
    bottom: 72px !important; /* sits above the 48px WhatsApp button + gap */
    width: 44px !important;
    height: 44px !important;
    font-size: 1rem !important;
  }
}
@media (max-width: 480px) {
  .back-to-top{
    right: 12px !important;
    bottom: 64px !important; /* sits above the 44px WhatsApp button + gap */
    width: 40px !important;
    height: 40px !important;
    font-size: .92rem !important;
  }
}

/* ==========================================================================
   MOBILE FIX 3 — Review cards clipping on the right, and desktop back-to-top
   vs WhatsApp overlap. Additive only; no existing rule is edited.
   ========================================================================== */

/* The big decorative quote mark is absolutely positioned inside each review
   card. Clipping it to the card's own rounded corners stops it (or any
   other absolutely-positioned decoration) from visually bleeding past the
   card edge on narrow screens — this does not change its appearance when
   it already fits, which is the case at desktop widths. */
.review-slide{
  overflow: hidden !important;
}

/* Give the carousel viewport a hair of side padding on phones so the visible
   card never sits flush against the clipped edge. */
@media (max-width: 760px) {
  .review-carousel-viewport{
    padding: 12px 2px 28px !important;
  }
  .review-slide{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Desktop / laptop: back-to-top button was sitting in the same corner as
   WhatsApp and overlapping it. Stack back-to-top directly above WhatsApp,
   same corner, with a clear gap — this is the only change at this size. */
@media (min-width: 901px) {
  .back-to-top{
    right: 24px !important;
    bottom: 98px !important; /* sits above the 64px WhatsApp button + gap */
  }
}


/* HOMECLOUDASIA LOGO TM */
.brand-with-tm,
.logo-with-tm {
  position: relative;
  display: inline-block;
  line-height: 0;
}

.brand-with-tm img,
.logo-with-tm img {
  display: block;
}

.logo-wordmark-tm {
  position: absolute;
  left: 80.8%;
  top: 81.8%;
  transform: translate(-50%, -50%);
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
  color: #0b2e6f;
  pointer-events: none;
  user-select: none;
}

/* footer version slightly bigger */
.footer-logo-panel .logo-wordmark-tm {
  font-size: 9px;
}

/* =========================================================
   HOMECLOUDASIA TRADEMARK
   LOCKED TO THE LOGO IMAGE
   ========================================================= */

.hca-logo-wrap {
  position: relative !important;
  display: inline-block !important;
  width: fit-content !important;
  height: fit-content !important;
  line-height: 0 !important;
  vertical-align: middle;
}

.hca-logo-wrap img {
  display: block !important;
}


/* TM beside / above the LAST A */
.hca-logo-tm {
  position: absolute !important;

  /*
     LOCKED POSITION:
     Last A is near the lower-right part
     of the HomeCloudAsia logo.
  */
  right: 19.5% !important;
  bottom: 17.5% !important;

  width: auto !important;
  height: auto !important;

  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 7px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  color: #082f73 !important;

  margin: 0 !important;
  padding: 0 !important;

  transform: none !important;

  pointer-events: none !important;
  user-select: none !important;

  z-index: 20 !important;
}


/* HEADER TM */
.site-header .hca-logo-tm {
  right: 19.5% !important;
  bottom: 17.5% !important;
  font-size: 7px !important;
}


/* FOOTER TM */
.site-footer .hca-logo-tm {
  right: 19.5% !important;
  bottom: 17.5% !important;
  font-size: 8px !important;
}

/* =========================================================
   HOMECLOUDASIA TM
   FORCE POSITION BESIDE TOP-RIGHT OF FINAL "A"
   ========================================================= */

.hca-logo-tm-wrap {
  position: relative !important;
  display: inline-block !important;
  line-height: 0 !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
}

.hca-logo-tm-wrap img {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

.hca-logo-tm {
  position: absolute !important;
  display: block !important;

  right: auto !important;
  bottom: auto !important;

  margin: 0 !important;
  padding: 0 !important;

  width: auto !important;
  height: auto !important;

  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: #082f73 !important;

  white-space: nowrap !important;

  pointer-events: none !important;
  user-select: none !important;

  z-index: 999999 !important;

  transform: none !important;
}


/* =========================================================
   HEADER LOGO TM
   ========================================================= */

.site-header .hca-logo-tm-header {
  left: 94.5% !important;
  top: 79.5% !important;

  font-size: 5px !important;
}


/* =========================================================
   FOOTER LOGO TM
   ========================================================= */

.site-footer .hca-logo-tm-footer {
  left: 94.5% !important;
  top: 79.5% !important;

  font-size: 7px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

  .site-header .hca-logo-tm-header {
    left: 94.5% !important;
    top: 79.5% !important;
    font-size: 4px !important;
  }

  .site-footer .hca-logo-tm-footer {
    left: 94.5% !important;
    top: 79.5% !important;
    font-size: 6px !important;
  }

}