/* Shared horizontal alignment for the public navigation and page content. */
:root { --site-max-width:1600px; --site-gutter:32px; }
.wrap { width:100%; max-width:var(--site-max-width); margin-left:auto; margin-right:auto; padding-left:var(--site-gutter); padding-right:var(--site-gutter); }
@media(max-width:600px) { :root { --site-gutter:20px; } }

/* Home hero: fill the screen below the sticky header on desktop, tablet and phone.
   svh (small viewport height) keeps it from jumping when a mobile browser's toolbar hides/shows;
   100vh is the fallback for older browsers. The clamp keeps it usable on very short or very tall screens. */
:root { --header-h:150px; }
@media(max-width:600px) { :root { --header-h:132px; } }
.hero-fullscreen { display:flex; align-items:center; min-height:clamp(560px, calc(100vh - var(--header-h)), 1100px); min-height:clamp(560px, calc(100svh - var(--header-h)), 1100px); }