/*
Theme Name: PWD Custom Impreza Child
Template: Impreza
Version: 1.0
Author:	PWD
Theme URI: https://pwd.com.au/
Author URI: https://pwd.com.au/
*/

/*Add your own styles here:*/


html {
	font-size:16px;
	scroll-behavior: smooth;
}
::placeholder {
	opacity:1;
}
h1, h2, h3, h4, h5, h6 {
	padding-top:unset;
	margin-bottom:0
}
::-webkit-scrollbar {
	width: 0px;
  background: transparent; /* make scrollbar transparent */
}
body.usb_preview [data-usbid]:has(>.w-grid) {
	width: 100%;
}

:root{
	--heading-primary-font: "Mona Sans",sans-serif;
	--rg-border-radius:0.5rem;
}

.xlg-font{
	font-family:var(--heading-primary-font);
	font-size:clamp(3rem, 6vw, 5rem);
	line-height:1;
	font-weight:600;
	margin-bottom:2rem;
	.w-text-value span{
		color: var(--color-glossy-aluminium);
		font-style: normal;
	}
}

.lg-font{
	font-family:var(--heading-primary-font);
	font-size:clamp(2.5rem, 5vw, 4rem);
	line-height:1;
	font-weight:600;
	padding-bottom:1.375rem;
	padding-top:0.625rem;
	.w-text-value span{
		font-weight: 300;
		font-style: normal;
	}
}

.md-font {
	font-family:var(--heading-primary-font);
	font-size:clamp(2.125rem, 4vw, 3.4375rem);
	font-style:normal;
	line-height:1;
	font-weight:600;
	text-wrap: balance;
	.w-text-value span{
		font-weight: 300;
		font-style: normal;
	}
}

.rg-font{
	font-family:var(--heading-primary-font);
	font-size:clamp(1.75rem, 3vw, 2.5rem);
	line-height:1;
	font-weight:600;
	em{
		font-weight: 300;
		font-style: normal;
	}
}

.sm-font{
	font-family:var(--heading-primary-font);
	font-size:clamp(1.5rem, 2.5vw, 2rem);
	line-height:1;
	font-weight:600;
}
.xsm-font{
	font-family:var(--heading-primary-font);
	font-size: 1.3rem;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 3.2px;
	text-transform: uppercase;
}

.md-gap {
	gap:clamp(2rem, 4vw, 4rem);
}
.md-mb{
	margin-bottom:clamp(2rem, 4vw, 4rem) !important;
}
.rg-gap {
	gap:clamp(1.25rem, 2.5vw, 2rem);
}
.sm-gap {
	gap:1.375rem;
}
/* Layout */
.default-padding{
	padding-top: 6rem;
	padding-bottom: 6rem;
}
#black-box-section {
    margin: 0 30px;
    overflow: hidden;
		border-radius: var(--rg-border-radius);
}
.to-horizontal {
	flex-direction: row;
}
.to-vertical {
	flex-direction: column;
}
.rg-br{
	border-radius: var(--rg-border-radius);
}
.dotstyle_circle .owl-dot span{
	border:1px solid var(--color-site-black);
}
.owl-carousel.dotstyle_circle .owl-dot.active span{
	background: var(--color-site-orange) !important;
}
/* Header */
.w-nav .menu-item{
	line-height:2 !important;
}
.header_hor .w-nav.type_desktop>.w-nav-list {
	gap: 10px;
}

.header_hor .w-nav.type_mobile.m_layout_dropdown .w-nav-list.level_1 {
        padding-top: 20px !important;
        padding-bottom: 20px !important;  
}

/* Landing */

/* Banner styling */
#banner-row {
  min-height: 685px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Only target v-wrapper inside THIS main-row */
#banner-row .w-vwrapper {
  max-width: 758px;
  width: 100%;
}

.partners-grid{
	width: 100%;
}
.partner-wrap {
 	 padding: 5px;
	min-height: 150px;
	align-items: center !important;
	background: var(--color-site-white);
 	border-radius: var(--rg-border-radius);
	justify-content: center;
}

.partner-wrap img {
	max-height: 150px;
  width: auto !important;;
  object-fit: contain;
}

/* Benefit Three Column Section */
.benefits-carousel{
	.benefit-title{
		font-style: italic !important;
	}
	.w-vwrapper{
		border-radius: var(--rg-border-radius);
		background: var(--color-site-white);
		padding: 3.5625rem 2.0625rem;
		height: 100%;
	}
	.benefit-icon{
		aspect-ratio: 19/24;
		max-width: 95px;
	}
}


/* Steps block */
.step-number .w-text-value {
	color: var(--color-light-gray);
  font-size: clamp(2.75rem, 4.5vw, 5rem); /* 80px max */
  font-style: normal;
  font-weight: 600;
  line-height: 1;
}

.step-cta-col {
  width: 485px;
}

.step-cover-image{
	margin: 0 0 0 auto;
}
.step-cover-image .w-image-h {
  aspect-ratio: 19 / 13;
	max-width: 665px;
}

