/* --------------------------------- */
/* Block: Part of Journey Banner     */
/*                                   */
/* Background color, text color, and */
/* logo fill are all set via inline  */
/* styles from block attributes.     */
/* They are NOT set in this file.    */
/*                                   */
/* This file handles layout,         */
/* spacing, and responsive rules     */
/* only.                             */
/* --------------------------------- */


/* --------------------------------- */
/* Outer block wrapper               */
/*                                   */
/* Carries the alignfull / alignwide */
/* classes. No visual styles on this */
/* element — exists only to receive  */
/* alignment classes from the        */
/* theme's existing CSS.             */
/* --------------------------------- */
.wp-block-squint-part-of-journey {
    display: block;
}


/* --------------------------------- */
/* Banner container                  */
/*                                   */
/* background-color is set inline    */
/* from the backgroundColor          */
/* attribute — not here.             */
/* --------------------------------- */
.wp-block-squint-part-of-journey #part_of_journey_banner {
    display: flex;
    padding-left: 3rem;
    padding-right: 3rem;
    justify-content: center;
    font-size: 18px;
    line-height: 1.56em;
    position: relative;
    font-weight: 700;
}

.wp-block-squint-part-of-journey #part_of_journey_banner p {
    font-size: 1rem;
}


/* --------------------------------- */
/* Inner content row                 */
/* --------------------------------- */
.wp-block-squint-part-of-journey #part_of_journey_banner_inner {
    margin-top: 3rem;
    margin-bottom: 3rem;
    width: 100%;
    max-width: var(--wp--style--global--content-size);
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: row;
    gap: 3rem;
}

.wp-block-squint-part-of-journey #part_of_journey_banner_inner h3 {
    margin-top: 0;
}


/* --------------------------------- */
/* CTA button                        */
/*                                   */
/* color and border-color are set    */
/* inline from the textColor         */
/* attribute — not here.             */
/* --------------------------------- */
.wp-block-squint-part-of-journey .part_of_journey_banner_button {
    display: inline-block;
    cursor: pointer;
    padding: 1rem;
    background-color: transparent !important;
    border-top: 1px solid;
    border-right: 1px solid;
    border-bottom: 1px solid;
    border-left: 1px solid;
}

.wp-block-squint-part-of-journey .part_of_journey_banner_button a {
    text-decoration: none;
}


/* --------------------------------- */
/* Left column                       */
/* --------------------------------- */
.wp-block-squint-part-of-journey .part_of_journey_banner_left {
    flex: 1;
}


/* --------------------------------- */
/* Right column: SVG logo            */
/*                                   */
/* fill is set inline on the svg     */
/* element from logoColor attribute. */
/* --------------------------------- */
.wp-block-squint-part-of-journey .part_of_journey_banner_right {
    justify-content: flex-end;
    align-content: center;
    display: flex;
}

.wp-block-squint-part-of-journey .part_of_journey_banner_right a {
    display: flex;
}

.wp-block-squint-part-of-journey .part_of_journey_banner_right a svg {
    max-width: 450px;
    width: 100%;
}


/* --------------------------------- */
/* Responsive: 1199px and below      */
/* --------------------------------- */
@media (max-width: 1199px) {

    .wp-block-squint-part-of-journey .part_of_journey_banner_right a svg {
        max-width: 350px;
    }

}


/* --------------------------------- */
/* Responsive: 991px and below       */
/*                                   */
/* Stack columns, logo above text    */
/* --------------------------------- */
@media (max-width: 991px) {

    .wp-block-squint-part-of-journey #part_of_journey_banner_inner {
        flex-direction: column-reverse;
        gap: 1rem;
    }

    .wp-block-squint-part-of-journey .part_of_journey_banner_right {
        justify-content: flex-start;
    }

}


/* --------------------------------- */
/* Responsive: 768px and below       */
/* --------------------------------- */
@media (max-width: 768px) {

    .wp-block-squint-part-of-journey .part_of_journey_banner_right a svg {
        max-width: 250px;
    }

    .wp-block-squint-part-of-journey #part_of_journey_banner {
        padding-left: 2rem;
        padding-right: 2rem;
    }

}


/* --------------------------------- */
/* Responsive: 576px and below       */
/* --------------------------------- */
@media (max-width: 576px) {

    .wp-block-squint-part-of-journey #part_of_journey_banner {
        padding-left: 1rem;
        padding-right: 1rem;
    }

}