/* ************************************ */
/* Main block and variables */
/* ************************************ */

.cmw-Y25.y25-hero-block {
    /* Variables for layout and spacing */
    --cmw-width: min(83%, 1200px); /* Max width for the container */
    --cmw-eyebrow-margin-bottom: 1.33333rem; /* Space below eyebrow text */
    --cmw-heading-margin-bottom: 1rem; /* Space below heading */
    --cmw-button-margin-top: 2.66667rem; /* Space above buttons */
    --cmw-padding-top: 5rem; /* Top padding without media */
    --cmw-padding-bottom: 6rem; /* Bottom padding without media */
    --cmw-padding-top-when-media: 4.44444rem; /* Top padding with media */
    --cmw-padding-bottom-when-media: 4.44444rem; /* Bottom padding with media */
    --cmw-gap-between-details-and-media: 2.66667rem; /* Space between text and media */

    /* Default styles */
    background-color: white; /* Background color */
    background-size: cover; /* Cover the background */
    background-repeat: no-repeat; /* No background repeat */
    background-position: center center; /* Centered background */
    width: 100%; /* Full width */
    margin-bottom: 0;
    position: relative;
    overflow: hidden;
    z-index: 0;
}

.cmw-Y25.y25-hero-block.cmw-hero-in-archive {
    --cmw-padding-top: var(--cmw-xl);
    --cmw-padding-bottom: var(--cmw-xl);
}

/* ************************************ */
/* Container Styling */
/* ************************************ */

.cmw-Y25.y25-hero-block .y25-hero-container {
    width: var(--cmw-width);
    padding-top: var(--cmw-padding-top);
    padding-bottom: var(--cmw-padding-bottom);
    margin-inline: auto;
    gap: var(--cmw-gap-between-details-and-media);
    display: flex;
    z-index: 1;
}

.cmw-Y25.y25-hero-block.cmw-bottom-white-border::before {
    content: "";
    z-index: 1;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-image: url('./img/swoop_mobile.png');
    height: 4rem;
}
/* Style for the background image */
.cmw-Y25.y25-hero-block > img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}

/* Swap sections */
.cmw-Y25.y25-hero-block .y25-hero-container.cmw-swap-sections {
    flex-direction: row-reverse;
}

/* Adjust padding when media is present */
.cmw-Y25.y25-hero-block .y25-hero-container {
    padding-top: var(--cmw-padding-top-when-media);
    padding-bottom: var(--cmw-padding-bottom-when-media);
}

/* Restore default padding when no media */
.cmw-Y25.y25-hero-block .y25-hero-container.cmw-no-media {
    padding-top: var(--cmw-padding-top);
    padding-bottom: var(--cmw-padding-bottom);
}

/* ************************************ */
/* Text and Details Section */
/* ************************************ */

/* Align details section vertically */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details {
    align-content: center;
}
.cmw-Y25.y25-hero-block .cmw-details p{
    font-family: "Apercu Mono", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}
.cmw-Y25.y25-hero-block .cmw-details p.cmw-description-white img, .cmw-Y25.cmw-hero .cmw-details .cmw-large-paragraph.white img{
    -webkit-filter: invert(100%);
        filter: invert(100%);
    width: 1rem;
}
/* Narrower details section when no media */
.cmw-Y25.y25-hero-block .y25-hero-container.cmw-no-media .cmw-details {
    max-width: 65%; /* Restrict width for large screens */
}

/* Space below text elements */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-eyebrow-large {
    margin-bottom: var(--cmw-eyebrow-margin-bottom);
}
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-heading {
    margin-bottom: var(--cmw-heading-margin-bottom);
}

/* Headline styles */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details h1{
    font-size: clamp(2rem, 0.936rem + 3.404vw, 4rem);
    line-height: normal;
}
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details.cmw-bold-headline h1 {
        line-height: normal;
    font-family: "WeWork Serif", Georgia, serif;
    font-weight: 800;
    line-height: 100%;
    font-size: clamp(2rem, 0.936rem + 3.404vw, 4rem); /* Using clamp to ensure the font size scales responsively */
}
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details.cmw-black-headline h1 {
    color: #000000!important;
}

/* ************************************ */
/* Media Styling */
/* ************************************ */

.cmw-Y25.y25-hero-block .y25-hero-container .cmw-media figure {
    display: flex;
    justify-content: end;
    align-items: flex-start;
    position: relative;
    margin: 0;
    width: 100%;
}

