/*
Theme Name: Divi Child
Theme URI: https://www.andreyschafis.ch/
Description: Child Theme für Divi 5 mit eigenen CSS und JS Dateien
Author: Andrey Schafis
Author URI: https://www.andreyschafis.ch/
Template: Divi
Version: 1.0.0
*/

/* Custom Styles können hier ergänzt werden */


/*
.header-font-size h1 {
	font-size: clamp(2.5rem, -1.875rem + 14vw, 6rem) !important;
}

.header-font-size p {
	font-size: clamp(1.2rem, 0.5125rem + 2.2vw, 1.75rem) !important;
}
*/

.mh_flip .mh_flip_active, .mh_flip .mh_flip_meta, .et-fb .mh_flip .mh_flip_active, .et-fb .mh_flip .mh_flip_meta {
    transform: perspective(500px) rotateX(0deg); /* Default transform */
    transition: all 0.3s linear;
}

.mh_flip .mh_flip_active {
    display: flex;
    flex-wrap: wrap;
    align-items: top;
    width: 100%;
    height: 100%;
    background-color: #fff;
    padding: 40px 50px;
    top: 0;
    left: 0;
    transform-origin: 50% 0%;
    height: calc(100% - -1px);
}

.mh_flip:hover .mh_flip_active {
    transform: perspective(500px) rotateX(-90deg);
    transition-delay: 0s;
}

.mh_flip .mh_flip_meta {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #ceb888;
    padding: 40px;
    transform-origin: 50% 100%;
    opacity: 0; /* Hidden by default */
    transition: all .3s linear; /* Transition without delay */
    transform: perspective(500px) rotateX(90deg); /* Initial transform for hidden state */
}

.mh_flip:hover .mh_flip_meta {
    opacity: 1; /* Visible on hover */
    transform: perspective(500px) rotateX(0deg); /* Rotate to visible state on hover */
    transition-delay: 0.2s; /* Delay the start of transition to sync with .mh_flip_active */
}

.et-fb .mh_flip .mh_flip_active, .et-fb .mh_flip:hover .mh_flip_active, .et-fb .mh_flip .mh_flip_meta {
    height: unset;
    opacity: 1 !important; /* Ensure it's visible */
}

.et-fb .mh_flip:hover .mh_flip_active {
    transform: perspective(500px) rotateX(0deg);
}