/* =====================================================================
   BHROMI — "About BHROMI" page (route /about)
   Every size is the mock-up pixel (1224px wide picture) written as
   N * var(--u),  --u = viewport / 1224 (capped at 480px), so type,
   spacing and radii keep the exact proportions of the design.
   ===================================================================== */
body.bab-on { background: #f1f8fe; }
@media (max-width: 767px) { body.bab-on header.glass-header { display: none !important; } }

.bab {
  --u: calc(min(100vw, 480px) / 1224);
  --navy: #06064a;
  --body: #565d78;
  --blue: #0c74ec;
  --line: #e5e9ee;
  box-sizing: border-box;
  min-height: 60vh;
  padding-bottom: calc(60 * var(--u));
  background: linear-gradient(180deg, #eef8fe 0%, #f1f8fe 100%);
  font-family:"Inter","Noto Sans Bengali",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--navy);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-kerning: normal;
  -webkit-text-size-adjust: 100%;
}
.bab *, .bab *::before, .bab *::after { box-sizing: border-box; }
.bab h1, .bab h2, .bab p { margin: 0; font-family: inherit; }
.bab > * { max-width: 480px; margin-left: auto; margin-right: auto; }

/* ---------- header card ---------- */
.bab-bar { position: sticky; top: 0; z-index: 30; padding: calc(13 * var(--u)) calc(24 * var(--u)) 0; background: linear-gradient(180deg, #eef8fe 72%, rgba(238,248,254,0)); }
.bab-hd { height: calc(145 * var(--u)); display: flex; align-items: center; justify-content: space-between; padding: 0 calc(56 * var(--u)) 0 calc(55 * var(--u)); background: #fff; border-radius: calc(46 * var(--u)); box-shadow: 0 calc(4 * var(--u)) calc(34 * var(--u)) rgba(30, 90, 170, .07); }
.bab-logo { display: inline-flex; line-height: 0; }
.bab-logo img { display: block; width: calc(305 * var(--u)); height: auto; }
.bab-tools { display: flex; align-items: center; }
.bab-lang, .bab-menu { appearance: none; -webkit-appearance: none; background: none; border: 0; padding: 0; margin: 0; font: inherit; color: var(--navy); cursor: pointer; display: inline-flex; align-items: center; -webkit-tap-highlight-color: transparent; }
.bab-menu { width: calc(59.4 * var(--u)); height: calc(52.4 * var(--u)); margin-left: calc(77 * var(--u)); justify-content: center; }
.bab-menu img { display: block; width: 100%; height: 100%; }
.bab-lang img.bab-globe { width: calc(56.4 * var(--u)); height: calc(56.4 * var(--u)); }
.bab-lang b { margin-left: calc(29 * var(--u)); font-size: max(12px, calc(36 * var(--u))); font-weight: 800; line-height: 1; letter-spacing: .01em; }
.bab-lang img.bab-chev { width: calc(32.7 * var(--u)); height: auto; margin-left: calc(16 * var(--u)); }

.bab-lang:focus-visible, .bab-menu:focus-visible, .bab-logo:focus-visible { outline: 2px solid var(--blue); outline-offset: 4px; border-radius: 6px; }

.bab-pop { position: absolute; right: calc(24 * var(--u)); top: calc(13 * var(--u) + 155 * var(--u)); min-width: calc(520 * var(--u)); padding: calc(16 * var(--u)); background: #fff; border-radius: calc(40 * var(--u)); box-shadow: 0 calc(10 * var(--u)) calc(50 * var(--u)) rgba(30, 60, 120, .16); display: flex; flex-direction: column; }
.bab-pop > a, .bab-pop > button { appearance: none; -webkit-appearance: none; border: 0; background: none; font: inherit; text-align: left; text-decoration: none; color: var(--navy); font-size: calc(42 * var(--u)); font-weight: 600; padding: calc(28 * var(--u)) calc(30 * var(--u)); border-radius: calc(26 * var(--u)); display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
.bab-pop > a:hover, .bab-pop > button:hover { background: #f1f6fd; }
.bab-pop em { font-style: normal; font-size: max(12px, calc(28 * var(--u))); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--blue); margin-left: calc(30 * var(--u)); }

/* ---------- content card ---------- */
.bab-card { margin-top: calc(44 * var(--u)); margin-left: auto; margin-right: auto; width: calc(100% - 48 * var(--u)); max-width: calc(480px - 48 * var(--u)); padding: calc(56 * var(--u)) calc(69.5 * var(--u)) calc(52 * var(--u)) calc(63 * var(--u)); background: #fefefe; border-radius: calc(46 * var(--u)); box-shadow: 0 calc(4 * var(--u)) calc(34 * var(--u)) rgba(30, 90, 170, .06); }
.bab-dash { display: block; flex: none; width: calc(87 * var(--u)); height: calc(7 * var(--u)); min-height: 1.5px; border-radius: 99px; background: var(--blue); }
.bab-card h1 { margin-top: calc(30 * var(--u)); font-size: calc(88 * var(--u)); line-height: calc(100 * var(--u)); font-weight: 800; letter-spacing: -.02em; color: var(--navy); }
.bab-card p { font-size: calc(41 * var(--u)); line-height: calc(58.4 * var(--u)); font-weight: 400; color: var(--body); margin-top: calc(31.6 * var(--u)); }
.bab-card h1 + p { margin-top: calc(20 * var(--u)); }
.bab-sec { margin-top: calc(46 * var(--u)); padding-top: calc(42 * var(--u)); border-top: calc(3 * var(--u)) solid var(--line); }
.bab-sec h2 { display: flex; align-items: center; gap: calc(47 * var(--u)); font-size: calc(59 * var(--u)); line-height: calc(76 * var(--u)); font-weight: 800; letter-spacing: -.02em; color: var(--navy); }
.bab-sec h2 .bab-dash { position: relative; top: calc(4 * var(--u)); }
.bab-sec h2 + p { margin-top: calc(14 * var(--u)); }
.bab-card p.bab-tag { font-weight: 700; color: var(--blue); }

@media (min-width: 768px) {
  .bab { padding-top: calc(40 * var(--u)); }
  .bab-bar { display: none; }
  .bab-card { margin-top: 0; }
}
.bab-bn { font-weight: 700; }

/* lower sections: sized from the second mock-up (Our Vision ... Our Future) */
.bab-sec.bab-b { margin-left: calc(8 * var(--u)); margin-right: calc(-2.5 * var(--u)); margin-top: calc(34 * var(--u)); padding-top: calc(31 * var(--u)); border-top-width: calc(2.5 * var(--u)); }
.bab-b h2 { gap: calc(32 * var(--u)); font-size: calc(54 * var(--u)); line-height: calc(70 * var(--u)); }
.bab-b h2 .bab-dash { width: calc(66 * var(--u)); height: calc(6 * var(--u)); }
.bab-b h2 + p { margin-top: calc(14 * var(--u)); }
.bab-card .bab-b p { white-space: nowrap; font-size: max(12px, calc(33.4 * var(--u))); line-height: calc(49.4 * var(--u)); margin-top: calc(28 * var(--u)); }
.bab-card .bab-b h2 + p { margin-top: calc(10 * var(--u)); }

/* blue accent lines draw in (left to right) as they scroll into view */
.bab.bab-anim .bab-dash { transform: scaleX(0); transform-origin: left center; transition: transform .8s cubic-bezier(.22, .7, .2, 1); will-change: transform; }
.bab.bab-anim .bab-dash.is-in { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) { .bab.bab-anim .bab-dash { transition: none; transform: none; } }

/* v1.2.32 Bangla text: consistent weight/spacing with English */
.bab :lang(bn), .bab .bab-bn { letter-spacing: 0 !important; line-height: 1.55; }
.bab-card h1:lang(bn), .bab-sec h2:lang(bn) { line-height: 1.3; }