/* Things Avada's JavaScript used to do, done in CSS instead. */

/* Entrance animations: content started hidden until a script revealed it. */
.fusion-animated, [data-animationtype] { visibility: visible !important; opacity: 1 !important; animation: none !important; }

/* Mobile menu (Avada cloned the desktop menu into this holder with JS). */
.fusion-mobile-nav-holder > ul { display: none; }
.fusion-mobile-nav-holder.fusion-mobile-menu-expanded { display: block !important; }
.fusion-mobile-nav-holder.fusion-mobile-menu-expanded > ul { display: block; }
.fusion-mobile-nav-holder .mobile-nav-heading > span { display: block; padding: 0 20px; font-family: Montserrat, Arial, Helvetica, sans-serif; color: #333; }

/* Static first slide in place of Revolution Slider. */
/* Same type as the old slider: 55px light-blue "hi...", 15px white tagline, 55px semi-bold "Every Client / Matters...",
   a red and a blue button. A soft dark gradient on the left keeps the white text readable on any part of the photo. */
#sliders-container, .fusion-slider-revolution.rev_slider_wrapper { height: auto !important; min-height: 0 !important; overflow: visible !important; }
.static-hero { position: relative; background-size: cover; background-position: center center; display: flex; align-items: center; width: 100%; max-width: 100%; box-sizing: border-box; aspect-ratio: 1240 / 600; min-height: 420px; max-height: 720px; background-color: #1f2246; }
.static-hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 14, 38, .78) 0%, rgba(8, 14, 38, .55) 45%, rgba(8, 14, 38, .15) 80%); }
.static-hero-inner { position: relative; min-width: 0; box-sizing: border-box; max-width: 1170px; margin: 0 auto; padding: 40px 30px; width: 100%; font-family: Montserrat, Arial, Helvetica, sans-serif; }
.static-hero-inner .hero-hi { margin: 0; color: #4fb3f6; font-size: 55px; line-height: 1.1; font-weight: 300; }
.static-hero-inner .hero-sub { margin: 6px 0 14px; color: #fff; font-size: 15px; line-height: 1.5; font-weight: 400; letter-spacing: .5px; }
.static-hero-inner .hero-title { margin: 0 0 30px; color: #fff; font-family: Montserrat, Arial, Helvetica, sans-serif; font-size: 55px; line-height: 1.15; font-weight: 600; text-transform: none; letter-spacing: 0; }
.static-hero-inner .hero-buttons { display: flex; flex-wrap: wrap; gap: 16px; }
.static-hero-inner .hero-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 62px; padding: 0 34px; box-sizing: border-box; color: #fff; font-family: Montserrat, Arial, Helvetica, sans-serif; font-size: 18px; font-weight: 700; text-decoration: none; border-radius: 2px; }
.static-hero-inner .hero-btn-call { background: #c43c3c; min-width: 209px; }
.static-hero-inner .hero-btn-consult { background: #1877c0; min-width: 249px; }
.static-hero-inner .hero-btn:hover, .static-hero-inner .hero-btn:focus { filter: brightness(1.1); color: #fff; }
@media (max-width: 800px) {
  .static-hero { aspect-ratio: auto; min-height: 0; max-height: none; }
  .static-hero::before { background: rgba(8, 14, 38, .62); }
  .static-hero-inner { padding: 36px 20px 40px; }
  .static-hero-inner .hero-hi { font-size: 40px; }
  .static-hero-inner .hero-title { font-size: 38px; margin-bottom: 24px; }
  .static-hero-inner .hero-btn { flex: 1 1 100%; min-height: 54px; font-size: 17px; min-width: 0; }
}

/* Lead form honeypot: off-screen, never seen by people. */
.lead-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.wpcf7-response-output[hidden] { display: none; }
form.sent .wpcf7-response-output { border: 2px solid #46b450; }
form.failed .wpcf7-response-output, form.invalid .wpcf7-response-output { border: 2px solid #dc3232; }

/* Mobile menu items (Avada 7 styles these when its JS builds the menu). */
.fusion-mobile-nav-holder .fusion-mobile-menu { margin: 0; padding: 0; list-style: none; border-top: 1px solid #e5e5e5; }
.fusion-mobile-nav-holder .fusion-mobile-nav-item a { display: block; padding: 0 20px; line-height: 42px; border-bottom: 1px solid #e5e5e5; color: #333; font-family: Montserrat, Arial, Helvetica, sans-serif; font-size: 14px; }
.fusion-mobile-nav-holder .fusion-mobile-sub-item a { padding-left: 36px; }
.fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a { background: #1f2246 !important; }
.fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a, .fusion-mobile-nav-holder .fusion-mobile-current-nav-item > a .menu-text { color: #fff !important; }

/* Lazy-load placeholders are gone; never hide images waiting for a script. */
img.lazyload, img.lazyloading, .lazyload { opacity: 1 !important; visibility: visible !important; }

/* Font Awesome 4.7 icon font, self-hosted (the old sites loaded it from use.fontawesome.com). */
@font-face { font-family: 'FontAwesome'; src: url('/fonts/fa4/fontawesome-webfont.woff2') format('woff2'), url('/fonts/fa4/fontawesome-webfont.woff') format('woff'); font-weight: normal; font-style: normal; font-display: block; }
@font-face { font-family: 'fontawesome'; src: url('/fonts/fa4/fontawesome-webfont.woff2') format('woff2'), url('/fonts/fa4/fontawesome-webfont.woff') format('woff'); font-weight: normal; font-style: normal; font-display: block; }

/* Avada "100% height" containers: its JS set them to the window height minus the header, growing with the content.
   Without that JS they fall back to a fixed height and taller content spills under the header. */
.fullwidth-box.hundred-percent-height { height: auto !important; min-height: calc(100vh - 160px); }
.fullwidth-box.hundred-percent-height > .fusion-fullwidth-center-content { height: auto !important; min-height: inherit; }

/* WordPress theme page preloaders: their hide-on-load script is not carried over, so they would cover the page forever. */
#ct-loadding,.ct-loader,#preloader,.preloader,#page-preloader,.page-loader,#loader-wrapper,.site-loader{display:none!important}

/* Phone menu button: big enough to tap (44px) and dark enough to see. */
.fusion-mobile-menu-icons a, .fusion-mobile-menu-icons a.fusion-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px !important; height: 44px !important; box-sizing: border-box; margin: 0 !important; font-size: 24px !important; line-height: 1 !important; color: #1f2246 !important; border: 2px solid #1f2246; border-radius: 4px; }
.fusion-mobile-menu-icons a::before, .fusion-mobile-menu-icons a.fusion-icon::before { color: #1f2246 !important; font-size: 22px !important; }
.fusion-mobile-nav-holder .fusion-mobile-nav-item a { line-height: 46px; }

/* Text that the old theme coloured white ("color-fff"), on the homepage red and photo bands. */
.cta_area .color-fff, .cta_area .layer-text, .cta_area .first_cta-subtext, .cta_area .first_cta-subtext strong, .cta_area h3,
.trust_practices .color-fff, .trust_practices .layer-text, .trust_practices .trust-subtext, .trust_practices h3 { color: #fff !important; }
.cta_area { background-color: #c43c3c !important; }
/* Trusts band: darken the photo so white text reads on every part of it. */
.trust_practices { background-color: rgba(20, 22, 40, .82) !important; background-blend-mode: multiply !important; }

/* Service and contact page banners: a dark layer under the heading and breadcrumb. */
.fusion-page-title-bar { box-shadow: inset 0 0 0 100vmax rgba(10, 16, 40, .58) !important; }
.fusion-page-title-bar h1, .fusion-page-title-bar .fusion-breadcrumbs, .fusion-page-title-bar .fusion-breadcrumbs a, .fusion-page-title-bar .fusion-breadcrumbs span { color: #fff !important; }

/* Homepage "LEGAL AWARDS": the carousel script that revealed the logos is gone; show them as a static row. */
.awards-images .fusion-carousel, .awards-images .fusion-carousel-positioner, .awards-images .fusion-carousel-holder, .awards-images .fusion-carousel-item, .awards-images img { visibility: visible !important; opacity: 1 !important; }
.awards-images .fusion-carousel-positioner { height: auto !important; overflow: visible !important; }
.awards-images .fusion-carousel-holder { display: flex !important; flex-wrap: wrap; align-items: center; gap: 24px; width: auto !important; height: auto !important; transform: none !important; margin: 10px 0 0 !important; padding: 0 !important; }
.awards-images .fusion-carousel-item { float: none !important; width: auto !important; margin: 0 !important; list-style: none; }
.awards-images img { width: auto; max-height: 100px; }

/* Landing pages: selling points and the big consultation button on the light-blue banner. */
.top_banner_container .banner-list { background: rgba(15, 25, 60, .82); padding: 14px 18px !important; border-radius: 4px; }
.top_banner_container .banner-list .fusion-li-item-content { color: #fff !important; }
.fusion-body .fusion-button.double-color-brdr { background: #1f2246 !important; padding: 8px 20px 12px !important; }

/* Contact: the address bar is white on navy and links to Google Maps. */
.map_address p, .map_address a.map-address-link { color: #fff !important; }
.map_address a.map-address-link { text-decoration: underline; }
.map_address p { padding: 0 16px; }

/* Footer social links (replace the old gallery shortcode). */
.footer-social-links { list-style: none; margin: 0; padding: 0; }
.footer-social-links li { margin: 0 0 6px; }
.footer-social-links a { display: inline-block; padding: 6px 0; }