/* 
Theme Name:   Twenty Twenty Two
Description:  Twenty Twenty Two theme custom
Author:       Christopher BLAUD
Author URI:   https://cblaud.com
Template: twentytwentytwo
*/

*, ::before, ::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	text-wrap: balance;
}

@font-face {
	font-display: swap;
	font-family: 'Radio Canada';
	font-style: normal;
	font-weight: 300;
	src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-300.woff2') format('woff2'),
		 url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-300.ttf') format('truetype');
  }

  @font-face {
	font-display: swap;
	font-family: 'Radio Canada';
	font-style: normal;
	font-weight: 400;
	src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-regular.woff2') format('woff2'),
		 url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-regular.ttf') format('truetype');
  }

  @font-face {
	font-display: swap;
	font-family: 'Radio Canada';
	font-style: normal;
	font-weight: 500;
	src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-500.woff2') format('woff2'),
		 url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-500.ttf') format('truetype');
  }

  @font-face {
	font-display: swap;
	font-family: 'Radio Canada';
	font-style: normal;
	font-weight: 600;
	src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-600.woff2') format('woff2'),
		 url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-600.ttf') format('truetype');
  }

  @font-face {
	font-display: swap;
	font-family: 'Radio Canada';
	font-style: normal;
	font-weight: 700;
	src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-700.woff2') format('woff2'),
		 url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/radio-canada-v21-latin-700.ttf') format('truetype');
  }

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-100.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-100.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 200;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-200.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-200.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-300.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-300.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-regular.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-regular.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-500.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-500.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-600.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-600.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-700.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-700.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 800;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-800.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-800.ttf') format('truetype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Inter';
  font-style: normal;
  font-weight: 900;
  src: url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-900.woff2') format('woff2'), 
       url('https://baillonvtc.com/wp-content/themes/twentytwentytwo-child/fonts/inter-v13-latin-900.ttf') format('truetype'); 
}

/* Animation */
@keyframes pulse-animation {
	0% {
		filter: drop-shadow(0 0 0px rgba(0, 0, 0, 0.2));
	}
	100% {
		filter: drop-shadow(0 0 0px rgba(0, 0, 0, 0));
	}
}

.pulse {
	animation: pulse-animation 2s infinite;
}

html {
	scroll-behavior: smooth;
}

h1 {
	font-size: 55px;
}

h1 strong {
	position: relative;
	white-space: nowrap;
}

h1 strong::before {
    content: "";
    display: flex;
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 45%;
    background-color: var(--wp--preset--color--orange-primary);
}

.heading-strong .letter {
	display: inline-block;
	line-height: 1em;
}

h2 .letter {
	display: inline-block;
	line-height: 1em;
	transform-origin: 0 0;
  }

.fw {
	width: 100%;
}

.justify-content-center {
	justify-content: center!important;
}

.align-items-center {
	align-items: center!important;
}

.text-align-center {
	text-align: center!important;
}

.wp-site-blocks {
	padding: 0;
	overflow-x: hidden;
}

header.wp-block-template-part {
	position: fixed;
	z-index: 10;
	width: 100%;
}

.main-content {
	margin: 0;
	padding-top: 94px;
}

.lottie {
	display: flex;
	position: fixed;
	z-index: 3;
	cursor: pointer;
	bottom: 16px;
	right: 16px;
}

header .header-container {
	background-color: var(--wp--preset--color--white);
    background-position-x: 180px;
    background-repeat: no-repeat;
    background-position-y: 0;
}

section {
	padding: 96px;
	gap: 96px;
}

footer {
	padding: 112px 80px!important;
}

a {
	text-decoration: none;
}

p {
	line-height: 30.1px;
}

.img-container {
	display: flex;
}

.hero-section {
	position: relative;
	width: 100%;
	padding-left: 200px;
}

.hero-section::after {
	content: "";
	display: flex;
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.7) 35.42%, rgba(0, 0, 0, 0.49) 55.21%, rgba(0, 0, 0, 0.00) 86.46%);
}

.text-content {
	display: flex;
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 680px;
	overflow: hidden;
}

.about-img {
	flex: 0 1 530px;
}


.flex-50 {
	flex: 1;
}

#mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_1 > li.mega-menu-item > a.mega-menu-link {
	font-family: var(--wp--preset--font-family--radio-canada);
}

#mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_1 > li.mega-menu-item > a.mega-menu-link:hover {
	transition: all 250ms linear;
	color: var(--wp--preset--color--black-night);
}

.reasons {
	margin-top: -6px;
}

.reasons-bg {
	background-position-y: center;
}

.reasons > div {
	flex: 1;
}

.reasons .text {
	padding: 112px;
}

.cta {
	display: flex;
	padding: 24px 32px;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	position: relative;
	width: fit-content;
	overflow: hidden;
	background-color: var(--wp--preset--color--black-night);
	text-decoration: none;
	transform: skewX(-20deg);
}

.cta::after {
	content: "";
	display: flex;
	position: absolute;
	z-index: 1;
	width: 120%;
	height: 100%;
	background-color: var(--wp--preset--color--white);
	transform: scaleY(0);
	transition: transform 400ms ease-out;
}

.cta:hover::after {
	transform: scaleY(1);
}

.cta:hover span {
	color: var(--wp--preset--color--black-night);
}

.cta span {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 14px;
	font-weight: 700;
	line-height: 14px;
	text-transform: uppercase;
	position: relative;
	z-index: 2;
	color: var(--wp--preset--color--white);
	transform: skewX(20deg);
	transition: color 400ms ease-out;
	transition-delay: 100ms;
}

