/* BioInfratech — restrained production layout and typography refinements
   Loaded after existing styles so page content, brand colours and components remain intact. */
:root {
  --layout-section-space: clamp(3.25rem, 5.5vw, 5.25rem);
  --layout-content-width: 1240px;
  --layout-copy-width: 72ch;
  --layout-heading-tight: 1.12;
  --layout-body-leading: 1.72;
}

html { scroll-padding-top: 92px; }
body {
  font-family: Inter, "Source Sans 3", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: var(--layout-body-leading);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
  letter-spacing: -0.025em;
  line-height: var(--layout-heading-tight);
}
p { text-wrap: pretty; }

/* A consistent, more compact vertical rhythm for non-hero content. */
section:not([class*="hero"]):not(.hero-section) {
  padding-top: var(--layout-section-space) !important;
  padding-bottom: var(--layout-section-space) !important;
}
.container, .clients-container, .ateam-main-container,
.awhy-container, .aservice-container, .bcp-container {
  width: min(var(--layout-content-width), calc(100% - 48px));
  max-width: var(--layout-content-width);
  margin-left: auto;
  margin-right: auto;
}
.container { padding-left: 0; padding-right: 0; }

/* Tighten repeated page-section wrappers without changing their contents. */
.awhy-section, .aservice-section,
.ateam-introduction-section, .ateam-members-section,
.ateam-philosophy-section, .ateam-highlight-section,
.clients-section, .leadership-section, .standards-section,
.industries-intro, .industry-solutions, .industries-cta,
.methodology, .compliance, .manufacturing-section,
.contact-introduction, .contact-information, .contact-form-section,
.faq-section, .career-intro, .career-values, .career-opportunities,
.career-apply, .cleanroom-intro, .cleanroom-overview,
.cleanroom-scope, .cleanroom-process, .cleanroom-gallery,
.cleanroom-cta, .hospital-intro, .hospital-info, .hospital-scope,
.hospital-process, .hospital-gallery, .hospital-cta,
.laboratory-intro, .laboratory-overview, .laboratory-scope,
.laboratory-process, .laboratory-gallery, .laboratory-cta {
  padding-top: var(--layout-section-space) !important;
  padding-bottom: var(--layout-section-space) !important;
}

/* Avoid excessive gaps between headings and the content they introduce. */
.section-heading, .section-header, .industry-section-heading,
.ateam-section-header, .career-section-heading,
.cleanroom-heading, .cleanroom-process-heading,
.hospital-info-heading, .hospital-process-heading,
.laboratory-heading, .laboratory-process-heading,
.bcp-compliance-header, .awhy-header {
  margin-bottom: clamp(1.75rem, 3vw, 2.75rem) !important;
}
.section-title, .section-heading h2, .section-header h2,
.industries-intro h2, .industry-section-heading h2,
.awhy-title, .ateam-section-title, .ateam-section-header h2,
.contact-hero h1, .page-title {
  font-size: clamp(1.9rem, 3.5vw, 3.1rem);
  line-height: 1.12;
  letter-spacing: -0.035em;
}
.section-text, .section-heading p, .section-header p,
.awhy-description, .career-hero-copy > p {
  max-width: var(--layout-copy-width);
  line-height: 1.75;
}

/* Bring card layouts into a consistent rhythm. */
.downloads-grid, .knowledge-grid, .insight-grid,
.aservice-grid, .awhy-grid, .ateam-card-grid,
.career-values, .career-hero-inner, .contact-grid,
.cleanroom-overview-grid, .cleanroom-process-grid,
.hospital-info-grid, .hospital-process-grid,
.laboratory-overview-grid, .laboratory-process-grid {
  row-gap: clamp(1.1rem, 2vw, 1.75rem);
}
.download-card, .knowledge-card, .insight-card,
.aservice-card, .awhy-card, .ateam-member-card,
.career-value-card, .contact-card, .office-card,
.cleanroom-overview-card, .cleanroom-process-card,
.hospital-info-card, .hospital-process-card,
.laboratory-overview-card, .laboratory-process-card {
  min-width: 0;
}

