/*!
Theme Name: Glazing Solutions South West
Author: Charlie @ Aztec Media
Author URI: https://aztec.media/
Description: Bespoke Theme for Glazing Solutions South West
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.0
Requires PHP: 8.2


BlankSlate WordPress Theme © 2024 Aztec Media
*/




html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}



img {
	object-fit: 100%;
}

body {
	line-height: 1.5;
	color: var(--black);
}

ul {
	list-style: none;
}

.inner__about__text ul {
	list-style: square;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

*, *::before, *::after {
	box-sizing: border-box;
	letter-spacing: 1px;
	line-height: 1.5;
  }

html {
	background-color: var(--dark-blue);
	overflow-x: hidden;
}

a {
	color: currentColor;
	text-decoration: none;
	display: inline-block;
}

:root {
--dark-green: #437810;
--green: #77BE34;
--grey: #F8F8F8;
--light-grey: #FCFCFC;
--white: white;
--black: #333333;
--dark-grey: #575757;
}

h1, h2 {
    font-family: "Phudu", serif;
}

h3, h4, h5, p, span, a {
    font-family: "Outfit", Arial, Helvetica, sans-serif;
}

header {
	display: flex;
	
	padding: 3rem 4rem 1rem 4rem;
	justify-content: space-between;
	align-items: center;
}

header ul {
	display: flex;
	align-items: start;
	gap: 2rem;
}


header a {
	color: var(--dark-grey);

	font-weight: 300;
	font-size: 1rem;
}



header svg {

	width: 12rem;
}

.cta__button {
	display: inline-block;
	background-color: var(--dark-green);
	padding: 1rem 2rem;
	border-radius: 2rem;
	color: white;
	font-weight: 400;  
	text-decoration: none;
	font-size: 1.2rem;
	text-align: center;
	text-transform: unset;
	transition: ease-in-out 0.2s;
}

.active {
	font-weight: 600;
}



				.burger {
					display: none;
					padding: 0;
				}

				@media screen and (max-width: 1200px) {
					.burger {
						display: block;
						z-index: 99999;
					}

					.nav__link {
						display: none;
					}	
				}

				.burger span {
					width: 30px;
					height: 3px;
					margin: 5px;
					background-color: var(--green);
					transition: transform 0.3s ease;
					display: block;
					border-radius: 30px;
				}

				.burger  {
					background: none;
					border: none;
					appearance: none;
					cursor: pointer;
				}



				@media screen and (max-width: 1200px) {
					.nav-links {
						position: absolute;
						top: 0;
						right: 0;
						height: 100vh;
						width: 100%;
						color: var(--black);
						display: flex;
						flex-direction: column;
						align-items: center;
						transform: translate(0);
						transition: transform 0.5s ease-in;
						text-align: center;
						z-index: 9999;
						background: #ffffff;
					}

					header {
						padding: 2rem 4rem;
					}
					

				}

				
				.nav-links a {
					font-size: 1.5rem;
					text-decoration: none;
					font-weight: 600;
				}

				.burger.active .line1 {
					transform: rotate(45deg) translate(5px, 5px);
				}

				
				.nav-links {
					display: flex
				;
					justify-content: center;
					width: 100%;
					margin: 0;
					padding: 0;
				}


				@media screen and (min-width: 1200px) {
					.nav-links {
						display: none;
				}
				
			}

			@media screen and (max-width: 1200px) {
				.nav-links-desktop {
					display: none;
			}
			
		}

			.inner__page__height {
				height: 50vh;
			}

            .burger.active .line2 {
				opacity: 0;
			}

			.burger.active .line3 {
				transform: rotate(-45deg) translate(5px, -5px);
			}

			.nav-active {
				transform: translate(100%);
			}

			@media screen and (max-width: 1200px) {
				.burger {
					display: block;
					z-index: 99999;
				}
			}


			.hero__container {
				position: relative;
				margin: 0rem 4rem;
				overflow: hidden;
			}

			.overlay {
				height: 100%;
				width: 100%;
				position: absolute;
				background: rgba(0, 0, 0, 0.568);
			
			}

			.hero__text {
				width: 100%;
				padding: 8rem 4rem;
				position: relative;
				text-align: center;
				max-width: 70rem;
				margin: auto;
			}

			.hero__text h1 {
				font-size: 4rem;
				color: var(--white);
				margin-bottom: 1.5rem;
				line-height: 1.1;
			}

			.hero__text h2 {
				font-size: 1rem;
				font-family: "Outfit";
				color: white;
				margin-bottom: 1rem;
				text-transform: uppercase;
			}

			.hero__text p {
				color: var(--white);
				font-size: 1.2rem;
				line-height: 1.4;
				font-weight: 300;
			
			}

.hero__text .cta__button {
margin-top: 3rem;
}

			.button__container {
				display: flex;
				flex-wrap: wrap;
				gap: 2rem;
				padding: 2rem;
				justify-content: center;
			}

			.hero__container img {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				z-index: -1;
				object-fit: cover;
			}

strong {
font-weight: 700;
}

			.white {
				background-color: #F7F7F7;
				color: var(--black);
			}

			.hero__container::before {
				content: "";
				height: 6rem;
				width: 5rem;
				font-size: 2rem;
				color: white;
				position: absolute;
				bottom: 4rem;
				right: 4rem;
				z-index: 999;
				pointer-events: none; 
				border: solid 1px var(--white);
				background: url(./assets/img/hero__arrow.svg) no-repeat 50% 50%;
			
				padding: 2rem 3rem;
				border-radius: 50%;
			}



			.about__container {
				padding: 8rem 6rem;
				display: grid;
				grid-template-columns: 1fr 1fr;
				gap: 8rem;
				max-width: 1600px;
   				 margin: auto;
			}

			.about__container h2 {
				font-family: "Outfit";
				font-size: 3rem;
				font-weight: 600;
				color: var(--black);
			}

			.about__container p {
				font-size: 1.2rem;
				font-weight: 300;
				color: var(--dark-grey)
			}

			.ranges__wrapper {
				background-color: var(--grey);
			}

			.range__container {
				
				padding: 4rem 6rem 8rem 6rem;
				max-width: 1600px;
				margin: auto;
			}

			.title__and__button {
				display: flex;
				justify-content: space-between;
				grid-template-columns: 3fr 1fr;
				max-width: 1600px;
				margin: auto;
			}

			.title__and__button h3 {
				font-size: 2rem;
				font-weight: 600;
				align-self: end;
				color: var(--black)
			}
			
			.range__grid {
			padding: 2rem 0rem 0rem 0rem;
			display: grid;
			grid-template-columns: 1fr 1fr 1fr 1fr;
			margin: auto;
			width: 100%;
			gap: 50px;
			max-width: 1600px;
				margin: auto;
			}

			.range__grid img {
				width: 100%;
				height: 14rem;
				object-fit: cover;
				display: block;
				transition: ease-in-out 1s;
			}

			.range__item a {
				height: 100%;
				display: flex;
				flex-direction: column;
			}

			.range__item h3 {
				background-color: white;
				color: var(--black);
				font-size: 1.4rem;
				font-weight: 300;
				margin-top: 0;
				
			}

		
	        /* .range__item h3::after {
				content: "";
				height: 6rem;
				width: 6rem;
				font-size: 2rem;
				color: rgb(0, 0, 0);
				position: absolute;
				background: url(img/arrow2.png) no-repeat;
				z-index: 999;
				pointer-events: none; 
				transform: translate(120%, 15%);
			} */

			.usp__container {
				padding: 8rem 6rem;
			}

			.usp__grid {
				display: grid;
				grid-template-columns: 1fr 1fr 1fr;
				width: 100%;
   				 gap: 25px;
   				 max-width: 1600px;
   				 margin: auto;
			}

			.usp__item {
				padding: 2rem;
				display: flex;
				flex-direction: column;
				background-color: #FCFCFC;
				border: 1px solid #EDEDED;
			}

			.usp__item h2 {
				font-size: 2rem;
				margin-bottom: 1rem;
				color: var(--black);
			}

			.usp__item h3 {
				font-size: 1.5rem;
				margin-bottom: 1rem;
				font-weight: 500;
				color: var(--black);
			}

			.usp__item p {
				font-size: 1.2rem;
				color: var(--dark-grey);
				font-weight: 300;
			}

			.usp__item .cta__button {
				font-size: 1.2rem;
				margin-bottom: 0rem;
				max-width: max-content;
			}

			.first {
				background-color: white;
				border: none;
			}

			.first p {
				margin-bottom: 2rem;
				
			}

			.usp__item svg {
				height: auto;
				width: 48px;
				margin-bottom: 1rem;
			
			}
			
			#image-carousel {
				padding: 0rem 12rem 0rem 12rem;
				align-items: center;
			}

