/* BGT 2026 - cross-widget device safety */
.bgt-hero,
.bgt-trust-strip,
.bgt-commercial-bridge,
.bgt-product-entry,
.bgt-commercial-flow,
.bgt-buyer-journey,
.bgt-buyer-led-nav,
.bgt-quality-compliance,
.bgt-procurement-confidence,
.bgt-how-berkeley-works,
.bgt-our-approach,
.bgt-company-credibility,
.bgt-company-glance,
.bgt-bulk-quote,
.bgt-inner-page-hero,
.bgt-business-proof-strip {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

@supports not (overflow: clip) {
  .bgt-hero,
  .bgt-trust-strip,
  .bgt-commercial-bridge,
  .bgt-product-entry,
  .bgt-commercial-flow,
  .bgt-buyer-journey,
  .bgt-buyer-led-nav,
  .bgt-quality-compliance,
  .bgt-procurement-confidence,
  .bgt-how-berkeley-works,
  .bgt-our-approach,
  .bgt-company-credibility,
  .bgt-company-glance,
.bgt-bulk-quote,
.bgt-inner-page-hero,
.bgt-business-proof-strip { overflow-x: hidden; }
}

.bgt-hero *,
.bgt-trust-strip *,
.bgt-commercial-bridge *,
.bgt-product-entry *,
.bgt-commercial-flow *,
.bgt-buyer-journey *,
.bgt-buyer-led-nav *,
.bgt-quality-compliance *,
.bgt-procurement-confidence *,
.bgt-how-berkeley-works *,
.bgt-our-approach *,
.bgt-company-credibility *,
.bgt-company-glance *,
.bgt-bulk-quote *,
.bgt-inner-page-hero *,
.bgt-business-proof-strip * {
  box-sizing: border-box;
}

.bgt-hero img,
.bgt-quality-compliance img,
.bgt-product-entry img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 480px) {
  .bgt-hero,
  .bgt-trust-strip,
  .bgt-commercial-bridge,
  .bgt-product-entry,
  .bgt-commercial-flow,
  .bgt-buyer-journey,
  .bgt-buyer-led-nav,
  .bgt-quality-compliance,
  .bgt-procurement-confidence,
  .bgt-how-berkeley-works,
  .bgt-our-approach,
  .bgt-company-credibility,
  .bgt-company-glance,
.bgt-bulk-quote,
.bgt-inner-page-hero,
.bgt-business-proof-strip {
    overflow-wrap: anywhere;
  }
}


/* BGT v25 — global header-width synchronisation.
   All widget backgrounds remain full width. Only their inner content containers
   are locked to the same measured width used by the hero/header. !important is
   intentional so older Elementor instances saved with the former 1250px value
   are corrected immediately without rebuilding each page. */
:root {
  --bgt-site-header-width: 1340px;
}

.bgt-hero__container,
.bgt-trust-strip__container,
.bgt-commercial-bridge__container,
.bgt-product-entry__container,
.bgt-commercial-flow__container,
.bgt-buyer-journey__container,
.bgt-buyer-led-nav__container,
.bgt-quality-compliance__container,
.bgt-procurement-confidence__container {
  width: 100% !important;
  max-width: var(--bgt-site-header-width, 1340px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep the exact header alignment on laptops while avoiding accidental overflow. */
@media (max-width: 1340px) {
  .bgt-hero__container,
  .bgt-trust-strip__container,
  .bgt-commercial-bridge__container,
  .bgt-product-entry__container,
  .bgt-commercial-flow__container,
  .bgt-buyer-journey__container,
  .bgt-buyer-led-nav__container,
  .bgt-quality-compliance__container,
  .bgt-procurement-confidence__container {
    max-width: 100% !important;
  }
}