/* Keep page banners visually strong, but prevent oversized blank vertical bands. */
.contact-hero { padding: clamp(5.5rem, 8vw, 7.25rem) 0 clamp(4rem, 6vw, 5.25rem) !important; }
.career-hero { padding-top: clamp(4.75rem, 7vw, 6rem) !important; padding-bottom: clamp(4.5rem, 6vw, 5.75rem) !important; }
.ateam-hero-section { padding-top: clamp(7rem, 10vw, 9.5rem) !important; padding-bottom: clamp(4rem, 6vw, 5.5rem) !important; }
.awhy-banner { margin-bottom: clamp(2.5rem, 4vw, 4rem) !important; }
.methodology-banner { margin-top: clamp(2rem, 3vw, 3rem) !important; margin-bottom: clamp(2rem, 3vw, 3rem) !important; }

/* More polished links and focus states, without changing the existing palette. */
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(0, 174, 239, .72);
  outline-offset: 3px;
}

@media (max-width: 900px) {
  :root { --layout-section-space: clamp(2.75rem, 6vw, 4rem); }
  .container, .clients-container, .ateam-main-container,
  .awhy-container, .aservice-container, .bcp-container {
    width: calc(100% - 40px);
  }
  .container { padding-left: 0; padding-right: 0; }
  .section-title, .section-heading h2, .section-header h2,
  .industries-intro h2, .industry-section-heading h2,
  .awhy-title, .ateam-section-title, .ateam-section-header h2,
  .contact-hero h1, .page-title { font-size: clamp(1.8rem, 5.5vw, 2.6rem); }
}
@media (max-width: 600px) {
  :root { --layout-section-space: 2.75rem; }
  body { font-size: 15.5px; line-height: 1.68; }
  .container, .clients-container, .ateam-main-container,
  .awhy-container, .aservice-container, .bcp-container {
    width: calc(100% - 32px);
  }
  .container { padding-left: 0; padding-right: 0; }
  .section-title, .section-heading h2, .section-header h2,
  .industries-intro h2, .industry-section-heading h2,
  .awhy-title, .ateam-section-title, .ateam-section-header h2,
  .contact-hero h1, .page-title { font-size: clamp(1.7rem, 7vw, 2.15rem); }
  .section-tag, .section-heading .section-tag { margin-bottom: 14px; }
  .contact-hero { padding-top: 6rem !important; padding-bottom: 3.5rem !important; }
  .career-hero { padding-top: 5.5rem !important; padding-bottom: 3.5rem !important; }
  .ateam-hero-section { padding-top: 6.5rem !important; padding-bottom: 3.5rem !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* =========================================================
   BIOINFRATECH — CONSISTENT SITE SYSTEM + MOTION
   Additive overrides: existing page content and brand colours stay intact.
========================================================= */
:root {
  --site-ink: #0A2342;
  --site-teal: #008C95;
  --site-blue: #00AEEF;
  --site-body: #526174;
  --site-line: rgba(10, 35, 66, .10);
  --site-radius: 18px;
  --site-radius-lg: 24px;
  --site-shadow: 0 12px 34px rgba(10, 35, 66, .075);
  --site-shadow-hover: 0 20px 46px rgba(10, 35, 66, .13);
  --site-ease: cubic-bezier(.2, .7, .25, 1);
}

html { scroll-behavior: smooth; scroll-padding-top: 100px; }
body { color: var(--site-body); }
main { min-width: 0; }
main section { scroll-margin-top: 100px; }

/* Consistent content width and vertical rhythm across pages */
.container, .clients-container, .ateam-main-container,
.awhy-container, .aservice-container, .bcp-container,
.cleanroom-container, .hospital-container, .laboratory-container {
  width: min(1240px, calc(100% - 48px));
  max-width: 1240px;
  margin-inline: auto;
}
section:not(.bifx5Hero):not(.career-hero):not(.contact-hero):not(.industries-hero):not(.cleanroom-hero):not(.hospital-hero):not(.laboratory-hero):not(.get-touch-banner):not(.awhy-banner):not(.ateam-hero-section):not(.methodology-banner) {
  padding-block: clamp(3.25rem, 5.2vw, 5rem) !important;
}

/* Unified type scale and readable line lengths */
h1, h2, h3, h4, h5, h6 {
  text-wrap: balance;
  letter-spacing: -.028em;
}
p, li { text-wrap: pretty; }
main h1 { font-size: clamp(2.35rem, 4.6vw, 4.25rem); line-height: 1.08; }
main h2 { font-size: clamp(1.85rem, 3.2vw, 2.8rem); line-height: 1.14; }
main h3 { line-height: 1.25; }
main p { line-height: 1.72; }
.section-heading, .section-header, .industry-section-heading,
.ateam-section-header, .career-section-heading, .clients-header,
.cleanroom-heading, .hospital-info-heading, .laboratory-heading {
  margin-bottom: clamp(1.5rem, 2.7vw, 2.4rem) !important;
}

/* Common cards: consistent borders, corners, shadows and hover response */
.download-card, .knowledge-card, .insight-card, .aservice-card,
.awhy-card, .ateam-member-card, .career-value-card, .contact-card,
.office-card, .cleanroom-overview-card, .cleanroom-process-card,
.hospital-info-card, .hospital-process-card, .laboratory-overview-card,
.laboratory-process-card, .client-logo, .career-general-opportunity,
.methodology-step, .industry-card, .service-card, .team-card {
  border-radius: var(--site-radius) !important;
  transition: transform .32s var(--site-ease), box-shadow .32s var(--site-ease),
              border-color .32s var(--site-ease), background-color .32s var(--site-ease) !important;
}
.download-card:hover, .knowledge-card:hover, .insight-card:hover,
.aservice-card:hover, .awhy-card:hover, .ateam-member-card:hover,
.career-value-card:hover, .contact-card:hover, .office-card:hover,
.cleanroom-overview-card:hover, .cleanroom-process-card:hover,
.hospital-info-card:hover, .hospital-process-card:hover,
.laboratory-overview-card:hover, .laboratory-process-card:hover,
.industry-card:hover, .service-card:hover, .team-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--site-shadow-hover);
}

