/* Shared contact strip and navigation: the same persistent rows on every page. */
:root {
  --contact-strip-height: calc(32px + env(safe-area-inset-top, 0px));
  --navigation-height: 80px;
  scroll-padding-top: calc(var(--contact-strip-height) + var(--navigation-height) + 16px);
}
.utility {
  position: sticky;
  top: 0;
  z-index: 41;
  padding-block-start: env(safe-area-inset-top, 0px);
}
body > header { top: var(--contact-strip-height); }
@media (max-width: 1200px) {
  .js-ready #navigation {
    max-height: calc(100dvh - var(--contact-strip-height) - var(--navigation-height));
  }
  html:not(.js-ready) body > header { top: 0; }
}
@media (max-width: 960px) {
  :root { --contact-strip-height: calc(44px + env(safe-area-inset-top, 0px)); }
}
@media (max-width: 760px) {
  .js-ready #navigation {
    max-height: calc(100dvh - var(--contact-strip-height) - var(--navigation-height) - 60px - env(safe-area-inset-bottom, 0px));
  }
}
@media (max-width: 600px) {
  :root { --navigation-height: 64px; }
}