/* Layout fixes for techbrosaz.com (Techbros, 2026-10-19).
   Loaded last on every Elementor page, so these rules win over the captured
   Elementor CSS without editing it (that CSS lives in the Blob store). */

/* No container is wider than the box it sits in. Fixed-width containers
   (1300px: the homepage certifications card, the footer) pushed every page
   sideways on screens narrower than that. */
.e-con{max-width:100%}

/* The form and blog-grid gutters use negative margins; clip them at their own
   widget's edge instead of letting them widen the page. */
.elementor-widget-form>.elementor-widget-container,.elementor-widget-tp-blog-listout{overflow-x:clip}

/* Header fits at every width (Techbros, 2026-10-19). Elementor split the row
   26% logo / 61% nav / 15% button, which overflowed tablets by 52px, wrapped the
   menu onto two rows below 1366px, and broke "Client Portal" onto two lines. */
@media (min-width:768px){
  .elementor-43 .elementor-element.elementor-element-b7a6088{--width:auto;flex:0 0 auto}
  .elementor-43 .elementor-element.elementor-element-5ed64d7 .elementor-button{white-space:nowrap}
}
/* 768-1279: logo left; Client Portal, then the menu button, right. */
@media (min-width:768px) and (max-width:1279px){
  .elementor-43 .elementor-element.elementor-element-1f891a6{--justify-content:space-between}
  .elementor-43 .elementor-element.elementor-element-b7a6088{order:2;margin-left:auto}
  .elementor-43 .elementor-element.elementor-element-384da5c{--width:auto;order:3}
}
/* 1025-1279: the six-item menu doesn't fit on one row, so use the menu button. */
@media (min-width:1025px) and (max-width:1279px){
  .elementor-43 .elementor-element.elementor-element-d54aa7a{display:none}
  .elementor-43 .elementor-element.elementor-element-3bb41dc.elementor-hidden-desktop{display:block}
}
/* 1280+: the button takes its own width and the menu gets what's left. */
@media (min-width:1280px){
  .elementor-43 .elementor-element.elementor-element-384da5c{--width:auto;flex:1 1 0;min-width:0}
}
@media (min-width:1280px) and (max-width:1439px){
  .elementor-43 .elementor-element.elementor-element-d54aa7a{--n-menu-title-padding:6px 12px 6px 12px}
}

/* Faster page banners (2026-10-19). The Services and About banners were 427 KB
   and 531 KB background images that finished downloading only when the whole
   page did on a slow phone (17 s and 13 s). Smaller copies live in /media/hero/
   and each page preloads its banner at high priority. Selectors match
   Elementor's own rules exactly, so these win by loading later. */
.elementor-15 .elementor-element.elementor-element-08b72c8:not(.elementor-motion-effects-element-type-background),
.elementor-15 .elementor-element.elementor-element-08b72c8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("/media/hero/services-1000.webp")}
.elementor-17 .elementor-element.elementor-element-0c8a2a9:not(.elementor-motion-effects-element-type-background),
.elementor-17 .elementor-element.elementor-element-0c8a2a9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("/media/hero/about-1200.webp")}
@media (min-width:1025px){
  .elementor-17 .elementor-element.elementor-element-0c8a2a9:not(.elementor-motion-effects-element-type-background),
  .elementor-17 .elementor-element.elementor-element-0c8a2a9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("/media/hero/about-1600.webp")}
}
/* The other large Services cards (226-455 KB each) download at once on phones and compete with the banner. */
.elementor-15 .elementor-element.elementor-element-87745a7:not(.elementor-motion-effects-element-type-background),
.elementor-15 .elementor-element.elementor-element-87745a7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("/media/hero/services-card-87745a7.webp")}
.elementor-15 .elementor-element.elementor-element-294bf51:not(.elementor-motion-effects-element-type-background),
.elementor-15 .elementor-element.elementor-element-294bf51 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("/media/hero/services-card-294bf51.webp")}
.elementor-15 .elementor-element.elementor-element-e65b9a7:not(.elementor-motion-effects-element-type-background),
.elementor-15 .elementor-element.elementor-element-e65b9a7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("/media/hero/services-card-e65b9a7.webp")}
