.header_section {
    aspect-ratio: 1 / 1;
    justify-content: center;
    background-color: var(--typo-color-blue);
    color: #FFFFFF;
}

.header_section .content_row {
    position: relative;
    z-index: 20;
}

@media screen and (min-width:40em){
    .header_section {
        aspect-ratio: auto;
    }

    .wrapper .content > .header_section:first-child {
        min-height: calc(100svh - var(--typo-topbar-height));
    }

    .upper_topbar + .wrapper .content > .header_section:first-child {
        min-height: calc(100svh - var(--typo-topbar-height) - 5rem);
    }
}

@media screen and (min-width:64em){
    .wrapper .content > .header_section:first-child {
        min-height: 100svh;
    }

    .upper_topbar + .wrapper .content > .header_section:first-child {
        min-height: calc(100svh - 2.5rem);
    }
}