@font-face {
	font-family: 'Pretty Dahlia';
	src: url('../fonts/pretty-dahlia.otf') format('opentype');
}

@font-face {
	font-family: 'Gilroy';
	src: url('../fonts/gilroy-semibold.ttf') format('truetype');
}

@font-face {
	font-family: 'Gilroy Medium';
	src: url('../fonts/gilroy-medium.ttf') format('truetype');
}

@font-face {
	font-family: 'Headliner';
	src: url('../fonts/headliner.ttf') format('truetype');
}

:root {
	--accent-color: #3e6143;
	--banner-font: 'Pretty Dahlia', cursive;
	--title-font: 'Gilroy', sans-serif;
	--body-font: 'Gilroy Medium', sans-serif;
	--ar-font: 'Headliner', sans-serif;
}

body,
p {
	font-family: var(--body-font) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.title,
.section-title {
	font-family: var(--title-font) !important;
}

.ar-font {
	font-family: var(--ar-font) !important;
}

.banner-font {
	font-family: var(--banner-font);
}

.discount-title {
	font-family: var(--title-font);
	font-size: 80px;
}

#logo img {
	height: 50px !important;
}

#header-wrap {
	border: 0;
}

.header-layer {
	width: 100%;
	height: 100px;
	position: absolute;
	left: 0;
	background-position: center;
	background-repeat: repeat;
	background-size: contain;
	z-index: -1;
}

.banner-layer {
	bottom: -1px;
	transform: rotate(180deg);
	width: 100%;
	height: 100px;
	position: absolute;
	left: 0;
	background-position: center;
	background-repeat: repeat;
	background-size: contain;
	z-index: 1;
}

#slider .swiper-slide-bg:after {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1;
}

#slider .slider-caption {
	position: relative;
	z-index: 2;
}

.about-card {
	background-color: #6e8872;
	padding: 20px;
	transition: .5s;
}

.about-card:hover {
	background-color: #9eafa1;
}

.about-card p,
.about-card h3 {
	color: #fff;
}

.accent-color {
	color: var(--accent-color);
}

.bg-accent {
	background-color: var(--accent-color)
}

.section-layer-bg {
	background-position: center;
	background-size: cover;
	width: 100%;
	height: 100px;
}

.bg-color-accent {
	background-color: rgb(110 136 114 / 12%);
}

.info-section .feature {
	transition: .5s;
	padding: 20px;
}

.info-section .feature:hover {
	background-color: var(--accent-color);
}

.info-section .feature:hover .feature-title,
.info-section .feature:hover .feature-description {
	color: #fff !important;
}

.product-card {
	background-color: #f4f4f4;
	/* Light gray background */
	border-radius: 10px;
	/* Rounded corners */
	padding: 20px;
	/* Add some padding */
	transition: transform 0.3s, box-shadow 0.3s;
	/* Smooth hover effects */
	text-align: center;
	/* Center content */
}

.product-card:hover {
	transform: scale(1.05);
	/* Slight zoom effect on hover */
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
	/* Shadow effect */
}

.product-card img {
	border-radius: 8px;
	/* Slight rounding for the image */
	transition: opacity 0.3s ease;
	/* Smooth image hover transition */
}

.product-card:hover img {
	opacity: 0.9;
	/* Slight fade effect on hover */
}

.product-card h4 {
	font-size: 1.1rem;
	color: #333;
	/* Dark gray text color */
	margin-top: 10px;
}

.contact-form-section:after {
	content: "";
	background-color: rgba(62, 96, 67, 0.5);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 0;
}

.contact-form-section .row {
	position: relative;
	z-index: 1;
}

.contact-form-section input,
.contact-form-section textarea {
	background-color: transparent !important;
	color: white !important;
}

.contact-form-section input::placeholder,
.contact-form-section textarea::placeholder {
	color: white !important;
}

.team-member {
	position: relative;
	overflow: hidden;
}

.team-member img {
	transition: transform 0.5s ease;
}

.team-member:hover img {
	transform: scale(1.1);
}

.team-info {
	position: absolute;
	bottom: -50% !important;
	left: 0;
	width: 100%;
	background-color: var(--accent-color);
	color: #fff;
	text-align: center;
	padding: 10px 0;
	transition: 0.5s;
}

.team-member:hover .team-info {
	bottom: 0 !important;
}

.team-card {
	position: relative;
}

.owl-dot {
	border-radius: 0 !important;
}