/* =====================================================================
   BHROMI - desktop layout for About / Terms / Privacy / Cancellation / Contact / Help Centre (>=1024px)
   These pages reuse the mobile "About" card (.bab / .bab-card / .bab-sec / .bab-dash, + .bpv).
   On desktop the card is widened to 960px and sizes are fixed (not scaled by --u).
   Below 1024px nothing here applies. Loaded last in index.html.
   ===================================================================== */
@media (min-width: 1024px) {
  body .bab { --u: .4px; padding: 40px 32px 64px; min-height: 60vh; }
  body .bab > * { max-width: 960px; }

  body .bab-card { width: 100%; max-width: 960px; margin: 0 auto; padding: 48px 56px; border-radius: 24px; box-shadow: 0 10px 36px rgba(30, 90, 170, .09), 0 1px 3px rgba(30, 90, 170, .06); }

  /* blue accent lines scale with the headings */
  body .bab-dash { width: 56px; height: 5px; min-height: 0; }
  body .bab-sec h2 .bab-dash, body .bab-b h2 .bab-dash { width: 36px; height: 4px; top: 2px; }

  /* titles */
  body .bab-card h1 { margin-top: 24px; font-size: 40px; line-height: 1.2; letter-spacing: -.02em; }
  body .bab-sec, body .bab-sec.bab-b { margin: 36px 0 0; padding-top: 32px; border-top: 2px solid var(--line); }
  body .bab-sec h2, body .bab-b h2 { gap: 16px; font-size: 24px; line-height: 1.3; }

  /* body copy: 16.5px / 1.7, ~80 characters per line */
  body .bab-card p, body .bpv .bab-card .bab-b p, body .bab-card .bab-b p { font-size: 16.5px; line-height: 1.7; margin-top: 18px; white-space: normal; max-width: 68ch; }
  body .bab-card h1 + p { margin-top: 18px; }
  body .bab-sec h2 + p, body .bab-b h2 + p, body .bpv .bab-card .bab-b h2 + p, body .bab-card .bab-b h2 + p { margin-top: 14px; }
  body .bab-card p.bab-tag { font-size: 18px; line-height: 1.5; font-weight: 700; max-width: none; }
  body .bpv .bab-card p.bpv-upd { margin-top: 10px; font-size: 14px; line-height: 1.6; max-width: none; }
  body .bpv .bpv-intro { margin-top: 6px; }
  body .bpv .bpv-intro p { font-size: 16.5px; line-height: 1.7; }

  /* sub-headings, lists */
  body .bpv .bpv-sub { margin: 28px 0 0; font-size: 18px; line-height: 1.4; }
  body .bpv .bpv-sub + p, body .bpv .bpv-sub + ul { margin-top: 12px; }
  body .bpv .bpv-ul { margin: 16px 0 0; }
  body .bpv .bpv-ul li { padding-left: 32px; margin-top: 10px; font-size: 16.5px; line-height: 1.7; max-width: 68ch; }
  body .bpv .bpv-ul li:first-child { margin-top: 0; }
  body .bpv .bpv-ul li::before { left: 8px; top: 10.5px; width: 8px; height: 8px; min-width: 0; min-height: 0; }
  body .bpv .bpv-ol li { padding-left: 44px; }
  body .bpv .bpv-ol li::before { left: 0; top: 1px; width: 26px; height: 26px; font-size: 13px; }

  /* in-text links */
  body .bpv a.bpv-lk { text-underline-offset: 3px; transition: color .15s, text-decoration-thickness .15s; }
  body .bpv a.bpv-lk:hover { color: #0856b8; text-decoration-thickness: 2px; }

  /* Contact / Related cards */
  body .bpv .bct-list { margin-top: 20px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  body .bpv .bct-list:has(a[href^="tel:"]), body .bpv .bct-list:has(.bct-row:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  body .bpv .bct-row { min-height: 72px; gap: 14px; padding: 12px 16px; border-width: 1.5px; border-radius: 16px; transition: background .15s, border-color .15s, transform .15s, box-shadow .15s; }
  body .bpv .bct-row:hover { background: #eaf3fd; border-color: #b9d4f5; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(30, 90, 170, .10); }
  body .bpv .bct-ic { width: 46px; height: 46px; }
  body .bpv .bct-tx b { font-size: 17px; line-height: 1.35; letter-spacing: -.01em; }
  body .bpv .bct-tx small { font-size: 14.5px; line-height: 1.4; overflow-wrap: break-word; word-break: normal; }
  body .bpv .bct-go { font-size: 24px; }

  /* Help Centre FAQ */
  body .bpv .bhc-faq { margin-top: 20px; gap: 12px; }
  body .bpv .bhc-q { border-width: 1.5px; border-radius: 14px; transition: background .15s, border-color .15s; }
  body .bpv .bhc-q:hover { border-color: #cfe2f8; }
  body .bpv .bhc-q summary { min-height: 56px; gap: 20px; padding: 12px 22px; font-size: 16px; line-height: 1.45; transition: background .15s; }
  body .bpv .bhc-q summary:hover { background: #eaf3fd; }
  body .bpv .bhc-q summary i { width: 11px; height: 11px; border-right-width: 2.5px; border-bottom-width: 2.5px; margin-bottom: 4px; }
  body .bpv .bhc-q[open] summary i { margin-bottom: -4px; }
  body .bpv .bab-card .bab-b .bhc-q p { margin: 0; padding: 0 22px 22px; max-width: 72ch; }
}
