/*
Theme Name: Divi Child theme of Divi
Theme URI: 
Description: Child theme of Divi theme for the Divi theme
Author: <a href="http://www.elegantthemes.com">Elegant Themes</a>
Author URI: 
Template: Divi
Version: 4.24.2
*/

:root {
	--clr-primary: #ff003c;
	--clr-secondary: #000;
	--clr-light: #f2ebe7;

	--fnt-heading: 'Playfair Display SC', serif;
	--fnt-body: 'Work Sans', sans-serif;
}

/* typography */
#main-content h1,
#main-content h2,
#main-content h3,
#main-content h5 {
	text-transform: lowercase;
}

#main-content h1 {
	font-size: 150px !important;
	font-size: 7.82vw !important;
	font-weight: 900 !important;
}

#main-content h2 {
	font-size: 92px !important;
	font-size: 4.8vw !important;
	font-weight: 700 !important;
}

#main-content h3 {
	font-weight: 900 !important;
}

#main-content h5 {
	font-size: 32px !important;
	font-size: 1.67vw !important;
	font-weight: 700 !important;
}

.h3-alt h3 {
	display: inline-block;
	position: relative;
	font-family: --var(--fnt-body);
	font-size: 24px !important;
	font-size: 1.25vw !important;
	font-weight: 600 !important;
	text-transform: none !important;
}

#main-content p {
	font-size: 1.333em;
	font-weight: 400;
	letter-spacing: -1px;
	line-height: 1.4em
}

#hero h1 {
	margin-bottom: 30px;
	padding-bottom: 0;
}

.h2-alt h2 {
	padding-bottom: 0;
	font-family: var(--fnt-body) !important;
	font-size: 64px !important;
	font-size: 4vw !important;
	font-weight: 700 !important;
	letter-spacing: -2px;
	line-height: 1.1em;
	text-transform: none !important;
}

#hero h2 span.txt-sm {
	font-size: 32px;
	font-size: 1.76vw;
	font-weight: 400;
	line-height: normal;
}

.red {
	color: #ff003c;
}

span.underline {
	display: inline-block;
	position: relative;
}

span.underline:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 15%;
	bottom: 0;
	left: 0;
	background: var(--clr-primary);

	transition: height .3s ease-in;
	z-index: -1;
}

span.underline:hover:before {
	height: 80%;
}

/* header */
#header-main .et_pb_menu--with-logo .et_pb_menu__menu>nav>ul>li>a {
	padding: 0;
}

/* home */
.home #hero p {
	line-height: 0;
}

.portfolio-image-3-4 .et_portfolio_image {
	display: block;
	padding-top: 100%;
}

.portfolio-image-3-4 .et_portfolio_image img {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	object-fit: cover;
	object-position: top;
}

/* .home #work .et_pb_portfolio_grid .et_pb_portfolio_item .et_pb_module_header {
	position: absolute;
	padding: 0 30px;
	right: 0;
	bottom: 30px;
	left: 0;

	line-height: 1.2;

	opacity: 0;
	transform: translatey(0px);
	transition: all .2s ease-in;
	z-index: 3;
}

.home #work .et_pb_portfolio_grid .et_pb_portfolio_item:hover .et_pb_module_header {
	opacity: 1;
	transform: translatey(-30px);
} */

/* work */
.page-work .et_pb_filterable_portfolio .et_pb_portfolio_filters ul {
	display: flex;
	justify-content: center;
	gap: 2rem;
	margin: 0 0 30px;;

	& li {
		float: none;
		line-height: 2.5em;

		& a {
			position: relative;
			padding: 0;
			background: transparent;
			color: var(--clr-secondary);
			font-size: 2rem;
			border: 0;

			&:before {
				content: '';
				position: absolute;
				width: 100%;
				height: 15%;
				bottom: 0;
				left: 0;
				background: var(--clr-primary);
			
				transition: height .3s ease-in;
				z-index: -1;
			}

			&.active:before {
				content: '';
				position: absolute;
				width: 100%;
				height: 80%;
				bottom: 0;
				left: 0;
				background: var(--clr-primary);
			
				transition: height .3s ease-in;
				z-index: -1;
			}

			&:hover:before {
				height: 80%;
			}
		}
	}
}

.page-work .et_pb_filterable_portfolio .et_pb_portfolio_items h2 {
    font-size: 92px !important;
    font-size: 4.8vw !important;
}

/* project */
.single-project #hero h1 {
	font-size: 120px !important;
	font-size: 6.5svw !important;
}

.single-project #hero .et_pb_image_wrap img {
	height: 60rem;
	object-fit: cover;
	object-position: top;
}

.single-project #featured-img .et_pb_image_wrap {
	height: 70vh;
	object-fit: fill;
	overflow: hidden;
}

.single-project #featured-img .et_pb_image_wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	transition: all 5s ease-in-out;
}

.single-project #featured-img .et_pb_image_wrap:hover img {
	object-position: bottom center;
}

/* about */
.page-about .dtq-iconbox__desc {
	font-size: 24px !important;
	font-size: 1.25vw !important;
}

.page-about .experience ul {
	margin: 20px 0;
}

/* contact */
.page-contact .blockspam {
	display: none;
}

/* form */
.forminator-ui.forminator-custom-form[data-design=flat] .forminator-input,
.forminator-ui.forminator-custom-form[data-design=flat] select.forminator-select2+.forminator-select .selection span[role=combobox].select2-selection--single .select2-selection__rendered,
.forminator-ui.forminator-custom-form[data-design=flat] .forminator-textarea {
	padding: 1.5em !important;
	font-size: 20px !important;
}

/* buttons */
.btn-alt {
	padding: 0 45px 0 0 !important;
	border: 0 !important;
	border-bottom: 3px solid #000 !important;
	border-radius: 0 !important;
}

.btn-alt:after {
	margin-left: 0 !important;
	padding-left: .5em;
	border-bottom: 3px solid #000 !important;
}

.btn-alt:hover:after {
	border-bottom: 3px solid #ff003c !important;
}

/* THREE COLUMN PORTFOLIO GRID LAYOUT */
@media only screen and ( min-width: 980px ) {

	.et_pb_portfolio_grid_items .project {
		width: 31.333% !important;
		margin: 0 3% 3% 0 !important;
	}
	
	.et_pb_portfolio_grid_items .project:nth-child(3n) {
		margin-right: 0 !important;
	}

	.et_pb_portfolio_grid_items .project:nth-child(3n+1) {
		clear: left;
	}

	.et_pb_portfolio_grid_items .project:nth-child(4n+1) {
		clear: unset !important;
	}
	
	/* work */
	.page-work .et_pb_filterable_portfolio .et_pb_portfolio_items {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 3%;
	}

	.page-work .et_portfolio_image img {
		height: 50dvh;
		object-fit: cover;
		object-position: top center;
	}

}