/* Header overlap fix, phone only, this page only.

   The site header here is an Avada Layout Builder header (.fusion-tb-header),
   not #side-header, so the header rules in gq.css and gq-fold.css never
   matched anything. Two faults followed on a phone:

   1. the logo rendered at 78px inside a 99px header, and
   2. the theme pulls #main up by 30px, so the navy card started at 69px and
      slid under the header. The header sits at z-index 15, so the logo and
      its strapline printed on top of the card.

   Capping the logo and tightening the header's own padding brings the header
   back to roughly 60px, which is about where the card used to start, so
   cancelling the negative margin costs the fold nothing. The menu button
   keeps a 44px tap target. */

/* The negative margin is a tablet and phone rule in the theme, so the card
   slid under the header at every width below 1024px. */
@media (max-width:1023px){
body:has(.gq) #main{margin-top:0 !important}
}

@media (max-width:600px){

body:has(.gq) .fusion-tb-header .fusion-fullwidth{padding:6px 14px !important}
body:has(.gq) .fusion-tb-header .fusion-builder-row{margin-left:0 !important;margin-right:0 !important}
body:has(.gq) .fusion-tb-header .fusion-layout-column{margin:0 !important}
body:has(.gq) .fusion-tb-header .fusion-column-wrapper{margin:0 !important}
body:has(.gq) .fusion-tb-header .fusion-image-element{margin:0 !important;padding:0 !important}
body:has(.gq) .fusion-tb-header .fusion-image-element img,
body:has(.gq) .fusion-tb-header .fusion-imageframe img{max-height:42px !important;width:auto !important;height:auto !important}
body:has(.gq) .fusion-tb-header .awb-menu{align-self:center !important}
body:has(.gq) .fusion-tb-header .awb-menu__m-toggle{padding:9px 13px !important;height:44px !important;min-height:44px !important;min-width:44px !important;align-self:center !important}

}