.splide {
visibility: unset !important;
}

			

			.splide__slide {
				display: flex;
				border: 1px solid #EEEEEE;
				justify-content: center;
				/* padding: 4rem 2rem; */
			} 

			.splide__slide img {
				padding: 2rem;
				object-fit: contain;
				width: 100%;
				height: 100%;
				max-height: 10rem;
			}

			.credentials__item img {
				height: 75px;
			}

			.left__arrow {
				display: flex;
				
				margin-left: 6rem;
				border: 1px solid #d4d4d4;
				text-align: center;
				justify-content: center;
				height: 50px;
				width: 50px;
				padding: 1rem;
				border-radius: 50%;
			}

			.right__arrow {
				display: flex;
				transform: rotate(180deg);
				margin-left: 6rem;
				border: 1px solid #d4d4d4;
				justify-content: center;
				text-align: center;
				height: 50px;
				width: 50px;
				padding: 1rem;
				border-radius: 50%;
			}

			
		.cta__section {
			display: grid;
			grid-template-columns: 1fr 1fr;
			padding: 6rem 6rem;
			gap: 10rem;
		}

		.cta__section__text {
			display: flex;
			justify-content: center;
			flex-direction: column;
		}

		.info__block .text h3 {
			font-size: 3rem;
			font-family: "Outfit";
			font-weight: 600;
			color: var(--black);
			margin-bottom: 40px;
			
		}

		.text p {
			font-size: 1.2rem;
			font-weight: 300;
			margin-bottom: 4rem;
			color: var(--dark-grey);
		}

		.cta__section img {
			width: 100%;
			max-height: 50rem;
		}

		footer {
			display: flex;
			flex-direction: row;
			padding: 4rem 6rem;
			background-color: var(--grey);
			gap: 50px;
		}

		.footer__link__container {
			display: flex;
			gap: 200px;
			margin-left: auto;
		}

		.footer__item {
			display: flex;
			flex-direction: column;
			gap: 1rem;
		}

	
		.footer__item img {
			margin-bottom: 2rem;
		}

		.footer__phone__number {
			font-weight: 500;
			font-size: 1.2rem;
			
		}

		.footer__email {
			font-weight: 500;
			font-size: 1.2rem;
		}

		.footer__item h3 {
			font-size: 1.3rem;
			font-weight: 500;
			margin-bottom: 1rem;
			color: var(--black);
		}

		.footer__item a {
			text-decoration: none;
			color: var(--dark-grey);
			font-weight: 400;
		}

		.copyright__container {
			background-color: var(--grey);
			padding: 6rem 6rem 2rem 6rem;
			font-weight: 300;		
		}

		.line {
			width: 100%;
			margin: auto;
			border-top: 1px solid rgb(228, 228, 228);	
		}

		.copyright__item {
			display: flex;
			flex-direction: row;
			gap: 3rem;
			text-align: center;
			padding-top: 2rem;
			font-size: 0.8rem;
		}

		.range__arrow  {
			width: 20px !important;
			height: 20px !important;
		}

		.range__button {
			display: flex;
			flex: 1;
			background-color: white;
			align-items: center;
			padding: 1rem 2rem;
			border: 1px solid #eeeeee;
			gap: 0.5rem;
		}

		.range__button img {
			height: 16px;
			width: auto;
			margin-left: auto;
		}