.cmw-Y25.y25-hero-block .y25-hero-container.cmw-swap-sections .cmw-media figure {
    justify-content: start;
}

.cmw-Y25.y25-hero-block .y25-hero-container .cmw-media figure img,
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-media figure video {
    border-radius: 24px;
    max-width: 100%;
    height: auto;
}

/* Style for embaded video */
.cmw-Y25.y25-hero-block .y25-hero-container.cmw-embeded .cmw-media figure,
.cmw-Y25.y25-hero-block .y25-hero-container.cmw-embeded .cmw-media figure .wp-block-embed__wrapper {
    display: flex;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    overflow: clip;
}

/* ************************************ */
/* Button Styling */
/* ************************************ */

/* Button container alignment */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-top: var(--cmw-button-margin-top);
    border: none;

}
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button a:after{
        content: "";
    background: url(./img/icon_chevron_grey.svg) no-repeat center;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    width: 1.25rem;
    height: 1.875rem;
    position: relative;
    right: 0;
    margin-left: 20px;
}
/* Button styles */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button a {
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    display:inline-flex;
    padding: 1rem;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    border: none;
}

/* WordPress-specific buttons */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .wp-block-button__link,
.wp-block-column.cmw-details .wp-element-button {
    border-radius: .25rem;
    box-sizing: border-box;
}

/* White text button */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .cmw-text-white {
    color: white !important;
}
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .cmw-text-white.wp-block-button__link:hover,
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .cmw-text-white.wp-block-button__link:focus-visible {
color: #000000 !important;
    border: none !important;
}

/* Blue text button */
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .cmw-text-black {
    color: #000000 !important;
}
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .cmw-text-black.wp-block-button__link:hover,
.cmw-Y25.y25-hero-block .y25-hero-container .cmw-details .cmw-custom-button .cmw-text-black.wp-block-button__link:focus-visible {
   color: #000000 !important;
}


/* ************************************ */
/* Responsive Styling */
/* ************************************ */
@media (min-width: 1195px) {
    section.cmw-Y25.y25-hero-block.cmw-bottom-white-border::before{
        height: 8.75rem;
        bottom: -1rem;
        background-image: url('./img/swoop_desktop.webp');

    }
}
@media (min-width: 600px) and (max-width: 1194px){
    section.cmw-Y25.y25-hero-block.cmw-bottom-white-border::before{
        background-image: url('./img/swoop_tablet.png');
        height: 4.625rem;
    }
}
@media (max-width: 834px) {
    .cmw-Y25.y25-hero-block .y25-hero-container {
        /* Update variables for smaller screens */
        --cmw-eyebrow-margin-bottom: 0.88889rem;
        --cmw-heading-margin-bottom: 0.44444rem;
        --cmw-button-margin-top: 1.77778rem;
        --cmw-padding-top: 3rem;

        --cmw-gap-between-details-and-media: 1.77778rem;
    }

    .cmw-Y25.y25-hero-block.cmw-hero-in-archive {
        --cmw-padding-top: var(--cmw-l);
        --cmw-padding-bottom: var(--cmw-l);
    }

    /* Container height when media is present */
    .cmw-Y25.y25-hero-block .y25-hero-container {
        height: fit-content;
    }
    /* Container height when no media present */
    .cmw-Y25.y25-hero-block .y25-hero-container.cmw-no-media {
        height: auto;
    }

    .cmw-Y25.y25-hero-block .y25-hero-container,
    .cmw-Y25.y25-hero-block .y25-hero-container.cmw-swap-sections {
        flex-direction: column; /* Stack content vertically */
        flex-wrap: nowrap !important;
    }

    /* Full-width details for smaller screens */
    .cmw-Y25.y25-hero-block .y25-hero-container .cmw-details,
    .cmw-Y25.y25-hero-block .y25-hero-container.cmw-no-media .cmw-details {
        min-width: 100%;
    }

    /* Ensure media appears above details */
    .cmw-Y25.y25-hero-block .y25-hero-container .cmw-media {
        order: 1 !important;
    }
    .cmw-Y25.y25-hero-block .y25-hero-container .cmw-details {
        order: 2 !important;
    }

    .cmw-Y25.y25-hero-block .y25-hero-container .cmw-media figure {
        justify-content: start;
    }
}