/*
 Theme Name:   tpwof
 Theme URI:    https://generatepress.com
 Description:  GeneratePress child theme
 Author:       Resonator Agency Inc.
 Author URI:   https://resonator.ca/
 Template:     generatepress
 Version:      1.0.2
*/

:root {
	--inner-w: 1440px;
	--inner-p: 40px;
	--mobile-padding: 20px;
}

* p:last-child {
	margin-bottom:0;
}

ul {
	margin-bottom: 0;
	margin-left: 24px;
}

#masthead {
	background: linear-gradient(180deg, rgba(16, 52, 103, 0.91) 0%, rgba(32, 104, 205, 0) 100%);
    background-blend-mode: multiply;
}

.mobile-menu-open #masthead {
    padding-bottom: 40px;
    background-color: rgba(16, 52, 103, 0.99);
}

.mobile-menu-open #masthead ul#menu-main li a{
    text-align: right;
}

.main-navigation .main-nav > ul {
	justify-content: flex-end;
	gap: 24px;
}

.main-navigation .main-nav > ul li:not(:last-child) a {
 padding: 0;
}


.main-navigation ul#menu-main  li:last-child a {
    background-color: var(--seondary-yellow);
    color: var(--accent-blue); 
        
    padding: 8px 15px !important;
    border-radius: 9999px;
	line-height: 36px;
	width: 187px;
	text-align: center;
}

.mobile-menu-open #masthead .main-navigation ul#menu-main li:last-child {
    padding-top: 16px;
    display: flex;
    justify-content: end;
}

.mobile-menu-open #masthead .main-navigation ul#menu-main li:last-child a {
    text-align: center;
}

/* Contact form 7 */
.contact-form .wpcf7-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-form .wpcf7-form 

.wpcf7-form label {
	display: block;
    color: white;
    margin-bottom: 12px;
}

.wpcf7-form input[type="email"],
.wpcf7-form input[type="text"],
.wpcf7-form textarea {
    width: 100%;
    border-radius: 18px;
    padding: 12px 24px;
}

.wpcf7-form input[type="submit"] {
    background-color: transparent;
    border-radius: 90px;
    border: solid 1px white;
    padding: 8px 64px;
    margin-left: 18px;
    width: fit-content;
}

.tpwof-form-nl > div {
	display: flex;
}

.tpwof-form-nl label {
    display: block;
    padding: 8px;
    color: white;
}

.wpcf7 form.sent .wpcf7-response-output {
	color: white;
	border: none;
}

/* easy accordion */
.faq .sp-easy-accordion .sp-ea-single {
	border-radius: 1.5rem;
	box-shadow: 0px 24px 24px -12px #364A360F;

}

.faq .sp-easy-accordion .sp-ea-single .ea-header a {
	font-weight: 500;
	padding: 24px 32px;
}

.faq .sp-easy-accordion .sp-ea-single .ea-body {
	padding: 0 32px 24px;
}

/* Helpers */
.blue-bg-offset {
	position: relative;
	z-index:10;
}

.blue-bg-offset::before {
	content: "";
	width: 100%;
	height: calc( 100% - 64px );
	background-color: var(--primary-blue);
	position: absolute;
	z-index:-1;
	top: -32px;
}

.bg-overflow {
	position: relative;
	z-index:10;
}

.bg-overflow::before {
	content: "";
	width: calc( (100vw - var(--inner-w) + 40px )/2 );
	height: 100%;
	background-color: inherit;
	position: absolute;
	z-index:-1;
	left: 100%;
}

.col-2-img-box.wp-block-media-text.is-image-fill-element > .wp-block-media-text__media  {
border-top-right-radius: 26px;
	border-bottom-right-radius: 26px;
	overflow:hidden;
}


@media (max-width: 767px) {
    .site-logo {
        max-width: 250px;   
    }
    
    .bg-overflow::before {
        width: var(--mobile-padding);
    }
    
    .tpwof-form-nl > div {
        flex-direction: column;
        gap: 20px;
    }
    
    .wpcf7-form .tpwof-form-nl > div input[type="submit"] {
        margin: 0 auto;
    }
}