.info__block {
    padding: 2rem;
    display: grid;
    gap: 2rem;
    position: relative;
    max-width: 1600px;
	margin: auto;
}



.info__block .img {
    height: 40rem;
    border-radius: 4px;
    position: relative;
    transform-origin: left;
}


@media only screen and (min-width: 1024px) {
    .info__block {
        gap: 6rem;
        padding: 8rem 6rem;
    }
}
@media only screen and (min-width: 820px) {
    .info__block {
        grid-template-columns: 1fr 1fr;
        align-items: center;
    }
}

@media only screen and (min-width: 1440px) {
    .info__block .img {
        height: 44rem;
    }
}
@media only screen and (min-width: 1200px) {
    .info__block .img {
        height: 40rem;
    }
}
@media only screen and (max-width: 820px) {
    .info__block .img {
        height: 100%;
    }
	header svg {

		width: 8rem;
	}
}


.info__block .text {
    text-align: center;
}

@media only screen and (min-width: 1440px) {
    .info__block .text {
        max-width: 1024px;
    }
}
@media only screen and (min-width: 820px) {
    .info__block .text {
        text-align: left;
        max-width: 650px;
        padding: 2rem 0;
    }
}

figure {
    overflow: hidden;
    max-height: 40rem;
    object-fit: cover;
}
.info__block figure {
    width: 100%;
    height: 100%;
    max-height: inherit;
    min-height: inherit;
}

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

