/* ==========================================================================
   TABLET
   ========================================================================== */

@media (min-width: 761px) and (max-width: 1024px) {

    .hero-band--home-mission > img {
        width: 60%;
        height: 100%;

        object-fit: cover;
        object-position: 35% 43%;
    }


    .hero-band--home-mission::after {
        background: linear-gradient(
            90deg,

            rgba(23, 46, 72, 0) 0%,
            rgba(23, 46, 72, 0) 31%,

            rgba(23, 46, 72, 0.07) 34%,
            rgba(23, 46, 72, 0.16) 37%,
            rgba(23, 46, 72, 0.30) 40%,
            rgba(23, 46, 72, 0.48) 43%,
            rgba(23, 46, 72, 0.66) 46%,
            rgba(23, 46, 72, 0.82) 48%,
            rgba(23, 46, 72, 0.94) 50%,

            var(--mission-navy) 52%,
            var(--mission-navy) 100%
        );
    }


    .hero-band--home-mission .hero-mission {
        left: 53%;
        right: 5%;

        transform: translateY(-50%);
    }


    .hero-band--home-mission .hero-mission .eyebrow {
        margin-bottom: .8rem;
    }


    .hero-band--home-mission .hero-mission .mission-text {
        width: 100%;
        max-width: 38ch;

        font-size: clamp(.95rem, 1.65vw, 1.08rem);
        line-height: 1.5;
    }
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 760px) {


    .hero-band--home-mission {
        display: block;

        height: auto;
        min-height: 0;

        background: var(--mission-navy);
    }


    .hero-band--home-mission > img {
        position: relative;

        top: auto;
        right: auto;
        bottom: auto;
        left: auto;

        display: block;

        width: 100%;
        height: clamp(220px, 64vw, 300px);

        object-fit: cover;


        object-position: 35% 42%;
    }


    .hero-band--home-mission::after {
        display: none;
    }


    .hero-band--home-mission .hero-mission {
        position: relative;

        top: auto;
        right: auto;
        bottom: auto;
        left: auto;

        width: 100%;
        max-width: none;

        transform: none;

        padding:
            1.75rem
            var(--gutter)
            2rem;

        background: var(--mission-navy);

        color: #fff;
    }


    .hero-band--home-mission .hero-mission .eyebrow {
        margin: 0 0 .75rem;
    }


    .hero-band--home-mission .hero-mission .mission-text {
        width: 100%;
        max-width: none;

        margin: 0;

        font-size: .98rem;
        line-height: 1.55;

        color: #fff;
    }
}

/* ==========================================================================
   TEAM PAGE - MOBILE PERSON CARDS ONLY
   ========================================================================== */

@media (max-width: 415px) {

    /* Keep every employee list fully inside the mobile viewport */
    .team-mobile-people {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }


    /* One-column employee card */
    .team-mobile-people .person {
        display: grid;
        grid-template-columns: minmax(0, 1fr);

        width: 100%;
        max-width: 100%;
        min-width: 0;

        gap: 0;

        overflow: hidden;

        background: #fff;

        border: 1px solid var(--rule);
        border-radius: var(--radius);
    }


    /* Photo wrapper */
    .team-mobile-people .person .ph {
        display: block;

        width: 100%;
        max-width: 100%;
        min-width: 0;

        /*
         * Override the generic .ph placeholder styling
         * only inside these Team cards.
         */
        aspect-ratio: auto;

        padding: 10px;

        border: 0;
        border-bottom: 1px solid var(--rule);
        border-radius: 0;

        background: var(--grey-10);
    }


    /* Employee photo */
    .team-mobile-people .person .ph img {
        display: block;

        width: 100%;
        max-width: 100%;

        height: auto;

        /*
         * Client reference uses a compact landscape crop
         * rather than the very shallow current mobile crop.
         */
        aspect-ratio: 4 / 3;

        min-height: 0;
        max-height: none;

        object-fit: cover;
        object-position: top center;

        border: 1px solid var(--rule);
        border-radius: 1px;
    }


    /* Employee details */
    .team-mobile-people .person .pb {
        width: 100%;
        max-width: 100%;
        min-width: 0;

        padding: 1rem 1rem 1.2rem;

        overflow: hidden;
    }


    /* Name */
    .team-mobile-people .person .pb h3 {
        max-width: 100%;

        margin-bottom: .2rem;

        overflow-wrap: break-word;
        word-break: normal;
    }


    /* Role / location must wrap instead of escaping the card */
    .team-mobile-people .person .role {
        width: 100%;
        max-width: 100%;

        white-space: normal;

        overflow-wrap: anywhere;
        word-break: normal;

        line-height: 1.45;

        margin-bottom: .8rem;
    }


    /* Biography paragraphs */
    .team-mobile-people .person .pb p {
        width: 100%;
        max-width: 100%;

        overflow-wrap: break-word;
        word-break: normal;

        line-height: 1.6;
    }


    .team-mobile-people .person .pb p:last-child {
        margin-bottom: 0;
    }
}