/* Buttons and links should feel consistent without changing their labels */
button, .career-btn, .hero-btn, .bifx5Hero__button,
.contact-submit, .submit-btn, .download-btn, .cta-button {
  transition: transform .25s var(--site-ease), box-shadow .25s var(--site-ease),
              background-color .25s var(--site-ease), border-color .25s var(--site-ease), color .25s ease !important;
}
button:hover:not(:disabled), .career-btn:hover, .hero-btn:hover,
.bifx5Hero__button:hover, .contact-submit:hover, .submit-btn:hover,
.download-btn:hover, .cta-button:hover { transform: translateY(-2px); }
a { text-underline-offset: .2em; }

/* Shared inner-page hero/banner rhythm; backgrounds and artwork remain original */
.career-hero, .contact-hero, .industries-hero, .cleanroom-hero,
.hospital-hero, .laboratory-hero, .get-touch-banner, .awhy-banner,
.ateam-hero-section, .methodology-banner, .page-hero {
  isolation: isolate;
  overflow: hidden;
}
.career-hero, .contact-hero, .industries-hero, .cleanroom-hero,
.hospital-hero, .laboratory-hero, .get-touch-banner, .awhy-banner,
.ateam-hero-section, .page-hero {
  padding-block: clamp(3.5rem, 6.5vw, 5.75rem) !important;
}

