/* Page width. Loaded last, after webhost.css.

   The header (layout_default.html.twig line 88) and the main area (line 188) are both a plain
   Bootstrap .container, so this one rule sizes the whole page and keeps the two locked together
   at 90% of the viewport. There is no breakpoint ladder: a single percentage cannot disagree
   with itself between the header and the content.

   max-width is reset because Bootstrap pins .container to 540/720/960/1140/1320px. Loading after
   vendor.css, these equal-specificity rules win.

   #wrapper (line 196) sets no width of its own - it fills its column - so it follows the
   container automatically. */

/* Content pages that have the client sidebar keep the 75% column, because the main column is
   sharing the row with the sidebar. The homepage has no sidebar, so its column is dropped to
   full width in the markup instead of being centred and inset. */
.container {
    width: 90%;
    max-width: none;
}

/* Keep the header aligned with the content edges.
   The header nests .container (line 88) > .navbar (line 91) > .container-fluid (line 92). Both
   containers carry Bootstrap's horizontal gutter (--bs-gutter-x / 2 = .75rem), so the nav content
   lands 1.5rem in from the container edge, while the main .row below gets a single gutter (the
   row's negative margin cancels the column padding). The result is the logo and menu sitting
   ~.75rem to the right of the content edge.
   Zeroing the inner gutters makes the nav content box identical to the container content box. */
.navbar > .container-fluid {
    padding-left: 0;
    padding-right: 0;
}

/* Site-wide 110% appearance. This is the CSS equivalent of the browser's 110% zoom: the whole
   page (fonts, fixed-px hero grid, images, borders) renders 10% larger, which is the look the
   owner liked at 110% zoom. `zoom` is supported in Chromium, Safari and Firefox 126+. A visitor
   zooming the browser adds on top of this scale. */
html {
    zoom: 1.1;
}