/* ============================================================
   BDG · the site shell (from bdg-website-design-v2/_build/src/site.css)
   The lab's sections under the kit's header, mobile menu and sticky bar.
   ============================================================ */
/* The first band reaches up under the resting header, as the kit's hero does
   (every hero already keeps --header-h of room at its top). */
#main > :first-child { margin-top: calc(-1 * var(--header-h)); }
/* The blog's heads were drawn without a header above them. */
#main > :first-child:is(.blog-head, .blog-lhead) { padding-top: calc(var(--header-h) + var(--sp-8)); }

/* The header, and the menu under it, above the sections' own layers (WebGL, sticky stages). */
.header { z-index: 40; }
.menu { z-index: 39; }
.footer__brand .wordmark img { width: auto; }   /* the kit's 44px stands (LOGO-02) */

/* The contact form says what a CTA took over (js/contact-prefill.js). */
.contact-prefill { margin: 0; line-height: 1.5; font-size: var(--fs-small); color: var(--fg-2, var(--muted)); }
.contact-prefill strong { color: var(--fg); font-weight: 500; }
.contact-prefill__clear { margin-left: 6px; padding: 0; border: 0; background: none; font: inherit; color: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.contact-prefill__clear:hover, .contact-prefill__clear:focus-visible { color: var(--fg); }