/* BRENNER v67 — intermediate viewport architecture */

/* 641–900 px: restore the intended compact footer architecture that is
   currently overridden later in home.css. Mobile <=640 remains untouched. */
@media (min-width:641px) and (max-width:900px){
  .brenner-footer__container{
    width:min(calc(100% - 48px),1360px)!important;
  }
  .brenner-footer__main{
    grid-template-columns:minmax(0,205px) minmax(0,1fr)!important;
    column-gap:32px!important;
    row-gap:24px!important;
    min-width:0!important;
    padding:28px 0 24px!important;
  }
  .brenner-footer__brand,
  .brenner-footer__nav,
  .brenner-footer__company{min-width:0!important;}
  .brenner-footer__brand img{width:195px!important;max-width:100%!important;}
  .brenner-footer__nav{
    grid-template-columns:repeat(2,minmax(0,110px))!important;
    column-gap:24px!important;
    justify-self:end!important;
    justify-content:end!important;
  }
  .brenner-footer__company{
    grid-column:1/-1!important;
    justify-self:stretch!important;
    width:100%!important;
    max-width:none!important;
    overflow-wrap:anywhere!important;
  }
}

/* 901–1280 px: compact desktop footer. The v66 desktop tracks
   (260px + 1fr + 455px + 2x82px gap) have a min-content width that
   exceeds common laptop viewports and expands the whole document. */
@media (min-width:901px) and (max-width:1280px){
  .brenner-footer__container{
    width:calc(100% - 64px)!important;
    max-width:1360px!important;
  }
  .brenner-footer__main{
    grid-template-columns:minmax(0,190px) minmax(216px,1fr) minmax(280px,340px)!important;
    column-gap:24px!important;
    min-width:0!important;
  }
  .brenner-footer__brand,
  .brenner-footer__nav,
  .brenner-footer__company{min-width:0!important;}
  .brenner-footer__brand img{width:190px!important;max-width:100%!important;}
  .brenner-footer__nav{
    grid-template-columns:repeat(2,100px)!important;
    column-gap:16px!important;
    justify-self:center!important;
    justify-content:center!important;
  }
  .brenner-footer__company{
    justify-self:end!important;
    width:100%!important;
    max-width:340px!important;
    overflow-wrap:anywhere!important;
  }
}

/* Company proof / USP panel: at laptop widths the absolute element is
   positioned against the padding box, so left:0/right:0 visually erases
   the page gutter. Re-introduce a real viewport-safe gutter. */
@media (min-width:641px) and (max-width:980px){
  .company-container .proof-grid{
    left:24px!important;
    right:24px!important;
    padding-left:28px!important;
    padding-right:28px!important;
  }
  .company-container .proof-grid>div{padding-left:32px!important;padding-right:32px!important;}
  .company-container .proof-grid>div:first-child{padding-left:0!important;}
  .company-container .proof-grid>div:last-child{padding-right:0!important;}
}
@media (min-width:981px) and (max-width:1280px){
  .company-container .proof-grid{
    left:32px!important;
    right:32px!important;
    padding-left:28px!important;
    padding-right:28px!important;
  }
  .company-container .proof-grid>div{padding-left:36px!important;padding-right:36px!important;}
  .company-container .proof-grid>div:first-child{padding-left:0!important;}
  .company-container .proof-grid>div:last-child{padding-right:0!important;}
}

/* Contact department addresses: v66 jumps back to four columns above
   1100px; the max-content email strings then cross card boundaries. */
@media (min-width:641px) and (max-width:1280px){
  .dept-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .dept-grid>a{
    grid-template-columns:42px minmax(0,1fr)!important;
    justify-content:stretch!important;
    min-width:0!important;
  }
  .dept-grid>a>div{min-width:0!important;}
  .dept-grid b{
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}

/* PDP/catalog content: 45 real product pages explicitly reset the shared
   catalog gutter to padding:0 and only restore it below 1100px. This leaves
   the 1101–1280 laptop band flush to both viewport edges. */
@media (min-width:801px) and (max-width:1280px){
  .catalog-wrap{
    width:100%!important;
    max-width:1296px!important;
    padding-left:32px!important;
    padding-right:32px!important;
    box-sizing:border-box!important;
  }
}