/* Twenty Twenty-Five–style default page: Manrope (TT5 font) */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700&display=swap");

#page {
    #sec-title {
        position: relative;
        height: 35dvh;
        background-color: #FFCD9A;

        .background-img {
            height: 100%;

            img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
        }

        .title-container {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;

            &.with-overlay {
                backdrop-filter: blur(2px);
                background: rgba(0, 0, 0, 0.2);
            }

            .title-text {
                padding: 0 40px;
                margin: auto 0;

                h1 {
                    text-transform: uppercase;
                    font-family: 'Bayon', sans-serif;
                    font-size: 50px;
                    color: white;
                }

                .subtitle-container {
                    margin-top: 10px;
                    padding: 8px;
                    /* background: rgba(0, 0, 0, 1); */
                    width: fit-content;
                    background: linear-gradient(to right, #FE5000, #FFC175);

                    h2 {
                        text-transform: uppercase;
                        font-size: 18px;
                        color: white;
                    }
                }
            }
        }
    }
}

/* Responsive (TT5-style default page) */
@media (max-width: 768px) {
    #sec-title .title-text h1 {
        font-size: 2.5rem;
    }

    #sec-title .subtitle-container h2 {
        font-size: 1.1rem;
    }

    #wp-content-wrapper .page-content {
        padding-left: clamp(20px, 5vw, 30px);
        padding-right: clamp(20px, 5vw, 30px);
    }

    #wp-content-wrapper .page-content h1:not(.wp-block-heading) {
        font-size: 2rem;
    }

    #wp-content-wrapper .page-content h2:not(.wp-block-heading) {
        font-size: 1.75rem;
    }

    #wp-content-wrapper .page-content h3:not(.wp-block-heading) {
        font-size: 1.375rem;
    }
}