/*
 * Atlantic Image Defense – homepage band "Silence does not close a case"
 * (v1.15.4.19.35.451.293; v451.295: placed just below the legal and institutional
 * references, full window width, new background image; v451.296: image at
 * its own proportions, no zoom; v451.297: wide banner image across the top,
 * band at the height of its content; v451.298: new image covering the band,
 * band at the image's proportions on wide screens). Self-contained: every rule is scoped to
 * .aid-home-commitment and nothing else on the page is affected.
 */

html body .aid-home-commitment {
    position: relative;
    overflow: hidden;
    /* v451.295: the band sits inside the institutional section container and
       breaks out of it to span the full window width. */
    width: auto;
    margin: 34px calc(50% - 50vw) 34px;
    padding: 48px max(16px, calc(50vw - 50%)) 48px;
    background-color: #06101a;
    color: #fff;
    /* v451.298: the band is at least as tall as the image at the window
       width (6766 x 2169), and the content is centred vertically: the image
       fills the band without empty space above or below. */
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* v451.299: capped at 500 px so that wide desktop monitors do not get
       large empty areas above and below the content; the image is then
       cropped top and bottom instead of growing the band. */
    min-height: min(calc(100vw * 2169 / 6766), 500px);
}

/* v451.298: the image covers the whole band. On wide screens the band has
   the image's own proportions, so the image is shown at the window width
   without being enlarged; when the text needs more height (tablets), it is
   enlarged just enough to leave no empty strip. */
html body .aid-home-commitment::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: url("/assets/img/home/case-commitment-v451298.jpg");
    background-image: image-set(url("/assets/img/home/case-commitment-v451298.webp") type("image/webp"), url("/assets/img/home/case-commitment-v451298.jpg") type("image/jpeg"));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    pointer-events: none;
}

html body .aid-home-commitment::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(100deg, rgba(4, 11, 19, .82) 0%, rgba(5, 13, 22, .55) 46%, rgba(6, 16, 26, 0) 100%);
    pointer-events: none;
}

html body .aid-home-commitment > .container {
    position: relative;
    z-index: 2;
}



/* The public refinement layer gives every .container its gutter with
   !important; inside the band the gutter is already in the band's own
   padding, so the inner container is reset within that same layer. */
@layer aid-refine {
    html body.aid-context-public .aid-home-commitment > .container {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}

html body .aid-home-commitment__kicker {
    display: block;
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: #ffb366;
}

html body .aid-home-commitment h2 {
    max-width: none;
    margin: 0 0 16px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 46px;
    font-weight: 700;
    line-height: 1.1;
    color: #fff;
}

html body .aid-home-commitment__lead {
    max-width: 980px;
    margin: 0;
    font-size: 17px;
    line-height: 1.6;
    color: #e3ebf2;
}

html body .aid-home-commitment__pillars {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    width: 100%;
    max-width: none;
    margin: 36px 0 0;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .14);
}

html body .aid-home-commitment__pillars article {
    display: block;
    min-width: 0;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 20px 22px;
    border-top: 3px solid #f08a24;
    border-radius: 0;
    background: rgba(5, 12, 20, .8);
    box-shadow: none;
}

html body .aid-home-commitment__pillars h3 {
    margin: 0 0 7px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
}

html body .aid-home-commitment__pillars p {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.55;
    color: #d9e3ec;
}

/* v451.297: closing sentence and buttons share one line. */
html body .aid-home-commitment__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px 24px;
    margin: 26px 0 0;
}

html body .aid-home-commitment__close {
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 23px;
    line-height: 1.35;
    color: #fff;
}

html body .aid-home-commitment__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0;
}

html body .aid-home-commitment__actions a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 2px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

html body .aid-home-commitment__primary {
    border: 1px solid #fff;
    background: #fff;
    color: #0b1a27;
}

html body .aid-home-commitment__primary:hover,
html body .aid-home-commitment__primary:focus-visible {
    background: #ffe2c2;
    border-color: #ffe2c2;
    color: #0b1a27;
}

html body .aid-home-commitment__secondary {
    border: 1px solid rgba(255, 255, 255, .6);
    background: transparent;
    color: #fff;
}

html body .aid-home-commitment__secondary:hover,
html body .aid-home-commitment__secondary:focus-visible {
    border-color: #fff;
    background: rgba(255, 255, 255, .1);
    color: #fff;
}

html body .aid-home-commitment__actions a:focus-visible {
    outline: 2px solid #ffb366;
    outline-offset: 3px;
}

@media (max-width: 991.98px) {
    html body .aid-home-commitment {
        padding-top: 52px;
        padding-bottom: 52px;
    }

    html body .aid-home-commitment h2 {
        font-size: 38px;
    }
}

/* v451.299: large desktop monitors (1600 px and wider). The band keeps the
   height of its content instead of the image's proportions, so no empty
   strip appears above or below the content; the image still covers the
   band at the window width (it is cropped at the top and bottom, never
   enlarged). Laptops, tablets and phones are unchanged. */
@media (min-width: 1600px) {
    html body .aid-home-commitment {
        min-height: 0;
    }
}

/* Tablets: the three commitments stay side by side, with tighter padding. */
@media (min-width: 761px) and (max-width: 991.98px) {
    html body .aid-home-commitment__pillars article {
        padding: 18px 16px;
    }

    html body .aid-home-commitment__pillars h3 {
        font-size: 16px;
    }

    html body .aid-home-commitment__pillars p {
        font-size: 14px;
    }
}

@media (max-width: 760px) {
    html body .aid-home-commitment {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    /* Phones: the band is much taller than the image; the image is shown
       across the top at its own proportions and fades into the band. */
    html body .aid-home-commitment {
        min-height: 0;
    }

    html body .aid-home-commitment::after {
        inset: 0 0 auto 0;
        aspect-ratio: 2560 / 821;
        background-image: url("/assets/img/home/case-commitment-mobile-v451298.webp");
        background-size: 100% 100%;
        -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 60%, transparent 100%);
        mask-image: linear-gradient(to bottom, #000 0, #000 60%, transparent 100%);
    }

    html body .aid-home-commitment::before {
        background: linear-gradient(180deg, rgba(4, 11, 19, .6) 0%, rgba(5, 13, 22, .7) 100%);
    }

    html body .aid-home-commitment h2 {
        font-size: 31px;
    }

    html body .aid-home-commitment__lead {
        font-size: 16px;
    }

    html body .aid-home-commitment__pillars {
        grid-template-columns: minmax(0, 1fr);
    }

    html body .aid-home-commitment__close {
        font-size: 20px;
    }

    html body .aid-home-commitment__actions a {
        flex: 1 1 100%;
        justify-content: center;
    }
}
