/*
 * Atlantic Image Defense – home hero slides (v1.15.4.19.35.451.301).
 * v451.382: order reversed – the blue light image opens the page, the data
 * centre image follows. Each mobile layer keeps the background colour of its
 * own image.
 * Panoramic images (3.18:1) replacing the former 16:9 images.
 * - Computers (992 px and wider): the image covers the slide, WebP first,
 *   JPEG for older browsers. The slide keeps its size.
 * - Tablets and phones: the slide is taller than wide, so covering it would
 *   magnify the panorama several times. The image is shown at the top (240 to
 *   360 px high depending on the width), without enlargement, and fades into the colour of its own
 *   background.
 */
.aid-home-page .aid-home-hero-crossfade-v451100123 {
    background-image: url("/assets/img/bg/home-hero-slide-2-v451301.jpg") !important;
    background-image: image-set(url("/assets/img/bg/home-hero-slide-2-v451301.webp") type("image/webp"), url("/assets/img/bg/home-hero-slide-2-v451301.jpg") type("image/jpeg")) !important;
}
.aid-home-page .aid-home-hero-crossfade-v451100123__layer--one {
    background-image: url("/assets/img/bg/home-hero-slide-2-v451301.jpg");
    background-image: image-set(url("/assets/img/bg/home-hero-slide-2-v451301.webp") type("image/webp"), url("/assets/img/bg/home-hero-slide-2-v451301.jpg") type("image/jpeg"));
}
.aid-home-page .aid-home-hero-crossfade-v451100123__layer--two {
    background-image: url("/assets/img/bg/home-hero-slide-1-v451301.jpg");
    background-image: image-set(url("/assets/img/bg/home-hero-slide-1-v451301.webp") type("image/webp"), url("/assets/img/bg/home-hero-slide-1-v451301.jpg") type("image/jpeg"));
}
@media only screen and (max-width: 991px) {
    .aid-home-page .aid-home-hero-crossfade-v451100123 { --aid-hero-band: clamp(240px, 44vw, 360px); }
    .aid-home-page .aid-home-hero-crossfade-v451100123 {
        background-color: #061c4a !important;
        background-image: linear-gradient(to bottom, rgba(6, 28, 74, 0) calc(var(--aid-hero-band) - 90px), #061c4a var(--aid-hero-band)), url("/assets/img/bg/home-hero-slide-2-mobile-v451301.webp") !important;
        background-size: 100% var(--aid-hero-band), auto var(--aid-hero-band) !important;
        background-position: center top, center top !important;
        background-repeat: no-repeat !important;
    }
    .aid-home-page .aid-home-hero-crossfade-v451100123__layer {
        background-size: 100% var(--aid-hero-band), auto var(--aid-hero-band);
        background-position: center top, center top;
        background-repeat: no-repeat;
    }
    .aid-home-page .aid-home-hero-crossfade-v451100123__layer--one {
        background-color: #061c4a;
        background-image: linear-gradient(to bottom, rgba(6, 28, 74, 0) calc(var(--aid-hero-band) - 90px), #061c4a var(--aid-hero-band)), url("/assets/img/bg/home-hero-slide-2-mobile-v451301.webp");
    }
    .aid-home-page .aid-home-hero-crossfade-v451100123__layer--two {
        background-color: #18191b;
        background-image: linear-gradient(to bottom, rgba(24, 25, 27, 0) calc(var(--aid-hero-band) - 90px), #18191b var(--aid-hero-band)), url("/assets/img/bg/home-hero-slide-1-mobile-v451301.webp");
    }
}

/*
 * v451.383: readability of the introduction text on computers. A discreet
 * dark veil sits behind the text on the left and fades out towards the
 * right, above both images and below the text. The images are unchanged.
 * Tablets and phones are not concerned: the text is set below the image band.
 */
@media only screen and (min-width: 992px) {
    .aid-home-page .aid-home-hero-crossfade-v451100123::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(5, 14, 34, 0.72) 0%, rgba(5, 14, 34, 0.62) 38%, rgba(5, 14, 34, 0.24) 58%, rgba(5, 14, 34, 0) 74%);
    }
}
