/* Kaveripattinam Urban Co-operative Bank - navy, cement grey, and white */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");
:root {
  --teal: #0B5D57;
  --teal-deep: #07403C;
  --accent: #D9A93A;
  --accent-light: #F0D48A;
  --accent-soft: #FBF3DC;
  --leaf: #B98A22;
  --mist: #F3F8F6;
  --line: #E1E4E9;
  --ink: #1F2F2C;
  --ink-soft: #52645F;
  --white: #FFFFFF;
  --river: #F0D48A;

  --font-display: "Inter", "Anek Tamil", "Mukta Malar", system-ui, sans-serif;
  --font-body: "Inter", "Mukta Malar", "Noto Sans Tamil", system-ui, -apple-system, "Segoe UI", sans-serif;

  --wrap: 100%;
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 22px;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { width: 100%; max-width: 100%; margin: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.6;
  color: var(--ink);
  background: var(--white);
}
img, svg, iframe { max-width: 100%; height: auto; display: block; }
a { color: var(--teal); text-underline-offset: 3px; }
a:hover { color: var(--leaf); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 3px; }

h1, h2, h3, h4 { font-family: var(--font-display); line-height: 1.15; margin: 0 0 .5em; color: var(--teal-deep); }
h1 { font-size: clamp(2.075rem, 5vw, 3.475rem); font-weight: 700; letter-spacing: -.01em; }
h2 { font-size: clamp(1.575rem, 3.2vw, 2.275rem); font-weight: 650; }
h3 { font-size: 1.175rem; font-weight: 600; }
p { margin: 0 0 1em; max-width: 68ch; }
.ta { font-family: var(--font-display); font-weight: 500; }
/* Digits (and %) in Tamil pages use Inter, exactly like English; all other Tamil text keeps the Tamil font */
@font-face { font-family: "KucbDigits"; src: url("https://fonts.gstatic.com/s/inter/v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2") format("woff2"); font-weight: 100 900; font-display: swap; unicode-range: U+0025, U+0030-0039; }
:lang(ta) { font-family: "KucbDigits", "Mukta Malar", "Noto Sans Tamil", system-ui, sans-serif !important; }

.wrap { width: min(100% - clamp(2.5rem, 4vw, 5rem), var(--wrap)); margin-inline: auto; }
.skip { position: absolute; left: -999px; top: 0; background: var(--accent); color: #fff; padding: .6rem 1rem; z-index: 100; }
.skip:focus { left: 1rem; }

/* ---------- Header ---------- */
.site-header { border-bottom: 0; position: sticky; top: 0; z-index: 50; }
/* Header uses the same background image as each page's banner */
.site-header { background-color: var(--teal-deep); background-image: linear-gradient(rgba(4,30,28,.35), rgba(4,30,28,.35)), var(--header-img, none); background-size: cover; background-position: center top; }
body:has(.hero) { --header-img: url("../assets/home-hero-bg7.webp?v=1"); }
body.page-about { --header-img: url("../assets/about-hero-bg3.webp?v=1"); }
body.page-deposits { --header-img: url("../assets/deposits-hero-bg3.webp?v=1"); }
body.page-loans { --header-img: url("../assets/loans-hero-bg2.webp?v=1"); }
body.page-services { --header-img: url("../assets/services-hero-bg.webp?v=1"); }
body.page-rates { --header-img: url("../assets/rates-hero-bg.webp?v=1"); }
body.page-contact { --header-img: url("../assets/contact-hero-bg.webp?v=2"); }
body.page-notices { --header-img: url("../assets/notices-hero-bg.webp?v=1"); }
body.page-customer-corner { --header-img: url("../assets/customer-corner-hero-bg2.webp?v=1"); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: .5rem; }
body:has(.page-hero) .site-header .wrap { padding-block: .3rem; }

.topbar-brand { display: flex; align-items: center; gap: .6rem; min-width: 0; text-decoration: none; color: #fff; flex: none; }
.topbar-brand img { width: 34px; height: 34px; flex: none; }
.topbar-brand span { font-family: var(--font-display); font-weight: 700; font-size: .92rem; line-height: 1.15; }

.nav { flex: 1; min-width: 0; }
.nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: .1rem; align-items: stretch; justify-content: flex-start; flex-wrap: nowrap; width: 100%; }
.nav li { flex: 1 1 0; min-width: 0; display: flex; }
.nav a { display: flex; flex: 1; width: 100%; align-items: center; justify-content: center; text-align: center; gap: .3rem; padding: .65rem .3rem; text-decoration: none; color: #fff; font-weight: 600; font-size: .88rem; line-height: 1.2; white-space: normal; }
.nav a svg { width: 16px; height: 16px; flex: none; }
.nav a:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.nav a[aria-current="page"] { background: rgba(255, 255, 255, .16); box-shadow: inset 0 -3px 0 #fff; border-radius: 0; }
.nav .nav-cta { flex: 1 1 0; }
.nav .nav-cta a { background: var(--accent); border-radius: 999px; }
.nav .nav-cta a:hover { background: #B98A22; color: #fff; }
.nav-toggle { display: none; flex: none; background: none; border: 1px solid rgba(255, 255, 255, .4); border-radius: 999px; padding: .5rem .6rem; cursor: pointer; color: #fff; }
.nav-toggle svg { width: 24px; height: 24px; }

/* Settings icon + language dropdown */
.settings-menu { position: relative; flex: none; }
.settings-toggle { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; padding: 0; background: none; border: 1px solid rgba(255, 255, 255, .4); border-radius: 999px; color: #fff; cursor: pointer; }
.settings-icon { font-family: var(--font-display); font-weight: 700; font-size: .8rem; letter-spacing: -.03em; line-height: 1; }
.settings-toggle:hover, .settings-toggle[aria-expanded="true"] { background: rgba(255, 255, 255, .14); }
.settings-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.language-menu { display: none; position: absolute; top: calc(100% + .6rem); right: 0; min-width: 230px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--white); box-shadow: 0 10px 24px rgba(0, 0, 0, .2); z-index: 60; padding: .95rem 1rem .85rem; }
.language-menu.open { display: block; }
.language-menu-group { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .3rem 0; }
.language-menu-group + .language-menu-group { border-top: 1px solid var(--line); margin-top: .5rem; padding-top: .8rem; }
.language-menu-label { font-size: .82rem; font-weight: 700; color: var(--ink); }
.language-menu-options { display: inline-flex; flex: none; border: 1.5px solid var(--teal); border-radius: 999px; overflow: hidden; }
.language-menu-options button { border: 0; background: transparent; color: var(--teal); font-weight: 700; font-size: .82rem; font-family: inherit; padding: .32rem .7rem; cursor: pointer; }
.language-menu-options button[aria-pressed="true"] { background: var(--teal); color: #fff; }
.language-menu-options button:not([aria-pressed="true"]):hover { background: var(--accent-soft); }
.language-menu-options button:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }

/* Tamil + A+: keep the header/nav row at its normal size while the page
   content still grows to A+. It divides each rem value by the A+ scale
   (1.12) so it renders as if the root font-size were still 100%. */
body.nav-scale-lock .site-header .wrap { gap: calc(1rem / 1.12); padding-block: calc(.5rem / 1.12); }
body.nav-scale-lock:has(.page-hero) .site-header .wrap { padding-block: calc(.3rem / 1.12); }
body.nav-scale-lock .topbar-brand { gap: calc(.6rem / 1.12); }
body.nav-scale-lock .topbar-brand span { font-size: calc(.92rem / 1.12); }
body.nav-scale-lock .nav ul { gap: calc(.1rem / 1.12); }
body.nav-scale-lock .nav a { gap: calc(.3rem / 1.12); padding: calc(.65rem / 1.12) calc(.3rem / 1.12); font-size: calc(.88rem / 1.12); }
body.nav-scale-lock .settings-icon { font-size: calc(.8rem / 1.12); }

@media (max-width: 1200px) {
  .nav-toggle { display: inline-flex; }
  .site-header .wrap { padding-block: .5rem; justify-content: flex-start; }
  .nav-toggle { margin-left: auto; }
  .nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--teal-deep); display: none; }
  .nav.open { display: block; }
  .nav ul { flex-direction: column; align-items: stretch; justify-content: flex-start; padding: .5rem 1.25rem 1.2rem; }
  .nav li, .nav .nav-cta { flex: none; }
  .nav a { justify-content: flex-start; text-align: left; padding: .95rem 1.05rem; }
  .nav a[aria-current="page"] { box-shadow: inset 4px 0 0 #fff; }
  .nav .nav-cta a { margin: .5rem 0 0; text-align: center; }
}

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.35rem; border-radius: 999px; font-weight: 600; font-family: var(--font-body); font-size: 1rem; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: background .15s, color .15s; }
.btn-mango { background: var(--accent); color: #fff; }
.btn-mango:hover { background: #B98A22; color: #fff; }
.btn-ghost { border-color: rgba(255,255,255,.55); color: #fff; }
.btn-ghost:hover { background: rgba(255,255,255,.1); color: #fff; }
.btn-teal { background: var(--teal); color: #fff; }
.btn-teal:hover { background: var(--teal-deep); color: #fff; }
.btn-line { border-color: var(--teal); color: var(--teal); background: transparent; }
.btn-line:hover { background: #FBF3DC; border-color: var(--teal); color: var(--teal-deep); }

/* ---------- Hero (home) ---------- */
.hero { position: relative; overflow: hidden; min-height: clamp(460px, 42vw, 700px); background: url("../assets/home-hero-bg7.webp?v=1") center/cover no-repeat; color: #D7DADD; }
.hero::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.06) 1.4px, transparent 1.6px); background-size: 28px 28px; pointer-events: none; }
.hero-glow { display: none; }
@keyframes heroFloat1 { 0%, 100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-50px,40px) scale(1.12); } }
@keyframes heroFloat2 { 0%, 100% { transform: translate(0,0) scale(1); } 50% { transform: translate(45px,-35px) scale(1.15); } }
@keyframes heroFloat3 { 0%, 100% { transform: translate(0,0) scale(1); } 50% { transform: translate(30px,25px) scale(.85); } }
.hero canvas#heroParticles { display: none; }
.hero-wave { position: absolute; left: 0; right: 0; bottom: -1px; width: 100%; height: auto; display: block; pointer-events: none; }
.hero .wrap { position: relative; z-index: 1; min-height: clamp(460px, 42vw, 700px); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: 3rem; padding-block: clamp(2.5rem, 6vw, 4.5rem) clamp(3rem, 7vw, 5.5rem); align-items: start; }
.hero .wrap > * { min-width: 0; }
.hero h1 { color: #FFFFFF; margin-bottom: .25em; font-size: clamp(1.8rem, 4vw, 2.6rem); }
.hero .hero-ta { font-family: var(--font-display); font-size: clamp(1.25rem, 2.4vw, 1.7rem); color: #FFFFFF; font-weight: 500; margin-bottom: 1.1rem; }
.hero p.lead { font-size: 1.2rem; color: #FFFFFF; max-width: 46ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.6rem; }
.hero .btn { color: #FFFFFF; }
.hero .hero-actions .btn { background: var(--teal); border-color: var(--accent); color: #FFFFFF; }
.hero .hero-actions .btn:hover { background: var(--teal-deep); border-color: var(--accent); color: #FFFFFF; }
.hero .quick { background: rgba(15, 35, 55, 0.62); border: 1px solid rgba(255,255,255,0.28); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); color: #FFFFFF; }
.hero .quick-stat, .hero .quick-link { color: #FFFFFF; }
.hero .quick-label, .hero .quick-caption { color: #F5F7FA; }

.quick { position: relative; top: 60px; background: rgba(255,255,255,.07); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.18); border-radius: var(--r-md); padding: 1.5rem 1.6rem; color: #fff; max-width: 330px; margin-left: auto; }
.quick h2 { color: #fff; font-size: 1.05rem; margin-bottom: .9rem; }
.quick-slides { position: relative; }
.quick-slide { position: absolute; top: 0; left: 0; right: 0; display: flex; gap: .8rem; align-items: flex-start; opacity: 0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease; pointer-events: none; }
.quick-slide.is-active { position: relative; opacity: 1; transform: translateY(0); pointer-events: auto; }
.quick .qi { flex: none; width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.12); color: var(--accent-light); display: grid; place-items: center; }
.quick .qi svg { width: 18px; height: 18px; }
.quick-label { display: block; font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.6); font-weight: 700; }
.quick-stat { display: block; font-family: var(--font-display); font-size: 1.7rem; color: #fff; line-height: 1.15; margin: .15rem 0; }
.quick-caption { margin: 0 0 .5rem; font-size: .85rem; line-height: 1.4; color: rgba(255,255,255,.72); }
.quick-link { color: var(--accent-light); font-weight: 700; text-decoration: none; font-size: .88rem; }
.quick-link:hover { text-decoration: underline; }
.quick-dots { display: flex; gap: .4rem; justify-content: center; margin-top: 1rem; }
.quick-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 999px; background: rgba(255,255,255,.3); cursor: pointer; transition: width .2s, background .2s; }
.quick-dots button.is-active { background: var(--accent-light); width: 20px; }

@media (max-width: 900px) {
  .hero .wrap { grid-template-columns: 1fr; gap: 2rem; }
  .quick { max-width: 100%; margin-left: 0; }
}

/* ---------- Notice strip ---------- */
.notices { background: var(--accent-soft); border-bottom: 1px solid #CFE6E1; font-size: .95rem; }
.notices .wrap { display: flex; align-items: center; gap: 1rem; padding-block: .6rem; overflow: hidden; }
.notices-label { flex: none; font-weight: 700; color: #fff; background: var(--accent); padding: .15rem .7rem; border-radius: 999px; font-size: .85rem; }
.notices-track { overflow: hidden; flex: 1; mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.notices-list { display: flex; gap: 3rem; white-space: nowrap; margin: 0; padding: 0; list-style: none; animation: ticker 38s linear infinite; width: max-content; }
.notices-track:hover .notices-list, .notices-track:focus-within .notices-list { animation-play-state: paused; }
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .notices-list { white-space: normal; flex-wrap: wrap; width: auto; gap: .4rem 2rem; } .notices-list li[aria-hidden] { display: none; } }

/* ---------- Page hero (inner pages) ---------- */
.page-hero { background: linear-gradient(120deg, var(--teal-deep), var(--teal)); color: #D7DADD; position: relative; overflow: hidden; min-height: clamp(260px, 30vw, 440px); }
.page-hero::after { content: ""; position: absolute; right: -60px; top: -60px; width: 300px; height: 300px; background: url("../assets/kolam.svg?v=3") center / contain no-repeat; opacity: .35; }
body.page-deposits .page-hero { background: url("../assets/deposits-hero-bg3.webp?v=1") center/cover no-repeat; }
body.page-deposits .page-hero::after { display: none; }
body.page-about .page-hero { background: url("../assets/about-hero-bg3.webp?v=1") center/cover no-repeat; }
body.page-loans .page-hero { background: url("../assets/loans-hero-bg4.webp?v=1") center/cover no-repeat; }
body.page-loans .page-hero::after { display: none; }
body.page-services .page-hero { background: url("../assets/services-hero-bg.webp?v=1") center/cover no-repeat; }
body.page-services .page-hero::after { display: none; }
body.page-rates .page-hero { background: url("../assets/rates-hero-bg.webp?v=1") center/cover no-repeat; }
body.page-rates .page-hero::after { display: none; }
body.page-contact .page-hero { background: url("../assets/contact-hero-bg.webp?v=2") center/cover no-repeat; }
body.page-contact .page-hero::after { display: none; }
body.page-notices .page-hero { background: url("../assets/notices-hero-bg.webp?v=1") center/cover no-repeat; }
body.page-notices .page-hero::after { display: none; }
body.page-customer-corner .page-hero { background: url("../assets/customer-corner-hero-bg2.webp?v=1") center/cover no-repeat; }
body.page-customer-corner .page-hero::after { display: none; }
.page-hero .wrap { position: relative; padding-block: 2.75rem 1.8rem; }
.page-hero h1 { color: #fff; font-size: clamp(1.875rem, 4vw, 2.775rem); margin-bottom: .5em; }
.page-hero .hero-ta { color: #F0D48A; font-family: var(--font-display); font-size: 1.2rem; margin: 0 0 1.1rem; }
.page-hero p { margin: 0; max-width: 60ch; }
.crumbs { font-size: .88rem; margin-bottom: 1.6rem; color: var(--river); }
.crumbs a { color: #fff; }

/* ---------- Sections ---------- */
.section { padding-block: clamp(1rem, 2vw, 1.75rem) clamp(2rem, 4vw, 3.5rem); }
.customer-corner-main { padding-bottom: 1.5rem; }
.customer-corner-deposit { padding-block: 1.5rem; }
.customer-corner-fraud { padding-block: 1.5rem; }
.section-mist { background: var(--mist); }
.section-head { max-width: 62ch; margin-bottom: 2.2rem; }
.section-head p { color: var(--ink-soft); font-size: 1.1rem; }

/* Offer columns on home - three categories as a ruled split, not cards */
.offer-head { text-align: center; margin-inline: auto; }

.offer-panel { max-width: 1240px; margin-inline: auto; padding: 2rem 1.5rem 2.2rem; background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: 0 0 26px 2px rgba(20, 36, 61, .16); }
.offer { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; max-width: 1160px; margin-inline: auto; }
.offer-card { width: 100%; box-sizing: border-box; padding: 1.8rem; min-height: 400px; border: 1px solid var(--line); border-top: 3px solid var(--teal); border-radius: var(--r-lg); background: var(--white); box-shadow: 0 16px 40px -24px rgba(11, 23, 74, .18); transition: transform .25s ease, box-shadow .25s ease; }
.offer-card:hover { transform: scale(1.04); position: relative; z-index: 1; }
.offer-card:nth-child(1):hover { box-shadow: 0 -12px 28px -10px rgba(11, 23, 74, .26), 0 12px 28px -10px rgba(11, 23, 74, .26), 12px 0 28px -10px rgba(11, 23, 74, .26); clip-path: inset(-60px -60px -60px 0); }
.offer-card:nth-child(2):hover { box-shadow: 0 0 30px 3px rgba(11, 23, 74, .24); }
.offer-card:nth-child(3):hover { box-shadow: 0 -12px 28px -10px rgba(11, 23, 74, .26), 0 12px 28px -10px rgba(11, 23, 74, .26), -12px 0 28px -10px rgba(11, 23, 74, .26); clip-path: inset(-60px 0 -60px -60px); }
@media (prefers-reduced-motion: reduce) { .offer-card { transition: none; } .offer-card:hover { transform: none; } }
@media (max-width: 900px) { .offer { grid-template-columns: 1fr; } }
.offer-card h3 { display: flex; align-items: center; gap: .6rem; font-size: 1.325rem; }
.offer-card h3 svg { width: 28px; height: 28px; color: var(--leaf); }
.offer-card .ta { color: var(--ink-soft); font-size: .98rem; margin: -.3rem 0 1rem; }
.offer-card ul { list-style: none; padding: 0; margin: 0 0 1.2rem; }
.offer-card li a { display: flex; justify-content: space-between; padding: .6rem 0; border-bottom: 1px dashed var(--line); text-decoration: none; color: var(--ink); }
.offer-card li a:hover { color: var(--teal); }
.offer-card li a span { color: var(--ink-soft); font-size: .9rem; }

/* Gold loan band */
.gold { background: var(--accent-soft); color: var(--ink); position: relative; overflow: hidden; }
.gold .wrap { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 3rem; align-items: center; padding-block: clamp(3rem, 6vw, 4.5rem); }
.gold .wrap > * { min-width: 0; }
.gold h2 { color: var(--teal-deep); font-size: clamp(1.875rem, 4vw, 2.875rem); }
.gold .ta { font-size: 1.3rem; color: var(--teal-deep); margin-top: -.4rem; }
.gold-points { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.gold-points li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: .8rem; align-items: start; background: rgba(255,255,255,.55); padding: 1rem 1.1rem; border-radius: var(--r-md); }
.gold-points svg { width: 26px; height: 26px; color: var(--teal); margin-top: 2px; }
.gold-points strong { display: block; }
@media (max-width: 900px) { .gold .wrap { grid-template-columns: 1fr; gap: 2rem; } }

/* Split: rates + calculator */
.split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.split > * { min-width: 0; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }

/* Tables */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--white); }
.fixed-rates-intro { color: var(--ink-soft); margin-bottom: 1.2rem; }
.fixed-rates-table { width: 100%; min-width: 510px; border-collapse: collapse; }
.fixed-rates-table th { background: #0B5D57; color: #fff; white-space: nowrap; }
.fixed-rates-table td { background: #fff; }
.fixed-rates-table th, .fixed-rates-table td { padding: .8rem 1rem; }
.fixed-rates-note { max-width: none; margin: 1rem 0 0; color: var(--ink-soft); font-size: .9rem; line-height: 1.55; }
.loan-rates-title { margin-top: 2.4rem; }
.loan-rates-intro { color: var(--ink-soft); margin-bottom: 1.2rem; }
.loan-rates-table { width: 100%; min-width: 390px; border-collapse: collapse; }
.loan-rates-table th { background: #0B5D57; color: #fff; white-space: nowrap; }
.loan-rates-table td { background: #fff; }
.loan-rates-table th, .loan-rates-table td { padding: .8rem 1rem; }
.loan-rates-note { max-width: none; margin: .8rem 0 0; color: var(--ink-soft); font-size: .85rem; }
.rates-scroll { max-height: 700px; overflow-y: auto; overflow-x: hidden; padding-right: .5rem; scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: #0B5D57 #FBF3DC; }
.rates-scroll::-webkit-scrollbar { width: 10px; }
.rates-scroll::-webkit-scrollbar-track { background: #FBF3DC; border-radius: 8px; }
.rates-scroll::-webkit-scrollbar-thumb { background: #0B5D57; border-radius: 8px; }
.deposit-rate-pair { display: block; }
@media (max-width: 700px) { .rates-scroll { max-height: 620px; } }
.recurring-rates-block { margin-top: 2.4rem; }
.recurring-rates-intro { color: var(--ink-soft); margin-bottom: 1.2rem; }
.recurring-rates-table { width: 100%; min-width: 440px; border-collapse: collapse; }
.recurring-rates-table th { background: #0B5D57; color: #fff; white-space: nowrap; }
.recurring-rates-table td { background: #fff; }
.recurring-rates-table th, .recurring-rates-table td { padding: .8rem 1rem; }
table { width: 100%; border-collapse: collapse; font-size: 1rem; min-width: 440px; }
th, td { padding: .8rem 1rem; text-align: left; border-bottom: 1px solid var(--line); }
th { background: var(--mist); font-family: var(--font-display); font-weight: 600; color: var(--teal-deep); }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #F3F9F7; }
.note { font-size: .9rem; color: var(--ink-soft); margin-top: .8rem; }

/* Calculator */
.calc { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 1.3rem 1.4rem; }
.calc-tabs { display: flex; gap: .4rem; margin-bottom: .9rem; background: var(--mist); padding: .3rem; border-radius: 999px; }
.calc-tabs button { flex: 1; border: 0; background: transparent; padding: .45rem; border-radius: 999px; font: inherit; font-weight: 600; color: var(--ink-soft); cursor: pointer; }
.calc-tabs button[aria-selected="true"] { background: var(--white); color: var(--teal); box-shadow: 0 1px 3px rgba(4,30,28,.15); }
.field { margin-bottom: .65rem; }
.field label { display: flex; justify-content: space-between; font-weight: 600; font-size: .95rem; margin-bottom: .25rem; }
.field output { color: var(--teal); font-variant-numeric: tabular-nums; }
.field-head { display: flex; flex-direction: column; align-items: stretch; gap: .25rem; margin-bottom: .25rem; }
.field-head label { margin: 0; }
.calc-manual { width: 100%; padding: .45rem .7rem; border: 1px solid var(--line); border-radius: var(--r-sm); color: var(--teal-deep); font: inherit; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.calc-manual:focus { border-color: var(--teal); outline: 3px solid rgba(11,93,87,.16); }
.calc-actions { display: flex; justify-content: flex-end; gap: .65rem; margin-top: .8rem; }
.result { background: var(--teal); color: #fff; border-radius: var(--r-md); padding: .8rem 1rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-top: .8rem; }
.result div { display: flex; flex-direction: column; }
.result small { color: var(--river); font-size: .8rem; }
.result b { font-family: var(--font-display); font-size: 1.25rem; font-variant-numeric: tabular-nums; }
.result .big b { color: #F0D48A; font-size: 1.5rem; }
@media (max-width: 480px) { .result { grid-template-columns: 1fr 1fr; } .result .big { grid-column: 1 / -1; } }

/* Co-operative values */
.values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.4rem; }
.values h3 { border-left: 4px solid var(--accent); padding-left: .8rem; }
.values p { color: var(--ink-soft); }
@media (max-width: 900px) { .values { grid-template-columns: 1fr; gap: 1.4rem; } }

/* Visit / map */
.visit { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 0; border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--line); background: var(--white); }
.visit-info { padding: 2rem; }
.visit-info dl { margin: 0; display: grid; gap: 1.1rem; }
.visit-info dt { font-weight: 700; color: var(--teal-deep); font-family: var(--font-display); }
.visit-info dd { margin: 0; color: var(--ink-soft); }
.visit-info dd a { font-weight: 600; }
.visit-info .visit-contact { display: inline-flex; align-items: center; gap: .4rem; }
.visit-info .visit-contact svg { width: 1em; height: 1em; flex: 0 0 auto; }
.map { min-height: 380px; background: var(--mist); }
.map iframe { width: 100%; height: 100%; min-height: 380px; border: 0; }
@media (max-width: 900px) { .visit { grid-template-columns: 1fr; } }
.placeholder { background: var(--accent-soft); border-bottom: 1px dashed var(--accent); padding: 0 .2rem; }

/* Generic content card (history, notes, etc.) */
.info-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 1.8rem 2rem; box-shadow: 0 8px 24px rgba(12, 27, 75, .05); }
.info-card p:last-child { margin-bottom: 0; }
.info-card h3 { margin-top: 1.1rem; }
.info-contact-row { display: flex; flex-wrap: wrap; gap: .5rem 1.6rem; margin-top: .7rem; }
.info-contact { display: inline-flex; align-items: center; gap: .4rem; color: var(--teal); font-weight: 600; text-decoration: none; }
.info-contact:hover { color: var(--leaf); text-decoration: underline; }
.info-contact svg { width: 1em; height: 1em; flex: 0 0 auto; }
@media (max-width: 600px) { .info-card { padding: 1.4rem; } }

/* Registration & regulatory details */
.reg-details { margin: 0; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--white); padding: .4rem 2.8rem; }
.reg-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 1rem 2rem; padding: .8rem 0; border-bottom: 1px dashed var(--line); }
.reg-row:last-child { border-bottom: 0; }
.reg-row dt { margin: 0; color: var(--ink); }
.reg-row dd { margin: 0; max-width: 60%; color: var(--teal-deep); font-weight: 600; text-align: right; }
@media (max-width: 600px) { .reg-details { padding-inline: 1.4rem; } .reg-row dd { max-width: 100%; text-align: left; } }

/* Product detail blocks (inner pages) */
.product-nav { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: .5rem; margin-bottom: 1rem; scrollbar-width: none; -ms-overflow-style: none; }
.product-nav::-webkit-scrollbar { display: none; }
.product-nav a { padding: .45rem .95rem; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; color: var(--ink); font-size: .95rem; background: var(--white); white-space: nowrap; flex: none; transition: background-color .2s, color .2s, border-color .2s, box-shadow .2s, transform .2s; }
.product-nav a:hover, .product-nav a:focus-visible { background: var(--accent); border-color: var(--accent); color: var(--teal-deep); box-shadow: 0 6px 16px rgba(89, 101, 121, .35); transform: translateY(-1px); }
.product-nav a.is-active { background: var(--accent); border-color: var(--accent); color: var(--teal-deep); font-weight: 600; box-shadow: 0 4px 12px rgba(89, 101, 121, .3); }
/* Deposits page: keep the section links pinned under the header while scrolling */
body.page-deposits .product-nav { position: sticky; top: var(--header-h, 54px); z-index: 40; background: var(--white); padding-block: .6rem; margin-bottom: .4rem; }
body.page-deposits .product { scroll-margin-top: calc(var(--header-h, 54px) + 4rem); }
.product { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 2.4rem; padding-block: 1.2rem; border-top: 1px solid var(--line); scroll-margin-top: 110px; }
.product:first-of-type { border-top: 1px solid var(--line); }
.product { background: var(--white); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: 0 6px 24px rgba(28, 52, 84, .10); padding: 1.8rem; margin-top: 1.2rem; }
.product[hidden] { display: none; }
.product-title h2 { font-size: 1.475rem; margin-bottom: .2rem; }
.product-title .ta { color: var(--ink-soft); }
.product-title .tag { display: inline-block; margin-top: .8rem; background: var(--accent-soft); color: var(--teal-deep); font-weight: 600; font-size: .85rem; padding: .2rem .7rem; border-radius: 999px; }
.product-body ul.ticks { list-style: none; padding: 0; margin: 0 0 1.2rem; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem 1.6rem; }
.product-body ul.ticks li { padding-left: 1.6rem; position: relative; }
.product-body ul.ticks li::before { content: ""; position: absolute; left: 0; top: .45em; width: 14px; height: 8px; border-left: 2.5px solid var(--leaf); border-bottom: 2.5px solid var(--leaf); transform: rotate(-45deg); }
.product-body .docs { background: var(--mist); border-radius: var(--r-md); padding: 1rem 1.2rem; font-size: .96rem; }
.product-body .docs b { color: var(--teal-deep); }
@media (max-width: 800px) {
  .product { grid-template-columns: 1fr; gap: 1rem; }
  .product-body ul.ticks { grid-template-columns: 1fr; }
}

/* Generic grids */
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.grid-2 > *, .grid-3 > * { min-width: 0; }
@media (max-width: 900px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }

.service { padding: 1.4rem 1.4rem 1.2rem; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--white); }
.service svg { width: 30px; height: 30px; color: var(--teal); margin-bottom: .8rem; }
.service h3 { font-size: 1.025rem; margin-bottom: .3rem; }
.service p { color: var(--ink-soft); margin: 0; font-size: .98rem; }

/* Timeline (about) - real sequence */
.steps { counter-reset: s; list-style: none; padding: 0; margin: 0; display: grid; gap: 1.2rem; }
.steps li { counter-increment: s; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 1rem; align-items: start; }
.steps li::before { content: counter(s); width: 44px; height: 44px; border-radius: 50%; background: var(--teal); color: #fff; display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; }
.steps h3 { margin: .45rem 0 .2rem; font-size: .975rem; }
.steps p { margin: 0; color: var(--ink-soft); }

/* Board */
.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1.2rem; }
.person { text-align: center; padding: 1.4rem 1rem; border: 1px solid var(--line); border-radius: var(--r-md); }
.avatar { width: 84px; height: 84px; border-radius: 50%; margin: 0 auto .8rem; background: var(--mist); display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: 1.5rem; color: var(--teal); border: 2px dashed var(--river); }
.person strong { display: block; }
.person span { color: var(--ink-soft); font-size: .92rem; }
.board-section { border-block: 1px solid var(--line); }
.board-heading { margin-bottom: 1.7rem; }
.board-heading h2 { margin: .3rem 0 .55rem; color: #07403C; }
.board-heading p { margin-bottom: 0; }
.board-eyebrow { color: var(--teal); font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.board-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.board-card { min-height: 178px; padding: 1.25rem; border: 1px solid #DDE0E3; border-top: 3px solid #07403C; border-radius: var(--r-md); background: #fff; box-shadow: 0 8px 24px rgba(12, 27, 75, .05); }
.board-avatar { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 1rem; border-radius: 50%; background: #FBF3DC; color: #07403C; font-family: var(--font-display); font-size: .95rem; font-weight: 700; }
.board-role { margin: 0 0 .25rem; color: var(--teal); font-size: .84rem; font-weight: 700; }
.board-name { margin: 0; color: #07403C; font-size: 1.08rem; }
@media (max-width: 760px) { .board-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px) { .board-grid { grid-template-columns: 1fr; } .board-card { min-height: 0; } }
.download-forms-section .section-head { margin-bottom: 1.4rem; }
.forms-empty-state { display: flex; align-items: center; gap: 1rem; padding: 1.35rem; border: 1px solid var(--line); border-radius: var(--r-md); background: #fff; box-shadow: 0 8px 24px rgba(12, 27, 75, .05); }
.forms-file-icon { width: 52px; height: 52px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 14px; background: #FBF3DC; color: #07403C; }
.forms-file-icon svg { width: 25px; height: 25px; }
.forms-empty-copy { flex: 1; min-width: 0; }
.forms-status { display: inline-block; margin-bottom: .25rem; color: var(--teal); font-size: .78rem; font-weight: 700; }
.forms-empty-copy h3 { margin: 0 0 .2rem; color: #07403C; }
.forms-empty-copy p { margin: 0; color: var(--ink-soft); }
@media (max-width: 600px) { .forms-empty-state { align-items: flex-start; flex-wrap: wrap; } .forms-empty-state .btn { margin-left: calc(52px + 1rem); } }

/* Notices & circulars */
.notice-tabs { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1.6rem; }
.notice-tab { border: 1px solid var(--line); background: var(--white); color: var(--ink); font: inherit; font-weight: 600; font-size: .92rem; padding: .5rem 1.15rem; border-radius: 999px; cursor: pointer; }
.notice-tab:hover { border-color: var(--teal); color: var(--teal); }
.notice-tab.is-active { background: var(--teal-deep); border-color: var(--teal-deep); color: #fff; }
.notice-list { display: grid; gap: 1rem; }
.notice-card { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--white); padding: 1.2rem 1.4rem; box-shadow: 0 8px 24px rgba(12, 27, 75, .05); }
.notice-card.is-hidden { display: none; }
.notice-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin-bottom: .5rem; }
.notice-date { color: var(--ink-soft); font-size: .85rem; font-weight: 600; }
.notice-tag { display: inline-block; padding: .2rem .7rem; border-radius: 999px; font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.notice-tag-rbi { background: var(--accent-soft); color: var(--teal-deep); }
.notice-tag-agm { background: var(--teal); color: #fff; }
.notice-tag-tender { background: var(--accent); color: #fff; }
.notice-card h3 { margin: 0 0 .5rem; font-size: 1.075rem; }
.notice-card h3 a { color: var(--teal-deep); text-decoration: none; }
.notice-card h3 a:hover { color: var(--teal); text-decoration: underline; }
.notice-download { font-weight: 700; font-size: .9rem; color: var(--teal); text-decoration: none; }
.notice-download:hover { text-decoration: underline; }
.notice-empty { color: var(--ink-soft); padding: 1rem 0; }

/* Accordion (customer corner) */
details { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--white); margin-bottom: .7rem; }
summary { cursor: pointer; min-width: 0; padding: 1rem 1.2rem; font-weight: 600; font-family: var(--font-display); font-size: 1.1rem; color: var(--teal-deep); list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; flex: none; font-size: 1.4rem; line-height: 1; color: var(--teal); }
details[open] summary::after { content: "–"; }
details > div { padding: 0 1.2rem 1.1rem; color: var(--ink-soft); }

.downloads { list-style: none; padding: 0; margin: 0; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.downloads li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; min-width: 0; padding: .9rem 1.2rem; border-bottom: 1px solid var(--line); background: var(--white); }
.downloads li:last-child { border-bottom: 0; }
.downloads small { color: var(--ink-soft); }

.alert { border-left: 5px solid #C0392B; background: #FDF1EF; padding: 1.2rem 1.4rem; border-radius: 0 var(--r-md) var(--r-md) 0; }
.alert h3 { color: #8E2A20; }
.alert ul { margin: 0; padding-left: 1.2rem; }

/* Forms */
.form { display: grid; gap: 1rem; }
.form .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.form label { font-weight: 600; font-size: .95rem; display: block; margin-bottom: .3rem; }
.form input, .form select, .form textarea { width: 100%; max-width: 100%; min-width: 0; padding: .75rem .9rem; border: 1px solid var(--line); border-radius: var(--r-sm); font: inherit; background: var(--white); color: var(--ink); }
.form input:focus, .form select:focus, .form textarea:focus { border-color: var(--teal); outline: 2px solid var(--river); }
.form-actions { display: flex; align-items: center; gap: .75rem; }
.form-msg { font-weight: 600; color: var(--leaf); min-height: 1.5em; }
@media (max-width: 600px) { .form .row { grid-template-columns: 1fr; } }

/* CTA band */
.cta-band { background: var(--teal-deep); color: #D7DADD; }
.cta-band .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1.4rem; padding-block: 15px 18px; }
.cta-band h2 { color: #fff; margin: 0; font-size: 1rem; line-height: 1.15; }
.cta-band p { margin: 0; font-size: .8rem; }
.cta-band .btn { padding: .45rem 1rem; font-size: .85rem; }

/* Footer */
.site-footer { background: #07403C; color: #C3C7CC; font-size: .96rem; }
.site-footer .wrap { padding-block: 1.6rem .8rem; }
.foot-grid { display: flex; justify-content: space-between; gap: 1.5rem; transform: translateX(0); }
.foot-grid > div { min-width: 0; }
.foot-grid > div:nth-child(1) { flex: 0 1 18.4%; }
.foot-grid > div:nth-child(2) { flex: 0 1 14.1%; }
.foot-grid > div:nth-child(3) { flex: 0 1 11.9%; }
.foot-grid > div:nth-child(4) { flex: 0 1 9.3%; }
.foot-grid > div:nth-child(5) { flex: 0 1 13.9%; }
.foot-grid > div:nth-child(1) { transform: translateX(15px); }
.foot-grid > div:nth-child(3) { transform: translateX(-26px); }
.foot-grid > div:nth-child(4), .foot-grid > div:nth-child(5) { transform: translateX(-18px); }
.site-footer h4 { color: #fff; font-size: .925rem; margin-bottom: .9rem; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.site-footer a { color: #D7DADD; text-decoration: none; }
.site-footer a:hover { color: #F0D48A; }
.site-footer .footer-contact { display: inline-flex; align-items: center; gap: .35rem; max-width: 100%; overflow-wrap: anywhere; }
.site-footer .footer-contact-spacer { display: block; height: .45rem; }
.site-footer .footer-contact svg { width: 1em; height: 1em; flex: 0 0 auto; }
.site-footer a:hover .phone-number { color: #F0D48A; }
.foot-brand { display: flex; gap: .8rem; align-items: center; margin-bottom: 1rem; }
.foot-brand img { width: 46px; height: 46px; }
.foot-brand strong { color: #fff; font-family: var(--font-display); font-size: 1.1rem; line-height: 1.2; }
.foot-bottom { border-top: 1px solid #25403C; margin-top: 2.4rem; padding-top: 1.2rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .8rem; font-size: .86rem; }
.dicgc { display: inline-block; margin-top: .8rem; padding: .5rem .8rem; border: 1px solid #2F4A46; border-radius: var(--r-sm); font-size: .88rem; }
@media (max-width: 900px) { .foot-grid { display: grid; grid-template-columns: 1fr 1fr; transform: none; } .foot-grid > div:nth-child(1), .foot-grid > div:nth-child(n+3) { transform: none; } }
@media (max-width: 1259px) { .foot-grid { transform: none; } }
@media (max-width: 600px) { .foot-grid { grid-template-columns: 1fr; } }

/* Back to top */
.to-top { position: fixed; right: 1rem; bottom: 1rem; width: 46px; height: 46px; border-radius: 50%; border: 0; background: var(--teal); color: #fff; display: grid; place-items: center; cursor: pointer; opacity: 0; pointer-events: none; transition: opacity .2s; box-shadow: 0 6px 18px rgba(0,0,0,.25); z-index: 40; }
.to-top.show { opacity: 1; pointer-events: auto; }
.to-top svg { width: 20px; height: 20px; }

/* Hero entrance - the single orchestrated moment */
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.hero-copy > * { animation: rise .6s ease-out both; }
.hero-copy > *:nth-child(2) { animation-delay: .08s; }
.hero-copy > *:nth-child(3) { animation-delay: .16s; }
.hero-copy > *:nth-child(4) { animation-delay: .24s; }
.quick { animation: rise .7s .3s ease-out both; }

@media print {
  .site-header, .notices, .to-top, .cta-band { display: none; }
}

/* Placeholders on dark backgrounds */
.site-footer .placeholder { background: transparent; color: #F0D48A; border-bottom-color: #F0D48A; }
.site-footer .placeholder.phone-number { color: inherit; border-bottom: 0; padding: 0; }
.phone-number, .visit-info dd a[href^="tel:"] { font-family: var(--font-body); font-style: normal; font-weight: 400; }
#visit .visit-info .phone-number { background: transparent; border-bottom: 0; padding: 0; }
.site-footer .phone-number { font-size: 15px; }
.visit-info .phone-number { font-size: 17px; }
@media (max-width: 600px) {
  .topbar-brand span { font-size: .85rem; }
}
@media (max-width: 480px) {
  .calc-manual { width: 100%; min-width: 0; max-width: 100%; }
  .calc { padding: 1rem; }
}

/* ---------- Welcome popup (home, shown on every load/refresh) ---------- */
.welcome-popup { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; padding: 1rem; background: rgba(10, 20, 35, .55); animation: popupFade .35s ease; }
.welcome-popup[hidden] { display: none; }
.welcome-popup-card { position: relative; width: min(92vw, 460px); padding: 2.2rem 1.8rem 2rem; text-align: center; background: var(--white); border-radius: var(--r-lg); box-shadow: 0 20px 60px -10px rgba(10, 20, 35, .45); animation: popupRise .4s ease; }
.welcome-popup-ta { margin: 0 0 .6rem; font-family: var(--font-display); font-size: 1.7rem; font-weight: 700; color: var(--teal-deep); }
.welcome-popup-en { margin: 0; font-size: 1.4rem; color: var(--ink-soft); }
.welcome-popup-close { position: absolute; top: .5rem; right: .7rem; width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; color: var(--ink-soft); font-size: 1.6rem; line-height: 1; cursor: pointer; }
.welcome-popup-close:hover { background: var(--accent-soft); color: var(--teal-deep); }
@keyframes popupFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes popupRise { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .welcome-popup, .welcome-popup-card { animation: none; } }

/* Deposits page: professional product cards */
body.page-deposits .product{padding:0;gap:0;overflow:hidden;border:1px solid var(--line);border-top:4px solid var(--teal);border-radius:14px;box-shadow:0 1px 2px rgba(7,64,60,.06),0 12px 32px rgba(7,64,60,.08);margin-top:1.4rem;grid-template-columns:minmax(0,300px) minmax(0,1fr)}
body.page-deposits .product-title{background:linear-gradient(180deg,#F3F8F6,#FBF3DC);padding:2rem 1.8rem;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start}
body.page-deposits .product-title h2{font-size:1.4rem;color:var(--teal-deep);letter-spacing:-.01em;margin:0 0 .25rem}
body.page-deposits .product-title .ta{margin:0;font-size:.95rem}
body.page-deposits .product-title .tag{margin-top:auto;padding:.35rem .85rem;background:var(--teal);color:#fff;font-size:.78rem;letter-spacing:.03em;text-transform:uppercase}
body.page-deposits .product-title h2+.ta+.tag{margin-top:1.4rem}
body.page-deposits .product-body{padding:2rem 2.2rem}
body.page-deposits .product-body>p{font-size:1.02rem;line-height:1.65;color:var(--ink-soft);margin:0 0 1.4rem;max-width:62ch}
body.page-deposits .product-body ul.ticks{gap:.85rem 1.8rem;margin-bottom:1.6rem}
body.page-deposits .product-body ul.ticks li{padding-left:2rem;font-weight:500;color:var(--ink)}
body.page-deposits .product-body ul.ticks li::before{content:"";left:0;top:.05em;width:1.35rem;height:1.35rem;border:0;border-radius:50%;background:var(--accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C3454' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/70% no-repeat;transform:none}
body.page-deposits .product-body .docs{background:#F3F8F6;border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:8px;padding:1rem 1.2rem;font-size:.94rem;color:var(--ink-soft)}
@media(max-width:760px){body.page-deposits .product{grid-template-columns:1fr}body.page-deposits .product-title{border-right:0;border-bottom:1px solid var(--line);padding:1.4rem}body.page-deposits .product-body{padding:1.4rem}}

/* Services page: interactive service tiles */
body.page-services .grid-3{gap:1.1rem;padding:1.4rem;background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 1px 2px rgba(7,64,60,.05),0 14px 36px rgba(7,64,60,.08)}
body.page-services .service{counter-increment:svc;position:relative;min-height:190px;padding:1.1rem;border:1px solid var(--line);border-radius:6px 20px 6px 20px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:linear-gradient(165deg,#FAFBFC,#F1F3F6);
 box-shadow:0 1px 2px rgba(7,64,60,.05);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .3s;-webkit-tap-highlight-color:transparent}
body.page-services .service::before{content:"";position:absolute;right:-34px;bottom:-34px;width:140px;height:140px;background:url("../assets/kolam.svg") center/contain no-repeat;opacity:.4;transition:transform .8s cubic-bezier(.2,.8,.2,1),opacity .4s;pointer-events:none}
body.page-services .service:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
body.page-services .service svg{position:relative;width:52px;height:52px;padding:13px;margin:0;color:#fff;background:linear-gradient(145deg,#137A70,#07403C);border-radius:4px 14px 4px 14px;box-shadow:0 6px 12px rgba(7,64,60,.25);transition:transform .4s cubic-bezier(.2,.8,.2,1),border-radius .4s}
body.page-services .service h3{position:relative;margin:auto 0 0;padding:0;font-size:1.15rem;font-weight:700;line-height:1.25;color:var(--teal-deep);max-width:92%}
body.page-services .service h3::after{content:"";display:block;width:28px;height:3px;margin-top:.6rem;background:var(--accent);border-radius:2px;transition:width .4s cubic-bezier(.2,.8,.2,1),background .3s}
body.page-services .service::after{content:"+";position:absolute;top:.9rem;right:.9rem;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--accent-light);color:var(--teal);font-size:1.15rem;line-height:25px;text-align:center;z-index:3;transition:transform .35s,background .3s,color .3s,border-color .3s}
body.page-services .service .svc-more{position:absolute;inset:0;z-index:2;margin:0;padding:1.1rem;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(165deg,#137A70 0%,#07403C 100%);color:#DDEDE9;font-size:.92rem;line-height:1.55;text-align:center;
 clip-path:circle(0 at calc(100% - .9rem - 14px) calc(.9rem + 14px));transition:clip-path .55s cubic-bezier(.2,.8,.2,1)}
body.page-services .service .svc-more .st{display:block;margin-bottom:.7rem;padding-bottom:.7rem;border-bottom:1px solid rgba(255,255,255,.2);font-size:1.05rem;font-weight:700;color:#fff;width:100%}
body.page-services .service.is-open .svc-more{clip-path:circle(150% at calc(100% - .9rem - 14px) calc(.9rem + 14px))}
body.page-services .service.is-open{border-color:var(--teal-deep);box-shadow:0 18px 40px rgba(7,64,60,.28)}
body.page-services .service.is-open::after{transform:rotate(45deg);background:#fff;color:var(--teal-deep);border-color:#fff}
@media (hover:hover){
 body.page-services .service:hover{transform:translateY(-5px);border-color:var(--accent);box-shadow:0 1px 2px rgba(7,64,60,.05),0 18px 36px rgba(7,64,60,.14)}
 body.page-services .service:hover::before{transform:rotate(25deg) scale(1.08);opacity:.65}
 body.page-services .service:hover h3::after{width:48px;background:var(--teal)}
 body.page-services .service:hover svg{border-radius:16px 4px 16px 4px}
 body.page-services .service:hover::after{background:var(--teal);color:#fff;border-color:var(--teal)}
}
@media (prefers-reduced-motion:reduce){body.page-services .service,body.page-services .service *,body.page-services .service::before{transition:none!important}}
body.page-services .grid-3 > .note{grid-column:1/-1;margin:.4rem 0 0;padding-top:1rem;border-top:1px solid var(--line)}

/* Loans page: flip cards */
html.lc-on body.page-loans .product-nav,html.lc-on body.page-loans article.product{display:none}
#lc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.4rem;margin-top:.5rem}
.lc{position:relative;height:350px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px rgba(7,64,60,.05),0 8px 22px rgba(7,64,60,.07);overflow:hidden;cursor:pointer;color:var(--ink);text-align:left;-webkit-tap-highlight-color:transparent;transition:box-shadow .35s,transform .35s cubic-bezier(.2,.8,.2,1)}
.lc:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.lc:hover{box-shadow:0 1px 2px rgba(7,64,60,.05),0 18px 38px rgba(7,64,60,.16)}
.lc-front{position:absolute;inset:0;padding:1.3rem;display:flex;flex-direction:column;z-index:1}
.lc-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:auto}
.lc-ico{width:78px;height:78px;padding:15px;border-radius:22px 8px 22px 8px;color:#fff;flex:none;box-shadow:0 10px 20px rgba(7,64,60,.25),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.lc:hover .lc-ico{transform:rotate(-6deg) scale(1.06)}
.lc-rate{font-size:1.7rem;font-weight:700;line-height:1;color:var(--teal-deep);text-align:right;display:inline-block}
.lc-rate small{display:block;margin-top:.3rem;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.lc h3{margin:1rem 0 .1rem;font-size:1.15rem;line-height:1.25;color:var(--teal-deep);position:relative;width:fit-content;max-width:100%}
.lc .lc-ta{margin:0 0 .55rem;font-size:.86rem;color:var(--ink-soft)}
.lc .lc-p{margin:0;font-size:.9rem;line-height:1.5;color:var(--ink-soft);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:opacity .3s}
.lc-cta{margin-top:.8rem;font-size:.82rem;font-weight:600;color:var(--teal);display:flex;align-items:center;gap:.4rem;transition:opacity .3s}
.lc-cta i{font-style:normal;transition:transform .3s}
.lc:hover .lc-cta i{transform:translateX(5px)}
.lc-back{position:absolute;z-index:2;inset:0;padding:1.3rem;background:linear-gradient(165deg,#137A70,#07403C);color:#DDEDE9;opacity:0;pointer-events:none;display:flex;flex-direction:column;justify-content:center}
.lc-back h4{margin:0 0 .7rem;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;font-weight:600}
.lc-back ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.lc-back li{position:relative;padding-left:1.35rem;font-size:.9rem;line-height:1.4}
.lc-back li::before{content:"";position:absolute;left:0;top:.28em;width:.8rem;height:.45rem;border-left:2px solid var(--accent-light);border-bottom:2px solid var(--accent-light);transform:rotate(-45deg)}

/* 1 Gold: metallic shine sweep + coin spin */
.lc-1{background:linear-gradient(160deg,#FFFDF6,#F5E9C8);border-color:#E4D19C}
.lc-1 .lc-ico{background:#F0DFAE;color:#7A5A12}.lc-1 .lc-rate{color:#7A5A12;transition:transform .9s cubic-bezier(.3,.8,.3,1)}
.lc-1::after{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;z-index:3;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.8),transparent);transform:skewX(-20deg);transition:left 1s ease}
.lc-1:hover::after{left:140%}.lc-1:hover .lc-rate{transform:rotateY(360deg)}
.lc-1 .lc-cta{color:#7A5A12}
/* 2 House: sheet rises like a wall */
.lc-2{border-top:5px solid var(--teal)}
.lc-2 .lc-back{inset:auto 0 0 0;height:74%;opacity:1;border-radius:20px 20px 0 0;transform:translateY(102%);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.lc-2:hover .lc-back{transform:none}
/* 3 Mortgage: 3D flip */
.lc-3{overflow:visible;background:none;border:0;box-shadow:none;perspective:1100px}
.lc-3:hover{box-shadow:none}
.lc-3 .lc-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.3,.8,.3,1)}
.lc-3:hover .lc-inner,.lc-3:focus-visible .lc-inner{transform:rotateY(180deg)}
.lc-3 .lc-front,.lc-3 .lc-back{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:18px}
.lc-3 .lc-front{background:#fff;border:1px solid var(--line);box-shadow:0 8px 22px rgba(7,64,60,.09)}
.lc-3 .lc-back{opacity:1;transform:rotateY(180deg)}
/* 4 NHFDC: wipe from left */
.lc-4::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--teal);z-index:3;transition:opacity .3s}
.lc-4 .lc-back{opacity:1;clip-path:inset(0 100% 0 0);transition:clip-path .6s cubic-bezier(.7,0,.2,1)}
.lc-4:hover .lc-back{clip-path:inset(0)}.lc-4:hover::before{opacity:0}
/* 5 SHG: circle burst from corner */
.lc-5 .lc-ico{border-radius:50%}
.lc-5 .lc-back{opacity:1;clip-path:circle(0 at 100% 0);transition:clip-path .7s cubic-bezier(.2,.8,.2,1)}
.lc-5:hover .lc-back{clip-path:circle(150% at 100% 0)}
/* 6 TABCEDCO: cursor-follow 3D tilt + glare */
.lc-6{transform:perspective(800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .15s ease-out,box-shadow .35s;will-change:transform}
.lc-6::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,0%),rgba(255,255,255,.55),transparent 60%);opacity:0;transition:opacity .3s}
.lc-6:hover::after{opacity:1}.lc-6:hover{border-color:var(--accent)}
.lc-6 .lc-rate{background:var(--teal);color:#fff;padding:.5rem .7rem;border-radius:10px}.lc-6 .lc-rate small{color:#B9D9D3}
/* 7 TAMCO: count-up rate, underline draw, bottom bar */
.lc-7::before{content:"";position:absolute;left:0;bottom:0;height:5px;width:0;background:linear-gradient(90deg,var(--teal),var(--accent));z-index:3;transition:width .6s cubic-bezier(.2,.8,.2,1)}
.lc-7:hover::before{width:100%}
.lc-7 h3::after{content:"";position:absolute;left:0;bottom:-3px;height:2px;width:0;background:var(--teal);transition:width .5s}
.lc-7:hover h3::after{width:100%}
/* 8 Women Entrepreneur: feature chips pop in */
.lc-8 .lc-back{inset:auto 0 0 0;background:none;opacity:1;padding:1.3rem;justify-content:flex-end;color:var(--teal-deep)}
.lc-8 .lc-back h4{display:none}
.lc-8 .lc-back ul{display:flex;flex-wrap:wrap;gap:.45rem}
.lc-8 .lc-back li{padding:.4rem .8rem;border-radius:999px;background:var(--accent-soft);border:1px solid var(--accent-light);font-size:.8rem;font-weight:500;color:var(--teal-deep);opacity:0;transform:scale(.5) translateY(14px);transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .3s}
.lc-8 .lc-back li::before{display:none}
.lc-8:hover .lc-back li{opacity:1;transform:none}
.lc-8 .lc-back li:nth-child(2){transition-delay:.07s}.lc-8 .lc-back li:nth-child(3){transition-delay:.14s}.lc-8 .lc-back li:nth-child(4){transition-delay:.21s}
.lc-8:hover .lc-p,.lc-8:hover .lc-cta{opacity:0}
/* 9 Working Women: shutter opens from centre */
.lc-9 .lc-back{opacity:1;clip-path:inset(50% 0 50% 0);transition:clip-path .6s cubic-bezier(.7,0,.2,1)}
.lc-9:hover .lc-back{clip-path:inset(0)}
.lc-9 .lc-ico{border-radius:4px 14px 4px 14px}
/* 10 Surety: flashlight reveal */
.lc-10{background:linear-gradient(165deg,#0B5D57,#042B28);border-color:#07403C}
.lc-10 h3,.lc-10 .lc-rate{color:#fff}.lc-10 .lc-ta,.lc-10 .lc-p,.lc-10 .lc-rate small{color:#A5CBC4}.lc-10 .lc-cta{color:#fff}
.lc-10 .lc-ico{background:rgba(255,255,255,.12);color:#fff}
.lc-10::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(180px circle at var(--mx,-200px) var(--my,-200px),rgba(255,255,255,.14),transparent 70%)}
.lc-10 .lc-back{opacity:1;background:#137A70;-webkit-mask-image:radial-gradient(circle 110px at var(--mx,-300px) var(--my,-300px),#000 55%,transparent 100%);mask-image:radial-gradient(circle 110px at var(--mx,-300px) var(--my,-300px),#000 55%,transparent 100%)}


/* unique icon badges */
.lc-ico-w{display:block;filter:drop-shadow(0 10px 14px rgba(7,64,60,.28));flex:none}
.lc-ico{display:flex;align-items:center;justify-content:center;width:92px;height:92px;padding:0;border-radius:0;box-shadow:none;color:#fff;position:relative;transition:none}
.lc-ico::before{content:"";position:absolute;inset:0;background:radial-gradient(90% 70% at 30% 10%,rgba(255,255,255,.35),transparent 60%);pointer-events:none}
.lc:hover .lc-ico{transform:none}
.lc-ico svg{width:54px;height:54px;position:relative;overflow:visible}
.lc-ico .ac{fill:#FFD98A;stroke:#FFD98A}
.ic1 .lc-ico{border-radius:50%;box-shadow:inset 0 0 0 5px rgba(255,255,255,.28),inset 0 0 0 7px rgba(0,0,0,.12)}
.ic2 .lc-ico{border-radius:50% 50% 16px 16px}
.ic3 .lc-ico{clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.ic4 .lc-ico{border-radius:34%}
.ic5 .lc-ico{clip-path:polygon(30% 0,70% 0,100% 30%,100% 70%,70% 100%,30% 100%,0 70%,0 30%)}
.ic6 .lc-ico{border-radius:0 62% 0 62%}
.ic7 .lc-ico{clip-path:polygon(50% 0,100% 14%,100% 62%,50% 100%,0 62%,0 14%)}
.ic8 .lc-ico{border-radius:50% 50% 50% 10px}
.ic9 .lc-ico{border-radius:10px 46px 10px 46px}
.ic10 .lc-ico{clip-path:polygon(25% 4%,75% 4%,100% 50%,75% 96%,25% 96%,0 50%)}
@keyframes k-spin{to{transform:rotateY(360deg)}}
@keyframes k-hop{40%{transform:translateY(-8px)}70%{transform:translateY(0)}85%{transform:translateY(-3px)}}
@keyframes k-wig{25%{transform:rotate(-12deg)}75%{transform:rotate(12deg)}}
@keyframes k-pul{50%{transform:scale(1.18)}}
@keyframes k-grow{from{transform:scaleY(.8)}to{transform:scaleY(1.12)}}
@keyframes k-swing{25%{transform:rotate(-14deg)}75%{transform:rotate(14deg)}}
.lc:hover .lc-ico svg{transform-origin:50% 50%}
.lc.ic1:hover .lc-ico svg{animation:k-spin 1s ease}
.lc.ic2:hover .lc-ico svg{animation:k-hop .7s ease}
.lc.ic3:hover .lc-ico svg{animation:k-wig .7s ease}
.lc.ic4:hover .lc-ico svg{animation:k-pul .7s ease}
.lc.ic5:hover .lc-ico svg{animation:k-pul .7s ease}
.lc.ic6:hover .lc-ico svg{transform-origin:50% 100%;animation:k-grow .6s ease forwards}
.lc.ic7:hover .lc-ico svg{transform-origin:50% 15%;animation:k-swing 1s ease}
.lc.ic8:hover .lc-ico svg{animation:k-hop .7s ease}
.lc.ic9:hover .lc-ico svg{transform-origin:50% 90%;animation:k-wig .7s ease}
.lc.ic10:hover .lc-ico svg{animation:k-pul .7s ease}

/* details dialog */
.lc-dialog{border:0;border-radius:20px;padding:0;max-width:560px;width:calc(100% - 2rem);box-shadow:0 30px 80px rgba(4,30,28,.4);color:var(--ink);overflow:hidden}
.lc-dialog::backdrop{background:rgba(4,30,28,.55);backdrop-filter:blur(3px)}
.lc-dialog[open]{animation:lcpop .35s cubic-bezier(.2,.8,.2,1)}
@keyframes lcpop{from{opacity:0;transform:translateY(16px) scale(.97)}}
.lcd-head{position:relative;background:linear-gradient(165deg,#137A70,#07403C);color:#fff;padding:1.6rem 1.8rem}
.lcd-head h3{margin:0;color:#fff;font-size:1.4rem}.lcd-head .lcd-ta{margin:.2rem 0 0;color:#A5CBC4}
.lcd-rate{display:inline-block;margin-top:.9rem;padding:.3rem .8rem;border-radius:999px;background:rgba(255,255,255,.14);font-weight:600;font-size:.85rem}
.lcd-body{padding:1.5rem 1.8rem 1.8rem}
.lcd-body>p{margin:0 0 1rem;color:var(--ink-soft);line-height:1.6}
.lcd-body ul{list-style:none;padding:0;margin:0 0 1.2rem;display:grid;grid-template-columns:1fr 1fr;gap:.55rem 1.2rem}
.lcd-body li{position:relative;padding-left:1.5rem;font-size:.92rem}
.lcd-body li::before{content:"";position:absolute;left:0;top:.35em;width:.8rem;height:.45rem;border-left:2.5px solid var(--leaf);border-bottom:2.5px solid var(--leaf);transform:rotate(-45deg)}
.lcd-docs{background:var(--mist);border-left:4px solid var(--accent);border-radius:8px;padding:.9rem 1.1rem;font-size:.92rem;color:var(--ink-soft)}
.lcd-docs b{color:var(--teal-deep)}
.lcd-close{position:absolute;top:.9rem;right:.9rem;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.1);color:#fff;font-size:1.3rem;line-height:1;cursor:pointer}
.lcd-close:hover{background:#fff;color:var(--teal-deep)}
@media(max-width:560px){.lcd-body ul{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.lc *,.lc,.lc::before,.lc::after{transition:none!important}}

/* Home page: gold loan band */
/* gold loan band */
.gold{background:linear-gradient(180deg,#F7F8FA 0%,#E9ECF0 100%);position:relative}
.gold::before{content:"";position:absolute;left:-120px;bottom:-140px;width:420px;height:420px;background:url("../assets/kolam.svg") center/contain no-repeat;opacity:.35;pointer-events:none}
.gold .wrap{gap:4.5rem;position:relative}
.gold-eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.78rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#8A6414;margin-bottom:1rem}
.gold-eyebrow::before{content:"";width:34px;height:2px;background:linear-gradient(90deg,#C9962F,#F3D27A)}
.gold h2{letter-spacing:-.02em;line-height:1.1;margin-bottom:.4rem}
.gold h2 em{font-style:normal;position:relative;white-space:nowrap;z-index:0}
.gold h2 em::after{content:"";position:absolute;left:-2px;right:-2px;bottom:.06em;height:.34em;background:linear-gradient(90deg,#F3D27A,#E4B84E);border-radius:4px;z-index:-1;transform-origin:left;animation:gline 1.2s .3s cubic-bezier(.2,.8,.2,1) both}
@keyframes gline{from{transform:scaleX(0)}}
.gold .ta{color:var(--ink-soft)}
.gold .wrap>div>p:not(.ta){color:var(--ink-soft);max-width:54ch;line-height:1.75}
.gold-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;margin:1.6rem 0 .2rem;max-width:520px}
.gold-stats div{background:#fff;border:1px solid var(--line);border-top:3px solid #D9A93E;border-radius:12px;padding:.8rem 1rem;box-shadow:0 6px 16px rgba(7,64,60,.06);transition:transform .3s,box-shadow .3s}
.gold-stats div:hover{transform:translateY(-4px);box-shadow:0 14px 26px rgba(7,64,60,.12)}
.gold-stats b{display:block;font-size:1.4rem;line-height:1.1;color:var(--teal-deep)}
.gold-stats span{font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-soft)}
.gold .btn-teal{box-shadow:0 8px 20px rgba(7,64,60,.25);transition:transform .25s,box-shadow .25s,background .2s}
.gold .btn-teal:hover{transform:translateY(-2px);box-shadow:0 14px 26px rgba(7,64,60,.32)}
.gold .btn-line{background:#fff}
.gold-points{position:relative;gap:0;background:#fff;border:1px solid var(--line);border-radius:22px;padding:1.2rem 1.4rem;box-shadow:0 2px 4px rgba(7,64,60,.04),0 24px 48px rgba(7,64,60,.10);counter-reset:gp}
.gold-points::before{content:"Why customers choose it";display:block;font-size:.75rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);padding:.2rem .2rem .9rem;border-bottom:1px solid var(--line);margin-bottom:.4rem}
.gold-points::after{content:"";position:absolute;left:calc(1.4rem + 26px);top:5.2rem;bottom:3rem;width:2px;background:linear-gradient(to bottom,#E4B84E,#F0D48A)}
.gold-points li{counter-increment:gp;position:relative;z-index:1;grid-template-columns:54px minmax(0,1fr);gap:1.1rem;align-items:center;background:transparent;border-radius:14px;padding:1rem .6rem;font-size:.94rem;line-height:1.55;color:var(--ink-soft);transition:background .3s,transform .3s}
.gold-points li:hover{background:#F4F6F9;transform:translateX(6px)}
.gold-points li+li{border-top:1px dashed var(--line)}
.gold-points svg{width:54px;height:54px;padding:14px;margin:0;color:#fff;background:linear-gradient(145deg,#137A70,#07403C);border-radius:50%;box-shadow:0 0 0 5px #fff,0 8px 16px rgba(7,64,60,.25);transition:transform .45s cubic-bezier(.3,1.5,.5,1),background .3s}
.gold-points li:hover svg{transform:scale(1.12) rotate(-8deg);background:linear-gradient(145deg,#E4B84E,#B98724);color:#2A1E05}
.gold-points strong{color:var(--teal-deep);font-size:1.05rem;margin-bottom:.15rem}
.gold-points strong::before{content:"Step 0" counter(gp);display:block;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#B98724;margin-bottom:.15rem;font-weight:700}
@media (max-width:900px){.gold .wrap{gap:2.4rem}.gold-stats{max-width:none}.gold-points::after{display:none}}
@media (prefers-reduced-motion:reduce){.gold h2 em::after{animation:none}.gold *{transition:none!important}}
/* since-1921 seal, rates */
.gold .wrap{position:relative}
.gold-seal{position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);width:84px;height:84px;filter:drop-shadow(0 10px 18px rgba(7,64,60,.35));animation:sealfloat 5s ease-in-out infinite}
.gold-seal svg{width:100%;height:100%;overflow:visible}
.gold-seal .seal-ring{transform-origin:60px 60px;animation:sealspin 28s linear infinite}
.gold-seal::after{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);background-size:250% 100%;animation:sealshine 4s ease-in-out infinite;pointer-events:none;mix-blend-mode:overlay}
@keyframes sealspin{to{transform:rotate(360deg)}}
@keyframes sealfloat{50%{translate:0 -6px}}
@keyframes sealshine{0%{background-position:150% 0}60%,100%{background-position:-50% 0}}
.gold-foot{margin:.7rem 0 0;font-size:.78rem;line-height:1.5;opacity:.75}
.gold-stats{max-width:none!important;grid-template-columns:repeat(3,minmax(0,1fr))}
.gold-stats b{font-size:1.35rem!important;white-space:nowrap}
.gold-stats span{display:block;margin-top:.15rem;line-height:1.3}
@media (max-width:900px){.gold-seal{position:relative;top:auto;left:auto;transform:none;margin:0 0 1.4rem;grid-row:1}}
@media (max-width:560px){.gold-stats{grid-template-columns:1fr!important}}
@media (prefers-reduced-motion:reduce){.gold-seal,.gold-seal .seal-ring,.gold-seal::after{animation:none}}
/* seal beside heading, stronger highlight */
.gold-seal{position:relative!important;top:auto!important;left:auto!important;right:auto!important;transform:none!important;display:inline-block;vertical-align:middle;width:1.55em!important;height:1.55em!important;margin:-.6em 0 -.6em .3em;-webkit-text-fill-color:initial}
@media (max-width:900px){.gold-seal{grid-row:auto!important;margin:-.5em 0 -.5em .25em}}
.gold h2 em::after{height:.5em!important;bottom:.02em!important;background:linear-gradient(90deg,#F6DE9A 0%,#E9BE52 55%,#D9A93E 100%)!important;border-radius:6px!important;box-shadow:0 6px 16px rgba(217,169,62,.45);transform:skewX(-8deg)}
.gold h2 em{padding:0 .12em}
/* highlight covers the whole phrase */
.gold h2 em{padding:0 .14em!important;margin:0 -.04em}
.gold h2 em::after{top:.08em!important;bottom:-.04em!important;height:auto!important;left:0!important;right:0!important;z-index:-1!important;background:linear-gradient(90deg,#F8E2A0 0%,#F0CB68 55%,#E4B84E 100%)!important;border-radius:8px!important;transform:skewX(-6deg)}

/* Home page: why co-operative cards */
/* why co-operative */
.values-head{text-align:center;margin-bottom:2.6rem}
.values-head h2{position:relative;display:inline-block;padding-bottom:1rem;letter-spacing:-.02em}
.values-head h2::after{content:"";position:absolute;left:50%;bottom:0;width:64px;height:4px;margin-left:-32px;border-radius:4px;background:linear-gradient(90deg,#0B5D57,#D9A93A)}
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem;counter-reset:v}
.value-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:20px;padding:2.2rem 1.8rem 1.9rem;box-shadow:0 1px 2px rgba(7,64,60,.05),0 10px 26px rgba(7,64,60,.07);transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s,border-color .3s}
.value-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#0B5D57,#D9A93A);transform:scaleX(.25);transform-origin:left;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.value-card::after{content:"";position:absolute;right:-50px;bottom:-50px;width:190px;height:190px;background:url("../assets/kolam.svg") center/contain no-repeat;opacity:.3;transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .4s;pointer-events:none}
.value-card:hover{transform:translateY(-8px);border-color:#F0D48A;box-shadow:0 2px 4px rgba(7,64,60,.06),0 26px 50px rgba(7,64,60,.16)}
.value-card:hover::before{transform:scaleX(1)}
.value-card:hover::after{transform:rotate(30deg) scale(1.1);opacity:.55}
.value-ico{display:flex;align-items:center;justify-content:center;width:68px;height:68px;margin-bottom:1.4rem;border-radius:20px 8px 20px 8px;background:linear-gradient(145deg,#137A70,#07403C);color:#fff;box-shadow:0 10px 20px rgba(7,64,60,.25);transition:transform .5s cubic-bezier(.3,1.5,.5,1),background .3s,color .3s}
.value-ico svg{width:34px;height:34px}
.value-ico .ac{fill:#FFD98A;stroke:#FFD98A}
.value-card:hover .value-ico{transform:rotate(-7deg) scale(1.08);background:linear-gradient(145deg,#E4B84E,#B98724);color:#2A1E05}
.value-card:hover .value-ico .ac{fill:#2A1E05;stroke:#2A1E05}
.value-card h3{position:relative;margin:0 0 .6rem;font-size:1.25rem;color:var(--teal-deep);border:0;padding:0}
.value-card h3::before{display:none!important;content:none!important}
.value-card p{position:relative;margin:0;color:var(--ink-soft);line-height:1.7;font-size:.98rem}
@media (max-width:900px){.values{grid-template-columns:1fr}.value-card:hover{transform:none}}
@media (prefers-reduced-motion:reduce){.value-card,.value-card *,.value-card::before,.value-card::after{transition:none!important}}
/* alt hover: navy fill floods in from the cursor entry point */
.value-card{isolation:isolate;transition:box-shadow .4s,border-color .4s,transform .4s cubic-bezier(.2,.8,.2,1)}
.value-card::before{inset:0!important;height:auto!important;top:0!important;z-index:-1;background:radial-gradient(90% 80% at 85% 0%,#137A70 0%,transparent 60%),linear-gradient(160deg,#0B5D57,#042B28)!important;transform:none!important;clip-path:circle(0 at var(--ox,50%) var(--oy,100%));transition:clip-path .7s cubic-bezier(.2,.8,.2,1)!important}
.value-card:hover::before{clip-path:circle(150% at var(--ox,50%) var(--oy,100%))!important;transform:none!important}
.value-card:hover{transform:translateY(-4px)!important;border-color:#0B5D57;box-shadow:0 26px 50px rgba(7,64,60,.3)!important}
.value-card::after{opacity:.5!important;filter:brightness(1.4)}
.value-card h3,.value-card p,.value-ico{transition:color .45s .08s,background .4s,transform .5s cubic-bezier(.3,1.5,.5,1)}
.value-card:hover h3{color:#fff}
.value-card:hover p{color:#B9D9D3}
.value-card:hover .value-ico{transform:translateY(-4px) scale(1.06);box-shadow:0 14px 26px rgba(0,0,0,.4)}
.value-card h3::after{content:"";display:block;width:0;height:2px;margin-top:.5rem;background:linear-gradient(90deg,#F3D27A,#D9A93E);transition:width .6s .15s cubic-bezier(.2,.8,.2,1)}
.value-card:hover h3::after{width:56px}
@media (hover:none){.value-card:hover::before{clip-path:circle(0 at 50% 100%)!important}}

/* ---------- Home: rates + calculator section ---------- */
.hr-sec{background:linear-gradient(180deg,#F3F8F6 0%,#E6F1EE 100%)}
.hr-sec .split{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.5rem,4vw,3rem);align-items:stretch;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1.3rem,2.6vw,2rem);box-shadow:0 10px 30px rgba(7,64,60,.08);transition:box-shadow .25s}
.hr-sec .split:hover{box-shadow:0 14px 36px rgba(7,64,60,.13)}
.hr-sec .split>div{display:flex;flex-direction:column}
.hr-sec .split>div+div{border-left:1px solid var(--line);padding-left:clamp(1.5rem,4vw,3rem)}
.hr-sec h2{font-size:1.5rem;display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem}
.hr-sec h2::before{content:"";width:5px;height:1.15em;background:var(--teal);border-radius:3px}
.hr-sec .split>div>p:first-of-type{color:var(--ink-soft);margin-bottom:1.2rem;font-size:.95rem}
.hr-sec .table-wrap{box-shadow:none;border-radius:var(--r-md);overflow:hidden}
.hr-sec table{min-width:0}
.hr-sec th{background:var(--teal);color:#fff;font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;font-weight:600;padding:.85rem 1rem;text-align:left}
.hr-sec th.num,.hr-sec td.num{text-align:right}
.hr-sec td{padding:.8rem 1rem;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.hr-sec tbody tr{transition:background .2s}
.hr-sec tbody tr:nth-child(even) td{background:#F7F8FA}
.hr-sec tbody tr:hover td{background:#E6F1EE}
.hr-sec td.num:nth-child(2){font-weight:700;color:var(--teal-deep)}
.hr-sec tbody tr:last-child td{background:#E3F2EE;font-weight:600}
.hr-sec tbody tr:last-child td:first-child::after{content:"Best rate";margin-left:.6rem;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:var(--teal);color:#fff;padding:.15rem .5rem;border-radius:999px}
.hr-sec .note{margin-top:auto;padding-top:1rem;font-size:.85rem;color:var(--ink-soft)}
.hr-sec .table-wrap+.note{background:#F7F8FA;border-left:3px solid var(--accent);border-radius:var(--r-sm);padding:.8rem 1rem;margin-top:1.1rem}
.hr-sec .calc{border:0;padding:0;box-shadow:none;background:transparent;display:flex;flex-direction:column;flex:1}
.hr-sec .calc-tabs{background:#E6F1EE;margin-bottom:1.1rem}
.hr-sec .calc-tabs button[aria-selected="true"]{background:var(--teal);color:#fff;box-shadow:0 4px 10px rgba(7,64,60,.2)}
.hr-sec .field label{font-size:.82rem;font-weight:600;color:var(--ink-soft)}
.hr-sec .calc-manual{border-radius:var(--r-sm);transition:border-color .2s,box-shadow .2s}
.hr-sec .calc-manual:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(11,93,87,.15);outline:0}
.hr-sec .result{background:linear-gradient(135deg,var(--teal-deep),var(--teal));border-radius:var(--r-md);box-shadow:0 8px 20px rgba(7,64,60,.2)}
.hr-sec .calc-actions{display:grid;grid-template-columns:1fr 1.4fr;gap:.7rem;margin-top:1rem}
.hr-sec .calc-actions .btn{justify-content:center;width:100%;transition:transform .2s,box-shadow .2s}
.hr-sec .calc-actions .btn:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(7,64,60,.22)}
@media(max-width:900px){.hr-sec .split{grid-template-columns:1fr}.hr-sec .split>div+div{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:1.5rem}}

/* ---------- Inner pages: dark left gradient on hero + darker navbar, white hero text ---------- */
body:not(:has(.hero)) .site-header { background-image: linear-gradient(90deg, rgba(4,30,28,.82) 0%, rgba(4,30,28,.55) 45%, rgba(4,30,28,.25) 100%), var(--header-img, none); }
body:not(:has(.hero)) .page-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(4,30,28,.88) 0%, rgba(4,30,28,.7) 30%, rgba(4,30,28,.3) 60%, rgba(4,30,28,0) 85%), linear-gradient(180deg, rgba(4,30,28,.45) 0%, rgba(4,30,28,0) 30%); }
body:not(:has(.hero)) .page-hero .wrap { z-index: 1; }
.page-hero, .page-hero h1, .page-hero p, .page-hero .hero-ta, .page-hero .crumbs, .page-hero .crumbs a, .page-hero .crumbs span { color: #FFFFFF; }

/* ---------- Seamless header: page banner image runs behind the nav ---------- */
.site-header, body:not(:has(.hero)) .site-header { background-color: transparent; background-image: linear-gradient(180deg, rgba(4,30,28,.55) 0%, rgba(4,30,28,0) 100%); transition: background-color .25s, box-shadow .25s; }
.site-header.is-stuck, body:not(:has(.hero)) .site-header.is-stuck { background-color: var(--teal-deep); background-image: linear-gradient(rgba(4,30,28,.35), rgba(4,30,28,.35)), var(--header-img, none); box-shadow: 0 4px 16px rgba(4,30,28,.3); }
.hero, .page-hero { margin-top: calc(-1 * var(--over-h, 0px)); }
.hero .wrap { padding-top: calc(clamp(2.5rem, 6vw, 4.5rem) + var(--over-h, 0px) - 5px); }
.page-hero .wrap { padding-top: calc(2.75rem + var(--over-h, 0px)); }
@media (max-width: 1200px) { .nav { background: var(--teal-deep); } }
.page-hero { min-height: clamp(440px, calc(42vw - 20px), 680px); }

/* ---------- Welcome popup: bottom-right, single line, auto-hides after 3s ---------- */
.welcome-popup { position: fixed; inset: auto 1.25rem 1.25rem auto; z-index: 200; display: block; padding: 0; background: none; max-width: calc(100vw - 2.5rem); animation: popupToast 3s ease both; pointer-events: none; }
.welcome-popup-card { display: flex; align-items: center; gap: .7rem; width: auto; padding: .65rem 2.6rem .65rem 1.1rem; text-align: left; white-space: nowrap; overflow: hidden; background: rgba(7,64,60,.88); border: 1px solid rgba(255,255,255,.28); border-radius: 999px; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 10px 30px rgba(4,30,28,.35); animation: none; pointer-events: auto; }
.welcome-popup-ta, .welcome-popup-en { margin: 0; font-size: .92rem; font-weight: 600; color: #fff; overflow: hidden; text-overflow: ellipsis; }
.welcome-popup-ta { font-family: var(--font-display); }
.welcome-popup-en { color: rgba(255,255,255,.78); font-weight: 500; }
.welcome-popup-en::before { content: "•"; margin-right: .7rem; color: var(--accent-light); }
.welcome-popup-close { top: 50%; right: .45rem; transform: translateY(-50%); width: 26px; height: 26px; font-size: 1.2rem; color: rgba(255,255,255,.75); }
.welcome-popup-close:hover { background: rgba(255,255,255,.15); color: #fff; }
@keyframes popupToast { 0% { opacity: 0; transform: translateY(16px); } 10%, 88% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) { .welcome-popup { animation-name: popupToastFade; } @keyframes popupToastFade { 0%, 100% { opacity: 0; } 10%, 88% { opacity: 1; } } }


/* Page banner heading: 20px more space above and below */
.page-hero h1 { padding-top: 20px; margin-bottom: calc(.5em + 20px); }

/* Page banner Tamil subtitle: 10px larger */
.page-hero .hero-ta { font-size: calc(1.2rem + 10px); }

/* Banner text link with arrow (About page: Registration & Regulatory Details) */
.page-hero .hero-link { display: inline-flex; align-items: center; gap: .55rem; margin-top: 1.1rem; color: #fff; font-weight: 700; font-size: 1.05rem; text-decoration: none; padding: .55rem 0; border-bottom: 2px solid rgba(255,255,255,.55); transition: color .2s, border-color .2s; }
.page-hero .hero-link svg { width: 1.3em; height: 1.3em; flex: none; transition: transform .2s; }
.page-hero .hero-link:hover, .page-hero .hero-link:focus-visible { color: #A8D5CE; border-color: #A8D5CE; }
.page-hero .hero-link:hover svg, .page-hero .hero-link:focus-visible svg { transform: translateX(5px); }
#registration { scroll-margin-top: calc(var(--hdr-h, 54px) + 1.5rem); }

/* Banner buttons (Deposits page) */
.page-hero .hero-btns { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.3rem; }
.page-hero .hero-btn { display: inline-flex; align-items: center; padding: .7rem 1.4rem; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.65); background: rgba(7,64,60,.45); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: #fff; font-weight: 600; font-size: 1rem; text-decoration: none; transition: background .2s, color .2s, border-color .2s, transform .2s, box-shadow .2s; }
.page-hero .hero-btn:hover, .page-hero .hero-btn:focus-visible { background: #fff; color: var(--teal-deep); border-color: #fff; transform: translateY(-3px); box-shadow: 0 10px 22px rgba(4,30,28,.4); }
.page-hero .hero-btn:active { transform: translateY(0); }

/* Banner call-to-action card (Services page: Safe Deposit Lockers) */
.page-hero .hero-cta { display: inline-flex; align-items: center; gap: .9rem; margin-top: 1.3rem; padding: .55rem 1.2rem .55rem .55rem; border-radius: 16px; background: #fff; color: var(--teal-deep); text-decoration: none; box-shadow: 0 10px 26px rgba(4,30,28,.35); transition: transform .25s, box-shadow .25s, background .25s, color .25s; }
.page-hero .hero-cta-ico { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(145deg, var(--teal), var(--teal-deep)); color: #fff; transition: background .25s, transform .25s; }
.page-hero .hero-cta-ico svg { width: 24px; height: 24px; }
.page-hero .hero-cta-txt { font-weight: 700; font-size: 1.05rem; }
.page-hero .hero-cta-arrow { width: 20px; height: 20px; margin-left: .3rem; transition: transform .25s; }
.page-hero .hero-cta:hover, .page-hero .hero-cta:focus-visible { background: var(--accent); color: var(--teal-deep); transform: translateY(-3px); box-shadow: 0 16px 32px rgba(4,30,28,.5); }
.page-hero .hero-cta:hover .hero-cta-ico, .page-hero .hero-cta:focus-visible .hero-cta-ico { background: #fff; color: var(--teal); transform: rotate(-8deg) scale(1.05); }
.page-hero .hero-cta:hover .hero-cta-arrow, .page-hero .hero-cta:focus-visible .hero-cta-arrow { transform: translateX(5px); }
body.page-services .service.is-flash { animation: svcFlash 1.4s ease; }
@keyframes svcFlash { 0%, 100% { box-shadow: 0 0 0 0 rgba(11,93,87,0); } 25%, 65% { box-shadow: 0 0 0 6px rgba(11,93,87,.35); } }

/* ---------- Interest rates page: calculator buttons ---------- */
body.page-rates .calc-actions { display: grid; grid-template-columns: auto 1fr; gap: .8rem; margin-top: 1.1rem; }
body.page-rates .calc-actions .btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; padding: .85rem 1.4rem; border-radius: 14px; font-weight: 700; letter-spacing: .02em; transition: transform .25s, box-shadow .25s, background .25s, color .25s, border-color .25s; }
body.page-rates .calc-actions .btn::before { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; transition: transform .3s; }
body.page-rates .calc-actions [data-action="calculate"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cpath d='M8 6h8M8 11h.01M12 11h.01M16 11h.01M8 15h.01M12 15h.01M16 15h.01M8 19h.01M12 19h.01M16 19h.01'/%3E%3C/svg%3E"); background: linear-gradient(135deg, var(--teal), var(--teal-deep)); color: #fff; border: 0; box-shadow: 0 8px 18px rgba(7,64,60,.3), inset 0 1px 0 rgba(255,255,255,.18); }
body.page-rates .calc-actions [data-action="calculate"]::after { content: "\2192"; font-size: 1.1em; transition: transform .25s; }
body.page-rates .calc-actions [data-action="calculate"]:hover, body.page-rates .calc-actions [data-action="calculate"]:focus-visible { background: var(--accent); color: var(--teal-deep); transform: translateY(-3px); box-shadow: 0 14px 26px rgba(7,64,60,.3); }
body.page-rates .calc-actions [data-action="calculate"]:hover::before { transform: rotate(-10deg) scale(1.1); }
body.page-rates .calc-actions [data-action="calculate"]:hover::after { transform: translateX(5px); }
body.page-rates .calc-actions [data-action="cancel"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 3-6.7L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E"); background: transparent; color: var(--ink-soft); border: 1.5px solid var(--line); box-shadow: none; }
body.page-rates .calc-actions [data-action="cancel"]:hover, body.page-rates .calc-actions [data-action="cancel"]:focus-visible { background: var(--mist); color: var(--teal-deep); border-color: var(--accent); transform: translateY(-2px); box-shadow: none; }
body.page-rates .calc-actions [data-action="cancel"]:hover::before { transform: rotate(-180deg); }

#calculators { scroll-margin-top: calc(var(--hdr-h, 54px) + 1.5rem); }
#forms { scroll-margin-top: calc(var(--hdr-h, 54px) + 1rem); }
.page-hero .hero-link[target]:hover svg, .page-hero .hero-link[target]:focus-visible svg { transform: translate(3px, -3px); }

/* "Contact us" (nav) and "Send an enquiry" buttons: white background, navy text */
.nav .nav-cta a, .nav .nav-cta a[aria-current="page"], .btn-mango { background: #fff; color: var(--teal); }
.nav .nav-cta a:hover, .nav .nav-cta a:focus-visible, .btn-mango:hover, .btn-mango:focus-visible { background: var(--accent-soft); color: var(--teal-deep); }

/* Tamil versions of labels generated by CSS (html[lang="ta"] is set by js/translations.js) */
html[lang="ta"] .gold-points::before { content: "ஏன் வாடிக்கையாளர்கள் தேர்வு செய்கிறார்கள்"; }
html[lang="ta"] .gold-points strong::before { content: "படி 0" counter(gp); text-transform: none; }
html[lang="ta"] .hr-sec tbody tr:last-child td:first-child::after { content: "சிறந்த விகிதம்"; text-transform: none; }
/* Tamil glyphs are taller: give the gold-loan heading room so it does not overlap the line below */
html[lang="ta"] .gold h2 { line-height: 1.4; font-size: clamp(1.6rem, 3.4vw, 2.4rem); letter-spacing: 0; }
html[lang="ta"] .gold .ta { margin-top: .8rem; }

/* ---------- Small-screen fixes (checked in English and Tamil at all font sizes) ---------- */
@media (max-width: 520px) {
  .welcome-popup { inset: auto 1rem 1rem 1rem; max-width: none; }
  .welcome-popup-card { white-space: normal; flex-wrap: wrap; gap: .1rem .6rem; border-radius: 18px; padding-right: 2.4rem; }
  .welcome-popup-ta, .welcome-popup-en { text-overflow: clip; overflow: visible; }
  .welcome-popup-en::before { display: none; }
}
.visit-info, .visit-info dd, .visit-info a { overflow-wrap: anywhere; }
.calc-tabs button { min-width: 0; white-space: normal; padding-inline: .35rem; }

/* Scrolled header: same slice of the banner image, and the same fades, as at the top of the page */
body:not(:has(.hero)) { --banner-grad-h: linear-gradient(90deg, rgba(4,30,28,.88) 0%, rgba(4,30,28,.7) 30%, rgba(4,30,28,.3) 60%, rgba(4,30,28,0) 85%); --banner-grad-v: linear-gradient(180deg, rgba(4,30,28,.45) 0%, rgba(4,30,28,0) 30%); }
.site-header.is-stuck, body:not(:has(.hero)) .site-header.is-stuck {
  background-color: var(--teal-deep);
  background-image: linear-gradient(180deg, rgba(4,30,28,.55) 0%, rgba(4,30,28,0) 100%), var(--banner-grad-h, none), var(--banner-grad-v, none), var(--header-img, none);
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%, 100% var(--banner-h, 100%), var(--hdr-bg-size, cover);
  background-position: 0 0, 0 0, 0 0, var(--hdr-bg-pos, center top);
}

/* Home page: content rises from the bottom the first time it scrolls into view (classes added by js/main.js) */
.rv { opacity: 0; transform: translateY(70px); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1), box-shadow .25s; }
.rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .rv { opacity: 1; transform: none; transition: none; } }


/* ---------- About page layout: numbers strip, timeline, offices, certificate ---------- */
.ab-stats-sec{position:relative;z-index:2;margin-top:-1.6rem}
body.page-about .page-hero .wrap{padding-bottom:5rem}
.ab-stats{display:grid;grid-template-columns:repeat(4,1fr);background:linear-gradient(135deg,#0B5D57,#07403C);border-radius:22px;box-shadow:0 18px 40px rgba(7,64,60,.28);overflow:hidden}
.ab-stats>div{padding:1.5rem 1.4rem;text-align:center;position:relative;color:#fff}
.ab-stats>div+div::before{content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:rgba(255,255,255,.18)}
.ab-stats b{display:block;white-space:nowrap;font-size:clamp(1.5rem,3.4vw,2.15rem);line-height:1.1;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.ab-stats span{display:block;margin-top:.35rem;font-size:.82rem;letter-spacing:.09em;text-transform:uppercase;color:#F0D48A;font-weight:600}
.ab-sec{padding-block:clamp(2.6rem,5vw,4rem)}
.ab-head{max-width:720px;margin:0 auto clamp(1.6rem,3vw,2.4rem);text-align:center}
.ab-eyebrow{display:inline-block;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);padding:.25rem .8rem;border:1px solid var(--line);border-radius:999px;background:#fff;margin-bottom:.8rem}
.ab-head h2{margin:0 0 .5rem;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--teal-deep)}
.ab-head p{margin:0;color:var(--ink-soft)}
/* timeline */
.ab-tl{list-style:none;margin:0 auto;padding:0;max-width:980px;position:relative}
.ab-tl::before{content:"";position:absolute;left:50%;top:6px;bottom:6px;width:3px;margin-left:-1.5px;background:linear-gradient(#0B5D57,#D9A93A);border-radius:3px}
.ab-tl-item{position:relative;width:50%;padding:0 2.6rem 2.2rem 0;text-align:right}
.ab-tl-item:nth-child(even){margin-left:50%;padding:0 0 2.2rem 2.6rem;text-align:left}
.ab-tl-item::before{content:"";position:absolute;top:.35rem;right:-9px;width:18px;height:18px;border-radius:50%;background:#fff;border:4px solid var(--teal);box-shadow:0 0 0 5px rgba(11,93,87,.12)}
.ab-tl-item:nth-child(even)::before{right:auto;left:-9px}
.ab-tl-item>*{position:relative}
.ab-tl-item h3{margin:.55rem 0 .3rem;font-size:1.15rem;color:var(--teal-deep)}
.ab-tl-item p{margin:0;color:var(--ink-soft);font-size:.96rem;line-height:1.55;background:#fff;border:1px solid var(--line);border-radius:14px;padding:.9rem 1.1rem;box-shadow:0 6px 18px rgba(7,64,60,.06);display:inline-block;text-align:left;max-width:100%}
.ab-tl-date{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--teal);padding:.25rem .75rem;border-radius:999px}
.ab-tl-next::before{border-color:var(--accent);border-style:dashed}
.ab-tl-next .ab-tl-date{background:var(--accent);color:var(--teal-deep)}
/* offices */
.ab-branches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;max-width:980px;margin:0 auto}
.ab-branch{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1.5rem;box-shadow:0 10px 28px rgba(7,64,60,.08);position:relative;overflow:hidden;transition:transform .25s,box-shadow .25s}
.ab-branch::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(#0B5D57,#D9A93A)}
.ab-branch:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(7,64,60,.14)}
.ab-branch-top{display:flex;align-items:center;gap:.9rem;margin-bottom:.9rem}
.ab-branch-top h3{margin:0 0 .25rem;font-size:1.2rem;color:var(--teal-deep)}
.ab-badge{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:linear-gradient(145deg,var(--teal),var(--teal-deep));color:#fff;flex:none}
.ab-badge svg{width:24px;height:24px}
.ab-pill{display:inline-block;font-size:.76rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.15rem .6rem;border-radius:999px;background:var(--accent-soft);color:var(--ink-soft)}
.ab-branch p{margin:0 0 1rem;color:var(--ink-soft);line-height:1.6}
.ab-chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.ab-chips a{display:inline-flex;align-items:center;gap:.45rem;padding:.4rem .8rem;border:1px solid var(--line);border-radius:999px;background:var(--mist);color:var(--ink);text-decoration:none;font-size:.88rem;font-weight:500;overflow-wrap:anywhere;transition:background .2s,border-color .2s}
.ab-chips a:hover{background:var(--accent-soft);border-color:var(--accent)}
.ab-chips svg{width:16px;height:16px;flex:none;color:var(--teal)}
.ab-go{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;color:var(--teal);text-decoration:none;border-bottom:2px solid transparent;transition:border-color .2s,gap .2s}
.ab-go svg{width:18px;height:18px}
.ab-go:hover{border-color:var(--teal);gap:.65rem}
/* certificate */
.ab-cert{position:relative;max-width:980px;margin:0 auto;background:linear-gradient(180deg,#fff,#F7F8FA);border:1px solid var(--line);border-radius:22px;padding:clamp(1.4rem,3vw,2.2rem);box-shadow:0 14px 34px rgba(7,64,60,.09)}
.ab-seal{position:absolute;right:1.4rem;top:-1.4rem;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:linear-gradient(145deg,var(--teal),var(--teal-deep));color:#fff;box-shadow:0 8px 20px rgba(7,64,60,.3);border:4px solid #fff}
.ab-seal svg{width:28px;height:28px}
.ab-cert-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.3rem 2rem;margin:0;position:relative}
.ab-cert-grid dt,.ab-dicgc dt{font-size:.72rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.25rem}
.ab-cert-grid dd{margin:0;font-weight:500;color:var(--ink);line-height:1.45}
.ab-cert-grid .ab-strong{font-weight:800;font-size:1.15rem;color:var(--teal-deep);font-variant-numeric:tabular-nums}
.ab-wide{grid-column:1/-1}
.ab-dicgc{position:relative;display:flex;gap:1rem;align-items:flex-start;margin-top:1.6rem;padding:1rem 1.2rem;background:#fff;border:1px solid var(--line);border-left:5px solid var(--teal);border-radius:14px}
.ab-dicgc-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--accent-soft);color:var(--teal);flex:none}
.ab-dicgc-ico svg{width:22px;height:22px}
.ab-dicgc p{margin:0;color:var(--ink-soft);line-height:1.55}
/* reveal */
.ab-rv{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1)}
.ab-rv.is-in{opacity:1;transform:none}
@media (max-width:820px){
  .ab-stats{grid-template-columns:repeat(2,1fr)}
  .ab-stats>div:nth-child(3)::before{display:none}
  .ab-stats>div:nth-child(n+3){border-top:1px solid rgba(255,255,255,.14)}
  .ab-tl::before{left:11px;margin-left:0}
  .ab-tl-item,.ab-tl-item:nth-child(even){width:100%;margin-left:0;padding:0 0 1.8rem 2.6rem;text-align:left}
  .ab-tl-item::before,.ab-tl-item:nth-child(even)::before{left:2px;right:auto}
  .ab-branches,.ab-cert-grid{grid-template-columns:1fr}.ab-cert-grid{padding-top:1.6rem}
}
@media (prefers-reduced-motion:reduce){.ab-rv{opacity:1;transform:none;transition:none}}


/* ---------- Notices page layout: filter panel + notice rows (static, no scroll animations) ---------- */
body.page-notices .np-sec{padding-block:clamp(2rem,4vw,3.4rem)}
.np-layout{display:grid;grid-template-columns:minmax(240px,300px) minmax(0,1fr);gap:clamp(1.4rem,3vw,2.4rem);align-items:start}
.np-side{position:sticky;top:calc(var(--hdr-h,54px) + 1.2rem);display:flex;flex-direction:column;gap:1.1rem}
.np-side-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:1.2rem;box-shadow:0 10px 26px rgba(7,64,60,.08);scroll-margin-top:calc(var(--hdr-h,54px) + 1.2rem)}
.np-side-card h2{margin:0 0 .8rem;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.np-side .notice-tab{display:flex;align-items:center;gap:.75rem;width:100%;margin:0 0 .4rem;padding:.7rem .8rem;border:1px solid transparent;border-radius:14px;background:transparent;color:var(--ink);font:inherit;font-weight:600;text-align:left;cursor:pointer;box-shadow:none;transition:background .2s,color .2s,border-color .2s,transform .2s}
.np-side .notice-tab svg{width:20px;height:20px;flex:none;color:var(--teal)}
.np-side .np-label{flex:1;min-width:0}
.np-side .notice-tab em{font-style:normal;font-size:.78rem;font-weight:700;min-width:1.7rem;text-align:center;padding:.12rem .5rem;border-radius:999px;background:var(--accent-soft);color:var(--ink-soft);transition:background .2s,color .2s}
.np-side .notice-tab:hover{background:var(--mist);border-color:var(--line);transform:translateX(3px)}
.np-side .notice-tab.is-active{background:linear-gradient(135deg,var(--teal),var(--teal-deep));color:#fff;box-shadow:0 8px 18px rgba(7,64,60,.28)}
.np-side .notice-tab.is-active svg{color:#fff}
.np-side .notice-tab.is-active em{background:rgba(255,255,255,.2);color:#fff}
.np-help{background:linear-gradient(160deg,#F7F8FA,#FBF3DC);border:1px dashed rgba(11,93,87,.3);border-radius:20px;padding:1.2rem}
.np-help-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#fff;color:var(--teal);box-shadow:0 4px 12px rgba(7,64,60,.1);margin-bottom:.7rem}
.np-help-ico svg{width:21px;height:21px}
.np-help h3{margin:0 0 .3rem;font-size:1rem;color:var(--teal-deep)}
.np-help p{margin:0 0 .7rem;color:var(--ink-soft);font-size:.92rem;line-height:1.5}
.np-help a{font-weight:800;color:var(--teal);text-decoration:none;font-variant-numeric:tabular-nums;border-bottom:2px solid transparent}
.np-help a:hover{border-color:var(--teal)}
.np-list{display:flex;flex-direction:column;gap:.9rem}
.np-list .np-row{--c:#0B5D57;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.1rem;padding:1rem 1.2rem 1rem 1rem;background:#fff;border:1px solid var(--line);border-left:6px solid var(--c);border-radius:16px;box-shadow:0 6px 18px rgba(7,64,60,.06);transition:box-shadow .25s,transform .25s}
.np-list .np-row[data-category="agm"]{--c:#3E8F85}
.np-list .np-row[data-category="tender"]{--c:#D9A93A}
.np-list .np-row:hover{transform:translateX(4px);box-shadow:0 14px 30px rgba(7,64,60,.13)}
.np-list .np-row.is-hidden{display:none}
.np-date{display:flex;flex-direction:column;align-items:center;justify-content:center;width:74px;padding:.55rem .4rem;border-radius:14px;background:var(--mist);border:1px solid var(--line);text-align:center;line-height:1.15}
.np-date b{font-size:1.5rem;font-weight:800;color:var(--teal-deep)}
.np-date span{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.np-main{min-width:0}
.np-main .notice-tag{margin-bottom:.4rem;display:inline-block}
.np-main h3{margin:0;font-size:1.05rem;line-height:1.35}
.np-main h3 a{color:var(--teal-deep);text-decoration:none}
.np-main h3 a:hover{text-decoration:underline}
.np-dl{display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1rem;border-radius:999px;border:1.5px solid var(--teal);color:var(--teal);font-weight:700;font-size:.9rem;text-decoration:none;transition:background .2s,color .2s,transform .2s}
.np-dl svg{width:18px;height:18px;transition:transform .2s}
.np-dl:hover{background:var(--teal);color:#fff}
.np-dl:hover svg{transform:translateY(2px)}
.np-content .notice-empty{padding:1.4rem;text-align:center;border:1px dashed var(--line);border-radius:14px;color:var(--ink-soft)}
.np-content .note{margin-top:1rem}
@media (max-width:900px){
  .np-layout{grid-template-columns:1fr}
  .np-side{position:static}
  .np-side-card{display:flex;flex-wrap:wrap;gap:.4rem}
  .np-side-card h2{flex:1 0 100%;margin-bottom:.2rem}
  .np-side .notice-tab{width:auto;flex:1 1 calc(50% - .4rem);margin:0}
  .np-help{display:none}
}
@media (max-width:560px){
  .np-list .np-row{grid-template-columns:auto minmax(0,1fr);gap:.8rem}
  .np-dl{grid-column:1/-1;justify-content:center}
  .np-date{width:62px}
}


/* ---------- Customer corner layout: jump tiles, KYC tabs, complaint steps, forms, fraud panel (static, no scroll animations) ---------- */
.cc-quick{padding-block:clamp(1.8rem,3.5vw,2.8rem) 0}
.cc-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.cc-tiles a{display:flex;align-items:center;gap:.8rem;padding:1rem 1.1rem;background:#fff;border:1px solid var(--line);border-radius:18px;text-decoration:none;color:var(--teal-deep);box-shadow:0 8px 22px rgba(7,64,60,.07);transition:background .25s,color .25s,transform .25s,box-shadow .25s,border-color .25s}
.cc-ti{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(145deg,var(--teal),var(--teal-deep));color:#fff;flex:none;transition:background .25s,color .25s}
.cc-ti svg{width:22px;height:22px}
.cc-tiles b{flex:1;min-width:0;font-size:.98rem;line-height:1.25}
.cc-arrow{width:20px;height:20px;flex:none;color:var(--ink-soft);transition:transform .25s,color .25s}
.cc-tiles a:hover,.cc-tiles a:focus-visible{background:var(--accent);border-color:var(--accent);transform:translateY(-4px);box-shadow:0 16px 30px rgba(7,64,60,.18)}
.cc-tiles a:hover .cc-ti{background:#fff;color:var(--teal)}
.cc-tiles a:hover .cc-arrow{transform:translateX(4px);color:var(--teal-deep)}
.cc-sec{padding-block:clamp(2.4rem,4.5vw,3.6rem);scroll-margin-top:calc(var(--hdr-h,54px) + 1rem)}
.cc-mist{background:var(--mist)}
.cc-head{max-width:760px;margin:0 auto clamp(1.4rem,3vw,2rem);text-align:center}
.cc-head h2{margin:0 0 .5rem;font-size:clamp(1.5rem,2.8vw,2.05rem);color:var(--teal-deep)}
.cc-head h2::after{content:"";display:block;width:54px;height:4px;margin:.7rem auto 0;border-radius:4px;background:linear-gradient(90deg,var(--teal),var(--accent))}
.cc-head p{margin:.9rem 0 0;color:var(--ink-soft)}
/* KYC tabs */
.cc-kyc{max-width:900px;margin:0 auto}
.cc-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;padding:.4rem;background:#E6F1EE;border-radius:18px}
.cc-tabs button{display:flex;align-items:center;justify-content:center;gap:.55rem;padding:.8rem .6rem;border:0;border-radius:14px;background:transparent;color:var(--ink-soft);font:inherit;font-weight:600;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.cc-tabs button svg{width:20px;height:20px;flex:none}
.cc-tabs button:hover{background:rgba(255,255,255,.6);color:var(--teal-deep)}
.cc-tabs button.is-active{background:linear-gradient(135deg,var(--teal),var(--teal-deep));color:#fff;box-shadow:0 8px 18px rgba(7,64,60,.28)}
.cc-panels{margin-top:1rem}
.cc-panel{display:flex;gap:1.2rem;align-items:flex-start;padding:1.6rem;background:#fff;border:1px solid var(--line);border-left:6px solid var(--teal);border-radius:18px;box-shadow:0 10px 26px rgba(7,64,60,.08)}
.cc-panel[hidden]{display:none}
.cc-panel-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--accent-soft);color:var(--teal);flex:none}
.cc-panel-ico svg{width:26px;height:26px}
.cc-panel p{margin:0;font-size:1.05rem;line-height:1.7;color:var(--ink)}
/* complaint steps */
.cc-steps{list-style:none;margin:0 auto;padding:0;max-width:1000px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem;counter-reset:none}
.cc-steps li{position:relative;padding:2.4rem 1.4rem 1.4rem;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 10px 26px rgba(7,64,60,.08);transition:transform .25s,box-shadow .25s}
.cc-steps li:hover{transform:translateY(-5px);box-shadow:0 18px 36px rgba(7,64,60,.14)}
.cc-steps li:not(:last-child)::after{content:"";position:absolute;top:0;left:calc(50% + 34px);width:calc(100% + 1.4rem - 68px);border-top:3px dashed rgba(11,93,87,.3);transform:translateY(-1px)}
.cc-num{position:absolute;top:-24px;left:50%;transform:translateX(-50%);display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:linear-gradient(145deg,var(--teal),var(--teal-deep));color:#fff;font-size:1.3rem;font-weight:800;border:4px solid var(--mist);box-shadow:0 8px 18px rgba(7,64,60,.3)}
.cc-steps h3{margin:.2rem 0 .5rem;text-align:center;font-size:1.1rem;color:var(--teal-deep)}
.cc-steps p{margin:0;color:var(--ink-soft);line-height:1.6;text-align:center;font-size:.96rem;overflow-wrap:anywhere}
.cc-steps a{color:var(--teal);font-weight:600}
/* forms */
.cc-drop{max-width:760px;margin:0 auto;text-align:center;padding:2.2rem 1.6rem;border:2px dashed rgba(11,93,87,.32);border-radius:24px;background:linear-gradient(180deg,#fff,#F7F8FA)}
.cc-drop-ico{display:grid;place-items:center;width:68px;height:68px;margin:0 auto 1rem;border-radius:20px;background:linear-gradient(145deg,var(--teal),var(--teal-deep));color:#fff;box-shadow:0 10px 22px rgba(7,64,60,.28)}
.cc-drop-ico svg{width:32px;height:32px}
.cc-drop h3{margin:0 0 .4rem;color:var(--teal-deep)}
.cc-drop p{margin:0 0 1.2rem;color:var(--ink-soft)}
/* fraud */
.cc-fraud{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:1.6rem;align-items:center;padding:clamp(1.4rem,3vw,2.2rem);border-radius:26px;background:linear-gradient(135deg,#0B5D57,#07403C);color:#fff;box-shadow:0 18px 40px rgba(7,64,60,.28)}
.cc-fraud-lead{text-align:left}
.cc-fraud-ico{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:rgba(255,255,255,.12);color:#fff;margin-bottom:.9rem}
.cc-fraud-ico svg{width:32px;height:32px}
.cc-fraud h3{margin:0;font-size:1.5rem;color:#fff}
.cc-tips{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem}
.cc-tips li{display:flex;gap:.7rem;align-items:flex-start;padding:1rem;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);line-height:1.5;font-size:.95rem;color:#E6EAF0;transition:background .25s,transform .25s}
.cc-tips li:hover{background:rgba(255,255,255,.14);transform:translateY(-3px)}
.cc-tips svg{width:22px;height:22px;flex:none;color:#F0CB68;margin-top:.1rem}
.cc-tips span{overflow-wrap:anywhere}
@media (max-width:900px){
  .cc-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cc-steps{grid-template-columns:1fr;gap:2.2rem;max-width:520px}
  .cc-steps li:not(:last-child)::after{display:none}
  .cc-fraud{grid-template-columns:1fr}
}
@media (max-width:600px){
  .cc-tiles{grid-template-columns:1fr}
  .cc-tabs{grid-template-columns:1fr}
  .cc-panel{flex-direction:column}
  .cc-tips{grid-template-columns:1fr}
}


/* ---------- Contact page layout: info cards, map, enquiry form, route card (static, no scroll animations) ---------- */
.ct-sec{padding-block:clamp(2.2rem,4.5vw,3.4rem)}
.ct-top{padding-bottom:0}
.ct-mist{background:var(--mist)}
.ct-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.1rem}
.ct-card{display:flex;flex-direction:column;gap:.9rem;padding:1.3rem;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 10px 26px rgba(7,64,60,.08);transition:transform .25s,box-shadow .25s}
.ct-card:hover{transform:translateY(-5px);box-shadow:0 18px 36px rgba(7,64,60,.14)}
.ct-ico{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:linear-gradient(145deg,var(--teal),var(--teal-deep));color:#fff}
.ct-ico svg{width:24px;height:24px}
.ct-card dl{margin:0}
.ct-card dt{font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.3rem}
.ct-card dd{margin:0;color:var(--ink);line-height:1.55;font-size:.97rem;overflow-wrap:anywhere}
.ct-card dd a{color:var(--teal-deep);font-weight:700;text-decoration:none;border-bottom:2px solid transparent;transition:border-color .2s}
.ct-card dd a:hover{border-color:var(--teal)}
.ct-head{text-align:center;margin:0 auto 1.6rem}
.ct-head h2{margin:0;font-size:clamp(1.5rem,2.8vw,2.05rem);color:var(--teal-deep)}
.ct-head h2::after{content:"";display:block;width:54px;height:4px;margin:.7rem auto 0;border-radius:4px;background:linear-gradient(90deg,var(--teal),var(--accent))}
.ct-map{position:relative;border-radius:26px;overflow:hidden;box-shadow:0 18px 40px rgba(7,64,60,.16);border:1px solid var(--line)}
.ct-map-frame iframe{display:block;width:100%;height:clamp(320px,42vw,460px);border:0}
.ct-map-actions{position:absolute;left:1.2rem;bottom:1.2rem;display:flex;flex-wrap:wrap;gap:.7rem;padding:.7rem;border-radius:18px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 10px 26px rgba(7,64,60,.2)}
.ct-split{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(1.4rem,3vw,2.4rem);align-items:start}
.ct-formcard{background:#fff;border:1px solid var(--line);border-radius:24px;padding:clamp(1.4rem,3vw,2.1rem);box-shadow:0 14px 34px rgba(7,64,60,.09);border-top:5px solid var(--teal)}
.ct-formcard h2{margin:0 0 .4rem;color:var(--teal-deep);font-size:clamp(1.4rem,2.5vw,1.8rem)}
.ct-formcard>p{margin:0 0 1.3rem;color:var(--ink-soft);line-height:1.6}
.ct-form label{display:block;margin-bottom:.35rem;font-size:.86rem;font-weight:700;color:var(--ink-soft)}
.ct-form input,.ct-form select,.ct-form textarea{width:100%;padding:.8rem 1rem;border:1.5px solid var(--line);border-radius:14px;background:#F9FAFB;font:inherit;color:var(--ink);transition:border-color .2s,box-shadow .2s,background .2s}
.ct-form input:hover,.ct-form select:hover,.ct-form textarea:hover{border-color:var(--accent)}
.ct-form input:focus,.ct-form select:focus,.ct-form textarea:focus{outline:0;background:#fff;border-color:var(--teal);box-shadow:0 0 0 4px rgba(11,93,87,.14)}
.ct-form .form-actions{margin-top:.4rem}
.ct-route{position:relative;padding:clamp(1.4rem,3vw,2rem);border-radius:24px;background:linear-gradient(135deg,#0B5D57,#07403C);color:#fff;box-shadow:0 18px 40px rgba(7,64,60,.28);overflow:hidden}
.ct-route::after{content:"";position:absolute;right:-70px;bottom:-70px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.06)}
.ct-route-ico{display:grid;place-items:center;width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,.12);margin-bottom:1rem}
.ct-route-ico svg{width:28px;height:28px}
.ct-route h2{margin:0 0 .6rem;color:#fff;font-size:1.5rem}
.ct-route>p{margin:0 0 1.3rem;color:#DDEDE9;line-height:1.65}
.ct-route-step{position:relative;display:flex;gap:.9rem;align-items:flex-start;padding:1rem;border-radius:16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.16)}
.ct-route-car{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#fff;color:var(--teal);flex:none}
.ct-route-car svg{width:22px;height:22px}
.ct-route-step h3{margin:0 0 .2rem;color:#fff;font-size:1rem}
.ct-route-step p{margin:0;color:#DDEDE9;font-size:.94rem;line-height:1.5}
@media (max-width:1000px){.ct-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.ct-split{grid-template-columns:1fr}}
@media (max-width:600px){
  .ct-cards{grid-template-columns:1fr}
  .ct-map-actions{position:static;border-radius:0;box-shadow:none;justify-content:center;background:#fff}
}

/* "Contact us" nav button is white, so its current-page underline is navy instead of white */
.nav .nav-cta a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--teal); }
@media (max-width: 1200px) { .nav .nav-cta a[aria-current="page"] { box-shadow: inset 4px 0 0 var(--teal); } }

/* Readability of banner text over photos: darker veil behind the text (stronger on small screens) + soft text shadow */
body:not(:has(.hero)) .page-hero::before { background: linear-gradient(90deg, rgba(4,30,28,.92) 0%, rgba(4,30,28,.8) 38%, rgba(4,30,28,.45) 65%, rgba(4,30,28,0) 90%), linear-gradient(180deg, rgba(4,30,28,.5) 0%, rgba(4,30,28,.1) 35%, rgba(4,30,28,.25) 100%); }
@media (max-width: 900px) { body:not(:has(.hero)) .page-hero::before { background: linear-gradient(180deg, rgba(4,30,28,.72) 0%, rgba(4,30,28,.66) 100%); } }
.page-hero h1, .page-hero .hero-ta, .page-hero p, .page-hero .crumbs, .page-hero .hero-link { text-shadow: 0 2px 12px rgba(4,30,28,.6); }
.hero h1, .hero .hero-ta, .hero p.lead, .hero .hero-copy > p { text-shadow: 0 2px 14px rgba(4,30,28,.6); }

/* Home hero: same darker veil behind the text as the inner-page banners */
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, rgba(4,30,28,.85) 0%, rgba(4,30,28,.7) 34%, rgba(4,30,28,.32) 60%, rgba(4,30,28,0) 85%), linear-gradient(180deg, rgba(4,30,28,.35) 0%, rgba(4,30,28,0) 30%); }
@media (max-width: 900px) { .hero::after { background: linear-gradient(180deg, rgba(4,30,28,.7) 0%, rgba(4,30,28,.6) 100%); } }

/* Home page: hidden from the first paint while the intro is about to play (class set in <head>, removed by js/intro.js) */
html.iz-pre { background: #042B28; }
html.iz-pre body { visibility: hidden; }

/* Inner-page banners: tighter spacing, and the whole text block centred vertically in the banner */
.page-hero { display: flex; align-items: center; }
.page-hero .wrap { flex: 0 1 auto; min-width: 0; padding-top: calc(var(--over-h, 0px) + 1rem); padding-bottom: 1.6rem; }
.page-hero .crumbs { margin-bottom: .2rem; }
.page-hero h1 { padding-top: 6px; margin-bottom: .2em; }
.page-hero .hero-ta { margin-bottom: .7rem; }
.page-hero .hero-link, .page-hero .hero-btns, .page-hero .hero-cta { margin-top: .8rem; }

/* Banner text veil: keep the dark area tight behind the text only, so the people / picture stay bright */
body:not(:has(.hero)) .page-hero::before { background: linear-gradient(90deg, rgba(4,30,28,.86) 0%, rgba(4,30,28,.72) 22%, rgba(4,30,28,.32) 40%, rgba(4,30,28,0) 54%), linear-gradient(180deg, rgba(4,30,28,.32) 0%, rgba(4,30,28,0) 22%); }
.hero::after { background: linear-gradient(90deg, rgba(4,30,28,.82) 0%, rgba(4,30,28,.68) 24%, rgba(4,30,28,.3) 42%, rgba(4,30,28,0) 58%), linear-gradient(180deg, rgba(4,30,28,.28) 0%, rgba(4,30,28,0) 22%); }
@media (max-width: 900px) {
  body:not(:has(.hero)) .page-hero::before { background: linear-gradient(180deg, rgba(4,30,28,.5) 0%, rgba(4,30,28,.46) 100%); }
  .hero::after { background: linear-gradient(180deg, rgba(4,30,28,.5) 0%, rgba(4,30,28,.44) 100%); }
}
.hero-wave { z-index: 3; }
/* no dark contrast layer behind hero/banner text */
.hero::after, body:not(:has(.hero)) .page-hero::before { background: none !important; }
.hero h1, .hero .hero-ta, .hero p.lead, .hero .hero-copy > p, .page-hero h1, .page-hero .hero-ta, .page-hero p, .page-hero .crumbs, .page-hero .hero-link { text-shadow: none !important; }
/* slightly less zoom on the home hero photo */
.hero, .hero .wrap { min-height: clamp(460px, 38vw, 660px); }
.hero { background-position: center bottom; }
/* show more of the top of the home hero photo, less of the bottom */
.hero { background-position: center 40%; }
/* home highlight box: deep teal */
.hero .quick { background: rgba(14, 92, 102, .6); border-color: rgba(255,255,255,.35); }
.hero .quick .qi { background: rgba(255,255,255,.18); color: #FFE9A8; }
.hero .quick-label, .hero .quick-caption { color: rgba(255,255,255,.92); }
.hero .quick-link { color: #FFE9A8; }
.hero .quick-dots button { background: rgba(255,255,255,.4); }
.hero .quick-dots button.is-active { background: #FFE9A8; }
/* blend the highlight box into the hero photo */
.hero .quick { background: rgba(14, 92, 102, .22); border-color: rgba(255,255,255,.18); box-shadow: none; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.hero .quick .qi { background: rgba(255,255,255,.14); }
/* blend the highlight box even further */
.hero .quick { background: rgba(14, 92, 102, .1); border-color: rgba(255,255,255,.1); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.hero .quick .qi { background: rgba(255,255,255,.1); }
.hero .quick h2, .hero .quick-stat, .hero .quick-label, .hero .quick-caption, .hero .quick-link { text-shadow: 0 1px 8px rgba(8,50,58,.55); }

/* Loans: flat multicolour icons, no coloured badge behind them */
.lc-ico-w{filter:none}
.lc-ico,.lc-1 .lc-ico,.lc-10 .lc-ico,.ic1 .lc-ico,.ic2 .lc-ico,.ic3 .lc-ico,.ic4 .lc-ico,.ic5 .lc-ico,.ic6 .lc-ico,.ic7 .lc-ico,.ic8 .lc-ico,.ic9 .lc-ico,.ic10 .lc-ico{background:none;border-radius:0;clip-path:none;box-shadow:none;width:72px;height:72px}
.lc-ico::before{display:none}
.lc-ico svg{width:100%;height:100%}

/* About: light split hero - text left, round photo right */
body:has(.page-hero) .page-hero { background: linear-gradient(120deg, #EAF6F4 0%, #E3F2EF 60%, #DDF0EC 100%); color: #25403C; min-height: clamp(420px, 36vw, 560px); }
body:has(.page-hero) .page-hero::before { content: ""; display: block; position: absolute; top: 50%; right: 1.4rem; transform: translateY(-50%); width: 22px; height: 240px; background: linear-gradient(#B7E0DA,#B7E0DA) center / 2px 100% no-repeat, radial-gradient(circle, #5FBFB5 3.5px, transparent 4.5px) center top / 22px 80px repeat-y; opacity: 1; pointer-events: none; z-index: 1; }
body:has(.page-hero) .page-hero::after { content: ""; display: block; position: absolute; z-index: 1; right: clamp(3rem, 6vw, 6rem); top: 50%; left: auto; width: clamp(240px, 27vw, 390px); height: clamp(240px, 27vw, 390px); transform: translateY(-50%); border-radius: 50%; background: var(--pimg) var(--ppos) / var(--psize) no-repeat, #F7E9C4; border: 8px solid #F3EDCB; box-shadow: 0 0 0 1px #E6E2BE, 0 26px 50px -22px rgba(4,30,28,.45); opacity: 1; }
body:has(.page-hero) .page-hero .wrap { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; min-height: clamp(420px, 36vw, 560px); padding-bottom: 3rem; max-width: 100%; }
body:has(.page-hero) .page-hero .wrap > * { max-width: 46%; position: relative; z-index: 2; }
body:has(.page-hero) .page-hero .crumbs, body:has(.page-hero) .page-hero .crumbs a, body:has(.page-hero) .page-hero .crumbs span { color: #5B706C; text-shadow: none; order: 0; }
body:has(.page-hero) .page-hero .hero-ta { order: 2; color: #C1121F; font-family: var(--font-display); font-size: clamp(1.25rem, 2.4vw, 1.7rem); font-weight: 500; margin: 0 0 1.1rem; text-shadow: none; }
body:has(.page-hero) .page-hero h1 { order: 1; color: #0B1F1D; font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 700; line-height: 1.2; margin: 1.2rem 0 .25em; padding-top: 0; text-shadow: none; }
body:has(.page-hero) .page-hero p:not(.hero-ta) { order: 3; color: #25403C; text-shadow: none; font-size: 1.2rem; max-width: 46ch; }
body:has(.page-hero) .page-hero .hero-link { order: 4; color: #0B5D57; border-bottom-color: rgba(11,93,87,.4); text-shadow: none; }
body:has(.page-hero) .page-hero .hero-link:hover, body:has(.page-hero) .page-hero .hero-link:focus-visible { color: #B98A22; border-color: #B98A22; }
body:has(.page-hero) .site-header, body:has(.page-hero) .site-header.is-stuck { background: rgba(255,255,255,.94) !important; background-image: none !important; box-shadow: 0 1px 0 #D9E8E5 !important; }
body:has(.page-hero) .site-header a, body:has(.page-hero) .site-header .topbar-brand, body:has(.page-hero) .site-header .nav a:not([aria-current]), body:has(.page-hero) .site-header .nav-toggle, body:has(.page-hero) .site-header .settings-toggle { color: #07403C !important; text-shadow: none !important; }
body:has(.page-hero) .site-header .nav a[aria-current="page"] { color: #0B5D57 !important; }
body:has(.page-hero) .site-header .nav .nav-cta a { background: #0B5D57 !important; color: #fff !important; }
body:has(.page-hero) .site-header .nav-toggle, body:has(.page-hero) .site-header .settings-toggle { border-color: #B7D3CE !important; }
@media (max-width: 900px) { body:has(.page-hero) .page-hero::after, body:has(.page-hero) .page-hero::before { display: none; } body:has(.page-hero) .page-hero .wrap > * { max-width: 100%; } }
body.page-about { --pimg: url("../assets/about-hero-bg3.webp?v=1"); --ppos: 79% 0; --psize: auto 108%; }
body.page-deposits { --pimg: url("../assets/deposits-hero-bg3.webp?v=1"); --ppos: 86% 50%; --psize: auto 100%; }
body.page-loans { --pimg: url("../assets/loans-hero-bg4.webp?v=1"); --ppos: 87% 50%; --psize: auto 82%; }
body.page-services { --pimg: url("../assets/services-hero-bg.webp?v=1"); --ppos: 73% 50%; --psize: auto 100%; }
body.page-rates { --pimg: url("../assets/rates-hero-bg.webp?v=1"); --ppos: 79% 50%; --psize: auto 100%; }
body.page-contact { --pimg: url("../assets/contact-hero-bg.webp?v=2"); --ppos: 74% 50%; --psize: auto 100%; }
body.page-notices { --pimg: url("../assets/notices-hero-bg.webp?v=1"); --ppos: 93% 50%; --psize: auto 100%; }
body.page-customer-corner { --pimg: url("../assets/customer-corner-hero-bg2.webp?v=1"); --ppos: 27% 50%; --psize: auto 100%; }
body:has(.page-hero) .page-hero .hero-btn { color: #07403C; background: #fff; border-color: #0B5D57; backdrop-filter: none; -webkit-backdrop-filter: none; text-shadow: none; }
body:has(.page-hero) .page-hero .hero-btn:hover, body:has(.page-hero) .page-hero .hero-btn:focus-visible { background: #0B5D57; color: #fff; border-color: #0B5D57; }
body:has(.page-hero) .page-hero .hero-cta { box-shadow: 0 10px 26px rgba(4,30,28,.18); }
body:has(.page-hero):not([class*="page-"]) { --pimg: url("../assets/bank-logo-new.png?v=1"); --ppos: 50% 50%; --psize: 52%; }
body.page-loans .page-hero::after { background-color: transparent; background-image: var(--pimg), linear-gradient(180deg,#8CC6F2 0%,#C9E4F8 45%,#F0E3D4 56%,#EAD9C6 100%); background-position: var(--ppos), 0 0; background-size: var(--psize), 100% 100%; background-repeat: no-repeat; }
body:has(.page-hero) .page-hero .wrap > :not(.crumbs):not(h1):not(.hero-ta):not(p) { order: 4; }

/* Home hero text: same colours as inner pages, photo untouched; a tight white glow hugs the letters only */
.hero::after { background: none !important; }
.hero h1, .hero .hero-ta, .hero p.lead { background: none; padding: 0; border-radius: 0; width: auto; text-shadow: 0 0 6px #fff, 0 0 12px rgba(255,255,255,.95), 0 0 22px rgba(255,255,255,.85), 0 0 36px rgba(255,255,255,.6); }
.hero h1 { color: #0B1F1D; }
.hero .hero-ta { color: #C1121F; }
.hero p.lead, .hero .hero-copy > p.lead { color: #1F2F2C; font-weight: 500; }
.hero .hero-ta, body:has(.page-hero) .page-hero .hero-ta { font-size: clamp(1.7rem, 3.2vw, 2.3rem); font-weight: 700; line-height: 1.3; }

/* Loan details: split layout */
.lc-dialog { max-width: 820px; border-radius: 10px; box-shadow: 0 30px 70px rgba(4,30,28,.45); background: #fff; }
.lcd2 { display: grid; grid-template-columns: 220px minmax(0, 1fr); min-height: 420px; }
.lcd2-side { background: var(--teal-deep, #07403C); color: #E6F1EE; padding: 2rem 1.6rem; display: flex; flex-direction: column; border-right: 4px solid var(--accent); }
.lcd2-kick { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent-light); font-weight: 700; }
.lcd2-rate { margin-top: 1.4rem; line-height: 1; display: flex; align-items: flex-start; flex-wrap: wrap; }
.lcd2-rate b { font-size: 4.2rem; font-weight: 700; color: #fff; letter-spacing: -.03em; }
.lcd2-rate i { font-style: normal; font-size: 1.6rem; margin: .5rem 0 0 .15rem; color: var(--accent-light); font-weight: 700; }
.lcd2-rate small { flex-basis: 100%; margin-top: .6rem; font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: #A5CBC4; }
.lcd2-note { margin: auto 0 0; padding-top: 1.4rem; font-size: .78rem; line-height: 1.5; color: #A5CBC4; border-top: 1px solid rgba(255,255,255,.18); }
.lcd2-main { position: relative; padding: 2rem 2.2rem 1.8rem; }
.lcd2-main h3 { margin: 0 2.4rem 0 0; font-size: 1.6rem; line-height: 1.2; color: var(--ink); }
.lcd2-ta { margin: .25rem 0 1rem; color: var(--ink-soft); }
.lcd2-desc { margin: 0 0 1.4rem; line-height: 1.65; color: var(--ink); }
.lcd2-main h4 { margin: 0 0 .6rem; padding-top: 1rem; border-top: 1px solid var(--line); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); font-weight: 700; }
.lcd2-list { list-style: none; counter-reset: l; margin: 0 0 1.2rem; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .5rem 1.6rem; }
.lcd2-list li { counter-increment: l; display: flex; gap: .7rem; font-size: .93rem; line-height: 1.4; }
.lcd2-list li::before { content: counter(l, decimal-leading-zero); flex: none; font-weight: 700; font-size: .78rem; color: var(--accent); padding-top: .12rem; }
.lcd2-docs { margin: 0 0 1.4rem; font-size: .93rem; line-height: 1.6; color: var(--ink-soft); }
.lcd2-cta { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
.lcd2-call { font-weight: 600; color: var(--teal-deep, #07403C); text-decoration: none; border-bottom: 2px solid var(--accent); padding-bottom: 1px; }
.lcd2-close { position: absolute; top: 1rem; right: 1rem; width: 34px; height: 34px; border: 1px solid var(--line); background: #fff; color: var(--ink); border-radius: 50%; font-size: 1.3rem; line-height: 1; cursor: pointer; }
.lcd2-close:hover { background: var(--teal-deep, #07403C); color: #fff; border-color: var(--teal-deep, #07403C); }
@media (max-width: 700px) { .lcd2 { grid-template-columns: 1fr; } .lcd2-side { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .6rem 1.2rem; padding: 1.2rem 1.4rem; border-right: 0; border-bottom: 4px solid var(--accent); } .lcd2-rate { margin: 0; } .lcd2-rate b { font-size: 2.6rem; } .lcd2-note { display: none; } .lcd2-list { grid-template-columns: 1fr; } }
.lcd2-main h4, .lcd2-list li::before { color: #C1121F; }
.hero .hero-actions .btn, .hero .hero-actions .btn:hover { border: 0; }

/* Home highlights card: blended into the photo, bold white text with shadow, value line in red */
.hero .quick { background: none; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.hero .quick .qi { background: none; box-shadow: none; color: #fff; }
.hero .quick-label { color: #FFE08A; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: .78rem; text-shadow: 0 2px 4px rgba(0,0,0,.75), 0 4px 18px rgba(0,0,0,.6); }
.hero .quick-stat { color: #C1121F; font-weight: 800; text-shadow: 0 0 6px #fff, 0 0 14px rgba(255,255,255,.95), 0 0 26px rgba(255,255,255,.8); }
.hero .quick-caption { color: #fff; font-weight: 700; text-shadow: 0 2px 4px rgba(0,0,0,.75), 0 4px 18px rgba(0,0,0,.6); }
.hero .quick-link { color: #FFE08A; font-weight: 700; text-shadow: 0 2px 4px rgba(0,0,0,.75), 0 4px 18px rgba(0,0,0,.6); }
.hero .quick-dots button { background: #fff; opacity: .5; }
.hero .quick-dots button.is-active { background: #FFE08A; opacity: 1; }
.hero .quick-stat { color: #B5252E; text-shadow: 0 0 8px rgba(255,255,255,.45), 0 0 18px rgba(255,255,255,.3); }
.hero .quick-label, .hero .quick-link { color: #000; text-shadow: 0 0 8px rgba(255,255,255,.55), 0 0 16px rgba(255,255,255,.3); }
.hero .quick-dots button.is-active { background: #000; }

/* Hover colour: cement grey for outline buttons (Estimate your EMI, Cancel, Open in Google Maps) and the "Send an enquiry" button */
.btn-line:hover, .btn-line:focus-visible, .cta-band .btn-mango:hover, .cta-band .btn-mango:focus-visible, body.page-rates .calc-actions .btn-line:hover { background: #B5B8BA !important; border-color: #B5B8BA !important; color: #1F2F2C !important; }

/* Board of directors: photo circle (initials show until a photo is added in assets/board/) */
.board-card { text-align: center; }
.board-avatar { position: relative; overflow: hidden; width: 104px; height: 104px; margin: 0 auto 1rem; font-size: 1.5rem; border: 3px solid #fff; box-shadow: 0 0 0 2px #E6D6A8, 0 8px 18px rgba(7,64,60,.18); }
.board-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Deposits: spec-sheet product layout */
body.page-deposits .product { display: block; padding: 0; margin-top: 1.6rem; border: 1px solid #DCE5E2; border-top: 1px solid #DCE5E2; border-radius: 10px; background: #fff; box-shadow: 0 10px 30px -18px rgba(7,64,60,.35); overflow: hidden; }
body.page-deposits .product-title { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 1.5rem; padding: 1.5rem 2rem; background: #F3F8F6; border: 0; border-bottom: 1px solid #DCE5E2; }
body.page-deposits .product-title h2 { margin: 0; font-size: 1.55rem; color: #07403C; }
body.page-deposits .product-title .ta { margin: .1rem 0 0; flex-basis: 100%; order: 2; color: var(--ink-soft); }
body.page-deposits .product-title h2 { order: 1; }
body.page-deposits .product-title .tag { order: 1; margin: 0; padding: .35rem .8rem; background: transparent; color: #0B5D57; border: 1.5px solid #0B5D57; border-radius: 4px; font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
body.page-deposits .product-title { position: relative; }
body.page-deposits .product-title h2, body.page-deposits .product-title .tag { flex: 0 0 auto; }
body.page-deposits .product-body { padding: 1.6rem 2rem 1.8rem; }
body.page-deposits .product-body > p { max-width: 70ch; margin: 0 0 1.4rem; font-size: 1.05rem; line-height: 1.7; color: var(--ink); }
body.page-deposits .product-body ul.ticks { counter-reset: t; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 3rem; margin: 0 0 1.4rem; padding: 0; }
body.page-deposits .product-body ul.ticks li { counter-increment: t; display: flex; gap: .9rem; align-items: baseline; padding: .75rem 0; border-bottom: 1px solid #E4ECE9; font-weight: 500; color: var(--ink); }
body.page-deposits .product-body ul.ticks li::before { content: counter(t, decimal-leading-zero); position: static; flex: none; width: auto; height: auto; border: 0; border-radius: 0; background: none; transform: none; font-size: .78rem; font-weight: 700; color: #C1121F; padding: 0; }
body.page-deposits .product-body .docs { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 1rem; align-items: baseline; margin: 0; padding: 1rem 0 0; background: none; border: 0; border-radius: 0; font-size: .95rem; color: var(--ink-soft); }
body.page-deposits .product-body .docs b { font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: #C1121F; }
@media (max-width: 760px) { body.page-deposits .product-title, body.page-deposits .product-body { padding: 1.2rem; } body.page-deposits .product-body ul.ticks { grid-template-columns: 1fr; } body.page-deposits .product-body .docs { grid-template-columns: 1fr; gap: .3rem; } }

/* Deposits: illustrated product cards */
body.page-deposits .product { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 0; padding: 0; margin-top: 1.6rem; border: 1px solid #E6D6A8; border-radius: 16px; background: #fff; box-shadow: 0 14px 34px -20px rgba(7,64,60,.4); overflow: hidden; }
body.page-deposits .product-title { display: block; text-align: center; padding: 1.8rem 1.4rem 1.6rem; background: #FFF6DC; border: 0; border-right: 1px solid #EFE2B8; position: relative; }
body.page-deposits .product-title::before { content: ""; display: block; width: 118px; height: 118px; margin: 0 auto 1rem; background: var(--ill) center / contain no-repeat; }
body.page-deposits .product-title h2 { margin: 0; font-size: 1.45rem; color: #07403C; }
body.page-deposits .product-title .ta { margin: .2rem 0 0; flex-basis: auto; color: #6B5A2A; }
body.page-deposits .product-title .tag { display: inline-block; margin: .9rem 0 0; padding: 0 0 .15rem; background: none; border: 0; border-bottom: 2px solid #D9A93A; border-radius: 0; color: #8E2A3A; font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
body.page-deposits .product-body { padding: 1.9rem 2.3rem 1.8rem; }
body.page-deposits .product-body > p { max-width: 62ch; margin: 0 0 1.3rem; font-size: 1.12rem; line-height: 1.65; color: #1F2F2C; }
body.page-deposits .product-body ul.ticks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem 2rem; margin: 0 0 1.4rem; padding: 0; counter-reset: none; }
body.page-deposits .product-body ul.ticks li { display: block; position: relative; padding: 0 0 0 1.5rem; border: 0; font-weight: 500; color: #1F2F2C; }
body.page-deposits .product-body ul.ticks li::before { content: ""; position: absolute; left: .1rem; top: .5em; width: 8px; height: 8px; border: 0; border-radius: 2px; background: #D9A93A; transform: rotate(45deg); font-size: 0; }
body.page-deposits .product-body .docs { display: block; margin: 0; padding: .9rem 0 0; border: 0; border-top: 2px dotted #E0D2A4; border-radius: 0; background: none; font-size: .96rem; color: #4A5A56; }
body.page-deposits .product-body .docs b { display: block; margin-bottom: .2rem; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: #8E2A3A; }
@media (max-width: 760px) { body.page-deposits .product { grid-template-columns: 1fr; } body.page-deposits .product-title { border-right: 0; border-bottom: 1px solid #EFE2B8; } body.page-deposits .product-body { padding: 1.3rem; } body.page-deposits .product-body ul.ticks { grid-template-columns: 1fr; } }
body.page-deposits #savings { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Cellipse%20cx%3D%2260%22%20cy%3D%2270%22%20rx%3D%2236%22%20ry%3D%2227%22%20fill%3D%22%23F4A6A0%22%2F%3E%3Cpath%20d%3D%22M40%2050%2036%2034%2052%2044z%22%20fill%3D%22%23E88A84%22%2F%3E%3Crect%20x%3D%2284%22%20y%3D%2262%22%20width%3D%2218%22%20height%3D%2216%22%20rx%3D%227%22%20fill%3D%22%23E88A84%22%2F%3E%3Ccircle%20cx%3D%2292%22%20cy%3D%2270%22%20r%3D%222%22%20fill%3D%22%2307403C%22%2F%3E%3Ccircle%20cx%3D%2276%22%20cy%3D%2262%22%20r%3D%223%22%20fill%3D%22%2307403C%22%2F%3E%3Crect%20x%3D%2238%22%20y%3D%2290%22%20width%3D%229%22%20height%3D%2214%22%20rx%3D%223%22%20fill%3D%22%23E88A84%22%2F%3E%3Crect%20x%3D%2272%22%20y%3D%2290%22%20width%3D%229%22%20height%3D%2214%22%20rx%3D%223%22%20fill%3D%22%23E88A84%22%2F%3E%3Crect%20x%3D%2252%22%20y%3D%2248%22%20width%3D%2218%22%20height%3D%224%22%20rx%3D%222%22%20fill%3D%22%23C9605A%22%2F%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2226%22%20r%3D%2213%22%20fill%3D%22%23F2B632%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%223%22%2F%3E%3Cpath%20d%3D%22M60%2019v14M55%2022h8M55%2028h8%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%222.600%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E"); }
body.page-deposits #current { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20x%3D%2214%22%20y%3D%2230%22%20width%3D%2292%22%20height%3D%2258%22%20rx%3D%226%22%20fill%3D%22%23fff%22%20stroke%3D%22%230B5D57%22%20stroke-width%3D%224%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%2230%22%20width%3D%2292%22%20height%3D%2214%22%20fill%3D%22%230B5D57%22%2F%3E%3Cpath%20d%3D%22M26%2058h40M26%2068h28%22%20stroke%3D%22%239CB8B3%22%20stroke-width%3D%224%22%20stroke-linecap%3D%22round%22%2F%3E%3Cpath%20d%3D%22M62%2080c6-12%2010%208%2016-4s8%204%2014-2%22%20fill%3D%22none%22%20stroke%3D%22%238E2A3A%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%3Ccircle%20cx%3D%2290%22%20cy%3D%2258%22%20r%3D%229%22%20fill%3D%22%23F2B632%22%2F%3E%3Cpath%20d%3D%22M86%2055h8M86%2059h8%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%222%22%2F%3E%3C%2Fsvg%3E"); }
body.page-deposits #fixed { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20x%3D%2218%22%20y%3D%2220%22%20width%3D%2284%22%20height%3D%2268%22%20rx%3D%224%22%20fill%3D%22%23fff%22%20stroke%3D%22%230B5D57%22%20stroke-width%3D%224%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2228%22%20width%3D%2268%22%20height%3D%2252%22%20fill%3D%22none%22%20stroke%3D%22%23F2B632%22%20stroke-width%3D%222%22%20stroke-dasharray%3D%224%203%22%2F%3E%3Cpath%20d%3D%22M34%2044h52M34%2054h36%22%20stroke%3D%22%239CB8B3%22%20stroke-width%3D%224%22%20stroke-linecap%3D%22round%22%2F%3E%3Cpath%20d%3D%22M78%2080l-6%2022%2012-7%2012%207-6-22z%22%20fill%3D%22%238E2A3A%22%2F%3E%3Ccircle%20cx%3D%2284%22%20cy%3D%2272%22%20r%3D%2214%22%20fill%3D%22%23F2B632%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%223%22%2F%3E%3Cpath%20d%3D%22m78%2072%204%204%208-9%22%20fill%3D%22none%22%20stroke%3D%22%2307403C%22%20stroke-width%3D%223.500%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }
body.page-deposits #recurring { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20x%3D%2216%22%20y%3D%2226%22%20width%3D%2288%22%20height%3D%2276%22%20rx%3D%228%22%20fill%3D%22%23fff%22%20stroke%3D%22%230B5D57%22%20stroke-width%3D%224%22%2F%3E%3Crect%20x%3D%2216%22%20y%3D%2226%22%20width%3D%2288%22%20height%3D%2222%22%20rx%3D%228%22%20fill%3D%22%238E2A3A%22%2F%3E%3Crect%20x%3D%2234%22%20y%3D%2216%22%20width%3D%228%22%20height%3D%2218%22%20rx%3D%224%22%20fill%3D%22%2307403C%22%2F%3E%3Crect%20x%3D%2278%22%20y%3D%2216%22%20width%3D%228%22%20height%3D%2218%22%20rx%3D%224%22%20fill%3D%22%2307403C%22%2F%3E%3Cg%20fill%3D%22%239CB8B3%22%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%2262%22%20r%3D%224%22%2F%3E%3Ccircle%20cx%3D%2252%22%20cy%3D%2262%22%20r%3D%224%22%2F%3E%3Ccircle%20cx%3D%2270%22%20cy%3D%2262%22%20r%3D%224%22%2F%3E%3Ccircle%20cx%3D%2288%22%20cy%3D%2262%22%20r%3D%224%22%2F%3E%3Ccircle%20cx%3D%2234%22%20cy%3D%2280%22%20r%3D%224%22%2F%3E%3Ccircle%20cx%3D%2252%22%20cy%3D%2280%22%20r%3D%224%22%2F%3E%3C%2Fg%3E%3Ccircle%20cx%3D%2276%22%20cy%3D%2282%22%20r%3D%2212%22%20fill%3D%22%23F2B632%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%223%22%2F%3E%3Cpath%20d%3D%22m70%2082%204%204%208-9%22%20fill%3D%22none%22%20stroke%3D%22%2307403C%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }
body.page-deposits #senior { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Cpath%20d%3D%22M22%20108c0-24%2016-38%2038-38s38%2014%2038%2038z%22%20fill%3D%22%230B5D57%22%2F%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2244%22%20r%3D%2222%22%20fill%3D%22%23F4C7A1%22%2F%3E%3Cpath%20d%3D%22M38%2040c0-16%2010-24%2022-24s22%208%2022%2024c-6-8-14-12-22-12s-16%204-22%2012z%22%20fill%3D%22%23D9DEE2%22%2F%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%2307403C%22%20stroke-width%3D%223%22%3E%3Ccircle%20cx%3D%2251%22%20cy%3D%2246%22%20r%3D%226%22%2F%3E%3Ccircle%20cx%3D%2269%22%20cy%3D%2246%22%20r%3D%226%22%2F%3E%3Cpath%20d%3D%22M57%2046h6%22%2F%3E%3C%2Fg%3E%3Cpath%20d%3D%22M52%2058q8%206%2016%200%22%20fill%3D%22none%22%20stroke%3D%22%238E2A3A%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%3Cpath%20d%3D%22M96%2070v38%22%20stroke%3D%22%23A0673A%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22%2F%3E%3Cpath%20d%3D%22M96%2070c0-8%2010-8%2010%200%22%20fill%3D%22none%22%20stroke%3D%22%23A0673A%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E"); }
body.page-deposits #kids { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20x%3D%2214%22%20y%3D%2268%22%20width%3D%2240%22%20height%3D%2240%22%20rx%3D%225%22%20fill%3D%22%238E2A3A%22%2F%3E%3Crect%20x%3D%2258%22%20y%3D%2268%22%20width%3D%2240%22%20height%3D%2240%22%20rx%3D%225%22%20fill%3D%22%230B5D57%22%2F%3E%3Crect%20x%3D%2236%22%20y%3D%2228%22%20width%3D%2240%22%20height%3D%2240%22%20rx%3D%225%22%20fill%3D%22%23F2B632%22%2F%3E%3Cpath%20d%3D%22M26%2088h16M34%2080v16%22%20stroke%3D%22%23fff%22%20stroke-width%3D%225%22%20stroke-linecap%3D%22round%22%2F%3E%3Ccircle%20cx%3D%2278%22%20cy%3D%2288%22%20r%3D%229%22%20fill%3D%22none%22%20stroke%3D%22%23fff%22%20stroke-width%3D%225%22%2F%3E%3Cpath%20d%3D%22M48%2052l8-14%208%2014z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M100%2022l3%207%208%201-6%205%202%208-7-4-7%204%202-8-6-5%208-1z%22%20fill%3D%22%23F2B632%22%2F%3E%3C%2Fsvg%3E"); }
body.page-deposits #locker { --ill: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20120%20120%22%3E%3Crect%20x%3D%2216%22%20y%3D%2220%22%20width%3D%2288%22%20height%3D%2280%22%20rx%3D%228%22%20fill%3D%22%23C9CED2%22%20stroke%3D%22%2307403C%22%20stroke-width%3D%224%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%2230%22%20width%3D%2268%22%20height%3D%2260%22%20rx%3D%224%22%20fill%3D%22%23E6EAED%22%20stroke%3D%22%239AA3A8%22%20stroke-width%3D%222%22%2F%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2260%22%20r%3D%2217%22%20fill%3D%22%23F2B632%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%224%22%2F%3E%3Ccircle%20cx%3D%2260%22%20cy%3D%2260%22%20r%3D%225%22%20fill%3D%22%2307403C%22%2F%3E%3Cpath%20d%3D%22M60%2043v6M60%2071v6M43%2060h6M71%2060h6%22%20stroke%3D%22%23D9951A%22%20stroke-width%3D%223%22%2F%3E%3Crect%20x%3D%2226%22%20y%3D%22100%22%20width%3D%2210%22%20height%3D%228%22%20fill%3D%22%2307403C%22%2F%3E%3Crect%20x%3D%2284%22%20y%3D%22100%22%20width%3D%2210%22%20height%3D%228%22%20fill%3D%22%2307403C%22%2F%3E%3C%2Fsvg%3E"); }

/* Deposits: list on the left, selected product shown on the right */
body.page-deposits .section > .wrap { display: grid; grid-template-columns: 250px minmax(0, 1fr); column-gap: 2rem; align-items: start; }
body.page-deposits .product-nav { grid-column: 1; grid-row: 1 / span 12; position: sticky; top: calc(var(--header-h, 54px) + 1rem); flex-direction: column; flex-wrap: nowrap; overflow: visible; gap: 0; margin: 1.6rem 0 0; padding: .4rem 0; background: #fff; border: 1px solid #E6D6A8; border-radius: 14px; box-shadow: 0 10px 28px -20px rgba(7,64,60,.4); }
body.page-deposits .product-nav a { display: block; flex: none; padding: .85rem 1.2rem .85rem 1.4rem; border: 0; border-left: 4px solid transparent; border-radius: 0; background: none; font-size: .98rem; font-weight: 600; color: #3C524E; box-shadow: none; transform: none; white-space: normal; }
body.page-deposits .product-nav a + a { border-top: 1px solid #F0E8CF; }
body.page-deposits .product-nav a:hover, body.page-deposits .product-nav a:focus-visible { background: #FFF6DC; color: #07403C; transform: none; box-shadow: none; border-color: transparent; border-left-color: #D9A93A; }
body.page-deposits .product-nav a.is-active { background: #FFF6DC; color: #07403C; border-left-color: #C1121F; font-weight: 700; box-shadow: none; }
body.page-deposits .product { grid-column: 2; grid-row: 1; grid-template-columns: 1fr; margin-top: 1.6rem; }
body.page-deposits .product-title { display: grid; grid-template-columns: 96px minmax(0, 1fr); column-gap: 1.2rem; align-items: center; text-align: left; padding: 1.4rem 2rem; border-right: 0; border-bottom: 1px solid #EFE2B8; }
body.page-deposits .product-title::before { grid-row: 1 / span 3; width: 96px; height: 96px; margin: 0; }
body.page-deposits .product-title h2, body.page-deposits .product-title .ta { grid-column: 2; }
body.page-deposits .product-title .tag { grid-column: 2; justify-self: start; margin-top: .5rem; }
@media (max-width: 900px) {
  body.page-deposits .section > .wrap { display: block; }
  body.page-deposits .product-nav { position: static; flex-direction: row; flex-wrap: nowrap; overflow-x: auto; margin: 0 0 1rem; padding: 0; border-radius: 999px; }
  body.page-deposits .product-nav a { border-left: 0; border-bottom: 3px solid transparent; white-space: nowrap; }
  body.page-deposits .product-nav a + a { border-top: 0; }
  body.page-deposits .product-nav a.is-active { border-left: 0; border-bottom-color: #C1121F; }
}
body.page-deposits .product[hidden] { display: none !important; }

/* Deposits: body content presented as lead quote, benefit tiles and a documents strip */
body.page-deposits .product-body > p { padding-left: 1rem; border-left: 4px solid #D9A93A; font-size: 1.15rem; line-height: 1.6; margin-bottom: 1.6rem; }
body.page-deposits .product-body ul.ticks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; counter-reset: b; margin-bottom: 1.5rem; }
body.page-deposits .product-body ul.ticks::before { content: "Key benefits"; grid-column: 1 / -1; font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #8E2A3A; margin-bottom: .1rem; }
body.page-deposits .product-body ul.ticks li { counter-increment: b; display: flex; align-items: center; gap: .8rem; min-height: 54px; padding: .7rem 1rem; background: #FBFDFC; border: 1px solid #DCE9E5; border-radius: 12px; font-weight: 600; color: #07403C; transition: transform .2s, box-shadow .2s, border-color .2s; }
body.page-deposits .product-body ul.ticks li:hover { transform: translateY(-2px); border-color: #0B5D57; box-shadow: 0 10px 20px -14px rgba(7,64,60,.5); }
body.page-deposits .product-body ul.ticks li::before { position: static; flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #0B5D57; color: #fff; font-size: .8rem; font-weight: 700; transform: none; content: counter(b); }
body.page-deposits .product-body .docs { display: flex; align-items: flex-start; gap: .9rem; padding: 1rem 1.2rem; border: 0; border-radius: 12px; background: #FFF6DC; font-size: .95rem; line-height: 1.55; color: #3C3A2C; }
body.page-deposits .product-body .docs::before { content: ""; flex: none; width: 26px; height: 26px; margin-top: .1rem; background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238E2A3A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2011.5l-8.5%208.5a5%205%200%200%201-7-7L14%204.500a3.500%203.500%200%200%201%205%205l-8.500%208.500a2%202%200%200%201-3-3L15%207.500%22%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; }
body.page-deposits .product-body .docs b { display: inline; margin: 0 .35rem 0 0; font-size: inherit; letter-spacing: 0; text-transform: none; color: #8E2A3A; }
body.page-deposits .product-body .docs > * , body.page-deposits .product-body .docs { }
@media (max-width: 760px) { body.page-deposits .product-body ul.ticks { grid-template-columns: 1fr; } }
body.page-deposits .product-nav { grid-row: 1; }
body.page-deposits .section > .wrap > .note { grid-column: 2; }
body.page-deposits .product-title { display: block; position: relative; min-height: 124px; padding: 1.5rem 2rem 1.5rem calc(2rem + 96px + 1.3rem); }
body.page-deposits .product-title::before { position: absolute; left: 2rem; top: 50%; transform: translateY(-50%); margin: 0; }
body.page-deposits .product-title h2, body.page-deposits .product-title .ta, body.page-deposits .product-title .tag { order: 0; }
body.page-deposits .product-title h2 { margin: 0; }
body.page-deposits .product-title .ta { margin: .15rem 0 0; }
body.page-deposits .product-title .tag { margin-top: .65rem; }
@media (max-width: 760px) { body.page-deposits .product-title { padding-left: 1.2rem; padding-top: 7.2rem; } body.page-deposits .product-title::before { left: 50%; top: 1.2rem; transform: translateX(-50%); } }

/* Inner pages (light header): visible current-page marker, readable mobile menu */
body:has(.page-hero) .site-header .nav a:hover, body:has(.page-hero) .site-header .nav a:focus-visible { background: rgba(11,93,87,.08) !important; color: #0B5D57 !important; }
body:has(.page-hero) .site-header .nav a[aria-current="page"] { background: rgba(11,93,87,.08) !important; box-shadow: inset 0 -3px 0 #0B5D57 !important; color: #0B5D57 !important; }
body:has(.page-hero) .site-header .nav .nav-cta a, body:has(.page-hero) .site-header .nav .nav-cta a:hover { background: #0B5D57 !important; color: #fff !important; box-shadow: none !important; }
@media (max-width: 1200px) {
  body:has(.page-hero) .site-header .nav { background: #fff; border-top: 1px solid #DCE9E5; box-shadow: 0 18px 30px -14px rgba(4,30,28,.35); }
  body:has(.page-hero) .site-header .nav a[aria-current="page"] { box-shadow: inset 4px 0 0 #0B5D57 !important; }
  body:has(.page-hero) .site-header .nav li + li a { border-top: 1px solid #EDF3F1; }
  body:has(.page-hero) .site-header .nav .nav-cta a { border-top: 0; }
}
body:has(.page-hero) .site-header .nav .nav-cta a[aria-current="page"] { background: #0B5D57 !important; box-shadow: inset 0 -3px 0 #fff !important; color: #fff !important; }
@media (max-width: 1200px) { body:has(.page-hero) .site-header .nav .nav-cta a[aria-current="page"] { box-shadow: inset 4px 0 0 #fff !important; } }
body:has(.page-hero) .site-header .nav .nav-cta a[aria-current="page"] { box-shadow: inset 0 -4px 0 #F2B632 !important; }
@media (max-width: 1200px) { body:has(.page-hero) .site-header .nav .nav-cta a[aria-current="page"] { box-shadow: inset 5px 0 0 #F2B632 !important; } }

/* Loan cards: no rate on the front, bigger icon centred in the empty space above the text */
.lc-rate { display: none; }
.lc-top { flex: 1; justify-content: center; align-items: center; margin-bottom: 0; }
.lc-ico, .lc-1 .lc-ico, .lc-10 .lc-ico, .ic1 .lc-ico, .ic2 .lc-ico, .ic3 .lc-ico, .ic4 .lc-ico, .ic5 .lc-ico, .ic6 .lc-ico, .ic7 .lc-ico, .ic8 .lc-ico, .ic9 .lc-ico, .ic10 .lc-ico { width: 120px; height: 120px; }

/* Loans: five cards per row */
#lc-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }
.lc { height: 380px; }
.lc-front, .lc-back { padding: 1.1rem; }
.lc-ico, .lc-1 .lc-ico, .lc-10 .lc-ico, .ic1 .lc-ico, .ic2 .lc-ico, .ic3 .lc-ico, .ic4 .lc-ico, .ic5 .lc-ico, .ic6 .lc-ico, .ic7 .lc-ico, .ic8 .lc-ico, .ic9 .lc-ico, .ic10 .lc-ico { width: 100px; height: 100px; }
.lc h3 { font-size: 1.05rem; }
@media (max-width: 1100px) { #lc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lc { height: 360px; } }
@media (max-width: 760px) { #lc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { #lc-grid { grid-template-columns: 1fr; } }
.lc { height: 335px; }
.lc-ico, .lc-1 .lc-ico, .lc-10 .lc-ico, .ic1 .lc-ico, .ic2 .lc-ico, .ic3 .lc-ico, .ic4 .lc-ico, .ic5 .lc-ico, .ic6 .lc-ico, .ic7 .lc-ico, .ic8 .lc-ico, .ic9 .lc-ico, .ic10 .lc-ico { width: 82px; height: 82px; }
@media (max-width: 1100px) { .lc { height: 335px; } }

/* Notices: compact rows */
.np-list { gap: .55rem; }
.np-list .np-row { gap: .8rem; padding: .55rem .9rem .55rem .7rem; border-left-width: 5px; border-radius: 12px; box-shadow: 0 4px 12px rgba(7,64,60,.05); }
.np-date { width: 54px; padding: .3rem .25rem; border-radius: 10px; }
.np-date b { font-size: 1.1rem; }
.np-date span { font-size: .6rem; }
.np-main .notice-tag { margin-bottom: .2rem; font-size: .66rem; padding: .12rem .55rem; }
.np-main h3 { font-size: .95rem; line-height: 1.3; }
.np-dl { padding: .35rem .8rem; font-size: .8rem; gap: .35rem; }
.np-dl svg { width: 15px; height: 15px; }
@media (max-width: 560px) { .np-date { width: 48px; } }

/* Fraud notice in the notices list */
.notice-tag-fraud { background: #C1121F; color: #fff; }
.np-list .np-row[data-category="fraud"] { --c: #C1121F; }
.np-date-alert { color: #C1121F; background: #FDF1EF; border-color: #F3D2CE; }
.np-date-alert svg { width: 24px; height: 24px; }
.np-note { margin: .25rem 0 0; font-size: .86rem; line-height: 1.45; color: var(--ink-soft); }
.cc-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 900px) { .cc-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .cc-tiles { grid-template-columns: 1fr; } }

/* Customer corner: more gold in the mix */
.cc-mist { background: #FFF8E6; }
.cc-head h2::after { background: linear-gradient(90deg, #F2B632, #0B5D57); }
.cc-tabs { background: #FBF0CF; }
.cc-tabs button:hover { background: rgba(255,255,255,.7); color: #07403C; }
.cc-tabs button.is-active { background: linear-gradient(135deg, #F7C440, #E6A622); color: #07403C; box-shadow: 0 8px 18px rgba(185,138,34,.35); }
.cc-panel { border-left-color: #F2B632; }
.cc-panel-ico { background: #FFE9A8; color: #07403C; }
.cc-num { background: linear-gradient(145deg, #F7C440, #E6A622); color: #07403C; border-color: #FFF8E6; box-shadow: 0 8px 16px rgba(185,138,34,.35); }
.cc-steps li { border-top: 3px solid #F2B632; }
.cc-steps li:not(:last-child)::after { border-top-color: rgba(217,169,58,.75); }
.cc-steps a { color: #0B5D57; text-decoration-color: #F2B632; }
.cc-drop { border-color: rgba(217,169,58,.7); background: linear-gradient(180deg, #fff, #FFF8E6); }
.cc-drop-ico { background: linear-gradient(145deg, #F7C440, #E6A622); color: #07403C; box-shadow: 0 10px 22px rgba(185,138,34,.35); }

/* Home navbar: same height as the other pages */
body:has(.hero) .site-header .wrap { padding-block: .3rem; }
body.nav-scale-lock:has(.hero) .site-header .wrap { padding-block: calc(.3rem / 1.12); }

/* Navbar: keep every menu item on one line so the bar stays slim (all pages) */
@media (min-width: 1201px) {
  .nav a { white-space: nowrap; padding-inline: .2rem; font-size: .84rem; }
  .nav li { flex: 1 1 auto; }
  .nav .nav-cta { flex: 0 0 auto; }
  .nav .nav-cta a { padding-inline: 1rem; }
}

/* KYC documents section keeps the original teal look */
#kyc .cc-head h2::after { background: linear-gradient(90deg, var(--teal), var(--accent)); }
#kyc .cc-tabs { background: #E6F1EE; }
#kyc .cc-tabs button:hover { background: rgba(255,255,255,.6); color: var(--teal-deep); }
#kyc .cc-tabs button.is-active { background: linear-gradient(135deg, var(--teal), var(--teal-deep)); color: #fff; box-shadow: 0 8px 18px rgba(7,64,60,.28); }
#kyc .cc-panel { border-left-color: var(--teal); }
#kyc .cc-panel-ico { background: var(--accent-soft); color: var(--teal); }

/* Rates page: number block + text boxes, gold on hover */
.rp-stats { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: .8rem !important; margin: -2.4rem 0 1.6rem !important; }
.rp-stat { position: relative; display: grid !important; grid-template-columns: auto 1fr; align-items: stretch; background: #fff !important; border: 1px solid #E4ECE9 !important; border-top: 1px solid #E4ECE9 !important; border-radius: 10px !important; overflow: hidden; padding: 0 !important; box-shadow: none !important; transform: none !important; transition: border-color .25s ease !important; text-align: left; }
.rp-stat:hover, .rp-stat:focus-within { transform: none !important; box-shadow: none !important; border-color: #F2B632 !important; border-top-color: #F2B632 !important; }
.rp-stat small { display: block; padding: .5rem .8rem 0; font-size: .68rem !important; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #5B706C; }
.rp-stat b { grid-row: 1 / span 3; display: grid !important; place-items: center; margin: 0 !important; padding: 0 .8rem; background: #0B5D57; color: #fff !important; font-size: 1.15rem !important; line-height: 1.1; transition: background .25s, color .25s; }
.rp-stat span { display: block; padding: 0 .8rem .5rem; font-size: .76rem !important; color: #5B706C; }
.rp-stat:hover b, .rp-stat:focus-within b { background: #F2B632; color: #07403C !important; }
.rp-stats { margin-top: -3.8rem !important; }
@media (max-width: 900px) { .rp-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; margin-top: -2.8rem !important; } }
.cta-band { background: #0A524C; }

/* Services: short description on the front, key features on click */
body.page-services .service { min-height: 230px; }
body.page-services .service .svc-short { position: relative; display: block; margin-top: .55rem; max-width: 94%; font-size: .88rem; line-height: 1.45; color: var(--ink-soft); }
body.page-services .service .svc-more ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .4rem; width: 100%; text-align: left; }
body.page-services .service .svc-more li { position: relative; padding-left: 1.15rem; font-size: .9rem; line-height: 1.4; color: #E6F1EE; }
body.page-services .service .svc-more li::before { content: ""; position: absolute; left: 0; top: .5em; width: 7px; height: 7px; border-radius: 2px; background: #F2B632; transform: rotate(45deg); }

/* Inner pages: navbar shows the page banner behind it (like Home), turns white once you scroll */
body:has(.page-hero) .site-header:not(.is-stuck) { background: transparent !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none; -webkit-backdrop-filter: none; }
body:has(.page-hero) .site-header.is-stuck { background: rgba(255,255,255,.96) !important; box-shadow: 0 1px 0 #D9E8E5, 0 8px 20px -14px rgba(4,30,28,.35) !important; }

/* White strip above the navbar */
.top-strip { height: 40px; background: #fff; border-bottom: 1px solid #E4ECE9; }

/* Top strip now holds the logo + bank name */
.top-strip { height: 68px; display: flex; align-items: center; }
.top-strip .wrap { display: flex; align-items: center; }
.top-strip .topbar-brand { color: #07403C; gap: .8rem; }
.top-strip .topbar-brand img { width: 46px; height: 46px; }
.top-strip .topbar-brand span { font-size: 1.12rem; line-height: 1.2; color: #07403C; }

/* New KCTB logo is wider than tall */
.top-strip .topbar-brand img { width: auto; height: 50px; object-fit: contain; }
.foot-brand img { width: auto !important; height: 46px !important; object-fit: contain; }
.top-strip .topbar-brand img { height: 40px; }
.foot-brand img { height: 38px !important; }

/* Aa settings button lives at the far right of the top strip */
.top-strip .wrap { justify-content: space-between; }
.top-strip .settings-menu { margin-left: auto; }
.top-strip .settings-toggle { color: #07403C; border-color: #B7D3CE; background: #fff; }
.top-strip .settings-toggle:hover, .top-strip .settings-toggle[aria-expanded="true"] { background: #E6F1EE; }

/* Internet Banking / Open Account buttons in the top strip */
.top-strip .top-actions { margin-left: auto; display: flex; align-items: center; gap: .6rem; }
.top-strip .top-settings-gap, .top-strip .top-actions + .settings-menu { margin-left: .9rem; }
.top-btn { display: inline-flex; align-items: center; padding: .5rem 1.1rem; border-radius: 999px; border: 2px solid #0B5D57; font-weight: 700; font-size: .86rem; text-decoration: none; white-space: nowrap; transition: background .2s, color .2s; }
.top-btn-line { background: transparent; color: #0B5D57; }
.top-btn-line:hover, .top-btn-line:focus-visible { background: #E6F1EE; color: #07403C; }
.top-btn-solid { background: #0B5D57; color: #fff; }
.top-btn-solid:hover, .top-btn-solid:focus-visible { background: #07403C; border-color: #07403C; color: #fff; }
@media (max-width: 700px) { .top-btn { padding: .4rem .7rem; font-size: .76rem; } .top-strip .top-actions { gap: .4rem; } .top-strip .top-actions + .settings-menu { margin-left: .5rem; } }
@media (max-width: 520px) { .top-btn-line { display: none; } .top-strip .topbar-brand span { font-size: .95rem; } }
.top-strip .settings-toggle { border: 2px solid #0B5D57; }
.top-strip .settings-toggle:hover, .top-strip .settings-toggle[aria-expanded="true"] { border-color: #0B5D57; background: #E6F1EE; }

/* Internet Banking: coming-soon tag and pop-up */
.top-btn-line { position: relative; }
.top-soon { position: absolute; top: -9px; right: 12px; padding: .08rem .5rem; border-radius: 999px; background: #F2B632; color: #07403C; font-size: .56rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; line-height: 1.4; }
.ib-dialog { border: 0; border-top: 6px solid #F2B632; border-radius: 22px; padding: 2rem 2.2rem 1.8rem; width: min(640px, calc(100% - 2rem)); background: #FFF8E6; color: #1F2F2C; box-shadow: 0 30px 70px rgba(4,30,28,.45); overflow: visible; }
.ib-dialog::backdrop { background: rgba(4,30,28,.55); backdrop-filter: blur(3px); }
.ib-dialog[open] { animation: lcpop .35s cubic-bezier(.2,.8,.2,1); }
.ib-x { position: absolute; top: 1rem; right: 1.1rem; width: 36px; height: 36px; border: 0; background: none; color: #07403C; font-size: 1.9rem; line-height: 1; cursor: pointer; border-radius: 50%; }
.ib-x:hover { background: rgba(7,64,60,.1); }
.ib-badge { display: inline-flex; align-items: center; gap: .55rem; padding: .45rem 1rem; border-radius: 999px; background: #F2B632; color: #07403C; font-size: .82rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.ib-badge i { width: 9px; height: 9px; border-radius: 50%; background: #07403C; }
.ib-dialog h3 { margin: 1rem 0 .7rem; font-size: 1.7rem; color: #07403C; line-height: 1.2; }
.ib-lead { margin: 0 0 1.1rem; font-size: 1.08rem; line-height: 1.6; color: #1F2F2C; }
.ib-chips { list-style: none; margin: 0 0 1.1rem; padding: 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.ib-chips li { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem 1rem; border: 1.5px solid #0B5D57; border-radius: 999px; background: #fff; color: #07403C; font-weight: 700; font-size: .95rem; }
.ib-chips li::before { content: "\2713"; color: #D9A93A; font-weight: 800; }
.ib-note { margin: 0 0 1.4rem; font-size: 1rem; line-height: 1.55; color: #5B6B67; }
.ib-actions { display: flex; flex-wrap: wrap; gap: .8rem; }
.ib-actions .btn { padding: .6rem 1.3rem; font-size: .95rem; }
.ib-actions .ib-close { background: #fff; }
@media (max-width: 520px) { .ib-dialog { padding: 1.6rem 1.3rem 1.4rem; } .ib-dialog h3 { font-size: 1.4rem; } }

/* ---------- Mobile fixes ---------- */
@media (max-width: 900px) {
  /* top strip: logo + name + Aa on the first row, the two buttons on a second row */
  .top-strip { height: auto; padding: .55rem 0 .6rem; }
  .top-strip .wrap { flex-wrap: wrap; gap: .55rem .6rem; }
  .top-strip .topbar-brand { flex: 1 1 0; min-width: 0; order: 1; }
  .top-strip .settings-menu { order: 2; margin-left: 0 !important; }
  .top-strip .top-actions { order: 3; flex: 1 0 100%; margin-left: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
  .top-strip .top-btn, .top-strip .top-btn-line { display: inline-flex !important; justify-content: center; padding: .5rem .6rem; font-size: .84rem; }
  .top-strip .topbar-brand span { font-size: .95rem; }
  .top-strip .topbar-brand img { height: 36px; }
  .top-soon { right: 8px; }

  /* home hero: text on a light panel, photo underneath instead of text over faces */
  .hero { background: #EAF2F0 url("../assets/home-hero-bg7.webp?v=1") center bottom / 100% auto no-repeat !important; min-height: 0; }
  .hero .wrap { min-height: 0; padding-bottom: calc(100vw * .56) !important; }
  .hero::before, .hero::after { display: none !important; }
  .hero h1, .hero .hero-ta, .hero p.lead { text-shadow: none; }
  .hero .quick { background: #0B5D57 !important; border-radius: 16px; padding: 1rem 1.2rem; top: 0; }
  .hero .quick-label, .hero .quick-link { color: #F0D48A; text-shadow: none; }
  .hero .quick-stat { color: #fff; text-shadow: none; }
  .hero .quick-caption { color: #E6F1EE; text-shadow: none; font-weight: 500; }
  .hero .quick .qi { color: #fff; }
  .hero .quick-dots button { background: #fff; }
  .hero .quick-dots button.is-active { background: #F0D48A; }
}
@media (max-width: 700px) {
  /* rate tables: scroll sideways instead of being cut off */
  .hr-sec .table-wrap, .table-wrap { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .table-wrap table { min-width: 520px; }
}
@media (max-width: 900px) {
  body:has(.hero) .site-header:not(.is-stuck) { background: #EAF2F0 !important; background-image: none !important; }
  body:has(.hero) .site-header:not(.is-stuck) .nav-toggle { color: #07403C; border-color: #9CB8B3; }
}
@media (max-width: 900px) {
  /* mobile: no family photo strip under the text */
  .hero { background: #EAF2F0 !important; }
  .hero .wrap { padding-bottom: 2rem !important; }
}

/* Home gold stat boxes: label on top at the big size, number below at the small size */
.gold-stats div { display: flex; flex-direction: column-reverse; justify-content: flex-end; }
.gold-stats span { font-size: 1.2rem; font-weight: 700; line-height: 1.2; letter-spacing: 0; text-transform: none; color: var(--teal-deep); margin: 0 0 .35rem; }
.gold-stats b { font-size: .8rem !important; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-soft); white-space: normal; line-height: 1.2; }

/* Tamil language: the page text is already Tamil, so hide the separate Tamil sub-lines that would repeat it */
html[lang="ta"] p.ta,
html[lang="ta"] .lc-ta,
html[lang="ta"] .lcd2-ta,
html[lang="ta"] .page-hero .hero-ta { display: none !important; }

/* Customer corner: downloadable forms list */
.cc-forms-list { max-width: 860px; margin: 0 auto; }
.np-date-doc { color: #0B5D57; }
.np-date-doc svg { width: 24px; height: 24px; }

/* FAQ */
.cc-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .cc-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .cc-tiles { grid-template-columns: 1fr; } }
.faq { max-width: 860px; margin: 0 auto; }
.faq-tools { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; margin-bottom: 1.1rem; }
.faq-search { flex: 1 1 240px; padding: .7rem 1rem; border: 1.5px solid #CFE0DB; border-radius: 999px; background: #fff; font: inherit; color: var(--ink); }
.faq-search:focus { outline: 2px solid #0B5D57; outline-offset: 1px; border-color: #0B5D57; }
.faq-btns { display: flex; gap: .5rem; }
.faq-btns button { padding: .55rem 1rem; border: 1.5px solid #0B5D57; border-radius: 999px; background: #fff; color: #0B5D57; font: inherit; font-weight: 600; font-size: .88rem; cursor: pointer; transition: background .2s, color .2s; }
.faq-btns button:hover { background: #0B5D57; color: #fff; }
.faq-list { display: grid; gap: .7rem; }
.faq-item { background: #fff; border: 1px solid #E4ECE9; border-left: 5px solid #D9E8E5; border-radius: 14px; box-shadow: 0 6px 16px -12px rgba(7,64,60,.35); transition: border-color .25s, box-shadow .25s; }
.faq-item[hidden] { display: none; }
.faq-item[open] { border-left-color: #F2B632; box-shadow: 0 12px 26px -16px rgba(7,64,60,.45); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; cursor: pointer; list-style: none; font-weight: 700; color: #07403C; line-height: 1.4; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; flex: none; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; border: 2px solid #0B5D57; color: #0B5D57; font-size: 1.3rem; line-height: 1; transition: transform .25s, background .25s, color .25s; }
.faq-item[open] summary::after { transform: rotate(45deg); background: #0B5D57; color: #fff; }
.faq-item summary:focus-visible { outline: 2px solid #0B5D57; outline-offset: 2px; border-radius: 12px; }
.faq-a { padding: 0 1.2rem 1.1rem; color: #3C524E; line-height: 1.65; }
.faq-a p { margin: 0; }
.faq-empty { margin: 1rem 0 0; text-align: center; color: var(--ink-soft); }
.faq-btns { flex: 0 0 auto; }
.faq-btns button { white-space: nowrap; min-width: 108px; text-align: center; }
@media (max-width: 560px) {
  .faq-search { flex: 1 1 100%; }
  .faq-btns { flex: 1 1 100%; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
  .faq-btns button { width: 100%; min-width: 0; }
}
/* FAQ icon drawn with lines so it is always exactly centred: + when closed, − when open */
.faq-item summary::after { content: ""; font-size: 0; width: 30px; height: 30px; border-radius: 50%; border: 2px solid #0B5D57; color: #0B5D57; background: linear-gradient(currentColor, currentColor) center / 12px 2px no-repeat, linear-gradient(currentColor, currentColor) center / 2px 12px no-repeat; transform: none; display: block; }
.faq-item[open] summary::after { transform: none; background-color: #0B5D57; color: #fff; background-image: linear-gradient(currentColor, currentColor); background-size: 12px 2px; background-position: center; background-repeat: no-repeat; }
.faq-item summary { align-items: center; }

/* DICGC logo above the breadcrumb on the Deposits banner */
.page-hero .dicgc-logo { order: -1; display: block; height: 64px; width: auto; max-width: 100%; margin: 0 0 .7rem; object-fit: contain; }
body:has(.page-hero) .page-hero .wrap > img.dicgc-logo { order: -1; mix-blend-mode: multiply; }
body:has(.page-hero) .page-hero .wrap > img.dicgc-logo { order: -1 !important; }
body:has(.page-hero) .page-hero .wrap > img.dicgc-logo { mix-blend-mode: normal; box-sizing: content-box; padding: 5px 8px; background: #fff; border-radius: 12px; box-shadow: 0 8px 18px -10px rgba(7,64,60,.45); height: 56px; width: auto; }
body:has(.page-hero) .page-hero .wrap > img.dicgc-logo { height: 74px; margin-top: -1.2rem; }

/* Centred, blinking "launching soon" message in the top strip */
.top-strip .wrap { position: relative; }
.top-strip .top-note { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; max-width: 36%; text-align: center; pointer-events: none; }
.top-strip .top-note span { display: inline-block; background: none; box-shadow: none; padding: 0; font-size: 1.05rem; font-weight: 800; letter-spacing: .02em; color: #0B5D57; white-space: nowrap; overflow: hidden; vertical-align: bottom; border: 0; border-right: 2px solid transparent; }
.top-strip .top-note span.is-typing { border-right-color: #0B5D57; animation: topCaret 1s step-end infinite; }
@keyframes topCaret { 0%, 100% { border-right-color: #0B5D57; } 50% { border-right-color: transparent; } }
@media (prefers-reduced-motion: reduce) { .top-strip .top-note span { animation: none; border-right-color: transparent; } }
@media (max-width: 1100px) { .top-strip .top-note { display: none; } }

/* Notices: RBI Master Direction category */
.notice-tag-master { background: #F2B632; color: #07403C; }
.np-list .np-row[data-category="master"] { --c: #F2B632; }

/* Footer credit under the copyright line */
.foot-left { display: flex; flex-direction: column; gap: .35rem; }
.foot-dev { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .3rem .5rem; font-size: .82rem; color: #A9CFC8; }
.foot-dev-ico { width: 1.05em; height: 1.05em; flex: 0 0 auto; color: #F0D48A; opacity: .85; }
.foot-dev-by { text-transform: uppercase; letter-spacing: .07em; font-size: .68rem; font-weight: 600; color: #8FBDB5; }
.foot-dev-firm { display: inline-flex; align-items: baseline; gap: .3rem; color: #F0D48A; font-weight: 700; letter-spacing: .01em; text-decoration: none; border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; }
.foot-dev-firm:hover, .foot-dev-firm:focus-visible { color: #fff; border-bottom-color: #F0D48A; }
.foot-dev-tag { font-size: .78em; font-weight: 600; opacity: .8; }