/* ==========================================================================
   CAREERS PAGE - MOBILE PERSON CARDS ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {
    figure.careers-face-banner > img.careers-face-banner__image {
        height: 210px;
        object-position: center 15%;
    }
}


/* Mobile only */
@media (max-width: 640px) {
    figure.careers-face-banner > img.careers-face-banner__image {
        height: 150px;
        object-position: center 30%;
    }
}

/* ==========================================================================
   TEAM PAGE - MOBILE PERSON CARDS ONLY
   ========================================================================== */

/* Tablet - Team banner only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.team-face-banner > img.team-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 18%;
    }
}


/* Mobile - Team banner only */
@media (max-width: 640px) {

    figure.team-face-banner > img.team-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 25%;
    }
}

/* ==========================================================================
   CONTACT PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet - Contact banner only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.contact-face-banner > img.contact-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 23%;
    }
}


/* Mobile - Contact banner only */
@media (max-width: 640px) {

    figure.contact-face-banner > img.contact-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 8%;
    }
}
/* ==========================================================================
   ABOUT PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.about-face-banner > img.about-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 20%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.about-face-banner > img.about-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 24%;
    }
}
/* ==========================================================================
   HIGH-RISK ENVIRONMENTS PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.high-risk-face-banner > img.high-risk-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 20%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.high-risk-face-banner > img.high-risk-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 25%;
    }
}


/* ==========================================================================
   RISK INTELLIGENCE PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.risk-intelligence-face-banner
    > img.risk-intelligence-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 37%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.risk-intelligence-face-banner
    > img.risk-intelligence-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 36%;
    }
}
/* ==========================================================================
   INSIGHTS PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.insights-face-banner > img.insights-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 20%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.insights-face-banner > img.insights-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 24%;
    }
}
/* ==========================================================================
   STRATEGIC ADVISORY PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.strategic-advisory-banner
    > img.strategic-advisory-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 20%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.strategic-advisory-banner
    > img.strategic-advisory-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 22%;
    }
}
/* ==========================================================================
   OT & SECURITY TECHNOLOGY PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.ot-hardware-face-banner
    > img.ot-hardware-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 36%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.ot-hardware-face-banner
    > img.ot-hardware-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 35%;
    }
}
/* ==========================================================================
   SUPPORT OPERATIONS PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.support-operations-face-banner
    > img.support-operations-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 20%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.support-operations-face-banner
    > img.support-operations-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 25%;
    }
}
/* ==========================================================================
   FAQ PAGE - RESPONSIVE BANNER ONLY
   ========================================================================== */

/* Tablet only */
@media (min-width: 641px) and (max-width: 1024px) {

    figure.faq-face-banner > img.faq-face-banner__image {
        width: 100%;
        height: 210px;

        object-fit: cover;
        object-position: center 20%;
    }
}


/* Mobile only */
@media (max-width: 640px) {

    figure.faq-face-banner > img.faq-face-banner__image {
        width: 100%;
        height: 150px;

        object-fit: cover;
        object-position: center 20%;
    }
}