/*
Theme Name: Impreza Child
Template: Impreza
Version: 1.0
Author: Redbak
Theme URI: https://impreza.us-themes.com/
Author URI: https://redbak.com/
*/

/*********************************************
 *********************************************

 * *  1. Global Styling  * *
 * *  2. Navigation  * *
 * *  3. Sections  * *

 *********************************************
 *********************************************/


/*********************************************
 * *  1. Global Styling  * *
 *********************************************/
/* FONTS */
.orange-text .w-text-value span {
	color: var(--color-naylor-orange);
}
h1, h2, h3 {
	font-variation-settings: "slnt" 0, "wdth" 115, "wght" 700;
}
.nav-menu {
	font-variation-settings: "slnt" -12, "wdth" 115, "wght" 700;
}
.wpb_wrapper p {
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
}
.l-footer .wpb_wrapper p, .page-id-3 .wpb_wrapper p {
	max-width: 100%;
}


/*Form*/
.wsf-form input:not([type=submit]), .wsf-form textarea, .wsf-form select {
	box-shadow: none;
}
.wsf-form input[type=checkbox].wsf-field:checked::after {
    transform: translate(6px) scale(0.8) rotate(45deg) !important;
}
.wsf-form select.wsf-field:not([multiple]):not([size]):not([data-wsf-select2])+span.wsf-select-arrow {
    top: 8px !important;
}

/*recaptcha start*/
.grecaptcha-badge {
    box-shadow: grey 0px 0px 0px !important;
}
.grecaptcha-badge {
visibility: hidden;
}
.recaptcha-text {
    font-size: 12px !important;
}
.recaptcha-text a {
     text-decoration: underline;
     color: var(--color-content-primary) !important;
}
/*recaptcha end*/



/* Brand assets */
.grey-corner-bottom:after {
	content: "";
	display: block;
	position: absolute;
    bottom: -24px;
    right: 0;
	width: 30px;
	height: 25px;
	clip-path: path("M 500 420 L 0 0 h 500 v 420 Z");
	transition-duration: 0.3s;
	background-color: var(--color-naylor-grey);
}
.grey-corner-bottom:hover:after {
	background-color: var(--color-naylor-darker-grey);
}
.dark-grey-corner-bottom:after {
	content: "";
	display: block;
	position: absolute;
    bottom: -24px;
    right: 0;
	width: 30px;
	height: 25px;
	clip-path: path("M 500 420 L 0 0 h 500 v 420 Z");
	transition-duration: 0.3s;
	background-color: var(--color-naylor-darker-grey);
}
.dark-grey-corner-bottom:hover:after {
	background-color: var(--color-naylor-white);
}
.orange-corner-bottom:after {
	content: "";
	display: block;
	position: absolute;
    bottom: -24px;
    right: 0;
	width: 30px;
	height: 25px;
	clip-path: path("M 500 420 L 0 0 h 500 v 420 Z");
	transition-duration: 0.3s;
	background-color: var(--color-naylor-orange);
}
.orange-corner-bottom:hover:after {
	background-color: var(--color-naylor-white);
}


.row-divider .g-cols {
	margin: 0 !important;
}


.row-corner-right {
/* 	min-height: 600px; */
}
.row-corner-right:after {
	content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
	max-width: 50%;
	height: 100%;
	aspect-ratio: 545 / 420;
    clip-path: path("M 1090 840 L 0 0 h 1090 v 840 Z");
    transition-duration: 0.3s;
    background-color: var(--color-naylor-darker-grey);
    z-index: 0;
	background-image: url(/wp-content/uploads/2025/05/Logo-Repeating-Pattern-WEB.svg);
	background-size: 100vw;
	
}
.row-corner-right .g-cols .vc_column_container {
	z-index: 1;
}
.row-corner-right .g-cols .vc_column_container.stretched {
	padding-right: 4vw;
}

@media (max-width: 1024px) {
	.row-corner-right:after {
		width: 50%;
    }
}
@media (max-width: 900px) {
	.row-corner-right:after {
		display: none;
	}
	.row-corner-right .g-cols>div:last-of-type {
        order: -1;
		margin-bottom: 1rem;
    }
	.row-corner-right .vc_col-sm-6 {
		width: 100%;
	}
}
/*********************************************
 * *  2. Navigation  * *
 *********************************************/
.l-header.id_101 .l-subheader.at_middle:after {
    content: "";
    background-image: url(/wp-content/uploads/2025/05/Naylor-orange-corner.svg);
	background-repeat: none;
    height: var(--header-height);
    width: auto;
    aspect-ratio: 500 / 420;
    position: absolute;
	pointer-events: none;
    right: 0;
    top: 0;
	transition-timing-function: cubic-bezier(.78,.13,.15,.86);
	transition-duration: 0.3s;
}
.l-header.id_101.sticky .l-subheader.at_middle:after {
    height: var(--header-sticky-height);
}
@media (max-width: 900px) {
	.l-header.id_101 .l-subheader.at_middle:after {
		display: none;
    }
}



