/* BROWWA pages (separate Bootstrap 5 layout, frontend/browwa/layouts/header.blade.php): phone-width fix by worker W6.
   The header row is a Bootstrap .row (margin -12px each side) placed directly in a padding-free .container-fluid,
   so every BROWWA page was 12 px wider than the screen at 320, 375 and 768 px. */
.main-header .header-bg > .row { margin-left: 0; margin-right: 0; }
/* the carousel arrows sit half outside the slider on small screens: clip them inside the slide area, not the page */
.carousel { overflow: hidden; }
img, video, iframe { max-width: 100%; }

/* B-1: DBIM / WCAG basics for the BROWWA pages */
body, h1, h2, h3, h4, h5, h6, p, a, li, td, th, button, input, textarea, select { font-family: "Noto Sans", "Noto Sans Devanagari", sans-serif; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 8px; top: -60px; z-index: 10000; padding: 10px 16px; background: #fff; color: #162f6a; font-weight: 600; border: 2px solid #162f6a; border-radius: 4px; text-decoration: underline; }
.skip-link:focus, .skip-link:focus-visible { top: 8px; outline: 3px solid #ffbf00; outline-offset: 2px; }
/* body text is left-aligned (DBIM 4.1.1); several pages justify it inline */
[style*="justify"] { text-align: left !important; }
main#main-content:focus { outline: none; }