/* Aeroquest Mapcon - site-specific styles (loaded after site.css). */

/* ---------------------------------------------------------------------------
   Banner height
   Banners with a title (About, Contact) get their height from the title block.
   Image-only banners (every other page, including Home) use that same block
   height as a minimum, so all banners match. The banner's own padding comes
   from site.css and is added on top: 335px on desktop, 80px on short screens.
     title block: 172px normally, 114px on phones (640px and narrower)
     banner total: 507px normally, 449px on phones
   --------------------------------------------------------------------------- */
.collection-type-page .banner-thumbnail-wrapper:not(.has-description){min-height:172px}
@media only screen and (max-width:640px){
  .collection-type-page .banner-thumbnail-wrapper:not(.has-description){min-height:114px}
}

/* ---------------------------------------------------------------------------
   Home page
   --------------------------------------------------------------------------- */
.home-tagline{max-width:956px;margin:0 auto;padding:45px 32px 0;text-align:center;box-sizing:border-box}
.home-tagline h1{margin:0;padding:0;font-family:"Manrope Text","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;font-style:normal;text-transform:none;text-rendering:auto;color:#23284d}
/* Intro paragraph sits closer to the tagline: about 2 lines up on desktop, less on smaller screens.
   28.8px = one line of the paragraph (18px text at 1.6 line height). */
.homepage #page{padding-top:43.4px}
@media only screen and (max-width:767px){.homepage #page{padding-top:41.4px}}
@media only screen and (max-width:640px){.homepage #page{padding-top:32.8px}}

/* Service tiles: a picture with its title above. On hover or keyboard focus the
   dark-blue back (footer colour, white text) fades in over the picture.
   The whole tile is one link. */
.fade-tile{max-width:900px;margin:0 auto 20px}
.fade-tile-link{display:block;color:inherit;text-decoration:none;border:0}
.fade-tile-inner{position:relative;width:100%;aspect-ratio:1000/333}
.fade-tile-face{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}
.fade-tile-front img{display:block;width:100%;height:100%;object-fit:cover}
.fade-tile-back{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 24px;background-color:#23274f;opacity:0;transition:opacity .5s ease-out}
.fade-tile-back .sqs-html-content,.fade-tile-back .sqs-html-content p{color:#fff;margin:0}
.fade-tile-link:hover .fade-tile-back,.fade-tile-link:focus-visible .fade-tile-back{opacity:1}
@media (prefers-reduced-motion:reduce){.fade-tile-back{transition:none}}