.hero_container {
    width: 100%;
    height: 100vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
    box-sizing: border-box;
    padding: 50px 100px ;
    overflow: hidden;
    position: relative;
    z-index: 5;

    background-image: url(../media/Bg/Hero_bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

    @media (max-width: 800px) {
        .hero_container {
            grid-template-columns: 1fr;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 70vh;
        }
    }

    @media (max-width: 700px) {
        .hero_container {
            padding: var(--padding);
        }
    }

    @media (max-width: 450px) {
        .hero_container {
            height: 60vh;
        }
    }


.heroTitle_container {
    width: 80%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    gap: var(--gap);
}

    @media (max-width: 800px) {
        .heroTitle_container {
            width: 100%;
        }
    }

    @media (max-width: 550px) {
        .heroTitle_container span:nth-child(1), .heroTitle_container span:nth-child(2) {
            font-size: 2rem;
        }
        .heroTitle_container span {
            font-size: 1rem;
        }
        .heroTitle_container button {
            padding: 10px !important;
        }
        .heroTitle_container button span {
            font-size: 1rem !important;
        }
    }

    @media (max-width: 450px) {
        .heroTitle_container span {
            font-size: .9rem;
        }
    }

.heroTitle_btn_container {
    width: fit-content;
    height: fit-content;
    display: flex;
    flex-direction: row;
    gap: var(--gap);
}

    .heroTitle_btn, .heroTitle_btn:nth-child(2) {
        width: fit-content;
        padding: 15px 30px;
        border-radius: var(--border_small);
        box-sizing: border-box;
    }

        .heroTitle_btn {
            background-color: var(--color_white);
        }
        
        .heroTitle_btn:nth-child(2) {
            border: 2px var(--color_white) solid;
            background-color: transparent;
        }
        
            .heroTitle_btn:focus-visible {
                border: solid var(--accent_color) 2px;
            }

            .heroTitle_btn:nth-child(2):hover {
                background-color: var(--accent_color);
            }

.heroPictures_container {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 20px;
    gap: var(--gap);
    position: relative;
    overflow: hidden;
}

    @media (max-width: 800px) {
        .heroPictures_container {
            display: none;
        }
    }

    .heroPictures_container_row, .heroPictures_container_row:nth-child(2) {
        display: flex;
        flex-direction: column;
        gap: var(--gap);
    }

    .heroPictures_container_row:nth-child(2) {
        position: relative;
        top: -200px;
    }

    .heroPictures_box {
        aspect-ratio: 6 / 8;
        width: 100%;
        border-radius: var(--border_radius);
        overflow: hidden;
    }

.custom-shape-divider-bottom-1753142356 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: rotate(180deg);
}

.custom-shape-divider-bottom-1753142356 svg {
    position: relative;
    display: block;
    width: calc(121% + 1.3px);
    height: 75px;
}

.custom-shape-divider-bottom-1753142356 .shape-fill {
    fill: var(--pink_color);
}

.blur {
    filter: blur(30px);
}