/* ==========================================================================
   RBS Nidhi — premium design system
   Loaded after theme.slim.css (Bootstrap 5.0.2). Grid, collapse, dropdown and
   accordion behaviour still come from Bootstrap; everything visual lives here.
   ========================================================================== */

/* Self-hosted fonts. The -rupee files hold only the ₹ sign (the site has no other non-Latin text). */
@font-face { font-family: 'Fraunces'; font-style: italic; font-weight: 400 700; font-display: swap; src: url(../fonts/site/fraunces-italic-rupee.woff2) format('woff2'); unicode-range: U+20B9; }
@font-face { font-family: 'Fraunces'; font-style: italic; font-weight: 400 700; font-display: swap; src: url(../fonts/site/fraunces-italic-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/site/fraunces-normal-rupee.woff2) format('woff2'); unicode-range: U+20B9; }
@font-face { font-family: 'Fraunces'; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/site/fraunces-normal-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 400 800; font-display: swap; src: url(../fonts/site/plus-jakarta-sans-normal-rupee.woff2) format('woff2'); unicode-range: U+20B9; }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 400 800; font-display: swap; src: url(../fonts/site/plus-jakarta-sans-normal-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --ink: #160a22;
  --ink-2: #211030;
  --ink-3: #2d1642;
  --magenta: #93278f;
  --violet: #673f98;
  --orchid: #d06bcb;
  --lavender: #bfa9ea;
  --mist: #f7f3fb;
  --lilac: #efe6f7;
  --text: #1d1326;
  --muted: #6c6278;
  --line: rgba(29, 19, 38, .09);
  --line-strong: rgba(29, 19, 38, .16);
  --success: #1f9d6b;

  --gold-1: #f6e3a1;
  --gold-2: #d6b25e;
  --gold-3: #a47a2c;
  --plat-1: #f4f2f9;
  --plat-2: #c9c5d6;
  --plat-3: #8f8aa3;

  --grad-brand: linear-gradient(135deg, #a72fa1 0%, #93278f 38%, #673f98 100%);
  --grad-text: linear-gradient(100deg, #e48bdf 0%, #c3a4f3 55%, #f3dc95 100%);
  --foil-gold: linear-gradient(105deg, #7d5d22 0%, #e9cf85 18%, #c79f45 34%, #fff4cc 50%, #b88b30 64%, #f0d27d 82%, #8a6a2b 100%);
  --foil-plat: linear-gradient(105deg, #8c879e 0%, #f3f1f8 20%, #b8b3c8 36%, #ffffff 50%, #a29db4 66%, #ebe8f3 84%, #8c879e 100%);
  --royal: #2654e0;
  --royal-deep: #11286f;
  --panel-prime: radial-gradient(110% 70% at 100% 0%, #2c55d6 0%, #15307f 55%, #0b1647 100%);
  --panel-crown: radial-gradient(110% 70% at 100% 0%, #1a3488 0%, #0c1a4c 55%, #060b26 100%);

  --shadow-sm: 0 1px 2px rgba(22, 10, 34, .06), 0 2px 8px rgba(22, 10, 34, .05);
  --shadow-md: 0 14px 34px -16px rgba(22, 10, 34, .22);
  --shadow-lg: 0 40px 80px -36px rgba(22, 10, 34, .38);

  --r-sm: 12px;
  --r-md: 20px;
  --r-lg: 28px;

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --header-h: 78px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.65;
  color: var(--text);
  background: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-display);
  color: var(--text);
  font-weight: 600;
  letter-spacing: -.005em;
  line-height: 1.15;
  font-variation-settings: "opsz" 72;
}
h4, h5, h6, .h4, .h5, .h6 { font-family: var(--font-sans); letter-spacing: -.005em; font-variation-settings: normal; }
p { color: inherit; }
a { color: var(--magenta); text-decoration: none; transition: color .2s var(--ease); }
a:hover { color: var(--violet); }
::selection { background: rgba(147, 39, 143, .18); }
:focus-visible { outline: 2px solid var(--magenta); outline-offset: 3px; border-radius: 6px; }
img { max-width: 100%; }

.wrap { width: min(1200px, 100% - 40px); margin-inline: auto; }
.wrap--narrow { width: min(880px, 100% - 40px); margin-inline: auto; }
.skip-link { position: absolute; left: 16px; top: -60px; z-index: 2000; background: var(--ink); color: #fff; padding: .6rem 1rem; border-radius: 10px; }
.skip-link:focus { top: 12px; color: #fff; }
.visually-hidden-focusable:not(:focus) { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.text-muted-rbs { color: var(--muted) !important; }
.text-gradient { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.foil-gold { background: var(--foil-gold); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }
.foil-plat { background: var(--foil-plat); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- Eyebrow & section heads ---------- */
.eyebrow {
  display: inline-flex; align-items: center; gap: .7rem;
  font-family: var(--font-sans);
  font-size: .75rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  color: var(--magenta);
  margin-bottom: 1rem;
}
.eyebrow::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: var(--grad-brand); }
.eyebrow--light { color: #e6c9f1; }
.eyebrow--light::before { background: linear-gradient(90deg, #e48bdf, #c3a4f3); }
.eyebrow--gold { color: var(--gold-2); }
.eyebrow--gold::before { background: var(--foil-gold); }
.eyebrow--plat { color: var(--plat-2); }
.eyebrow--plat::before { background: var(--foil-plat); }

.section { padding: clamp(72px, 9vw, 128px) 0; position: relative; }
.section--tight { padding: clamp(48px, 6vw, 80px) 0; }
.section--mist { background: var(--mist); }
.section--ink { background: var(--ink); color: rgba(255, 255, 255, .78); }
.section--ink h2, .section--ink h3, .section--ink h4 { color: #fff; }

.sec-head { max-width: 760px; margin: 0 auto clamp(40px, 5vw, 64px); text-align: center; }
.sec-head--left { margin-left: 0; text-align: left; }
.sec-head h2 { font-size: clamp(2rem, 3.8vw, 3.1rem); margin-bottom: 1rem; }
.sec-head h2 em, .display em { font-style: italic; font-weight: 500; }
.sec-head p { font-size: 1.1rem; color: var(--muted); margin: 0; }
.section--ink .sec-head p { color: rgba(255, 255, 255, .66); }

/* ---------- Buttons ---------- */
.btn-rbs {
  --btn-bg: var(--grad-brand);
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  padding: .95rem 1.65rem;
  border-radius: 999px; border: 0;
  font-family: var(--font-sans); font-size: .95rem; font-weight: 700; letter-spacing: .01em; line-height: 1.2;
  color: #fff; background: var(--btn-bg);
  box-shadow: 0 12px 26px -12px rgba(147, 39, 143, .7), inset 0 1px 0 rgba(255, 255, 255, .22);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease), background-color .25s, color .25s;
  cursor: pointer; white-space: nowrap;
}
.btn-rbs:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 18px 34px -14px rgba(147, 39, 143, .8), inset 0 1px 0 rgba(255, 255, 255, .25); }
.btn-rbs:active { transform: translateY(0); }
.btn-rbs .bi { font-size: 1.05em; transition: transform .25s var(--ease); }
.btn-rbs:hover .bi-arrow-right, .btn-rbs:hover .bi-arrow-up-right { transform: translateX(3px); }
.btn-rbs[disabled] { opacity: .65; pointer-events: none; }
.btn-rbs--sm { padding: .68rem 1.2rem; font-size: .875rem; }
.btn-rbs--lg { padding: 1.1rem 2rem; font-size: 1rem; }
.btn-rbs--block { width: 100%; }
.btn-rbs--ghost { background: rgba(255, 255, 255, .06); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.btn-rbs--ghost:hover { background: rgba(255, 255, 255, .12); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .4); }
.btn-rbs--outline { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1.5px var(--line-strong); }
.btn-rbs--outline:hover { color: var(--magenta); box-shadow: inset 0 0 0 1.5px var(--magenta); }
.btn-rbs--light { background: #fff; color: var(--ink); box-shadow: 0 12px 26px -14px rgba(0, 0, 0, .5); }
.btn-rbs--light:hover { color: var(--magenta); }
.btn-rbs--gold { background: linear-gradient(135deg, #f7e4a6 0%, #d6b25e 45%, #a47a2c 100%); color: #1d1406; box-shadow: 0 14px 30px -14px rgba(214, 178, 94, .75), inset 0 1px 0 rgba(255, 255, 255, .55); }
.btn-rbs--gold:hover { color: #1d1406; box-shadow: 0 18px 36px -14px rgba(214, 178, 94, .9), inset 0 1px 0 rgba(255, 255, 255, .6); }
.btn-rbs--plat { background: linear-gradient(135deg, #ffffff 0%, #ddd9ea 50%, #aea8c3 100%); color: #2a1740; box-shadow: 0 14px 30px -14px rgba(191, 169, 234, .7), inset 0 1px 0 rgba(255, 255, 255, .9); }
.btn-rbs--plat:hover { color: #2a1740; }

.link-arrow { display: inline-flex; align-items: center; gap: .45rem; font-weight: 700; font-size: .95rem; color: var(--magenta); }
.link-arrow .bi { transition: transform .25s var(--ease); }
.link-arrow:hover .bi { transform: translateX(4px); }

/* ---------- Top bar ---------- */
.topbar { background: var(--ink); color: rgba(255, 255, 255, .7); font-size: .8rem; position: relative; z-index: 1031; }
.topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 40px; }
.topbar__tag { display: inline-flex; align-items: center; gap: .5rem; letter-spacing: .04em; }
.topbar__tag .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-2); box-shadow: 0 0 0 4px rgba(214, 178, 94, .18); }
.topbar__links { display: flex; align-items: center; gap: 1.4rem; }
.topbar a { color: rgba(255, 255, 255, .85); display: inline-flex; align-items: center; gap: .4rem; }
.topbar a:hover { color: #fff; }
@media (max-width: 767.98px) {
  .topbar__tag { display: none; }
  .topbar__inner { justify-content: center; }
  .topbar__links { gap: 1rem; }
}

/* ---------- Header / navigation ---------- */
.site-header {
  position: sticky; top: 0; z-index: 1030;
  background: rgba(255, 255, 255, .84);
  backdrop-filter: saturate(180%) blur(18px); -webkit-backdrop-filter: saturate(180%) blur(18px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s, box-shadow .3s, background-color .3s;
}
.site-header.is-scrolled { border-color: var(--line); box-shadow: 0 10px 30px -22px rgba(22, 10, 34, .45); background: rgba(255, 255, 255, .92); }
.site-header .navbar { padding: 0; min-height: var(--header-h); }
.site-header .navbar > .wrap { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: .75rem; padding: 10px 0; }
.brand img { height: 52px; width: auto; display: block; }
.brand__text { display: flex; flex-direction: column; line-height: 1.05; }
.brand__text strong { font-family: var(--font-display); font-size: 1.12rem; color: var(--text); letter-spacing: .01em; }
.brand__text small { font-size: .66rem; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); font-weight: 600; }

.site-nav .nav-link {
  font-size: .93rem; font-weight: 600; color: rgba(29, 19, 38, .82) !important;
  padding: .55rem .95rem !important; border-radius: 999px;
  transition: color .2s, background-color .2s;
}
.site-nav .nav-link:hover, .site-nav .nav-link:focus, .site-nav .nav-link.active, .site-nav .show > .nav-link { color: var(--magenta) !important; background: rgba(147, 39, 143, .07); }
.site-nav .dropdown-toggle::after { border: 0; content: "\F282"; font-family: "bootstrap-icons"; vertical-align: -1px; font-size: .7rem; margin-left: .35rem; transition: transform .25s; }
.site-nav .show > .dropdown-toggle::after { transform: rotate(180deg); }
.site-nav .dropdown-menu {
  border: 1px solid var(--line); border-radius: 22px; padding: .55rem; margin-top: .6rem !important;
  box-shadow: var(--shadow-lg); min-width: 340px; background: #fff;
}
.menu-item { display: flex; align-items: center; gap: .95rem; padding: .7rem .8rem; border-radius: 16px; color: var(--text); transition: background-color .2s; }
.menu-item:hover { background: var(--mist); color: var(--text); }
.menu-item strong { display: block; font-size: .93rem; }
.menu-item strong + span { display: block; font-size: .8rem; color: var(--muted); line-height: 1.4; }
.menu-item__icon { flex: 0 0 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; font-size: 1.25rem; color: var(--magenta); background: var(--lilac); transition: background .25s, color .25s, box-shadow .25s; }
.menu-item__icon .bi { display: block; line-height: 1; }
.menu-item__icon .bi::before { vertical-align: top; }
.menu-item:hover .menu-item__icon, .menu-item:focus-visible .menu-item__icon { color: #fff; background: var(--grad-brand); box-shadow: 0 10px 20px -12px rgba(147, 39, 143, .8); }
.mini-card { flex: 0 0 64px; height: 41px; border-radius: 7px; position: relative; overflow: hidden; box-shadow: 0 8px 16px -8px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(255, 255, 255, .14); }
.mini-card::before { content: ""; position: absolute; left: 7px; top: 15px; width: 11px; height: 8px; border-radius: 2px; }
.mini-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .22) 50%, transparent 65%); }
.mini-card--prime { background: radial-gradient(120% 140% at 0% 0%, #3d6cf5 0%, #1f45c4 45%, #112c8f 100%); }
.mini-card--prime::before { background: var(--foil-plat); }
.mini-card--crown { background: radial-gradient(130% 120% at 100% 0%, #1d3a9e 0%, #11286f 55%, #081443 100%); box-shadow: 0 8px 16px -8px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(214, 178, 94, .45); }
.mini-card--crown::before { background: var(--foil-gold); }

.nav-cta { display: flex; align-items: center; gap: .6rem; margin-left: 1rem; }
@media (min-width: 992px) { .site-header .navbar > .wrap { flex-wrap: nowrap; } }
.nav-toggle { border: 0; background: var(--mist); width: 46px; height: 46px; border-radius: 14px; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 5px; padding: 0; }
.nav-toggle span { display: block; width: 20px; height: 2px; border-radius: 2px; background: var(--text); transition: transform .3s var(--ease), opacity .2s; }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 991.98px) {
  :root { --header-h: 70px; }
  .brand img { height: 44px; }
  .nav-toggle { display: inline-flex; }
  .site-nav { width: 100%; }
  .site-nav .navbar-nav { padding: .5rem 0 1rem; gap: .15rem; }
  .site-nav .nav-link { padding: .85rem 1rem !important; border-radius: 14px; font-size: 1rem; }
  .site-nav .dropdown-menu { box-shadow: none; border: 0; background: var(--mist); min-width: 0; margin: .25rem 0 .5rem !important; }
  .nav-cta { margin: 0 0 1.2rem; }
  .nav-cta .btn-rbs { width: 100%; }
}

/* ---------- Ambient dark backgrounds ---------- */
.ambient { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.ambient::before {
  content: ""; position: absolute; inset: -20%;
  background:
    radial-gradient(38% 42% at 82% 18%, rgba(167, 47, 161, .55), transparent 70%),
    radial-gradient(40% 46% at 8% 92%, rgba(103, 63, 152, .55), transparent 70%),
    radial-gradient(30% 30% at 55% 0%, rgba(214, 178, 94, .14), transparent 70%);
  filter: blur(10px);
  animation: ambient-drift 22s ease-in-out infinite alternate;
}
.ambient::after {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255, 255, 255, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .045) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(70% 60% at 50% 30%, #000 20%, transparent 80%);
  mask-image: radial-gradient(70% 60% at 50% 30%, #000 20%, transparent 80%);
}
.ambient--gold::before {
  background:
    radial-gradient(40% 46% at 85% 10%, rgba(214, 178, 94, .3), transparent 70%),
    radial-gradient(40% 50% at 5% 95%, rgba(38, 84, 224, .42), transparent 70%),
    radial-gradient(30% 30% at 50% 50%, rgba(164, 122, 44, .12), transparent 70%);
}
.ambient--plat::before {
  background:
    radial-gradient(40% 46% at 85% 12%, rgba(120, 160, 255, .42), transparent 70%),
    radial-gradient(40% 50% at 5% 95%, rgba(38, 84, 224, .45), transparent 70%),
    radial-gradient(30% 30% at 50% 40%, rgba(255, 255, 255, .06), transparent 70%);
}
.grain::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .09; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@keyframes ambient-drift { to { transform: translate3d(2%, -3%, 0) scale(1.05); } }

/* ---------- Home hero ---------- */
.hero { position: relative; background: var(--ink); color: rgba(255, 255, 255, .74); overflow: hidden; padding: clamp(64px, 8vw, 110px) 0 clamp(150px, 14vw, 190px); }
.hero__grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.hero h1 { color: #fff; font-size: clamp(2.7rem, 5.6vw, 4.6rem); line-height: 1.05; letter-spacing: -.012em; margin-bottom: 1.4rem; font-weight: 600; }
.hero h1 em { font-style: italic; font-weight: 500; background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }
.hero__lead { font-size: clamp(1.05rem, 1.4vw, 1.2rem); max-width: 540px; color: rgba(255, 255, 255, .72); margin-bottom: 2.2rem; }
.hero__actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-bottom: 2.6rem; }
.hero__trust { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; font-size: .88rem; color: rgba(255, 255, 255, .75); padding: 0; margin: 0; list-style: none; }
.hero__trust li { display: inline-flex; align-items: center; gap: .5rem; }
.hero__trust .bi { color: var(--gold-2); font-size: 1rem; }

.hero-stage { position: relative; aspect-ratio: 1 / .92; max-width: 560px; margin-left: auto; width: 100%; }
.hero-stage .mcard { position: absolute; width: 80%; }
.hero-stage__back { top: 2%; right: 0; transform: rotate(9deg); animation: float-b 9s ease-in-out infinite; }
.hero-stage__front { bottom: 6%; left: 0; transform: rotate(-7deg); animation: float-a 8s ease-in-out infinite; z-index: 2; }
.hero-stage__halo { position: absolute; inset: 12% 8%; border-radius: 50%; background: radial-gradient(closest-side, rgba(167, 47, 161, .55), transparent); filter: blur(40px); }
.float-chip {
  position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: .65rem;
  padding: .7rem 1rem .7rem .7rem; border-radius: 16px;
  background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .18);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  color: #fff; font-size: .82rem; line-height: 1.25; box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .6);
}
.float-chip strong { display: block; font-size: .95rem; }
.float-chip small { color: rgba(255, 255, 255, .65); }
.float-chip__icon { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; font-size: 1.05rem; background: var(--grad-brand); }
.float-chip__icon--gold { background: linear-gradient(135deg, #f6e3a1, #a47a2c); color: #1d1406; }
.float-chip--a { left: -4%; top: 6%; animation: float-a 7s ease-in-out infinite; }
.float-chip--b { right: -2%; bottom: -2%; animation: float-b 8s ease-in-out infinite; }
@keyframes float-a { 0%, 100% { translate: 0 0; } 50% { translate: 0 -12px; } }
@keyframes float-b { 0%, 100% { translate: 0 0; } 50% { translate: 0 10px; } }

@media (max-width: 991.98px) {
  .hero__grid { grid-template-columns: 1fr; }
  .hero-stage { margin: 1rem auto 0; max-width: 480px; }
}
@media (max-width: 575.98px) {
  .float-chip { font-size: .74rem; padding: .55rem .8rem .55rem .55rem; }
  .float-chip strong { font-size: .84rem; }
  .float-chip--a { left: 0; top: 0; }
  .float-chip--b { right: 0; }
}

/* ---------- Stats bar ---------- */
.statbar { position: relative; z-index: 5; margin-top: clamp(-110px, -9vw, -80px); }
.statbar__inner { background: #fff; border-radius: var(--r-lg); box-shadow: var(--shadow-lg); border: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, 1fr); }
.stat { padding: clamp(22px, 3vw, 36px) clamp(18px, 2.4vw, 32px); position: relative; }
.stat + .stat::before { content: ""; position: absolute; left: 0; top: 24%; bottom: 24%; width: 1px; background: var(--line); }
.stat__value { font-family: var(--font-display); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 600; line-height: 1; letter-spacing: -.02em; background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; display: inline-block; }
.stat__label { margin-top: .55rem; font-size: .9rem; color: var(--muted); font-weight: 500; }
@media (max-width: 767.98px) {
  .statbar__inner { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(3)::before { display: none; }
  .stat:nth-child(n + 3) { border-top: 1px solid var(--line); }
}

/* ==========================================================================
   Membership cards — Prime (bright royal blue & platinum) and Crown (deep royal blue & gold)
   ========================================================================== */
.mcard {
  --mx: .5; --my: .3; --rx: 0deg; --ry: 0deg;
  --foil: linear-gradient(105deg, #a3b2dc 0%, #f5f8ff 20%, #c6d2f2 36%, #ffffff 50%, #b3c1e8 66%, #edf2ff 84%, #a3b2dc 100%);
  position: relative; width: 100%; max-width: 460px;
  aspect-ratio: 1.586;
  container-type: inline-size;
  perspective: 1400px;
  -webkit-user-select: none; user-select: none;
}
.mcard--crown { --foil: var(--foil-gold); }
.mcard__tilt { position: absolute; inset: 0; transform-style: preserve-3d; transform: rotateX(var(--rx)) rotateY(var(--ry)); transition: transform .6s var(--ease); }
.mcard.is-active .mcard__tilt { transition: transform .08s linear; }
.mcard__body { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform .9s var(--ease); }
.mcard.is-flipped .mcard__body { transform: rotateY(180deg); }
.mcard__face {
  position: absolute; inset: 0; overflow: hidden;
  border-radius: 4.4cqw;
  -webkit-backface-visibility: hidden; backface-visibility: hidden;
  color: #fff;
  box-shadow: 0 3.5cqw 7cqw -3cqw rgba(12, 4, 20, .7), 0 1.6cqw 3cqw -1.6cqw rgba(0, 0, 0, .45);
  isolation: isolate;
}
.mcard__face--back { transform: rotateY(180deg); }
.mcard__face::after { /* bevelled edge */
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 9;
  box-shadow: inset 0 0 0 .22cqw rgba(255, 255, 255, .14), inset 0 .3cqw 0 rgba(255, 255, 255, .22), inset 0 -.3cqw 0 rgba(0, 0, 0, .3);
}

/* Prime surface */
.mcard--prime .mcard__face {
  background:
    radial-gradient(70% 90% at 100% 100%, rgba(3, 8, 52, .55), transparent 70%),
    radial-gradient(90% 120% at 100% 0%, rgba(130, 175, 255, .2), transparent 55%),
    linear-gradient(160deg, rgba(255, 255, 255, .07) 0%, transparent 40%),
    radial-gradient(120% 150% at 0% 0%, #3d6cf5 0%, #2654e0 30%, #1b40bd 62%, #112c8f 100%);
}
.mcard--prime .mcard__brush { position: absolute; inset: 0; z-index: 0; opacity: .5; background: repeating-linear-gradient(112deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 3px); }
.mcard--prime .mcard__pattern { color: rgba(220, 232, 255, .2); }
.mcard--prime .mcard__holo {
  position: absolute; inset: -30%; z-index: 1; opacity: .14; mix-blend-mode: color-dodge;
  background: conic-gradient(from calc(var(--mx) * 360deg) at 60% 40%, #7fb8ff, #a9a0ff, #cfe6ff, #6f9bff, #7fb8ff);
  filter: blur(18px);
  transition: opacity .4s;
}
.mcard--prime.is-active .mcard__holo { opacity: .28; }

/* Crown surface */
.mcard--crown .mcard__face {
  background:
    radial-gradient(60% 80% at 100% 0%, rgba(214, 178, 94, .18), transparent 60%),
    radial-gradient(70% 90% at 0% 100%, rgba(70, 120, 240, .28), transparent 65%),
    radial-gradient(120% 120% at 100% 0%, #1d3a9e 0%, #11286f 45%, #081443 100%);
}
.mcard--crown .mcard__brush { position: absolute; inset: 0; z-index: 0; opacity: .6; background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .018) 0 2px, transparent 2px 4px), repeating-linear-gradient(-45deg, rgba(0, 0, 0, .12) 0 2px, transparent 2px 4px); }
.mcard--crown .mcard__pattern { color: rgba(222, 188, 104, .36); }
.mcard--crown .mcard__frame { position: absolute; inset: 2.6cqw; border-radius: 2.6cqw; z-index: 1; border: .16cqw solid rgba(222, 188, 104, .45); pointer-events: none; }
.mcard--crown .mcard__watermark {
  position: absolute; z-index: 1; right: -6cqw; bottom: -9cqw; width: 58cqw; aspect-ratio: 64 / 52; opacity: .1;
  background: var(--foil-gold);
  -webkit-mask: var(--emblem-crown) center / contain no-repeat; mask: var(--emblem-crown) center / contain no-repeat;
}

.mcard__pattern { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; }
.mcard__sheen { position: absolute; inset: 0; z-index: 2; overflow: hidden; pointer-events: none; }
.mcard__sheen::before {
  content: ""; position: absolute; top: -50%; bottom: -50%; left: -60%; width: 45%;
  background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, .16) 50%, transparent 100%);
  transform: skewX(-18deg); animation: mcard-sweep 7s ease-in-out infinite;
}
.mcard--crown .mcard__sheen::before { background: linear-gradient(100deg, transparent 0%, rgba(255, 233, 170, .16) 50%, transparent 100%); }
@keyframes mcard-sweep { 0%, 55% { left: -60%; } 85%, 100% { left: 130%; } }
.mcard__glare {
  position: absolute; inset: 0; z-index: 8; pointer-events: none; opacity: 0; mix-blend-mode: soft-light;
  background: radial-gradient(circle at calc(var(--mx) * 100%) calc(var(--my) * 100%), rgba(255, 255, 255, .7), transparent 48%);
  transition: opacity .4s;
}
.mcard.is-active .mcard__glare { opacity: 1; }

/* Content */
.mcard__content { position: absolute; inset: 0; z-index: 5; padding: 6.2cqw 6.6cqw 5.6cqw; display: flex; flex-direction: column; }
.mcard__top { display: flex; justify-content: space-between; align-items: flex-start; }
.mcard__logo-wrap { filter: drop-shadow(0 .25cqw .2cqw rgba(0, 0, 0, .45)); }
.mcard__logo {
  display: block; width: 14.5cqw; aspect-ratio: 472 / 400;
  background: var(--foil); background-size: 240% 100%; background-position: calc(var(--mx) * 100%) 50%;
  -webkit-mask: url("/assets/images/brand/logo/rbs-nidhi-logo.webp") center / contain no-repeat;
  mask: url("/assets/images/brand/logo/rbs-nidhi-logo.webp") center / contain no-repeat;
  transition: background-position .5s var(--ease);
}
.mcard__tier { text-align: right; line-height: 1; filter: drop-shadow(0 .25cqw .2cqw rgba(0, 0, 0, .45)); }
.mcard__tier-row { display: inline-flex; align-items: center; gap: 1.6cqw; }
.mcard__emblem { display: inline-block; width: 6.2cqw; aspect-ratio: 64 / 56; background: var(--foil); background-size: 240% 100%; background-position: calc(var(--mx) * 100%) 50%; -webkit-mask: var(--emblem-gem) center / contain no-repeat; mask: var(--emblem-gem) center / contain no-repeat; }
.mcard--crown .mcard__emblem { width: 7cqw; aspect-ratio: 64 / 52; -webkit-mask-image: var(--emblem-crown); mask-image: var(--emblem-crown); }
.mcard__tier-name { font-family: var(--font-display); font-weight: 600; font-size: 6.4cqw; letter-spacing: .14em; margin-right: -.14em; }
.mcard__tier-sub { display: block; margin-top: 1.5cqw; font-size: 1.95cqw; font-weight: 700; letter-spacing: .32em; margin-right: -.32em; text-transform: uppercase; }
.mcard .foil, .mcard__number, .mcard__name, .mcard__date, .mcard__tier-name, .mcard__tier-sub {
  background: var(--foil); background-size: 240% 100%; background-position: calc(var(--mx) * 100%) 50%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  transition: background-position .5s var(--ease);
}
.mcard__mid { display: flex; align-items: center; gap: 3.4cqw; margin-top: auto; margin-bottom: 3.4cqw; }
.mcard__chip { position: relative; width: 12.6cqw; aspect-ratio: 1.32; border-radius: 1.8cqw; overflow: hidden; box-shadow: inset 0 0 0 .2cqw rgba(0, 0, 0, .25), 0 .35cqw .7cqw rgba(0, 0, 0, .45); }
.mcard--prime .mcard__chip { background: linear-gradient(135deg, #f7f6fb 0%, #c9c5d6 35%, #8e89a2 55%, #e9e6f1 80%, #a9a4ba 100%); }
.mcard--crown .mcard__chip { background: linear-gradient(135deg, #fff1c2 0%, #e2c06c 32%, #a47a2c 55%, #f2d888 80%, #b68a33 100%); }
.mcard__chip::before {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, transparent 31%, rgba(0, 0, 0, .3) 31% 33.5%, transparent 33.5% 66.5%, rgba(0, 0, 0, .3) 66.5% 69%, transparent 69%),
    linear-gradient(0deg, transparent 33%, rgba(0, 0, 0, .3) 33% 36%, transparent 36% 64%, rgba(0, 0, 0, .3) 64% 67%, transparent 67%);
}
.mcard__chip::after { content: ""; position: absolute; left: 33%; right: 33%; top: 30%; bottom: 30%; border-radius: .9cqw; border: .22cqw solid rgba(0, 0, 0, .3); background: rgba(255, 255, 255, .12); }
.mcard__nfc { width: 5.6cqw; height: auto; color: rgba(255, 255, 255, .7); }
.mcard--crown .mcard__nfc { color: rgba(240, 210, 125, .75); }
.mcard__number {
  font-family: var(--font-sans); font-weight: 600; font-size: 6.1cqw; letter-spacing: .14em; white-space: nowrap;
  font-variant-numeric: tabular-nums; line-height: 1; margin-bottom: 4.6cqw;
  filter: drop-shadow(0 .25cqw .15cqw rgba(0, 0, 0, .5));
}
.mcard__bottom { display: flex; align-items: flex-end; gap: 5cqw; }
.mcard__field { display: flex; flex-direction: column; min-width: 0; filter: drop-shadow(0 .2cqw .15cqw rgba(0, 0, 0, .45)); }
.mcard__field small { font-size: 1.7cqw; letter-spacing: .26em; text-transform: uppercase; color: rgba(255, 255, 255, .55); font-weight: 700; margin-bottom: 1cqw; line-height: 1; }
.mcard--crown .mcard__field small { color: rgba(240, 214, 140, .6); }
.mcard__name { font-size: 3.5cqw; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.15; }
.mcard__date { font-size: 3.5cqw; font-weight: 700; letter-spacing: .1em; font-variant-numeric: tabular-nums; line-height: 1.15; }
.mcard__field--grow { flex: 1; }
.mcard__mark { margin-left: auto; font-family: var(--font-display); font-style: italic; font-size: 2.6cqw; letter-spacing: .04em; white-space: nowrap; opacity: .9; }

/* Card back: stripe, signature + code, terms, issuer line, contacts. Also renders the card-back PNGs. */
.mcard__face--back .mcard__pattern { opacity: .5; }
.mcard__stripe { position: absolute; left: 0; right: 0; top: 4.6cqw; height: 9.8cqw; z-index: 3; background: linear-gradient(180deg, #05070d 0%, #1b2030 46%, #0a0d16 100%); }
.mcard__back { position: absolute; inset: 0; z-index: 5; padding: 17.4cqw 6.2cqw 4.8cqw; display: flex; flex-direction: column; letter-spacing: 0; }
.mcard__back small { display: block; margin-bottom: .9cqw; font-size: 1.3cqw; font-weight: 700; letter-spacing: .22em; line-height: 1; text-transform: uppercase; color: rgba(255, 255, 255, .62); }
.mcard__sig-row { display: flex; align-items: flex-end; gap: 2.6cqw; }
.mcard__sig { flex: 1; min-width: 0; }
.mcard__sign-panel { height: 7.4cqw; border-radius: .8cqw; display: flex; align-items: center; padding: 0 2.4cqw; background: repeating-linear-gradient(135deg, #f4f7fe 0 1.2cqw, #e2e9f8 1.2cqw 2.4cqw); color: #1a2d6b; font-family: var(--font-display); font-style: italic; font-size: 3.4cqw; white-space: nowrap; overflow: hidden; }
.mcard--crown .mcard__sign-panel { background: repeating-linear-gradient(135deg, #fbf4df 0 1.2cqw, #f0e3bd 1.2cqw 2.4cqw); color: #3b2a0c; }
.mcard__code-box {
  display: flex; align-items: center; justify-content: center; width: 13cqw; height: 7.4cqw; border-radius: .8cqw;
  background: #fff; color: #10204f; box-shadow: inset 0 0 0 .2cqw rgba(0, 0, 0, .08);
  font-size: 3.4cqw; font-style: italic; font-weight: 700; letter-spacing: .14em;
}
.mcard__terms { margin: 2.6cqw 0 0; font-size: 1.48cqw; line-height: 1.5; color: rgba(255, 255, 255, .76); }
.mcard__powered { margin: 1.8cqw 0 0; padding-top: 1.6cqw; border-top: .12cqw solid rgba(255, 255, 255, .2); font-size: 1.55cqw; line-height: 1.4; color: rgba(255, 255, 255, .86); }
.mcard__powered b { font-weight: 700; } /* 800 opens wide gaps around "Ltd.," in this typeface */
.mcard__back-foot { margin-top: auto; display: flex; align-items: flex-end; gap: 3cqw; }
.mcard__contacts { flex: 1; margin: 0; padding: 0; list-style: none; font-size: 1.75cqw; font-weight: 600; line-height: 1.65; color: #fff; }
.mcard__contacts .bi { margin-right: 1.2cqw; font-size: 1.6cqw; color: rgba(255, 255, 255, .7); }
.mcard__back-foot .mcard__logo { width: 9.5cqw; }
.mcard__back-foot .mcard__holo-sticker { width: 12cqw; }
.mcard--crown .mcard__back small, .mcard--crown .mcard__contacts .bi { color: rgba(240, 214, 140, .78); }
.mcard--crown .mcard__terms { color: rgba(246, 236, 210, .74); }
.mcard--crown .mcard__powered { border-top-color: rgba(214, 178, 94, .32); color: rgba(246, 236, 210, .86); }
.mcard--crown .mcard__contacts { color: #f6ecd2; }
.mcard--crown .mcard__code-box { background: #fff8e4; color: #3b2a0c; }
.mcard__holo-sticker { width: 13cqw; aspect-ratio: 1.45; border-radius: 1.4cqw; background: conic-gradient(from calc(var(--mx) * 360deg), #ffc6f1, #b3e2ff, #d9c6ff, #fff0b8, #ffc6f1); box-shadow: inset 0 0 0 .2cqw rgba(255, 255, 255, .5); position: relative; overflow: hidden; }
.mcard__holo-sticker::after { content: ""; position: absolute; inset: 22%; background: rgba(20, 30, 70, .55); -webkit-mask: url("/assets/images/brand/logo/rbs-nidhi-mark.png") center / contain no-repeat; mask: url("/assets/images/brand/logo/rbs-nidhi-mark.png") center / contain no-repeat; }

.card-flip-hint { display: inline-flex; align-items: center; gap: .5rem; margin-top: 1.4rem; font-size: .85rem; font-weight: 600; color: rgba(255, 255, 255, .7); background: none; border: 0; padding: .4rem .2rem; cursor: pointer; }
.card-flip-hint:hover { color: #fff; }
.card-flip-hint .bi { font-size: 1.1rem; }

/* emblem masks */
:root {
  --emblem-gem: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 56'%3E%3Cdefs%3E%3Cmask id='m'%3E%3Crect width='64' height='56' fill='white'/%3E%3Cpath d='M2 18H62M22 18L14 4M22 18L32 4M42 18L32 4M42 18L50 4M22 18L32 54M42 18L32 54' stroke='black' stroke-width='2.4' fill='none' stroke-linejoin='round'/%3E%3C/mask%3E%3C/defs%3E%3Cpath mask='url(%23m)' d='M14 4H50L62 18L32 54L2 18Z' fill='white'/%3E%3C/svg%3E");
  --emblem-crown: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 52'%3E%3Cpath fill='white' d='M8 40h48v6a2 2 0 0 1-2 2H10a2 2 0 0 1-2-2z'/%3E%3Cpath fill='white' d='M6 15l12 13L32 9l14 19 12-13-3.5 21h-45z'/%3E%3Ccircle cx='6' cy='12' r='4' fill='white'/%3E%3Ccircle cx='32' cy='6' r='4.5' fill='white'/%3E%3Ccircle cx='58' cy='12' r='4' fill='white'/%3E%3C/svg%3E");
}

/* ---------- Tier showcase ---------- */
.tiers { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 2.6vw, 32px); }
.tier { position: relative; border-radius: 32px; padding: clamp(28px, 3.6vw, 48px); color: rgba(255, 255, 255, .75); overflow: hidden; isolation: isolate; display: flex; flex-direction: column; }
.tier::before { content: ""; position: absolute; inset: 0; z-index: -1; }
.tier--prime { background: var(--panel-prime); box-shadow: inset 0 0 0 1px rgba(190, 208, 255, .2), var(--shadow-lg); }
.tier--crown { background: var(--panel-crown); box-shadow: inset 0 0 0 1px rgba(214, 178, 94, .3), var(--shadow-lg); }
.tier__card { display: flex; justify-content: center; margin-bottom: clamp(28px, 3vw, 40px); padding-top: .5rem; }
.tier__card .mcard { max-width: 420px; }
.tier__label { font-size: .75rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; margin-bottom: .6rem; }
.tier h3 { color: #fff; font-size: clamp(1.7rem, 2.6vw, 2.2rem); margin-bottom: .8rem; }
.tier p { margin-bottom: 1.6rem; }
.tier__specs { list-style: none; padding: 0; margin: 0 0 1.8rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; border-radius: 18px; overflow: hidden; background: rgba(255, 255, 255, .1); }
.tier__specs li { background: rgba(6, 14, 50, .5); padding: .9rem 1rem; }
.tier--crown .tier__specs li { background: rgba(3, 8, 30, .55); }
.tier__specs small { display: block; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .5); font-weight: 600; margin-bottom: .2rem; }
.tier__specs strong { color: #fff; font-weight: 700; font-size: 1rem; }
.tier__foot { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.4rem; }
.price { display: flex; align-items: baseline; gap: .7rem; flex-wrap: wrap; }
.price__now { font-family: var(--font-display); font-weight: 600; font-size: clamp(2rem, 3vw, 2.5rem); line-height: 1; }
.price__was { font-size: 1.05rem; color: rgba(255, 255, 255, .62); text-decoration: line-through; }
.price__note { width: 100%; font-size: .78rem; color: rgba(255, 255, 255, .55); letter-spacing: .04em; }
/* The card offer: a festive label on its own line above the price (white text stays above 4.5:1 on the whole gradient) */
.price__offer { width: 100%; }
.offer-tag { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .9rem; border-radius: 999px; font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: linear-gradient(100deg, #c2410c 0%, #be185d 55%, #93278f 100%); box-shadow: 0 10px 22px -12px rgba(190, 24, 93, .9); }
.offer-tag .bi { font-size: .9rem; }
.tier__ctas { display: flex; gap: .6rem; flex-wrap: wrap; }
@media (max-width: 991.98px) { .tiers { grid-template-columns: 1fr; } }
@media (max-width: 575.98px) { .tier__specs { grid-template-columns: 1fr; } }

/* ---------- Generic surfaces ---------- */
.panel { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-md); padding: clamp(24px, 4vw, 56px); }
.panel--flat { box-shadow: none; }
.lift { position: relative; z-index: 3; margin-top: -88px; }
.icon-tile { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; font-size: 1.45rem; color: #fff; background: var(--grad-brand); box-shadow: 0 14px 26px -14px rgba(147, 39, 143, .8); flex: 0 0 auto; }
.icon-tile--soft { color: var(--magenta); background: var(--lilac); box-shadow: none; }
.icon-tile--gold { color: #1d1406; background: linear-gradient(135deg, #f6e3a1, #c79f45 60%, #a47a2c); box-shadow: 0 14px 26px -14px rgba(164, 122, 44, .8); }
.icon-tile--plat { color: #2a1740; background: linear-gradient(135deg, #ffffff, #cfcadd 60%, #a39db8); box-shadow: 0 14px 26px -14px rgba(143, 138, 163, .8); }
.icon-tile--sm { width: 44px; height: 44px; border-radius: 14px; font-size: 1.15rem; }

.feature { padding: clamp(24px, 3vw, 34px); border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); height: 100%; transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s; }
.feature:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: rgba(147, 39, 143, .2); }
.feature h3, .feature h4 { font-family: var(--font-sans); font-size: 1.15rem; font-weight: 700; margin: 1.3rem 0 .55rem; letter-spacing: -.01em; }
.feature p { color: var(--muted); margin: 0; font-size: .97rem; }

/* Services */
.svc { position: relative; border-radius: var(--r-lg); overflow: hidden; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); height: 100%; display: flex; flex-direction: column; transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.svc:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.svc__media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.svc__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.svc:hover .svc__media img { transform: scale(1.05); }
.svc__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(22, 10, 34, 0) 45%, rgba(22, 10, 34, .55) 100%); }
.svc__badge { position: absolute; z-index: 2; left: 20px; bottom: 18px; display: inline-flex; align-items: center; gap: .55rem; padding: .45rem .8rem .45rem .5rem; border-radius: 999px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .3); color: #fff; font-size: .78rem; font-weight: 600; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.svc__badge .mini-card { flex-basis: 34px; height: 22px; border-radius: 4px; }
.svc__badge .mini-card::before { left: 4px; top: 8px; width: 6px; height: 5px; }
.svc__body { padding: clamp(24px, 3vw, 36px); display: flex; flex-direction: column; flex: 1; }
.svc__body h3 { font-size: clamp(1.5rem, 2.2vw, 1.9rem); margin-bottom: .7rem; }
.svc__body p { color: var(--muted); }
.chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: .4rem 0 1.6rem; padding: 0; list-style: none; }
.chips li { display: inline-flex; align-items: center; gap: .45rem; font-size: .82rem; font-weight: 600; padding: .45rem .8rem; border-radius: 999px; background: var(--mist); color: var(--text); border: 1px solid var(--line); }
.chips .bi { color: var(--magenta); }
.svc__foot { margin-top: auto; display: flex; flex-wrap: wrap; gap: .8rem 1.4rem; align-items: center; }

/* Steps */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 24px); counter-reset: step; }
.step { position: relative; padding: clamp(26px, 3vw, 36px); border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.step:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.step__num { font-family: var(--font-display); font-style: italic; font-size: 3rem; line-height: 1; font-weight: 500; background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 1.1rem; display: block; }
.step h3 { font-family: var(--font-sans); font-size: 1.15rem; font-weight: 700; margin-bottom: .55rem; letter-spacing: -.01em; }
.step p { color: var(--muted); font-size: .96rem; margin: 0; }
.step__extra { margin-top: 1rem; display: flex; flex-wrap: wrap; gap: .5rem; }
@media (max-width: 991.98px) { .steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .steps { grid-template-columns: 1fr; } }

/* Why us (dark) */
.why { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(255, 255, 255, .1); border-radius: var(--r-lg); overflow: hidden; }
.why__item { background: var(--ink); padding: clamp(28px, 3.4vw, 44px); }
.why__item h3 { font-family: var(--font-sans); font-size: 1.2rem; font-weight: 700; margin: 1.4rem 0 .6rem; color: #fff; }
.why__item p { margin: 0; color: rgba(255, 255, 255, .64); }
.why--4 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 767.98px) { .why { grid-template-columns: 1fr; } }

/* ---------- Calculators: ladder planner and partner estimators ----------
   Series colours were checked with the dataviz palette validator: light set on #fff,
   dark set on the result panel (#0e1a4d). */
.range { -webkit-appearance: none; appearance: none; width: 100%; height: 6px; border-radius: 6px; background: linear-gradient(90deg, var(--royal) 0%, #5a88ff var(--fill, 50%), #e4e8f4 var(--fill, 50%)); outline: none; }
.range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 24px; height: 24px; border-radius: 50%; background: #fff; border: 6px solid var(--royal); box-shadow: 0 6px 14px -4px rgba(38, 84, 224, .55); cursor: grab; transition: transform .2s; }
.range::-webkit-slider-thumb:hover { transform: scale(1.12); }
.range::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 6px solid var(--royal); box-shadow: 0 6px 14px -4px rgba(38, 84, 224, .55); cursor: grab; }
.range:focus-visible::-webkit-slider-thumb { box-shadow: 0 0 0 5px rgba(38, 84, 224, .22); }
.range:disabled { cursor: not-allowed; }
.calc-scale { display: flex; justify-content: space-between; font-size: .75rem; color: var(--muted); margin-top: .45rem; }

.calc { --c-principal: #2654e0; --c-interest: #d39a2c; --c-fee: #c2389a; }
.calc__main { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); background: #fff; border: 1px solid var(--line); border-radius: 28px; box-shadow: var(--shadow-lg); overflow: hidden; }
.calc__controls { padding: clamp(22px, 3.4vw, 44px); display: grid; gap: 28px; align-content: start; }
.calc__label { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: .8rem; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.calc__label output, .calc__label [data-out] { letter-spacing: 0; text-transform: none; font-size: .88rem; font-weight: 700; color: var(--text); text-align: right; }

.calc__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.calc-card { position: relative; display: flex; align-items: center; gap: .9rem; text-align: left; padding: 14px 16px; border-radius: 16px; background: #fff; border: 1.5px solid var(--line-strong); cursor: pointer; transition: border-color .2s, background-color .2s, box-shadow .2s; }
.calc-card .mini-card { flex: 0 0 52px; height: 33px; }
.calc-card strong { display: block; font-size: 1rem; color: var(--text); line-height: 1.2; }
.calc-card small { display: block; font-size: .78rem; color: var(--muted); }
.calc-card__tick { position: absolute; top: 9px; right: 11px; font-size: .95rem; color: var(--royal); opacity: 0; transition: opacity .2s; }
.calc-card:hover { border-color: rgba(38, 84, 224, .45); }
.calc-card.is-on { border-color: var(--royal); background: #f4f7ff; box-shadow: 0 0 0 3px rgba(38, 84, 224, .12); }
.calc-card.is-on .calc-card__tick { opacity: 1; }

.calc__steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.calc-step { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 9px 11px; border-radius: 12px; border: 1.5px solid var(--line-strong); background: #fff; cursor: pointer; text-align: left; transition: border-color .2s, background-color .2s, box-shadow .2s; }
.calc-step small { font-size: .64rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.calc-step strong { font-size: .95rem; font-weight: 700; color: var(--text); white-space: nowrap; }
.calc-step--emi small::after { content: " · EMI"; }
.calc-step:hover { border-color: rgba(38, 84, 224, .45); }
.calc-step.is-before { background: #f4f7ff; border-color: rgba(38, 84, 224, .22); }
.calc-step.is-on { background: linear-gradient(135deg, #2f5fe8, #1b3fb8); border-color: transparent; box-shadow: 0 10px 22px -12px rgba(38, 84, 224, .9); }
.calc-step.is-on small, .calc-step.is-on strong { color: #fff; }

.calc__presets { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.calc__presets button { padding: .42rem .9rem; border-radius: 999px; border: 1.5px solid var(--line-strong); background: #fff; font-weight: 700; font-size: .84rem; color: var(--text); transition: border-color .2s, color .2s, background-color .2s; }
.calc__presets button:hover:not(:disabled) { border-color: rgba(38, 84, 224, .45); }
.calc__presets button.is-on { border-color: var(--royal); color: var(--royal); background: #f4f7ff; }
.calc__presets button:disabled { opacity: .45; cursor: not-allowed; }
.calc__tenure.is-off .range, .calc__tenure.is-off .calc-scale { opacity: .4; }
.calc__hint { display: flex; gap: .5rem; align-items: flex-start; margin: .9rem 0 0; font-size: .85rem; color: var(--muted); }
.calc__hint .bi { color: var(--royal); margin-top: .1rem; }

.calc__segs { display: grid; grid-template-columns: repeat(var(--n, 10), 1fr); gap: 4px; }
.calc__segs span { height: 8px; border-radius: 4px; background: #e4e8f4; transition: background-color .3s; }
.calc__segs span.is-filled { background: #9db7ff; }
.calc__segs span.is-current { background: var(--royal); }

.calc__result {
  --c-principal: #5a88ff; --c-interest: #b8872b; --c-fee: #c65aa9;
  position: relative; isolation: isolate; display: flex; flex-direction: column; padding: clamp(22px, 3.4vw, 44px); color: rgba(255, 255, 255, .72);
  background: radial-gradient(120% 70% at 100% 0%, rgba(90, 136, 255, .3), transparent 60%), linear-gradient(165deg, #142b74 0%, #0e1a4d 55%, #0a1238 100%);
}
.calc__result-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .62); }
.calc__badge { padding: .3rem .7rem; border-radius: 999px; background: rgba(255, 255, 255, .1); color: #fff; font-size: .76rem; font-weight: 600; letter-spacing: .02em; text-transform: none; white-space: nowrap; }
.calc__hero { margin: .9rem 0 .25rem; font-family: var(--font-sans); font-weight: 700; font-size: clamp(2.5rem, 4.4vw, 3.5rem); line-height: 1; letter-spacing: -.025em; color: #fff; }
.calc__sub { margin: 0 0 1.6rem; font-size: .92rem; color: rgba(255, 255, 255, .66); }
.costbar { display: flex; gap: 2px; height: 12px; margin-bottom: 1rem; }
.costbar span { flex: var(--v, 1) 1 0; min-width: 3px; background: var(--c); transition: flex-grow .45s var(--ease); }
.costbar span:last-child { border-radius: 0 4px 4px 0; }
.costlegend { list-style: none; margin: 0 0 1.4rem; padding: 0; }
.costlegend li { display: flex; align-items: center; gap: .6rem; padding: .55rem 0; border-bottom: 1px solid rgba(255, 255, 255, .1); font-size: .9rem; }
.costlegend li strong { margin-left: auto; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; }
.costlegend .sw { flex: 0 0 10px; height: 10px; border-radius: 2px; background: var(--c); }
.calc__minihead { margin: 0 0 .6rem; font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.calc__minihead[hidden], [data-out="eq-wrap"][hidden] { display: none; }
.calc__eq { list-style: none; margin: 0 0 1.4rem; padding: 12px 16px; border-radius: 14px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); }
.calc__eq li { display: flex; align-items: center; gap: .7rem; padding: .4rem 0; font-size: .9rem; }
.calc__eq li b { flex: 0 0 1rem; font-size: 1rem; font-weight: 700; text-align: center; color: rgba(255, 255, 255, .55); }
.calc__eq li span { line-height: 1.3; }
.calc__eq li small { display: block; font-size: .74rem; color: rgba(255, 255, 255, .5); }
.calc__eq li strong { margin-left: auto; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; }
.calc__eq li.is-total { margin-top: .25rem; padding-top: .6rem; border-top: 1px solid rgba(255, 255, 255, .2); color: #fff; font-weight: 700; }
.calc__eq li.is-total strong { font-size: 1.1rem; }
.calc__eq li.is-ctx { margin-bottom: .3rem; padding-bottom: .6rem; border-bottom: 1px solid rgba(255, 255, 255, .14); color: rgba(255, 255, 255, .72); }
.calc__eq li.is-ctx strong { color: rgba(255, 255, 255, .85); font-weight: 600; }
.calc__eq li.is-note { display: block; padding: .45rem 0 0; font-size: .76rem; color: rgba(255, 255, 255, .55); }
.calc__eq li.is-note[hidden] { display: none; }
.costlegend li.is-total { border-bottom: 0; padding-top: .8rem; color: #fff; font-weight: 700; font-size: 1rem; }
.costlegend li.is-total strong { font-size: 1.15rem; }
.calc__kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-bottom: 1.4rem; border-radius: 14px; overflow: hidden; background: rgba(255, 255, 255, .12); }
.calc__kpis > div { padding: .8rem .9rem; background: rgba(8, 15, 48, .6); }
.calc__kpis small { display: block; margin-bottom: .25rem; font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .55); }
.calc__kpis strong { color: #fff; font-size: 1.02rem; font-weight: 700; }
.calc__result .btn-rbs { margin-top: auto; }
.calc__note { margin: 1rem 0 0; font-size: .74rem; line-height: 1.55; color: rgba(255, 255, 255, .5); }

.calc__insights { margin-top: 22px; padding: clamp(20px, 3vw, 32px); background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow-sm); }
.calc__insights-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.4rem; }
.calc__insights-head h3 { margin: 0; font-size: 1.35rem; }
.seg { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 4px; border-radius: 999px; background: var(--mist); border: 1px solid var(--line); }
.seg button { border: 0; background: none; padding: .48rem 1rem; border-radius: 999px; font-weight: 700; font-size: .85rem; color: var(--muted); transition: background-color .2s, color .2s, box-shadow .2s; }
.seg button[aria-selected="true"], .seg button.is-on { background: #fff; color: var(--royal); box-shadow: var(--shadow-sm); }
.seg--grid { display: grid; grid-template-columns: repeat(var(--n, 3), auto); border-radius: 16px; }
.seg--grid button { border-radius: 12px; padding-inline: .8rem; }
/* .seg.seg--grid outranks the phone .seg rule further down, which turns every segmented control into one row */
@media (max-width: 575.98px) { .seg.seg--grid { display: grid; grid-template-columns: repeat(3, 1fr); } .seg.seg--grid button { padding-inline: .4rem; white-space: normal; } }
.chart-legend { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin-bottom: .8rem; font-size: .84rem; color: var(--muted); }
.chart-legend span { display: inline-flex; align-items: center; gap: .45rem; }
.chart-legend i { width: 10px; height: 10px; border-radius: 2px; background: var(--c); }
.chart { position: relative; }
.chart svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart .grid line { stroke: #eceff6; stroke-width: 1; }
.chart .axis text, .chart text.axis { fill: var(--muted); font-family: var(--font-sans); font-size: 11px; font-variant-numeric: tabular-nums; }
.chart .col { outline: none; }
.chart .col .hit { fill: transparent; }
.chart .col:hover .hit, .chart .col:focus-visible .hit { fill: rgba(38, 84, 224, .06); }
.chart-tip { position: absolute; z-index: 3; min-width: 168px; padding: .65rem .8rem; border-radius: 12px; background: #0e1a4d; color: #fff; font-size: .8rem; box-shadow: var(--shadow-md); pointer-events: none; opacity: 0; transform: translate(-50%, calc(-100% - 10px)); transition: opacity .15s; }
.chart-tip.is-on { opacity: 1; }
.chart-tip b { display: block; margin-bottom: .3rem; font-size: .72rem; font-weight: 600; color: rgba(255, 255, 255, .6); }
.chart-tip div { display: flex; align-items: center; gap: .5rem; line-height: 1.6; }
.chart-tip div i { flex: 0 0 12px; height: 2px; border-radius: 1px; background: var(--c); }
.chart-tip div span { color: rgba(255, 255, 255, .6); }
.chart-empty { display: flex; gap: 1rem; align-items: center; padding: clamp(20px, 3vw, 28px); border-radius: 18px; background: var(--mist); color: var(--text); }
.chart-empty .bi { font-size: 1.6rem; color: var(--royal); }
.chart-empty p { margin: 0; }
.calc__panel[hidden] { display: none; }
.calc__panel .table-wrap { max-height: 440px; box-shadow: none; }
.rate-table tr[data-tenure] { cursor: pointer; }
.rate-table tr.is-on td { background: #f4f7ff; font-weight: 700; color: var(--text); }
.rate-table tfoot td, .rate-table tr.is-total td { border-top: 2px solid var(--line-strong); font-weight: 700; color: var(--text); background: var(--mist); }
.rate-table--split td b { display: block; font-weight: 700; color: var(--text); }
.rate-table--split td small { display: block; font-size: .74rem; color: var(--muted); margin-top: .1rem; }
.rate-table thead th { position: sticky; top: 0; background: #fff; z-index: 1; }

@media (max-width: 991.98px) { .calc__main { grid-template-columns: 1fr; } }
@media (max-width: 575.98px) {
  .calc__cards { grid-template-columns: 1fr; }
  .calc__steps { gap: 6px; }
  .calc-step { padding: 8px 7px; }
  .calc-step small { font-size: .58rem; letter-spacing: .06em; }
  .calc-step--emi small::after { content: ""; }
  .calc-step strong { font-size: .82rem; }
  .calc__kpis { grid-template-columns: 1fr; }
  .seg { display: flex; flex-wrap: nowrap; width: 100%; border-radius: 14px; }
  .seg button { flex: 1 1 auto; padding: .5rem .55rem; border-radius: 10px; font-size: .8rem; white-space: nowrap; }
}

/* Loan ladder: 10 rising steps */
.ladder-legend { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; margin-bottom: 1.4rem; font-size: .86rem; color: var(--muted); }
.ladder-legend span { display: inline-flex; align-items: center; gap: .5rem; }
.ladder-legend i { width: 14px; height: 14px; border-radius: 4px; background: #fff; border: 1px solid var(--line-strong); }
.ladder-legend .is-emi i { background: var(--panel-prime); border: 0; }
.ladder-legend--crown .is-emi i { background: var(--panel-crown); box-shadow: inset 0 0 0 1px rgba(214, 178, 94, .5); }
.ladder { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 10), minmax(0, 1fr)); gap: 10px; align-items: end; }
.ladder__step {
  min-height: calc(118px + var(--i) * 140px / var(--n, 10)); display: flex; flex-direction: column; justify-content: flex-end; gap: .25rem;
  padding: 14px 12px; border-radius: 16px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm);
}
.ladder__n { font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ladder__amt { font-family: var(--font-display); font-weight: 600; font-size: clamp(1.05rem, 1.5vw, 1.3rem); line-height: 1.1; color: var(--text); white-space: nowrap; }
.ladder__meta { font-size: .74rem; line-height: 1.35; color: var(--muted); }
.ladder__step--emi { background: var(--panel-prime); border-color: transparent; }
.ladder--crown .ladder__step--emi { background: var(--panel-crown); box-shadow: inset 0 0 0 1px rgba(214, 178, 94, .35), var(--shadow-sm); }
.ladder__step--emi .ladder__n, .ladder__step--emi .ladder__meta { color: rgba(255, 255, 255, .66); }
.ladder__step--emi .ladder__amt { color: #fff; }
.ladder--crown .ladder__step--emi .ladder__amt { background: var(--foil-gold); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* More than ten steps: tighter tiles so every amount fits on one line */
.ladder--dense { gap: 8px; }
.ladder--dense .ladder__step { padding: 12px 9px; border-radius: 14px; }
.ladder--dense .ladder__n { letter-spacing: .08em; }
.ladder--dense .ladder__amt { font-size: clamp(.95rem, 1.15vw, 1.1rem); }
.ladder--dense .ladder__meta { font-size: .7rem; }
.ladder-total { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .6rem 1.4rem; margin-top: 1.2rem; font-size: .92rem; color: var(--muted); }
.ladder-total strong { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; color: var(--text); }
@media (max-width: 991.98px) {
  .ladder { grid-template-columns: repeat(5, 1fr); }
  .ladder__step { min-height: calc(110px + var(--r) * 12px); }
}
@media (max-width: 575.98px) {
  .ladder { grid-template-columns: repeat(2, 1fr); }
  .ladder__step { min-height: 0; }
}

/* Cost tables */
.table-wrap { overflow-x: auto; border-radius: var(--r-md); border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-sm); }
.rate-table { width: 100%; border-collapse: collapse; font-size: .9rem; min-width: 640px; margin: 0; }
.rate-table caption { caption-side: top; text-align: left; padding: 18px 20px 8px; color: var(--text); font-weight: 700; font-size: 1rem; }
.rate-table caption small { display: block; font-weight: 500; color: var(--muted); font-size: .84rem; margin-top: .15rem; }
.rate-table th, .rate-table td { padding: .7rem 1rem; text-align: right; border-top: 1px solid var(--line); white-space: nowrap; font-variant-numeric: tabular-nums; }
.rate-table th:first-child, .rate-table td:first-child { text-align: left; }
.rate-table thead th { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.rate-table tbody tr:hover { background: var(--mist); }
.rate-table td.is-strong { font-weight: 700; color: var(--text); }
.ladder-costs { display: grid; gap: 22px; margin-top: clamp(32px, 4vw, 48px); }
.fineprint { font-size: .82rem; line-height: 1.6; color: var(--muted); margin: 1.2rem 0 0; max-width: 980px; }

/* ---------- How it works & partner pages ---------- */
.network { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 34px 1fr 34px 1fr 34px 1fr; align-items: stretch; }
.network__node { position: relative; display: flex; flex-direction: column; padding: 26px 22px; border-radius: 22px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.network__node small { font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin-top: 1.1rem; }
.network__node h3 { font-family: var(--font-sans); font-size: 1.15rem; font-weight: 700; margin: .2rem 0 .8rem; }
.network__node ul { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .45rem; }
.network__node ul li { position: relative; padding-left: 1.1rem; font-size: .9rem; line-height: 1.45; color: var(--muted); }
.network__node ul li::before { content: ""; position: absolute; left: 0; top: .55em; width: 6px; height: 6px; border-radius: 50%; background: var(--royal); opacity: .55; }
.network__node .link-arrow { margin-top: auto; }
.network__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; font-size: 1.3rem; color: var(--royal); background: #eef2ff; }
.network__node--lender { background: var(--panel-prime); border-color: transparent; color: #fff; }
.network__node--lender .network__icon { background: rgba(255, 255, 255, .14); color: #fff; }
.network__node--lender small, .network__node--lender ul li { color: rgba(255, 255, 255, .72); }
.network__node--lender h3 { color: #fff; }
.network__node--lender ul li::before { background: #9db7ff; opacity: 1; }
.network__node.is-you { border: 2px solid var(--royal); box-shadow: 0 0 0 5px rgba(38, 84, 224, .1), var(--shadow-md); }
.network__node.is-you small { color: var(--royal); }
.network__arrow { display: grid; place-items: center; color: var(--royal); font-size: 1.2rem; }
.network__note { display: flex; gap: .55rem; align-items: flex-start; margin: 1.4rem 0 0; font-size: .9rem; color: var(--muted); }
.network__note .bi { color: var(--royal); margin-top: .15rem; }
@media (max-width: 991.98px) {
  .network { grid-template-columns: 1fr; gap: 0; }
  .network__arrow { height: 34px; }
  .network__arrow .bi { transform: rotate(90deg); }
}

.states { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 14px; align-items: stretch; }
.state { padding: 22px; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.state .bi { font-size: 1.4rem; }
.state strong { display: block; margin: .6rem 0 .3rem; font-size: 1.05rem; color: var(--text); }
.state p { margin: 0; font-size: .9rem; color: var(--muted); }
.state--locked .bi { color: var(--muted); }
.state--open { border-color: rgba(38, 84, 224, .35); background: #f4f7ff; }
.state--open .bi { color: var(--royal); }
.state--closed .bi { color: var(--success); }
.states__arrow { display: grid; place-items: center; color: var(--muted); font-size: 1.2rem; }
@media (max-width: 767.98px) {
  .states { grid-template-columns: 1fr; }
  .states__arrow { transform: rotate(90deg); }
}

.compare-cards { width: 100%; }
.compare-cards td, .compare-cards th { white-space: normal; }
.compare-cards td:not(:first-child), .compare-cards th:not(:first-child) { text-align: left; }

/* Leader bonus levels: 7 rising, selectable tiles + the selected level's example week */
.levels { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; align-items: end; }
.level { width: 100%; min-height: calc(132px + var(--i) * 16px); display: flex; flex-direction: column; justify-content: flex-end; gap: .2rem; padding: 14px 13px; border-radius: 16px; text-align: left; background: #fff; border: 1.5px solid var(--line-strong); cursor: pointer; transition: border-color .2s, background-color .2s, box-shadow .2s, transform .2s; }
.level small { font-size: .66rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.level strong { font-size: 1.25rem; font-weight: 700; color: var(--text); }
.level span { font-size: .74rem; line-height: 1.35; color: var(--muted); }
.level:hover { border-color: rgba(38, 84, 224, .45); }
.level.is-reached { background: #f4f7ff; border-color: rgba(38, 84, 224, .25); }
.level.is-on { background: var(--panel-prime); border-color: transparent; box-shadow: 0 14px 28px -16px rgba(38, 84, 224, .9); }
.level.is-on small, .level.is-on span { color: rgba(255, 255, 255, .7); }
.level.is-on strong { color: #fff; }
@media (max-width: 991.98px) {
  .levels { grid-template-columns: repeat(4, 1fr); }
  .level { min-height: 0; }
}
@media (max-width: 575.98px) { .levels { grid-template-columns: repeat(2, 1fr); } }

.steps--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 991.98px) { .steps--4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .steps--4 { grid-template-columns: 1fr; } }

.rate-callout { display: flex; gap: .8rem; align-items: flex-start; max-width: 860px; margin: 0 auto clamp(28px, 3.4vw, 40px); padding: 16px 20px; border-radius: 16px; background: #fff; border: 1px solid rgba(38, 84, 224, .3); box-shadow: var(--shadow-sm); }
.rate-callout .bi { font-size: 1.25rem; color: var(--royal); margin-top: .05rem; }
.rate-callout p { margin: 0; color: var(--text); }
.rate-strip { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.rate-strip li { padding: 8px 6px; border-radius: 10px; border: 1px solid var(--line); background: #fff; text-align: center; opacity: .55; transition: opacity .2s, background-color .2s, border-color .2s; }
.rate-strip li small { display: block; font-size: .66rem; font-weight: 700; letter-spacing: .1em; color: var(--muted); }
.rate-strip li b { font-size: .86rem; color: var(--text); }
.rate-strip li.is-on { opacity: 1; background: #f4f7ff; border-color: var(--royal); box-shadow: 0 0 0 3px rgba(38, 84, 224, .12); }
@media (max-width: 575.98px) { .rate-strip { grid-template-columns: repeat(4, 1fr); } }

/* CSP outlet tiers: one card per tier, all with the same rows (to join, you get, to keep it) */
.otiers { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.otier { display: flex; flex-direction: column; border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); overflow: hidden; box-shadow: var(--shadow-sm); }
.otier__head { padding: 20px 20px 18px; color: #1d1406; background: var(--g); }
.otier__head small { display: block; font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; opacity: .7; }
.otier__head h3 { display: flex; align-items: center; gap: .5rem; margin: .25rem 0 .8rem; font-size: 1.55rem; color: inherit; }
.otier__head h3 .bi { font-size: 1.05rem; opacity: .8; }
.otier__head p { margin: 0; font-size: .8rem; line-height: 1.35; opacity: .85; }
.otier__head p strong { display: block; font-size: 1.35rem; font-weight: 700; letter-spacing: -.01em; }
.otier--gold { --g: linear-gradient(135deg, #f6e3a1 0%, #d6b25e 55%, #b98d38 100%); }
.otier--platinum { --g: linear-gradient(135deg, #ffffff 0%, #dcd9e6 50%, #aea9c0 100%); }
.otier--platinum .otier__head { color: #221a33; }
.otier--diamond { --g: linear-gradient(135deg, #eef5ff 0%, #b9d3ff 50%, #7ea6f2 100%); }
.otier--diamond .otier__head { color: #0c1a4c; }
.otier--black-diamond { --g: radial-gradient(120% 90% at 100% 0%, #2d3658 0%, #121730 55%, #05060d 100%); }
.otier--black-diamond .otier__head { color: #fff; }
.otier--black-diamond .otier__head h3 .bi { color: #b9d3ff; opacity: 1; }
.otier__body { flex: 1; padding: 4px 20px 18px; }
.otier__body h4 { margin: 14px 0 4px; font-size: .66rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.otier__body dl { margin: 0; }
.otier__body dl div { display: flex; justify-content: space-between; align-items: baseline; gap: .8rem; padding: .45rem 0; border-top: 1px solid var(--line); font-size: .86rem; }
.otier__body dt { font-weight: 500; color: var(--muted); white-space: nowrap; }
.otier__body dd { margin: 0; text-align: right; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.otier__body dd span { display: block; }
.otier__body dd small { display: block; font-size: .74rem; font-weight: 500; color: var(--muted); }
.otier__body dd.is-none { font-weight: 500; color: var(--muted); }
@media (max-width: 1199.98px) { .otiers { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575.98px) { .otiers { grid-template-columns: 1fr; } }

/* Outlet estimator: whether the week meets the tier's weekly target */
.calc__target { display: flex; gap: .6rem; align-items: flex-start; margin: 0 0 1.4rem; padding: 12px 14px; border-radius: 14px; font-size: .86rem; line-height: 1.4; color: rgba(255, 255, 255, .85); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); }
.calc__target .bi { margin-top: .1rem; color: rgba(255, 255, 255, .6); }
.calc__target.is-met { background: rgba(31, 157, 107, .16); border-color: rgba(111, 224, 176, .35); }
.calc__target.is-met .bi { color: #6fe0b0; }
.calc__target.is-short { background: rgba(211, 154, 44, .14); border-color: rgba(240, 196, 106, .35); }
.calc__target.is-short .bi { color: #f0c46a; }

/* Membership pages: both sides of the card, large and flat */
.card-sides { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(20px, 3vw, 40px); }
.card-sides figure { margin: 0; }
.card-sides .mcard { max-width: none; }
.card-sides figcaption { margin-top: 1rem; font-size: .9rem; color: var(--muted); text-align: center; }
.card-sides figcaption strong { color: var(--text); }
@media (max-width: 767.98px) { .card-sides { grid-template-columns: 1fr; } }

/* Logo marquees (NBFC partners, banks): two copies of the list slide by one copy's width (half the track plus
   half a gap), so the loop is seamless. The edges fade out; hover or focus pauses the row. */
.marquee { --g: 18px; position: relative; overflow: hidden; padding: 8px 0; -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.marquee + .marquee { margin-top: 10px; }
.marquee__track { display: flex; gap: var(--g); width: max-content; animation: marquee var(--dur, 40s) linear infinite; }
.marquee--reverse .marquee__track { animation-direction: reverse; }
.marquee:hover .marquee__track, .marquee:focus-within .marquee__track { animation-play-state: paused; }
.marquee__set { display: flex; gap: var(--g); margin: 0; padding: 0; list-style: none; }
@keyframes marquee { to { transform: translateX(calc(-50% - var(--g) / 2)); } }
.logo-tile { flex: none; display: flex; align-items: center; justify-content: center; gap: .6rem; width: 212px; height: 84px; padding: 0 22px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.logo-tile img { height: 40px; width: auto; max-width: 100%; min-width: 0; object-fit: contain; }
.logo-tile span { font-size: .9rem; font-weight: 700; line-height: 1.15; color: #1a4fa0; }
.marquee--nbfc .logo-tile { width: 250px; height: 100px; padding: 0 28px; }
.marquee--nbfc .logo-tile img { height: 50px; }
@media (max-width: 575.98px) {
  .marquee { --g: 12px; }
  .logo-tile { width: 160px; height: 68px; padding: 0 16px; border-radius: 14px; }
  .logo-tile img { height: 32px; }
  .logo-tile span { font-size: .78rem; }
  .marquee--nbfc .logo-tile { width: 184px; height: 80px; padding: 0 20px; }
  .marquee--nbfc .logo-tile img { height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .marquee { -webkit-mask-image: none; mask-image: none; }
  .marquee__track { animation: none; width: auto; justify-content: center; }
  .marquee__set { flex-wrap: wrap; justify-content: center; }
  .marquee__set[aria-hidden] { display: none; }
}

/* App band */
.appband { position: relative; border-radius: 32px; overflow: hidden; background: var(--ink); color: rgba(255, 255, 255, .72); isolation: isolate; }
.appband__media { position: absolute; inset: 0; z-index: -1; }
.appband__media img { width: 100%; height: 100%; object-fit: cover; object-position: 80% 50%; }
.appband__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(22, 10, 34, .97) 0%, rgba(22, 10, 34, .9) 42%, rgba(22, 10, 34, .25) 75%, rgba(22, 10, 34, .1) 100%); }
.appband__inner { padding: clamp(36px, 5vw, 72px); max-width: 620px; }
.appband h2 { color: #fff; font-size: clamp(1.9rem, 3.4vw, 2.8rem); margin-bottom: 1rem; }
.store-row { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.store-btn { display: inline-flex; align-items: center; gap: .75rem; padding: .7rem 1.2rem .7rem 1rem; border-radius: 14px; background: #000; color: #fff; border: 1px solid rgba(255, 255, 255, .22); transition: transform .25s var(--ease), border-color .25s; line-height: 1.15; }
.store-btn:hover { color: #fff; transform: translateY(-2px); border-color: rgba(255, 255, 255, .5); }
.store-btn .bi { font-size: 1.6rem; }
.store-btn small { display: block; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, .65); }
.store-btn strong { font-size: 1rem; font-weight: 700; }
@media (max-width: 767.98px) { .appband__media::after { background: linear-gradient(180deg, rgba(22, 10, 34, .82) 0%, rgba(22, 10, 34, .96) 60%); } }

/* Contact cards */
.contact-card { height: 100%; padding: clamp(26px, 3vw, 36px); border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.contact-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.contact-card h3 { font-family: var(--font-sans); font-size: .78rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--magenta); margin: 1.4rem 0 .7rem; }
.contact-card p { color: var(--muted); margin-bottom: .6rem; font-size: .97rem; }
.contact-card .big { display: block; font-family: var(--font-display); font-size: clamp(1.3rem, 2vw, 1.55rem); font-weight: 600; color: var(--text); margin: .2rem 0 .6rem; word-break: break-word; }
.contact-card .big:hover { color: var(--magenta); }
.map-frame { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-md); aspect-ratio: 21 / 9; }
.map-frame iframe { width: 100%; height: 100%; border: 0; display: block; filter: saturate(.85); }
@media (max-width: 767.98px) { .map-frame { aspect-ratio: 4 / 3; } }

/* ---------- Inner page hero ---------- */
.pagehero { position: relative; background: var(--ink); color: rgba(255, 255, 255, .72); overflow: hidden; padding: clamp(56px, 7vw, 96px) 0 clamp(130px, 12vw, 170px); }
.pagehero > .wrap { position: relative; z-index: 2; }
.pagehero h1 { color: #fff; font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1.07; letter-spacing: -.012em; margin-bottom: 1.1rem; max-width: 900px; }
.pagehero h1 em { font-style: italic; font-weight: 500; background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .06em; }
.pagehero__lead { font-size: clamp(1.02rem, 1.3vw, 1.18rem); max-width: 680px; margin-bottom: 0; }
.pagehero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1.8rem; font-size: .82rem; color: rgba(255, 255, 255, .55); }
.crumbs a { color: rgba(255, 255, 255, .8); }
.crumbs a:hover { color: #fff; }
.crumbs li + li::before { content: "\F285"; font-family: "bootstrap-icons"; font-size: .65rem; margin-right: .5rem; opacity: .6; }
.pagehero--crown h1 em { background: var(--foil-gold); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; }
.pagehero--prime h1 em { background: var(--foil-plat); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; }

.keyfacts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 2.6rem; border-radius: 20px; overflow: hidden; background: rgba(255, 255, 255, .12); max-width: 920px; }
.keyfacts div { background: rgba(22, 10, 34, .72); padding: 1rem 1.2rem; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.keyfacts small { display: block; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .5); font-weight: 600; margin-bottom: .25rem; }
.keyfacts strong { color: #fff; font-size: 1.02rem; }
@media (max-width: 767.98px) { .keyfacts { grid-template-columns: 1fr 1fr; } }
/* Five facts (the loan pages): one row on desktop; the last fact widens to fill its row on smaller screens */
.keyfacts--5 { grid-template-columns: repeat(5, 1fr); max-width: 1120px; }
@media (max-width: 991.98px) { .keyfacts--5 { grid-template-columns: repeat(3, 1fr); } .keyfacts--5 > div:last-child { grid-column: span 2; } }
@media (max-width: 767.98px) { .keyfacts--5 { grid-template-columns: 1fr 1fr; } .keyfacts--5 > div:last-child { grid-column: 1 / -1; } }

/* Sticky in-page navigation */
.subnav { position: sticky; top: var(--header-h); z-index: 20; background: rgba(255, 255, 255, .9); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); }
.subnav ul { display: flex; gap: .3rem; list-style: none; margin: 0; padding: .6rem 0; overflow-x: auto; scrollbar-width: none; }
.subnav ul::-webkit-scrollbar { display: none; }
.subnav a { display: block; white-space: nowrap; padding: .5rem .95rem; border-radius: 999px; font-size: .88rem; font-weight: 600; color: var(--muted); }
.subnav a:hover, .subnav a.is-current { color: var(--magenta); background: rgba(147, 39, 143, .07); }

/* Prose & lists */
.prose { color: #4a4055; font-size: 1.04rem; }
.prose p { margin-bottom: 1.1rem; }
.prose h2 { font-size: clamp(1.7rem, 2.8vw, 2.3rem); margin-bottom: 1.1rem; }
.prose .lead-p { font-size: 1.18rem; color: var(--text); }
.checklist { list-style: none; padding: 0; margin: 0; display: grid; gap: .95rem; }
.checklist li { display: flex; gap: .85rem; align-items: flex-start; color: #4a4055; }
.checklist li::before { content: "\F26E"; font-family: "bootstrap-icons"; flex: 0 0 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 1.05rem; color: #fff; background: var(--grad-brand); margin-top: 1px; }
.checklist--gold li::before { color: #1d1406; background: linear-gradient(135deg, #f6e3a1, #c79f45 60%, #a47a2c); }
.checklist--plat li::before { color: #2a1740; background: linear-gradient(135deg, #ffffff, #cfcadd 60%, #a39db8); }

.aside-card { position: sticky; top: calc(var(--header-h) + 80px); border-radius: var(--r-lg); padding: 28px; color: rgba(255, 255, 255, .74); overflow: hidden; isolation: isolate; }
.aside-card h3 { color: #fff; font-size: 1.5rem; margin: 1.4rem 0 .6rem; }
.aside-card p { font-size: .95rem; }
.aside-card--prime { background: var(--panel-prime); }
.aside-card--crown { background: var(--panel-crown); }

/* Accordion */
.faq-list { display: grid; gap: .8rem; }
.faq-item { border: 1px solid var(--line); border-radius: 18px; background: #fff; transition: border-color .3s, box-shadow .3s; }
.faq-item:hover { border-color: rgba(147, 39, 143, .22); }
.faq-item.is-open { border-color: rgba(147, 39, 143, .3); box-shadow: var(--shadow-md); }
.faq-q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; text-align: left; padding: 1.2rem 1.4rem; background: none; border: 0; font-family: var(--font-sans); font-weight: 700; font-size: 1.02rem; color: var(--text); border-radius: 18px; }
.faq-q:hover { color: var(--magenta); }
.faq-q__icon { flex: 0 0 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--mist); color: var(--magenta); transition: transform .35s var(--ease), background-color .3s, color .3s; }
.faq-q[aria-expanded="true"] .faq-q__icon { transform: rotate(45deg); background: var(--grad-brand); color: #fff; }
.faq-a { padding: 0 1.4rem 1.3rem; color: #4a4055; }
.faq-a p:last-child, .faq-a ul:last-child, .faq-a ol:last-child { margin-bottom: 0; }
.faq-a ul, .faq-a ol { padding-left: 1.2rem; }
.faq-a li { margin-bottom: .35rem; }
.faq-search { position: relative; max-width: 560px; margin: 0 auto; }
.faq-search .bi { position: absolute; left: 1.2rem; top: 50%; transform: translateY(-50%); color: rgba(255, 255, 255, .65); }
.faq-search input { width: 100%; padding: 1rem 1.2rem 1rem 3rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .08); color: #fff; font-size: 1rem; outline: none; backdrop-filter: blur(10px); }
.faq-search input::placeholder { color: rgba(255, 255, 255, .55); }
.faq-search input:focus { border-color: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .12); }
.faq-group + .faq-group { margin-top: clamp(40px, 5vw, 64px); }
.faq-group__head { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.4rem; }
.faq-group__head h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); margin: 0; }
.faq-empty { display: none; text-align: center; color: var(--muted); padding: 2rem 0; }
.faq-tabs { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.2rem; }
.faq-tabs a { padding: .55rem 1.1rem; border-radius: 999px; font-size: .88rem; font-weight: 600; color: rgba(255, 255, 255, .8); border: 1px solid rgba(255, 255, 255, .2); }
.faq-tabs a:hover { color: #fff; background: rgba(255, 255, 255, .08); }

/* CTA band */
.ctaband { position: relative; border-radius: 32px; overflow: hidden; background: var(--ink); padding: clamp(36px, 5vw, 68px); color: rgba(255, 255, 255, .74); isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.ctaband > *:not(.ambient) { position: relative; z-index: 2; }
.ctaband h2 { color: #fff; font-size: clamp(1.8rem, 3.2vw, 2.6rem); margin: 0 0 .6rem; }
.ctaband p { margin: 0; }
.ctaband__actions { display: flex; gap: .8rem; flex-wrap: wrap; }

/* Membership page */
.mhero { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.mhero__card { display: flex; flex-direction: column; align-items: center; }
.mhero__card .mcard { max-width: 500px; }
.mhero .price { margin-top: 2rem; }
.mhero .price__now { font-size: clamp(2.4rem, 4vw, 3.2rem); }
.save-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .8rem; border-radius: 999px; font-size: .78rem; font-weight: 700; letter-spacing: .04em; }
.save-pill--gold { color: #1d1406; background: linear-gradient(135deg, #f6e3a1, #d6b25e); }
.save-pill--plat { color: #2a1740; background: linear-gradient(135deg, #ffffff, #d4cfe2); }
@media (max-width: 991.98px) { .mhero { grid-template-columns: 1fr; } .mhero__card { order: -1; } }

.glance { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: #ebe5f0; border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); box-shadow: var(--shadow-md); }
.glance > div { background: #fff; padding: clamp(20px, 2.4vw, 30px); }
.glance .bi { font-size: 1.4rem; }
.glance small { display: block; margin-top: .9rem; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.glance strong { display: block; font-family: var(--font-display); font-size: clamp(1.2rem, 1.8vw, 1.45rem); font-weight: 600; margin-top: .2rem; color: var(--text); }
.theme-crown .section .eyebrow:not([class*="eyebrow--"]) { color: var(--gold-3); }
.theme-crown .section .eyebrow:not([class*="eyebrow--"])::before { background: var(--foil-gold); }
.theme-prime .section .eyebrow:not([class*="eyebrow--"]) { color: var(--violet); }
.theme-prime .glance .bi { color: var(--violet); }
.theme-crown .glance .bi { color: var(--gold-3); }
@media (max-width: 991.98px) { .glance { grid-template-columns: repeat(2, 1fr); } .glance > div:last-child { grid-column: 1 / -1; } }

.benefits { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(16px, 2vw, 22px); }
.benefit { display: flex; gap: 1.2rem; padding: clamp(22px, 2.6vw, 30px); border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); }
.benefit__n { flex: 0 0 auto; font-family: var(--font-display); font-style: italic; font-size: 2.1rem; line-height: 1; font-weight: 500; }
.theme-prime .benefit__n { background: linear-gradient(135deg, #9a7bd0, #673f98); -webkit-background-clip: text; background-clip: text; color: transparent; }
.theme-crown .benefit__n { background: linear-gradient(135deg, #d6b25e, #8a6a2b); -webkit-background-clip: text; background-clip: text; color: transparent; }
.benefit p { margin: 0; color: #4a4055; }
.benefit--wide { grid-column: 1 / -1; }
@media (max-width: 767.98px) { .benefits { grid-template-columns: 1fr; } }

.timeline { list-style: none; padding: 0; margin: 0; position: relative; }
.timeline::before { content: ""; position: absolute; left: 27px; top: 12px; bottom: 12px; width: 2px; background: linear-gradient(180deg, var(--magenta), var(--violet), rgba(103, 63, 152, .1)); }
.theme-crown .timeline::before { background: linear-gradient(180deg, var(--gold-2), var(--gold-3), rgba(164, 122, 44, .1)); }
.timeline li { position: relative; display: flex; gap: 1.4rem; padding-bottom: clamp(24px, 3vw, 36px); }
.timeline li:last-child { padding-bottom: 0; }
.timeline__dot { flex: 0 0 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; font-family: var(--font-display); font-weight: 600; font-size: 1.3rem; color: #fff; background: var(--grad-brand); box-shadow: 0 0 0 6px #fff; position: relative; z-index: 1; }
.theme-crown .timeline__dot { color: #1d1406; background: linear-gradient(135deg, #f6e3a1, #c79f45 60%, #a47a2c); }
.section--mist .timeline__dot { box-shadow: 0 0 0 6px var(--mist); }
.timeline h3 { font-family: var(--font-sans); font-size: 1.15rem; font-weight: 700; margin: .4rem 0 .5rem; }
.timeline p, .timeline ul { color: #4a4055; margin: 0; }
.timeline ul { padding-left: 1.1rem; }
.timeline ul li { display: list-item; padding: 0 0 .3rem; }

/* ---------- Forms & application flow ---------- */
.form-label-rbs { display: block; font-weight: 600; font-size: .86rem; color: var(--text); margin-bottom: .45rem; }
.field { position: relative; }
.field .bi { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--muted); pointer-events: none; }
.input-rbs, .form-body .form-control, .flow .form-control {
  width: 100%; display: block; padding: .95rem 1.1rem; border-radius: 14px;
  border: 1.5px solid #e3dbe9; background: #fff; color: var(--text); font-size: .98rem; font-family: var(--font-sans);
  transition: border-color .2s, box-shadow .2s; appearance: none; -webkit-appearance: none;
}
.field .input-rbs { padding-left: 2.8rem; }
select.input-rbs, .flow select.form-control { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 16 16'%3E%3Cpath fill='%236c6278' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1.1rem center; padding-right: 2.6rem; }
.input-rbs:focus, .form-body .form-control:focus, .flow .form-control:focus { border-color: var(--magenta); box-shadow: 0 0 0 4px rgba(147, 39, 143, .12); outline: none; }
.input-rbs::placeholder { color: #a39aad; }
label.error { display: block !important; margin-top: 6px !important; color: #c0392b !important; font-weight: 600 !important; font-size: 12px !important; }

.flow-steps { display: flex; list-style: none; padding: 0; margin: 0 0 clamp(28px, 4vw, 44px); counter-reset: fs; }
.flow-steps li { flex: 1; position: relative; text-align: center; font-size: .78rem; font-weight: 600; color: var(--muted); counter-increment: fs; }
.flow-steps li::before { content: counter(fs); display: grid; place-items: center; width: 38px; height: 38px; margin: 0 auto .6rem; border-radius: 50%; background: #fff; border: 2px solid #e3dbe9; color: var(--muted); font-weight: 700; position: relative; z-index: 1; transition: all .3s; }
.flow-steps li::after { content: ""; position: absolute; top: 19px; left: calc(-50% + 19px); right: calc(50% + 19px); height: 2px; background: #e3dbe9; }
.flow-steps li:first-child::after { display: none; }
.flow-steps li.is-done::before { content: "\F26E"; font-family: "bootstrap-icons"; font-size: 1.2rem; background: var(--grad-brand); border-color: transparent; color: #fff; }
.flow-steps li.is-done::after, .flow-steps li.is-current::after { background: var(--grad-brand); }
.flow-steps li.is-current { color: var(--text); }
.flow-steps li.is-current::before { border-color: var(--magenta); color: var(--magenta); box-shadow: 0 0 0 6px rgba(147, 39, 143, .12); }
@media (max-width: 575.98px) { .flow-steps li { font-size: 0; } .flow-steps li.is-current { font-size: .72rem; } }

.applicant { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border-radius: 18px; overflow: hidden; border: 1px solid var(--line); margin-bottom: 2rem; }
.applicant > div { background: var(--mist); padding: 1rem 1.2rem; min-width: 0; }
.applicant small { display: block; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.applicant span { display: block; font-weight: 700; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 767.98px) { .applicant { grid-template-columns: 1fr; } }

.offer { text-align: center; padding: clamp(28px, 4vw, 48px); border-radius: var(--r-lg); background: radial-gradient(80% 120% at 50% 0%, rgba(147, 39, 143, .1), transparent 70%), var(--mist); border: 1px solid var(--line); margin-bottom: 1.8rem; }
.offer__amount { font-family: var(--font-display); font-size: clamp(2.4rem, 6vw, 4rem); font-weight: 600; line-height: 1.05; background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; display: inline-block; }
.fineprint { font-size: .84rem; color: var(--muted); text-align: center; margin: 1.2rem auto 0; max-width: 680px; }
.fineprint a { font-weight: 700; }

.countdown { display: flex; justify-content: center; gap: .6rem; list-style: none; padding: 0; margin: 1rem 0 0; }
.countdown li { min-width: 72px; padding: .8rem .4rem; border-radius: 14px; background: var(--ink); color: rgba(255, 255, 255, .6); font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; text-align: center; }
.countdown li span { display: block; font-family: var(--font-display); font-size: 1.7rem; letter-spacing: 0; color: #fff; line-height: 1.1; }

.bank { border-radius: var(--r-md); border: 1px solid var(--line); overflow: hidden; }
.bank__head { display: flex; align-items: center; gap: 1rem; padding: 1.2rem 1.4rem; background: var(--mist); border-bottom: 1px solid var(--line); }
.bank__head img { height: 34px; width: auto; }
.bank dl { display: grid; grid-template-columns: 180px 1fr; margin: 0; }
.bank dt, .bank dd { padding: .95rem 1.4rem; border-bottom: 1px solid var(--line); margin: 0; }
.bank dt { font-size: .82rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.bank dd { font-weight: 700; color: var(--text); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.bank dl > :nth-last-child(-n + 2) { border-bottom: 0; }
.copy-btn { border: 1px solid var(--line); background: #fff; border-radius: 10px; padding: .25rem .6rem; font-size: .78rem; font-weight: 600; color: var(--magenta); }
@media (max-width: 575.98px) { .bank dl { grid-template-columns: 1fr; } .bank dt { border-bottom: 0; padding-bottom: 0; } }
.notice { display: flex; gap: 1rem; padding: 1.2rem 1.4rem; border-radius: 16px; background: #f4f0fb; border: 1px solid rgba(103, 63, 152, .18); color: #3c2c4f; font-size: .94rem; }
.notice .bi { color: var(--violet); font-size: 1.3rem; flex: 0 0 auto; }
.notice p:last-child { margin-bottom: 0; }

/* Auth & apply layouts */
.auth { display: grid; grid-template-columns: 1fr 1fr; border-radius: 32px; overflow: hidden; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-lg); min-height: 620px; }
.auth__brand { position: relative; background: var(--ink); color: rgba(255, 255, 255, .72); padding: clamp(32px, 4vw, 56px); display: flex; flex-direction: column; overflow: hidden; isolation: isolate; }
.auth__brand > *:not(.ambient) { position: relative; z-index: 2; }
.auth__brand h2 { color: #fff; font-size: clamp(1.9rem, 3vw, 2.6rem); margin-bottom: 1rem; }
.auth__brand h2 em { font-style: italic; font-weight: 500; background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.auth__logo { height: 64px; width: auto; align-self: flex-start; margin-bottom: auto; }
.auth__cards { position: relative; height: 230px; margin: 2rem 0 1rem; }
.auth__cards .mcard { position: absolute; width: 68%; max-width: 330px; }
.auth__cards .mcard:first-child { right: 0; top: 0; transform: rotate(8deg); }
.auth__cards .mcard:last-child { left: 0; bottom: 0; transform: rotate(-6deg); }
.auth__form { padding: clamp(32px, 4.5vw, 64px); display: flex; flex-direction: column; justify-content: center; }
.auth__form h1 { font-size: clamp(1.9rem, 3vw, 2.5rem); margin-bottom: .6rem; }
.auth__form > p { color: var(--muted); margin-bottom: 2rem; }
.auth__form .form-control { margin-bottom: 1rem; }
.auth__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-top: .6rem; }
.auth__alt { margin-top: 2rem; padding-top: 1.4rem; border-top: 1px solid var(--line); font-size: .93rem; color: var(--muted); }
.form-content .form-sent { display: none; text-align: center; }
.form-content .form-sent.show-it { display: block; }
.form-content .hide-it { display: none !important; }
.sent-icon { width: 76px; height: 76px; border-radius: 50%; margin: 0 auto 1.4rem; display: grid; place-items: center; font-size: 2.2rem; color: #fff; background: var(--grad-brand); box-shadow: 0 18px 36px -16px rgba(147, 39, 143, .8); }
@media (max-width: 991.98px) { .auth { grid-template-columns: 1fr; } .auth__brand { min-height: 0; } .auth__logo { margin-bottom: 1.6rem; } }

.apply { display: grid; grid-template-columns: 1fr auto; gap: clamp(28px, 4vw, 64px); align-items: center; }
.apply__info { border-radius: 32px; padding: clamp(32px, 4vw, 56px); color: rgba(255, 255, 255, .74); position: relative; overflow: hidden; isolation: isolate; }
.apply__info > *:not(.ambient) { position: relative; z-index: 2; }
.apply__info--prime { background: var(--panel-prime); }
.apply__info--crown { background: var(--panel-crown); }
.apply__info h1 { color: #fff; font-size: clamp(2rem, 3.4vw, 2.9rem); margin-bottom: 1.4rem; }
.apply__info .mcard { max-width: 380px; margin: 2.2rem 0 0; }
.apply__info .checklist li { color: rgba(255, 255, 255, .82); }
.phone-frame { width: 390px; height: 800px; border-radius: 54px; padding: 14px; background: linear-gradient(145deg, #2a2230, #0d0a10); box-shadow: 0 50px 90px -40px rgba(22, 10, 34, .7), inset 0 0 0 2px rgba(255, 255, 255, .08); position: relative; }
.phone-frame::before { content: ""; position: absolute; top: 24px; left: 50%; transform: translateX(-50%); width: 110px; height: 28px; border-radius: 20px; background: #000; z-index: 2; }
.phone-frame iframe { width: 100%; height: 100%; border: 0; border-radius: 42px; background: #fff; display: block; }
@media (max-width: 1199.98px) { .apply { grid-template-columns: 1fr; justify-items: center; } .apply__info { width: 100%; } }
@media (max-width: 575.98px) { .phone-frame { width: 100%; max-width: 390px; height: 720px; } }

/* Success */
.success-mark { width: 96px; height: 96px; border-radius: 50%; margin: 0 auto 1.6rem; display: grid; place-items: center; font-size: 2.8rem; color: #fff; background: linear-gradient(135deg, #2bb57f, #1f9d6b); box-shadow: 0 0 0 12px rgba(31, 157, 107, .12), 0 24px 40px -18px rgba(31, 157, 107, .8); animation: pop .7s var(--ease) both; }
@keyframes pop { 0% { transform: scale(.4); opacity: 0; } 70% { transform: scale(1.08); } 100% { transform: scale(1); opacity: 1; } }

/* 404 */
.err-code { font-family: var(--font-display); font-size: clamp(6rem, 18vw, 12rem); line-height: .9; font-weight: 600; letter-spacing: -.04em; background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* Legal */
.legal-layout { display: grid; grid-template-columns: 260px 1fr; gap: clamp(24px, 4vw, 56px); align-items: start; }
.legal-nav { position: sticky; top: calc(var(--header-h) + 24px); padding: 1rem; border-radius: var(--r-md); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.legal-nav h2 { font-family: var(--font-sans); font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); padding: .4rem .7rem; margin: 0 0 .3rem; }
.legal-nav a { display: flex; align-items: center; gap: .6rem; padding: .62rem .75rem; border-radius: 12px; font-size: .92rem; font-weight: 600; color: var(--text); }
.legal-nav a .bi { color: var(--muted); }
.legal-nav a:hover { background: var(--mist); color: var(--magenta); }
.legal-nav a.is-current { background: var(--lilac); color: var(--magenta); }
.legal-nav a.is-current .bi { color: var(--magenta); }
@media (max-width: 991.98px) { .legal-layout { grid-template-columns: 1fr; } .legal-nav { position: static; } }
.legal_content p, .legal_content li { font-weight: 400; font-size: 1rem; color: #4a4055; letter-spacing: 0; line-height: 1.75; font-family: var(--font-sans); }
.legal_content p strong { color: var(--text) !important; }
.legal_content h2, .legal_content h3, .legal_content h4 { font-family: var(--font-display); letter-spacing: -.005em; font-variation-settings: normal; font-size: 1.45rem; margin: 2.2rem 0 .8rem; font-weight: 600; color: var(--text); }
.legal_content h2:first-child, .legal_content > p:first-child + h2 { margin-top: 1rem; }
.legal_content a { font-weight: 600; word-break: break-word; }
.legal_content img { border-radius: 16px; }

/* ---------- Footer ---------- */
.site-footer { position: relative; background: var(--ink); color: rgba(255, 255, 255, .62); overflow: hidden; isolation: isolate; padding-top: clamp(64px, 7vw, 96px); }
.site-footer::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(214, 178, 94, .55), rgba(208, 107, 203, .55), transparent); }
.site-footer__mark { position: absolute; z-index: -1; right: -60px; bottom: -40px; width: 460px; height: auto; opacity: .04; pointer-events: none; }
.footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: clamp(28px, 4vw, 56px); }
.footer-brand img { height: 72px; width: auto; margin-bottom: 1.4rem; }
.footer-brand p { font-size: .94rem; max-width: 380px; }
.footer-meta { display: grid; gap: .9rem; margin-top: 1.6rem; font-size: .88rem; }
.footer-meta b { display: block; color: #fff; font-weight: 600; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: .15rem; }
.site-footer h3 { font-family: var(--font-sans); color: #fff; font-size: .78rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 1.2rem; }
.footer-links { list-style: none; padding: 0; margin: 0; display: grid; gap: .65rem; }
.footer-links a { color: rgba(255, 255, 255, .66); font-size: .94rem; }
.footer-links a:hover { color: #fff; }
.socials { display: flex; gap: .55rem; margin-top: 1.6rem; }
.socials a { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; color: #fff; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .1); transition: background-color .25s, transform .25s; }
.socials a:hover { background: var(--grad-brand); transform: translateY(-2px); color: #fff; }
.footer-bottom { margin-top: clamp(48px, 6vw, 72px); padding: 1.6rem 0 2rem; border-top: 1px solid rgba(255, 255, 255, .09); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; font-size: .84rem; }
.footer-bottom nav { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; }
.footer-bottom a { color: rgba(255, 255, 255, .62); }
.footer-bottom a:hover { color: #fff; }
.site-footer .store-btn { background: rgba(255, 255, 255, .06); }
.store-btn--soon { opacity: .55; cursor: default; }
.store-btn--soon:hover { transform: none; border-color: rgba(255, 255, 255, .22); }
.footer-app-note { margin: .6rem 0 0; font-size: .82rem; color: rgba(255, 255, 255, .6); }
@media (max-width: 991.98px) { .footer-grid { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 575.98px) { .footer-grid { grid-template-columns: 1fr; } }

/* Back to top (button is required by custom.js) */
#btn-back-to-top { position: fixed; right: 22px; bottom: 22px; z-index: 1040; display: none; width: 48px; height: 48px; border: 0; border-radius: 16px; padding: 0; color: #fff; background: var(--grad-brand); box-shadow: 0 16px 30px -12px rgba(147, 39, 143, .8); font-size: 1.15rem; transition: transform .25s var(--ease); }
#btn-back-to-top:hover { transform: translateY(-3px); }

/* ---------- Reveal on scroll ---------- */
.js [data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--d, 0s); }
.js [data-reveal].is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
  html { scroll-behavior: auto; }
}

/* ---------- Third-party widgets ---------- */
.emic-calculator { font-family: var(--font-sans); }
.iziToast { border-radius: 14px !important; font-family: var(--font-sans) !important; }

/* Legacy support kept from custom.css */
.slick-slide { margin: 0 20px; }
.slick-slide img { width: 100%; }
.slick-slider { position: relative; display: block; box-sizing: border-box; user-select: none; touch-action: pan-y; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-track { position: relative; top: 0; left: 0; display: block; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
.slick-initialized .slick-slide { display: block; }
.text-justify { text-align: justify !important; }

/* ---------- Grievance redressal (/grievance-redressal) ---------- */
.gr-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(20px, 3vw, 32px); align-items: start; }
.gr-side { display: grid; gap: clamp(20px, 3vw, 32px); min-width: 0; }
.gr-panel { padding: clamp(22px, 3vw, 40px); }
.gr-panel h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); margin-bottom: .6rem; }
.gr-intro { color: var(--muted); margin-bottom: 1.4rem; }
.gr-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.gr-field { margin-bottom: 1.1rem; }
.gr-field label { display: block; font-size: .9rem; font-weight: 600; color: var(--text); margin-bottom: .4rem; }
.gr-input { display: block; width: 100%; padding: .78rem .95rem; font: inherit; font-size: 1rem; color: var(--text); background: #fff; border: 1px solid var(--line-strong); border-radius: var(--r-sm); transition: border-color .2s var(--ease), box-shadow .2s var(--ease); }
.gr-input:focus { outline: none; border-color: var(--magenta); box-shadow: 0 0 0 3px rgba(147, 39, 143, .16); }
textarea.gr-input { resize: vertical; min-height: 7rem; }
.gr-hint { display: block; color: var(--muted); font-size: .82rem; margin-top: .35rem; }
.gr-error { display: block; color: #b3261e; font-size: .85rem; font-weight: 600; margin-top: .35rem; }
.gr-field--error .gr-input { border-color: #b3261e; }
.gr-alert { padding: .85rem 1.05rem; margin-bottom: 1.2rem; border-radius: 14px; background: #fdecea; border: 1px solid rgba(179, 38, 30, .25); color: #7a1c14; font-size: .93rem; }
.gr-alert--top { margin: 1.2rem 0 0; }
.gr-ok { padding: .85rem 1.05rem; margin-bottom: 1rem; border-radius: 14px; background: #e9f6ee; border: 1px solid rgba(27, 127, 76, .25); color: #14593a; font-size: .93rem; }
.gr-small { color: var(--muted); font-size: .86rem; margin: .9rem 0 0; }
.gr-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gr-done h2 { margin-top: 1rem; }
.gr-number { font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 600; color: var(--magenta); overflow-wrap: anywhere; }
.gr-number--sm { font-size: 1.3rem; margin-bottom: .5rem; }
.gr-copy { font: inherit; font-family: var(--font-sans); font-size: .8rem; font-weight: 600; vertical-align: middle; padding: .25rem .7rem; color: var(--text); background: #fff; border: 1px solid var(--line-strong); border-radius: 999px; cursor: pointer; }
.gr-copy:hover { color: var(--magenta); border-color: var(--magenta); }
.gr-case { margin-top: 1.5rem; padding-top: 1.4rem; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.gr-pill { display: inline-block; padding: .28rem .8rem; border-radius: 999px; font-size: .8rem; font-weight: 700; background: var(--lilac); color: var(--magenta); }
.gr-pill--resolved { background: #e9f6ee; color: #14593a; }
.gr-pill--closed { background: #eeecf1; color: #4b4356; }
.gr-case dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .3rem 1rem; margin: 1rem 0 0; font-size: .93rem; }
.gr-case dt { font-weight: 600; color: var(--muted); }
.gr-case dd { margin: 0; }
.gr-timeline { list-style: none; margin: 1.2rem 0 0; padding: 0 0 0 1.1rem; border-left: 2px solid var(--line-strong); }
.gr-timeline li { position: relative; padding-bottom: 1rem; font-size: .93rem; }
.gr-timeline li:last-child { padding-bottom: 0; }
.gr-timeline li::before { content: ""; position: absolute; left: calc(-1.1rem - 6px); top: .4rem; width: 10px; height: 10px; border-radius: 50%; background: var(--magenta); }
.gr-timeline small { display: block; color: var(--muted); }
.gr-timeline p { margin: .3rem 0 0; }
.gr-review { margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
.gr-review h3 { font-family: var(--font-sans); font-size: 1.05rem; font-weight: 700; margin: 0; }
.gr-review .gr-small { margin: .3rem 0 1rem; }
.gr-officer h2 { font-size: 1.3rem; margin-top: 1rem; }
.gr-officer__name { font-weight: 700; font-size: 1.08rem; color: var(--text); margin-bottom: .8rem; }
.gr-officer p { overflow-wrap: anywhere; }
.gr-officer small { color: var(--muted); }
.gr-officer .bi { margin-right: .5rem; color: var(--magenta); }
.gr-address { display: flex; margin-bottom: 0; font-size: .93rem; color: var(--muted); }
@media (max-width: 991.98px) { .gr-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) { .gr-row { grid-template-columns: minmax(0, 1fr); } }