img.attachment-full.size-full {
    width: 100%;
}

.flipped img {
	transform: rotate(180deg);
}



#image-carousel  .splide__arrow img {
	height: 5rem;
	border: 1px solid rgb(205, 205, 205);
	border-radius: 50%;
	padding: 2rem 2.2rem;
}

#image-carousel .splide__arrow {
	background-color: transparent !important;
}

#image-carousel .splide__arrow--next {
	right: 7em;
}

#image-carousel  .splide__arrow--prev {
	left: 7em;
}

.copyright__flex {
display: flex;
gap: 50px;
justify-content: space-between;
}


@media only screen and (max-width: 1280px) {
	.hero__container {
		margin: 0;
	}
	
	.hero__text h1 {
	font-size: 3rem;
}

	.about__container {
		padding: 8rem 4rem;
	}

	.range__container {
		padding: 8rem 4rem;
	}

	.usp__container {
		padding: 8rem 4rem;
	}
	.footer__link__container {
		gap: 100px;
	}
}


@media only screen and (max-width: 1100px) {
	.usp__grid {
		grid-template-columns: 1fr 1fr;
	}

	.inner__cta__section {
		grid-template-columns: 1fr;
	}
	
	
}


@media only screen and (max-width: 950px) {

	
	#image-carousel .splide__arrow img {
	height: 3rem;
		padding: 1rem 1.1rem;
}
	
	.hero__container::before {
	display: none;
	}
	
	
	
	.about__container {
		grid-template-columns: 1fr;
		padding: 4rem;
		gap: 2rem;
	}
	.range__grid {
		grid-template-columns: 1fr 1fr;
	}
	.range__container {
		padding: 4rem;
	}
	.range__grid .range_image {
	height: 14rem;
	}
	
	.copyright__item {
		gap: 0.5rem;
	}
	
	.social__links {
text-align: center;
		justify-content: center;


}

	.copyright__container svg {
		text-align: center;
	}

	.info__block {
		grid-template-columns: 1fr;
		padding: 4rem;
	}
	.info__block .text {
		max-width: 100%;
	}
	footer {
		flex-direction: column;
		align-items: center;
		padding: 4rem;
	}
	.footer__item img {
		width: 16rem;
	}
	.footer__link__container {
		margin-left: unset;
		
	}
	.copyright__container {
		padding: 2rem;
	}
	.footer__item {
		text-align: center;
		flex: 1;
	}
	
	.usp__container {
		padding: 4rem;
	}

	.copyright__flex {
		flex-direction: column;
	}
	.copyright__item {
		flex-direction: column;
	}
	.usp__item h2 {
		font-size: 2rem;
	}
	.usp__item p {
		font-size: 1rem;
	}
}