/*********************************************
 * *  3. Sections  * *
 *********************************************/

.home-header-wrapper {
	height: calc(100vh - 8rem - var(--header-height));
}
@media (max-width: 900px) {
	.home-header-row {
		min-height: 500px !important;
	}
	.home-header-wrapper {
		height: 400px;
		margin-bottom: 1.5rem;
	}
}
.naylor-icon:before {
    content: "";
    position: absolute;
    margin-top: -90px;
    left: 0;
    width: 200px;
    transform: scale(0.5);
    transform-origin: top left;
    aspect-ratio: 200 / 136;
    background-color: var(--color-naylor-green);
    clip-path: path("M150.48,68.09h49.52L118.59,0v62.94L49.51,5.18v62.74H0l81.41,68.08v-62.94l69.08,57.78v-62.75Z");
}




.intro-heading {
	margin-bottom: 0;
}
.intro-subheading {
	margin-top: -0.5rem;
    font-size: 1.5rem;
}
@media (max-width: 1024px) {
	.intro-subheading {
		margin-top: 0rem;
    }
}
@media (max-width: 600px) {
	.intro-subheading {
		margin-top: 0.5rem;
    }
}




.services-grid .w-grid-item {
    background: var(--color-naylor-light-grey);
    padding: 1.5rem;
    text-align: center;
}
.services-grid .w-grid-item:nth-of-type(2n) {
    background: #E5E5E5;
}
.services-grid .w-grid-item-h {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.services-grid img {
    max-width: 80%;
	margin: auto;
}




.accreditations-grid-wrapper {
    display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	width: 80%;
    margin: auto;
}
.accreditations-grid-wrapper .w-image {
    flex: calc(25% - 1.5rem);
    max-width: calc(25% - 1rem);
}
@media (max-width: 1024px) {
/* 	.accreditations-grid-wrapper .w-image {
		flex: calc(33% - 1rem);
		max-width: calc(33% - 0rem);
	} */
}
@media (max-width: 768px) {
	.accreditations-grid-wrapper {
		width: 90%;
	}
	.accreditations-grid-wrapper .w-image {
		flex: calc(50% - 1rem);
		max-width: calc(50% - 1rem);
	}
}
@media (max-width: 300px) {
	.accreditations-grid-wrapper .w-image {
		flex: 100%;
		max-width: 100%;
	}
}




.values-message {
	width: 80%;
	margin: auto;
}

@keyframes valuestextfade {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}
.values-message #honesty,
.values-message #quality,
.values-message #collaboration,
.values-message #integrity {
	opacity: 0;
	transform: translateY(20px);
}
.values-message.start #honesty,
.values-message.start #quality,
.values-message.start #collaboration,
.values-message.start #integrity {
	animation: valuestextfade 1s 1;
	animation-fill-mode: forwards;
}
.values-message.start #honesty {
	animation-delay: 0s;
}
.values-message.start #quality {
	animation-delay: 0.4s;
}
.values-message.start #collaboration {
	animation-delay: 0.8s;
}
.values-message.start #integrity {
	animation-delay: 1.2s;
}


.row-corner-right .power-cut-text, .row-corner-right .power-cut-tel {
	text-align: right;
}

.power-cut-text, .power-cut-tel {
	font-size: 2.5rem;
	font-weight: 700;
	margin-bottom: 1.5rem;
}
.power-cut-text {
	color: var(--color-naylor-white);
}
.power-cut-tel a {
	color: var(--color-naylor-orange);
}
.power-cut-tel a:hover {
	color: var(--color-naylor-dark-orange);
}
@media (max-width: 900px) {
	.row-corner-right .power-cut-text, .row-corner-right .power-cut-tel {
		text-align: left;
	}
	.row-corner-right .power-cut-tel a {
		color: var(--color-naylor-white);
	}
	.row-corner-right .power-cut-tel a:hover {
		color: var(--color-naylor-darker-grey);
	}
}



/*********************************************
 * *  Responsive Styling  * *
 *********************************************/

@media (max-width: 1200px) {
     {
    }
}

@media (max-width: 1024px) {
     {
    }
}

@media (max-width: 900px) {
     {
    }
}

@media (max-width: 768px) {
     {
    }
}

@media (max-width: 600px) {
     {
    }
}

@media (max-width: 480px) {
     {
    }
}

@media (max-width: 320px) {
     {
    }
}
