/*
 Theme Name:   CPH (Kadence Child)
 Theme URI:    https://cphexecutiveportraits.dk
 Description:  Child theme for CPH project.
 Author:       Constantine Vasilyev
 Copyright:    2026 Constantine Vasilyev for Jesse Goff
 Template:     kadence
 Version:      1.0.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  cph
*/

/**
 * Typography & Lists
 */
ul.wp-block-list {
    padding-left: 1em !important;
}

/**
 * Hero pattern
 */
.hero .hero-eager {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: translate(-50%, -50%);
}

.hero {
    position: relative !important;
    overflow: hidden;
}

.hero > .kt-row-column-wrap {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: 100vh !important;
    min-height: 100vh !important;
}

.hero > .kt-row-column-wrap > .wp-block-kadence-column:first-child {
    grid-area: 1 / 1 / 2 / 2 !important;
    height: 100vh !important;
    z-index: 1 !important;
}

.hero > .kt-row-column-wrap > .wp-block-kadence-column:last-child {
    grid-area: 1 / 1 / 2 / 2 !important;
    height: 100vh !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.hero > .kt-row-column-wrap > .wp-block-kadence-column:last-child > .kt-inside-inner-col {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

@media screen and (max-width: 768px) {
    /* 1. Global Reset */
    .hero {
        min-height: 0 !important;
        height: auto !important;
    }

    /* 2. Row Wrapper */
    .hero > .kt-row-column-wrap {
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        height: auto !important;
    }

    /* 3. Image Section: Strict 50vh */
    .hero > .kt-row-column-wrap > .wp-block-kadence-column:first-child {
        height: 50vh !important;
        min-height: 50vh !important;
        max-height: 50vh !important;
        position: relative !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    /* 4. Fix Nested Container heights */
    .hero .kt-inside-inner-col,
    .hero .hero-eager,
    .hero .kb-is-ratio-image,
    .hero .kb-image-has-overlay {
        height: 100% !important;
        min-height: 100% !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        display: block !important;
    }

    /* 5. Image: Center and Restrict Width to 400px */
    .hero .hero-eager img {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 100% !important;
        max-width: 400px !important;
        height: 100% !important;
        object-fit: cover !important;
        object-position: center 20% !important;
    }

    /* 6. Content Section */
    .hero > .kt-row-column-wrap > .wp-block-kadence-column:last-child {
        height: auto !important;
        min-height: 0 !important;
        padding: 40px 20px !important;
    }

    /* 7. Typography */
    .hero h1 {
        font-size: 46px !important;
        line-height: 1.1 !important;
        margin: 0 !important;
    }
}