/* Homepage hero: fit the first desktop viewport below the top strip + navigation */
.bifx5Hero {
  height: calc(100svh - 128px) !important;
  min-height: min(560px, calc(100svh - 128px)) !important;
  max-height: 900px;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  padding: 0 !important;
}
.bifx5Hero__content {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  padding: 0 5vw 138px !important;
}
.bifx5Hero__text { max-width: 750px; }
.bifx5Hero__tag { margin-bottom: clamp(14px, 1.6vw, 22px) !important; padding: 9px 17px !important; font-size: 13px !important; }
.bifx5Hero__title {
  font-size: clamp(2.55rem, 4.35vw, 4.25rem) !important;
  line-height: 1.025 !important;
  letter-spacing: -.045em !important;
}
.bifx5Hero__description {
  max-width: 660px !important;
  margin: clamp(16px, 2vw, 24px) 0 clamp(20px, 2.3vw, 28px) !important;
  font-size: clamp(15px, 1.25vw, 17px) !important;
  line-height: 1.62 !important;
}
.bifx5Hero__button { min-width: 190px !important; height: 50px !important; padding-inline: 20px !important; font-size: 14px !important; border-radius: 10px !important; }
.bifx5Hero__stats {
  position: absolute !important;
  left: 50% !important;
  bottom: 22px !important;
  transform: translateX(-50%);
  width: min(1240px, calc(100% - 9vw)) !important;
  max-width: 1240px !important;
  margin: 0 !important;
  gap: 14px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.bifx5Hero__card {
  min-height: 88px !important;
  padding: 12px 16px !important;
  border-radius: 14px !important;
}
.bifx5Hero__number { font-size: clamp(1.65rem, 2.8vw, 2.5rem) !important; line-height: 1.05 !important; }
.bifx5Hero__label { margin-top: 7px !important; font-size: clamp(11px, .95vw, 13px) !important; line-height: 1.35 !important; }
.bifx5Hero__scroll { display: none !important; }

/* Motion-ready reveals are enabled only by JS; content stays visible without JS */
.motion-item { will-change: opacity, transform; }
body.motion-ready .motion-item {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity .65s var(--site-ease), transform .65s var(--site-ease);
}
body.motion-ready .motion-item.motion-visible { opacity: 1; transform: none; }
body.motion-ready .motion-item.motion-delay-1 { transition-delay: .08s; }
body.motion-ready .motion-item.motion-delay-2 { transition-delay: .16s; }
body.motion-ready .motion-item.motion-delay-3 { transition-delay: .24s; }
@keyframes siteHeroIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.bifx5Hero__tag, .bifx5Hero__title, .bifx5Hero__description, .bifx5Hero__buttons { animation: siteHeroIn .7s var(--site-ease) both; }
.bifx5Hero__title { animation-delay: .08s; }
.bifx5Hero__description { animation-delay: .16s; }
.bifx5Hero__buttons { animation-delay: .24s; }

@media (max-width: 1100px) and (min-width: 768px) {
  .bifx5Hero { height: calc(100svh - 114px) !important; min-height: min(600px, calc(100svh - 114px)) !important; }
  .bifx5Hero__content { padding: 0 5vw 145px !important; }
  .bifx5Hero__title { font-size: clamp(2.4rem, 4.8vw, 3.6rem) !important; }
  .bifx5Hero__stats { width: calc(100% - 8vw) !important; gap: 10px !important; }
  .bifx5Hero__card { min-height: 82px !important; padding: 10px !important; }
}
@media (max-height: 780px) and (min-width: 1101px) {
  .bifx5Hero { height: calc(100svh - 128px) !important; min-height: min(540px, calc(100svh - 128px)) !important; }
  .bifx5Hero__content { padding-bottom: 120px !important; }
  .bifx5Hero__title { font-size: clamp(2.35rem, 3.7vw, 3.35rem) !important; }
  .bifx5Hero__description { margin-block: 14px 18px !important; }
  .bifx5Hero__card { min-height: 74px !important; }
  .bifx5Hero__number { font-size: 1.8rem !important; }
}
@media (max-width: 767px) {
  .container, .clients-container, .ateam-main-container, .awhy-container,
  .aservice-container, .bcp-container, .cleanroom-container,
  .hospital-container, .laboratory-container { width: calc(100% - 32px); }
  section:not(.bifx5Hero) { padding-block: 2.8rem !important; }
  main h1 { font-size: clamp(2.1rem, 9vw, 3rem); }
  main h2 { font-size: clamp(1.7rem, 7vw, 2.25rem); }
  .bifx5Hero {
    height: auto !important;
    min-height: 0 !important;
    max-height: none;
    display: block !important;
    padding: 0 0 22px !important;
  }
  .bifx5Hero__content { padding: 74px 22px 28px !important; }
  .bifx5Hero__title { font-size: clamp(2.25rem, 9.2vw, 3rem) !important; line-height: 1.04 !important; }
  .bifx5Hero__description { font-size: 15px !important; margin: 18px 0 22px !important; }
  .bifx5Hero__buttons { gap: 10px !important; }
  .bifx5Hero__button { width: 100% !important; min-width: 0 !important; height: 48px !important; }
  .bifx5Hero__stats {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    width: auto !important;
    margin: 0 18px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .bifx5Hero__card { min-height: 78px !important; padding: 12px 8px !important; }
  .bifx5Hero__number { font-size: clamp(1.55rem, 7vw, 2.1rem) !important; }
  .bifx5Hero__label { font-size: 11px !important; }
  .bifx5Hero__scroll { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  body.motion-ready .motion-item { opacity: 1 !important; transform: none !important; }
}

/* =========================================================
   ACCESSIBLE, MOBILE-FIRST UX LAYER
   Additive only: preserves original BioInfratech content and palette.
========================================================= */
.ux-skip-link {
  position: fixed;
  z-index: 100000;
  top: 12px;
  left: 12px;
  padding: 12px 16px;
  border-radius: 10px;
  background: var(--site-ink, #0A2342);
  color: #fff;
  font-weight: 700;
  transform: translateY(-160%);
  box-shadow: 0 8px 24px rgba(10, 35, 66, .2);
}
.ux-skip-link:focus { transform: translateY(0); outline: 3px solid #00AEEF; outline-offset: 3px; }
#navMenu a[aria-current="page"], #navMenu a.ux-current-page { text-decoration-thickness: 2px; text-underline-offset: 6px; }

/* Improve tap comfort and form clarity across the site. */
input, select, textarea { max-width: 100%; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  scroll-margin-top: 120px;
}
input:focus-visible, select:focus-visible, textarea:focus-visible {
  border-color: var(--site-teal, #008C95) !important;
  box-shadow: 0 0 0 4px rgba(0, 140, 149, .12);
}
button:disabled, input:disabled, select:disabled, textarea:disabled {
  cursor: not-allowed;
  opacity: .65;
}
button, [role="button"], input[type="submit"], input[type="button"] { touch-action: manipulation; }
img { height: auto; }
:target { scroll-margin-top: 112px; }

@media (max-width: 767px) {
  input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px; }
  .main-menu a, .dropdown-menu a, .mega-menu a { -webkit-tap-highlight-color: rgba(0, 140, 149, .12); }
}
@media (prefers-reduced-motion: reduce) {
}


/* Refined navigation motion: smooth, predictable dropdowns and mobile drawer. */
#navMenu .dropdown-menu,
#navMenu .mega-menu {
  transition: opacity .24s ease, transform .28s cubic-bezier(.2,.75,.25,1), visibility .24s ease;
  will-change: opacity, transform;
}
#navMenu .dropdown-menu {
  transform: translateY(10px) scale(.985);
  transform-origin: top center;
  pointer-events: none;
}
#navMenu .dropdown:hover > .dropdown-menu,
#navMenu .dropdown:focus-within > .dropdown-menu,
#navMenu .dropdown.open > .dropdown-menu {
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
#navMenu .mega-menu {
  transform: translate(-50%, 10px) scale(.99);
  transform-origin: top center;
  pointer-events: none;
}
#navMenu .mega-parent:hover > .mega-menu,
#navMenu .mega-parent:focus-within > .mega-menu,
#navMenu .mega-parent.open > .mega-menu {
  transform: translate(-50%, 0) scale(1);
  pointer-events: auto;
}
#navMenu .main-menu > li > a i { transition: transform .22s ease; }
#navMenu .dropdown:hover > a i,
#navMenu .dropdown:focus-within > a i,
#navMenu .dropdown.open > a i,
#navMenu .mega-parent:hover > a i,
#navMenu .mega-parent:focus-within > a i,
#navMenu .mega-parent.open > a i { transform: rotate(180deg); }
#navMenu a { -webkit-tap-highlight-color: rgba(0,140,149,.12); }
@media (max-width: 991px) {
  #navMenu { transition: opacity .25s ease, transform .3s cubic-bezier(.2,.75,.25,1), visibility .25s ease; }
  #navMenu .dropdown-menu,
  #navMenu .mega-menu { transition: max-height .3s ease, opacity .22s ease, transform .25s ease; }
}
@media (prefers-reduced-motion: reduce) {
  #navMenu .dropdown-menu, #navMenu .mega-menu, #navMenu .main-menu > li > a i { transition: none !important; }
}

/* FIX: keep all four homepage hero statistics inside the viewport.
   The hero stylesheet intentionally resets transform on the stats grid;
   this later, scoped rule restores the centering used by the absolute layout. */
@media (min-width: 768px) {
  .bifx5Hero {
    overflow: hidden;
  }
  .bifx5Hero > .bifx5Hero__stats {
    left: 50% !important;
    right: auto !important;
    width: min(1240px, calc(100% - 9vw)) !important;
    max-width: 1240px !important;
    margin: 0 !important;
    transform: translateX(-50%) !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    box-sizing: border-box !important;
  }
  .bifx5Hero__stats > .bifx5Hero__card {
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* Dropdowns sit flush against the navigation header; remove the visible gap. */
@media (min-width: 992px) {
  #navMenu .main-menu > li.dropdown,
  #navMenu .main-menu > li.mega-parent { position: relative; }
  #navMenu .dropdown-menu { top: 100% !important; margin-top: 0 !important; }
  #navMenu .mega-menu { top: 100% !important; margin-top: 0 !important; }
  #navMenu .dropdown:hover > .dropdown-menu,
  #navMenu .dropdown:focus-within > .dropdown-menu,
  #navMenu .dropdown.open > .dropdown-menu { transform: translateY(0) scale(1); }
  #navMenu .mega-parent:hover > .mega-menu,
  #navMenu .mega-parent:focus-within > .mega-menu,
  #navMenu .mega-parent.open > .mega-menu { transform: translate(-50%, 0) scale(1); }
}

/* Mobile drawer: align flush with the bottom edge of the fixed header.
   Older navigation rules left a vertical offset on some viewport widths. */
@media (max-width: 991px) {
  #navMenu {
    top: 114px !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    transform: translateY(0) !important;
    box-sizing: border-box !important;
    height: calc(100dvh - 114px) !important;
    max-height: calc(100dvh - 114px) !important;
  }
  #navMenu.active {
    transform: translateY(0) !important;
  }
}
@media (max-width: 480px) {
  #navMenu {
    top: 94px !important;
    height: calc(100dvh - 94px) !important;
    max-height: calc(100dvh - 94px) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  #navMenu { transition: none !important; }
}

/* Mobile hero: remove the oversized blank gap above the tagline. */
@media (max-width: 767px) {
  .bifx5Hero__content {
    padding-top: 12px !important;
  }
  .bifx5Hero__text {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  .bifx5Hero__tag {
    position: relative !important;
    top: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 18px !important;
  }
}


/* Checkbox sizing fix: prevent native controls from stretching on mobile. */
input[type="checkbox"] {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  max-width: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  margin-right: 2px;
  flex: 0 0 18px !important;
  align-self: flex-start;
  accent-color: #008C95;
  cursor: pointer;
}
input[type="checkbox"] + label,
label:has(> input[type="checkbox"]) {
  line-height: 1.5;
}
@media (max-width: 767px) {
  input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    flex-basis: 18px !important;
    margin-top: 3px;
  }
}


/* Final mobile header-to-hero alignment: remove the blank band below the fixed header.
   The top strip (34px) and mobile navbar (~50px) occupy about 84px in total. */
@media (max-width: 767px) {
  body {
    padding-top: 84px !important;
  }
  #header {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    min-height: 0 !important;
  }
  #hero {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  #hero > .bifx5Hero,
  .bifx5Hero {
    margin-top: 0 !important;
  }
}