.cta.orange {
	background-color: var(--wp--preset--color--orange-primary);
}

.cta.white-stroke {
	background-color: transparent;
	border: 1px solid var(--wp--preset--color--white);
}

.services {
	background-size: contain!important;
	background-repeat: no-repeat;
}

.services-card {
	max-width: 370px;
}

.fw {
	width: 100%;
}

.footer-nav {
	margin-left: 16px!important;
}

.footer-nav li {
	font-family: var(--wp--preset--font-family--inter);
	font-weight: 400;
	color: var(--wp--preset--color--grey);
    list-style-type: "➡";
	white-space: nowrap;
    padding-left: 12px;
}

.footer-message {
	width: 100%;
	max-width: 350px;
}

.footer-element {
	flex: 1 1 300px;
}

.flex-shrink-0{
	flex-shrink: 0;
}

/* Form */

.form-container {
	padding: 64px 48px!important;
	max-width: 1216px;
}

.wp-block-contact-form-7-contact-form-selector, #wpcf7-f363-p11-o1 {
	display: flex;
	justify-content: center;
	width: 100%;
}

.wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
	max-width: 700px;
}

.wpcf7-form button {
	border: none;
	margin: auto;
	margin-top: 42px;
}

.wpcf7-form label {
	display: flex;
	align-items: center;
	position: relative;
}

.wpcf7-form label svg {
	position: absolute;
	z-index: 2;
	left: 24px;
	top: 15px;
	height: 20px;
}

.wpcf7-form label span {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.wpcf7-form label input, .wpcf7-form label textarea {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 14px;
	font-weight: 700;
	line-height: normal;
}

.wpcf7-form label input::placeholder, .wpcf7-form label textarea::placeholder {
	color: #74787C;
	font-weight: 500;
}

.wpcf7-form label input {
	width: 100%;
	height: 48px;
	border: none;
	padding: 0 24px 0 61px;
}

.wpcf7-form label textarea {
	border: none;
	resize: none;
	padding: 24px;
}

.wpcf7-form label input[type="checkbox"] {
	width: fit-content;
	margin-right: 16px;
	height: auto;
}

.wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item {
	margin: 0;
}

.wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item .wpcf7-list-item-label {
	font-family: var(--wp--preset--font-family--inter);
    font-size: 14px;
    font-weight: 500;
}

.wpcf7-form .wpcf7-not-valid-tip {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 14px;
}

.wp-block-social-links .wp-social-link {
	border: 1px solid;
	padding: 12px;
}

@media screen and (max-width: 1024px) {
	.main-content .hero-section {
		align-items: center;
		margin-right: 0;
		background-position-x: 100%;
	}

	.hero-section::after {
		background: rgba(0, 0, 0, 0.7);
	}

	.header-container .cta {
		display: none;
	}

	.main-content {
		padding-top: 72px;
	}

	.services {
		background-size: 300%!important;
		background-position-x: center;
	}

	.column-shape {
		display: none;
	}

	#mega-menu-wrap-max_mega_menu_1{
		position: unset;
	}

	#mega-menu-wrap-max_mega_menu_1 #mega-menu-max_mega_menu_1 > li.mega-menu-item > a.mega-menu-link:hover {
		transition: all 250ms linear;
		color: var(--wp--preset--color--orange-primary);
	}

	.reasons {
		flex-direction: column;
	}

	.reasons .text {
		padding: 80px 32px;
	}

	.reasons-bg {
		width: 100%;
	}

	#mega-menu-wrap-max_mega_menu_1 .mega-menu-toggle + #mega-menu-max_mega_menu_1 {
		top: 0;
		left: 0;
		z-index: 10;
		height: 100vh;
		padding-top: 96px;
		padding-left: 16px;
	}

	#mega-menu-wrap-max_mega_menu_1 .mega-menu-toggle {
		position: absolute;
		left: 50%;
		transform: translate(-50%, -50%);
		z-index: 20;
	}
}

@media screen and (max-width: 768px) {
	.justify-content-xs-start {
		justify-content: flex-start!important;
	}

	.align-items-xs-start {
		align-items: flex-start!important;
	}
	
	.text-align-xs-start {
		text-align: start!important;
	}

	section, footer {
		padding: 56px 32px!important;
		gap: 72px;
	}

	.hero-section {
		padding-left: 32px;
	}

	h1 {
		font-size: 36px!important;
		line-height: 46.2px!important;
	}

	h2 {
		font-size: 36px!important;
		line-height: 46.2px;
	}

	.cta {
		width: 100%;
	}

	.wp-site-blocks .header-container {
		padding: 16px 24px!important;
		justify-content: center;
	}

	.nav-container {
		width: 100%;
		justify-content: space-between;
	}


	.text-content {
		overflow: visible;
	}

	.hero-cta-container{
		padding-left: 0!important;
	}

	#mega-menu-wrap-max_mega_menu_1 .mega-menu-toggle {
		left: unset;
		right: 0;
		transform: translate(-50%, -50%);
		z-index: 20;
	}

	.p-0 {
		padding: 0!important;
	}

	.form-container {
		padding: 56px 32px!important;
	}
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	section {
		padding: 80px 96px;
	}

	section.vertical {
		flex-direction: column;
	}

	.hero-section {
		padding-left: 96px;
	}

	.cta {
		width: fit-content;
	}


	#mega-menu-wrap-max_mega_menu_1 .mega-menu-toggle {
		left: unset;
		right: 0;
		transform: translate(-50%, -50%);
		z-index: 20;
	}

	.reasons .text {
		padding: 80px 96px;
	}

	.form-container {
		padding: 72px 96px!important;
	}
}