.step-cover-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
	border-radius: var(--rg-border-radius);
}
#how-it-works-row{
	padding-bottom:clamp(2rem, 4vw, 4rem) !important;
	padding-top:clamp(2rem, 4vw, 4rem) !important;
	border-bottom:1px solid rgba(0, 0, 0, 0.40);
}


/* Square Grid List Section */

.perks-grid{
    .square-block{
        padding: 2.18rem 1.5rem 3.18rem 1.5rem;
        position: relative;
        border-radius: var(--rg-border-radius);
        overflow: hidden;
        height: 100%;
    }

    .square-block > *{
        z-index: 2;
		text-align:left;
    }

    .square-block::after{
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.75) 0%, rgb(0 0 0 / 38%) 100%);
        transition: 0.2s ease-in;
    }

    .benefit-title{
        max-width: 315px;
        text-wrap: balance;
		text-transform:uppercase;
    }

    .benefit-desc{
        opacity: 0;
        display: -webkit-box !important;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        transition: 0.2s ease-out;
    }

    .benefit-cta-btn{
        opacity: 0;
        transition: 0.2s ease-out;
		tex-wrap:balance;
    }

    .square-block:hover{
        &:after{
            background: linear-gradient(0deg, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.75) 100%);
        }
        .benefit-desc,
        .benefit-cta-btn{
            opacity: 1;
            transition: 0.5s ease-in;
        }
    }
}
/* Internal Pages */
#internal-banner {
  min-height: 447px;
  display: flex;
  align-items: center;
}
.potrait-ratio{
	aspect-ratio: 1/2;
}
.potrait-ratio-21-37{
	aspect-ratio: 21/37;
}
.ratio-13-11{
	aspect-ratio: 13/11;
}

.partner-block{
	aspect-ratio: 1/1;
	border-radius: var(--rg-border-radius);
	overflow: hidden;
	background: var(--color-site-white);
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	padding: 2.1rem 1.5rem;
	position: relative;
	&> *{
		z-index: 2;
	}
	img{
		width: auto !important;
		height: 100%;
		object-fit: contain;
	}
	&:after{
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: linear-gradient(180deg, rgba(0, 0, 0, 0.75) 0%, rgb(0 0 0 / 38%) 100%);
	}
	.w-btn{
		cursor:auto;
	}
}


.partners-main-wrapper {
	display: grid !important;
	grid-template-columns: repeat(4,1fr);
	gap: 5px;
}
.partner-name{
	color: var(--color-site-white);
}
/* Gravity Form */
.gform_wrapper.gravity-theme .gfield textarea.large{
	height: 226px;
}

.gchoice{
	align-items: center;
	.gfield-choice-input{
		border: 1px solid var(--color-light-gray);
    height: 1em;
    width: 1em;
		border-radius: unset;
	}
	input[type=checkbox]:before{
		font-size: 0.8em;
		line-height: 1.2em;
	}
}
.gform_wrapper.gravity-theme .gfield-choice-input+label {
    color: var(--color-light-gray);
}
.gform_button.button{
	min-width: 180px;
	margin-top: 10px;
}
.gform_confirmation_message, .form_saved_message_sent{
	color: var(--color-site-orange);
}
/* Footer */
.footer-main-wrap{
	gap: 0.5rem;
	flex-wrap: wrap;
	#menu-footer-menu a,p{
		color: var(--color-light-gray);
	}
}
.footer-social-wrap{
	gap:1rem;
	flex-shrink: 0;
}
.w-image.footer-social-icon{
	max-width: 20px;
	flex-direction: row;
	gap:1rem;
	img{
		object-fit: contain;
	}
}
@media (max-width: 1280px) {
	.partners-main-wrapper {
		grid-template-columns: repeat(2,1fr);
	}
}
/* Stack to single column */
@media (max-width: 1100px) {
  .step-main-wrapper {
    flex-direction: column;
  }

  .step-number,
  .step-cta-col,
  .step-cover-image {
    width: 100%;
  }
}
@media (max-width: 1024px) {
    .l-section.height_large {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

@media (max-width: 900px) {
	.w-btn{
		font-size:0.8rem !important;
	}
	.g-cols.via_grid{
		gap:2rem;
	}
	#steps-row{
		grid-template-columns:1fr 1fr 1fr;
	}
	.square-grid-wrapper{
	 	grid-template-columns: repeat(2, 1fr);
	}
	.benefit-main-wrapper{
		grid-template-columns: 1fr;
	}
	.square-grid-wrapper{
		grid-template-columns: 1fr;
	}
	.potrait-ratio,
	.potrait-ratio-21-37{
		aspect-ratio: 1/1;
	}
	.perks-grid {
    	.benefit-desc,.benefit-cta-btn{
			opacity:1;
			width:fit-content;
    	}
		 .square-block{
        &:after{
            background: linear-gradient(0deg, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.75) 100%);
        }
	}
}
@media (max-width: 768px) {
	#steps-row{
		grid-template-columns:1fr;
		.vc_column_container{
			padding-bottom:1rem;
			border-bottom:1px solid #00000069;
		}
	}
}
@media (max-width: 600px) {
	.partners-main-wrapper {
		grid-template-columns: 1fr;
	}
}