@media only screen and (max-width: 700px) {
	
	
	
	
	.hero__container::before {
		display: none;
	}

	.about__container {
		padding: 2rem;
		gap: 4rem;
	}

	.range__container {
		padding: 2rem;
	}

	.button__container {
		flex-direction: column;
		align-items: center;
	}
	.cta__button {
		max-width: max-content;

	}
	.title__and__button {
		display: block;
	
	}
	.title__and__button h3 {
		margin-bottom: 1rem;
	}
	.title__and__button .cta__button {
		margin-bottom: 2rem;
	}
	.range__grid {
		grid-template-columns: 1fr;
	}
	.range__grid .range_image {
		height: 14rem;
	}
	.usp__grid {
		grid-template-columns: 1fr;
	}
	.usp__container {
		padding: 2rem;
	}
	.info__block {
		padding: 2rem;
	}

	.footer__link__container {
		flex-direction: column;
	}
	footer {
		padding: 2rem;
	}
	.footer__item {
		line-height: 1.5;
	}
	
	.footer__link__container {
		gap: 50px;
	}
	header {
		padding: 2rem;
	}
}

@media only screen and (max-width: 500px) {
	header {
		padding: 2rem;
	}
	.hero__text {
		padding: 4rem 2rem;
	}
	.hero__text h1 {
		font-size: 2.5rem;
	}
	.about__container {
		gap: 2rem;
	}
	.title__and__button h3 {
		text-align: center;
		
	}
	.title__and__button .cta__button {
		font-size: 1rem;
		}

		.usp__container {
			padding: 1rem;
		}
		.first {
			padding: 1rem;
		}
		#image-carousel {
		padding: 1rem;

		}
		#image-carousel .splide__arrow--prev {
			left: 3em;
		}

		#image-carousel .splide__arrow--next {
			right: 3em;
		}
		.splide__slide {
			border: none;
		}
		#image-carousel .splide__arrow img {
			border: none;
		}
		.title__and__button h3 {
			margin: auto;
		}
		.title__and__button {
			display: flex;
			flex-direction: column;
			align-items: center;
			gap: 1rem;
		}
		header {
			padding: 1rem 2rem;
		}

		.about__container h2 {
			font-size: 2rem;
		}
		.about__container p {
			font-size: 1rem;
		}
		.range__item h3 {
			font-size: 1.2rem;
		}
		.usp__item .cta__button {
			font-size: 1rem;
		}
		.usp__item h3 {
			font-size: 1.2rem;
		}
		.info__block .text h3 {
			font-size: 2rem;
		}
		.text p {
			font-size: 1rem;
		}
		.cta__button {
			font-size: 1rem;
		}
		.footer__phone__number {
			font-size: 1rem;
		}
		.footer__email {
			font-size: 1rem;
		}
		.footer__item h3 {
			font-size: 1.2rem;
		}
		.footer__item a { 
			font-size: 1rem;
		}
		.nav-links a {
			font-size: 1.2rem;
		}
		
} 




.small::before {
	content: none;
}

.small__text {
max-width: 60rem;
}

.inner__cta__section {
	display: grid;
	padding: 8rem 6rem;
	grid-template-columns: 2fr 1fr;
	gap: 2rem;
}

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

.inner__cta__text {
	background-color: #F1F7EA;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2rem;
	padding: 2rem 4rem;
}

.inner__cta__text h2 {
	font-size: 3rem;
}

.inner__cta__text p {
	margin-bottom: 2rem;
	font-size: 1.2rem;
	
}

.inner__cta__text .cta__button {
	max-width: max-content;
	transition: ease-in-out 0.2s;
}


@media only screen and (max-width: 1100px) {
	

	.inner__cta__section {
		grid-template-columns: 1fr;
		padding: 0;
		gap: 0;
	}
	.inner__cta__text {
		align-items: center;
		margin: 4rem 0rem 4rem 0rem;
	}

	.inner__cta__text p {
		max-width: 100%;
		text-align: center;
		gap: 1rem;
	}
	.inner__cta__text h2 {
		text-align: center;
	}
	.inner__cta__section img {
		display: none;
	}
}

.range__header {
	text-align: center;
	font-size: 2.5rem;
}

.inner__about__text {
	padding: 8rem 6rem 0rem 6rem;
	max-width: 1600px;
	font-weight: 300;
	background-color: var(--white);
	margin: auto;
}

.inner__about__text h3 {
	font-size: 2rem;
	font-weight: 500;
	font-family: "Phudu";
	padding-bottom: 1rem;
}

.inner__about__text p {
font-size: 1.2rem;
padding-bottom: 1.2rem;
}

.inner__about__text h2 {
font-size: 2rem; margin-top: 2rem; margin-bottom: 1.5rem;
}

.inner__about__text ul {
margin-left: 2rem;
}

.inner__about__text li {
font-size: 1.2rem;
	    font-family: "Outfit", Arial, Helvetica, sans-serif;
	margin-bottom: 1.2rem;
}

.inner__about__text li:last-of-type {
margin-bottom: 0;
}

.bold {
	font-weight: 500;
}

.brochure__container {
	padding: 4rem 6rem 8rem 6rem;
	
	
	width: 100%;
}

.flipping__book {
	
	height: 50rem;
	background-color: white;
	margin: auto;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 2rem;
	
	background-color: var(--grey);
}

.flipping__book iframe {
width: 100%;
height: 100%;
}

@media only screen and (max-width: 950px) {
	
	.flipping__book {
	
	height: 30rem;
	}
	
	.range__grid {
	gap: 25px;
}
	
	.inner__about__text {
		padding: 2rem;
	}

	.inner__cta__text {
		padding: 2rem;
	}

}

@media only screen and (max-width: 1200px) {
	.flipping__book {
		width: 100%;
	}

	.brochure__container {
		padding: 2rem;
	}

}

.form__container {
display: grid;
grid-template-columns: 1fr 1fr;
padding: 12rem 6rem;
	gap: 3rem;
}

.contact__text {
color: var(--dark-grey);
	font-weight: 500;
	position: relative;
}

.contact__text h2 {
	font-size: 3rem;
	margin-bottom: 3rem;
}

.wpcf7 label {
color: white;
	font-size: 1.2rem;
}

.wpcf7 input,
.wpcf7 textarea {
margin-bottom: 1rem;
width: 100%;
		border: none;
	background-color: #173038;
	font-size: 1.4rem;
	color: white;
	padding: 0.5rem;
}

.wpcf7 input {
	height: 4rem;
	
}

.wpcf7-submit {
	font-family: "Cabin";
	display: inline-block;
	padding: 1rem 2rem;
	background-color: var(--gold);
	text-transform: uppercase;
	color: white;
	font-weight: 600;
	cursor: pointer;
			
}

.wpcf7-submit:hover {
	background-color: var(--gold) !important;
}

.contact__text h3 {
font-size: 1.2rem;
color: var(--gold);
	margin-bottom: 0.5rem;
}

.contact__text h4 {
color: black; 
margin-bottom: 4rem;
	font-size: 1.5rem;
}

.wpcf7-response-output {
	color: white;
}

@media screen and (max-width: 1100px) {
	.form__container {
grid-template-columns: 1fr;
padding: 2rem;
gap: 10rem;


}

	.form__container iframe {
		height: 30rem;
	}


	.contact__text {
		order: 2;
	}
	footer {
padding-top: 2rem;
}
}


.contact__text::before {
			content: "";
			position: absolute;
			top: -10rem;
			left: 0;
			width: 40rem;
			height: 40rem;
			background: url("/wp-content/themes/glazingsolutions/assets/img/leaf.svg") no-repeat;
			background-size: contain;
			z-index: -1;
			opacity: 0.3;
		}

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

.whatsapp {
display: flex;
max-width: max-content;
align-items: center;
}

.whatsapp svg {
padding: 0.5rem;

}

.copyright__container svg {
padding: 1rem;
	width: 60px;
}

    .review__grid {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            gap: 25px;
            padding: 8rem 6rem;
           
            
        }

        .review__grid__item {
            display: flex;
            flex-direction: column;
            
            justify-content: center;
            text-align: center;
            background-color: #FCFCFC;
            border: 1px solid #EDEDED;
            padding: 2rem;
        }

        .stars {
            color: rgb(247, 211, 47);
            font-size: 1.5rem;
            margin: 0.5rem;
			margin-bottom: 1rem;
        }

        .review__text {
            line-height: 1.5;
            margin-bottom: 3rem;
        }


        .review__image__grid img {
            width: 45%;
            height: 15rem;
            object-fit: cover;
            aspect-ratio: 1 / 1;
        }


        .review__grid__item h3 {
            font-size: 1.8rem;
            margin: 0;
		
        }

        @media screen and (max-width: 1400px) {
            .review__image__grid img {
            width: 100%;
            height: 20rem;
            object-fit: cover;
        } 
        }

        @media screen and (max-width: 1100px) {
            .review__grid {
            
            grid-template-columns: 1fr;
          
        }

        .review__image__grid img {
        display: none;
        }
}



        @media screen and (max-width: 700px) {
			
			.flipping__book {
	
	height: 25rem;
			}


			.review__grid__item h3 {
			font-size: 1.5rem;
			}
			
			
            .review__grid {
            padding: 1rem;  
        }
			
			.hero__text .cta__button {
				margin-top: 0rem;
			}	
			
			.hero__text {
				padding: 4rem 2rem;
			}
			
			.review__text {
		margin-bottom: 0;
	}
        }


		.review__image__grid {
    	margin-top: auto;
	    }


	.testimonial__title {
	font-size: 3rem;
	text-align: center;
	padding: 6rem 0rem 3rem 0rem;
	}


@media only screen and (max-width: 950px) {
	
	.testimonial__title {
	padding: 3rem 2rem;
}
}

.social__svg {
width: 40px;
}


.social__svg:first-of-type {
margin-right: 1rem;
}

.hero__container:before {
 transition: transform 0.8s ease-in-out;
}
.hero__container:hover::before {
	transform: translateY(14px);

}

.cta__button:hover,
.hero__text .cta__button:hover
 {
background-color: #5faa17;
	 color: white;
}

.range__item {
 transition: transform 0.2s ease-in-out;
}

.range__item:hover {
transform: translateY(-2px);
	box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;

}

.range__item:hover img {
 transition: transform 0.4s ease-in-out;

}

.range__item:hover img {
transform: scale(1.02);
}

.usp__item h3 {
 transition: transform 0.2s ease-in-out;
}



.usp__item {
 transition: transform 0.2s ease-in-out;
}





.stars span {
  display: inline-block;
  transition: transform 0.3s;
}

.review__grid__item:hover .stars span {
  animation: bounce 0.4s ease forwards;
}

.review__grid__item:hover .stars span:nth-child(1) { animation-delay: 0s; }
.review__grid__item:hover .stars span:nth-child(2) { animation-delay: 0.1s; }
.review__grid__item:hover .stars span:nth-child(3) { animation-delay: 0.2s; }
.review__grid__item:hover .stars span:nth-child(4) { animation-delay: 0.3s; }
.review__grid__item:hover .stars span:nth-child(5) { animation-delay: 0.4s; }

@keyframes bounce {
  0%   { transform: translateY(0); }
  30%  { transform: translateY(-3px); }
  60%  { transform: translateY(3px); }
  100% { transform: translateY(0); }
}

.social__links {
    display: flex;
    align-items: center;
}

.gallery {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, 1fr);
    max-width: 80rem;
    margin: 0 auto;
	padding: 3rem 0;
}


.gallery__img {
    width: 100%;
    height: 16rem;
	object-fit: cover;
    border-radius: 0.5rem;
	transition: 1s ease;
}

.gallery__img:hover {
transform: scale(1.025);
}

@media (max-width: 720px) {  
    .gallery {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) { 
    .gallery {
        grid-template-columns: repeat(1, 1fr);
    }
}