/**
 * Theme Name:       Mai Sleek
 * Theme URI:        https://bizbudding.com/mai-theme/
 * Description:      Mai Sleek child theme for the Genesis Framework.
 * Author:           BizBudding Inc.; Design by Rafal Tomal
 * Author URI:       https://bizbudding.com/
 * Version:          2.1.1
 * Text Domain:      mai-sleek
 * Template:         genesis
 * Template Version: 3.3.5
 * License:          GPL-2.0-or-later
 * License URI:      http://www.gnu.org/licenses/gpl-2.0.html
 */

@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {
	--body-font-family: "Poppins", sans-serif !important;
	--heading-font-family: "Poppins", sans-serif !important;
	--alt-font-family: "Playfair Display", serif !important;
	--body-font-weight: 400;
	--body-font-size: 18px;
	--heading-font-weight: 600;
	--heading-line-height: 1.15;
	--button-font-weight: 700;
	--button-border-radius: 0;
	/* --button-box-shadow: var(--shadow); */
	--color-body: #4e575f;
	--color-link: var(--color-body);
	--color-accent: #eac35c;
	--color-primary-100: #ecf5fd;
	--color-primary-200: #d0e7fb;
	--color-primary-300: #aad4f8;
	--color-primary-400: #83c0f5;
	--color-primary-500: #58acf2;
	--color-primary: #3e88c5;
	--color-primary-700: #316e9f;
	--color-heading: #214d72;
	--color-primary-900: #123048;
	--border: 1px solid rgba(0, 0, 0, 0.2);
	--sub-menu-font-size: var(--font-size-base);
	--color-shadow: rgba(10, 20, 30, 0.3);
	--shadow: 0 0.25em 1em 0 var(--color-shadow);
	--menu-font-family: var(--body-font-family);

	/* --link-text-decoration-hover */
	--content-sidebar-wrap-margin-top: calc(var(--spacing-xxl) * 2);
	--site-header-box-shadow: var(--shadow);
}

body {
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0.031rem;
	font-kerning: auto;
	font-feature-settings:
		"ss04" 1,
		"kern" 1,
		"ss01" 1;
}

.entry-content a:not(a.button):not(.entry-title-link) {
	text-underline-offset: 2px;
	text-decoration: underline;
	text-decoration-skip-ink: auto;
	text-decoration-thickness: 2px;
	text-decoration-color: var(--color-primary);
	&:hover {
		background-color: var(--color-primary-300);
		text-decoration: none;
	}
}
/* .entry-content a:not(a.button):not(.entry-wrap) .entry-title-link {
	--ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
	color: var(--color-link);
	text-decoration: underline;
	text-decoration-color: var(--color-primary-500);
	text-decoration-thickness: 2px;
	text-underline-offset: 2px;
	background-image: linear-gradient(
		transparent 50%,
		var(--color-primary-500) 50%
	);
	background-size: 0 100%;
	background-repeat: no-repeat;
	will-change: background-size;
	transition: background-size 0.3s var(--ease-in-out);
	display: inline;
	&:hover {
		background-size: 100% 100%;
	}
} */

.balance {
	text-wrap: balance;
}

.round img {
	border-radius: 99%;
}

.two-col > .wp-block-group__inner-container {
	columns: 2 200px;
	column-gap: 2em;
}
.three-col > .wp-block-group__inner-container {
	columns: 3 200px;
	column-gap: 2em;
	h2 {
		column-span: 2;
	}
}

/* .before-header {
	border-top: 6px solid var(--color-primary-400);
	background-color: var(--color-white);
} */

h1,
h2,
h3 {
	line-height: 1.15;
	/* font-weight: 700 !important; */
	font-optical-sizing: auto;
	letter-spacing: -0.5px;
}

.page-header {
	background: none;
	.page-header-image {
		left: 0;
		width: 100%;
	}
}

/* .content-sidebar-wrap {
    margin: var(--content-sidebar-wrap-margin-top) auto var(--content-sidebar-wrap-margin-bottom);
    max-width: var(--wrap-max-width);
    width: calc(100% - var(--side-spacing) * 2);
} */
/*
.entry-grid {
	&.is-column {
		--border: 1px solid rgba(0, 0, 0, 0.2);
		border: var(--border);
	}
	.entry-wrap {
		background: var(--color-white);
		.entry-grid .entry-image-link {
			background-color: #0066cc !important;
		}
		.entry-title {
			background-color: var(--color-white);
			max-width: 100%;
			width: 75%;
			padding: var(--spacing-base);
			padding-bottom: 0;
			margin-left: 0;
			margin-top: calc(var(--spacing-base) * -2);
		}
		.entry-excerpt {
			padding: 0 var(--spacing-base);
		}
		.entry-more {
			padding-left: var(--spacing-base);
			padding-bottom: var(--spacing-lg);
		}
	}
} */

/* --------------------------------- buttons -------------------------------- */

.menu-item-button {
	&.button-arrow a span::after {
		display: inline-flex;
		width: 1rem;
		height: 1rem;
		background: white;
		mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Pro 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2025 Fonticons, Inc.--><path d="M489.4 233.4L512 256l-22.6 22.6-128 128-22.6 22.6L293.5 384l22.6-22.6L389.5 288 32 288 0 288l0-64 32 0 357.5 0-73.4-73.4L293.5 128l45.3-45.3 22.6 22.6 128 128z"/></svg>');
		mask-position: 50%;
		margin-left: 0.5em;
		mask-repeat: no-repeat;
		mask-size: contain;
		transition: var(--transition);
		content: "";
	}

	&.is-style-button-arrow a:hover::after {
		transform: translateX(4px);
	}
}

@media only screen and (min-width: 400px) {
	/* Your CSS here. */
}

@media only screen and (min-width: 600px) {
	/* Your CSS here. */
}

@media only screen and (min-width: 800px) {
	.menu-toggle-icon,
	.menu-toggle-icon::before,
	.menu-toggle-icon::after {
		width: calc(var(--spacing-sm) * 2) !important;
	}
	p.site-title {
		margin-bottom: 0 !important;
	}
}

@media only screen and (min-width: 1000px) {
	/* Your CSS here. */
}

.wp-block-buttons.push {
	margin-top: calc(var(--spacing-xl) * -1);
	.wp-block-button a {
		padding: 1.5rem 2rem;
	}
}

a.wp-block-button__link.button {
	--button-text-decoration: none;
	--button-link-color: var(--color-white);
	text-decoration: none;
}

.button-link::after,
.button-link:visited::after {
	mask-size: contain;
	mask-size: 1cap;
	margin-left: 0.2em;
}

.wp-block-button.is-style-dark {
	.wp-block-button__link {
		--button-background: var(--color-heading);
		--button-background-hover: var(--color-primary-900);
	}
}

.wp-block-embed figcaption {
	text-align: left;
}

.entry-more-link.button-link {
	color: var(--color-body);
	text-decoration: underline;
	text-decoration-color: var(--color-link);
	text-decoration-thickness: 2px;
}

.nav-header {
	--menu-font-size: var(--font-size-base);
	--menu-font-weight: 600;
	--menu-item-link-color: var(--color-body);
	/* background-color: var(--color-primary); */
}

.site-title {
	/* font-family: var(--alt-font-family);
	font-size: var(--font-size-xl);
	letter-spacing: -0.6px;
	font-weight: 600;
	margin-bottom: var(--spacing-xs); */
}

.note {
	background-color: var(--color-primary-200);
	padding: 1rem;
	font-size: var(--font-size-base);
}
.wide-content.content-left {
	.entry {
		width: var(--breakpoint-md);
		margin-left: 0 !important;
	}
}

.wp-block-media-text.has-media-on-the-left .wp-block-media-text__content {
	margin-right: -150px;
}

.wp-block-media-text:not(.has-media-on-the-right)
	.wp-block-media-text__content {
	margin-left: -150px;
	background-color: var(--color-white);
}

@media (max-width: 640px) {
	.wp-block-media-text:not(.has-media-on-the-right)
		.wp-block-media-text__content {
		margin-left: 0px !important;
	}

	.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
		margin-right: 0px !important;
	}
}
footer {
	.wp-block-group {
		/* background: url("assets/images/nick-nickkey.svg") repeat; */
		font-size: var(--font-size-base);
		p {
			margin-bottom: var(--spacing-xxxs);
			color: rgba(255, 255, 255, 0.8);
		}
		a {
			text-underline-offset: 2px;
			color: var(--color-primary-300);
			&:hover {
				text-decoration: none;
				color: var(--color-primary-300);
			}
		}
	}
}

#wpforms-2948.wpforms-container {
	--input-font-size: var(--body-font-size);
	.wpforms-field-label {
		font-weight: 600;
		font-size: var(--font-size-sm);
		padding-bottom: var(--spacing-xs);
		.wpforms-required-label {
			color: var(--color-primary);
			font-weight: 600;
		}
	}
	.wpforms-field-checkbox {
		font-size: var(--font-size-sm) !important;
	}
}

@media only screen and (min-width: 400px) {
	/* Your CSS here. */
}

@media only screen and (min-width: 600px) {
	/* Your CSS here. */
}

@media only screen and (min-width: 800px) {
	/* Your CSS here. */
}

@media only screen and (min-width: 1000px) {
	.menu-item-link.button {
		--button-background: black;
		--button-color: white;
		--button-background-hover: var(--color-heading);
		--button-color-hover: white;
		--button-border: 0;
		span {
			padding-left: var(--spacing-sm);
			padding-right: var(--spacing-sm);
		}
	}
	.nav-header-right {
		font-weight: 600;
		.sub-menu {
			--menu-item-width: 100%;
			--menu-item-link-width: 100%;
			--menu-item-link-color: var(--color-primary-100);
			--menu-item-link-color-hover: var(--color-white);
			--menu-item-link-padding: var(--spacing-sm) var(--spacing-md);
			padding: 0;
			background: var(--color-primary);
			border: 0;
			border-radius: 0;
			box-shadow: var(--shadow);
			.menu-item:not(:last-child) {
				border-bottom: 1px solid rgba(255, 255, 255, 0.3);
			}
			.menu-item-link:hover {
				background-color: var(--color-primary-700);
			}
		}
	}
}

.page-header {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	width: 100vw;
	overflow: hidden;
	text-align: var(--page-header-text-align, center);
	background: var(--page-header-background, var(--color-alt));
	--alignfull-width: 100vw;
}

.page-header-wrap {
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: var(--page-header-justify-content, center);
	padding: var(
		--page-header-padding,
		var(--page-header-padding-top) var(--page-header-padding-sides, 0)
			var(--page-header-padding-bottom)
	);
}

.page-header-overlay {
	display: var(--page-header-overlay-display, block);
	background: var(--page-header-background, var(--color-alt));
	opacity: var(--page-header-overlay-opacity, 0.5);
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;

	/* @include position(absolute, 0 0 0 0); */
}

.page-header-image,
.page-header-image img {
	width: 100vw;
	height: 100% !important;
	object-fit: cover;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;

	/* @include position(absolute, 0 0 0 0); */
}

.page-header-inner {
	width: 100%;
	max-width: var(--page-header-inner-max-width, var(--breakpoint-sm));
	margin: var(--page-header-inner-margin, 0);
	padding: var(--page-header-inner-padding, 0);
	background: var(--page-header-inner-background, transparent);
	border: var(--page-header-inner-border, 0);
	border-radius: var(--page-header-inner-border-radius, var(--border-radius));
	box-shadow: var(--page-header-inner-box-shadow, none);
}

.page-header-description {
	margin: var(--page-header-description-margin, 0 0 1em);
	font-size: var(--page-header-font-size, var(--font-size-lg));

	&:last-child {
		margin-bottom: 0;
	}
}

/* paragraph with a short horiz rule below */

.rule::before {
	content: "";
	display: block;
	margin: 0 0;
	width: 24%;
	padding-bottom: var(--spacing-lg);
	border-top: 4px solid var(--color-accent);
	/* margin-bottom: var(--spacing-lg); */
}

/* grid entry-wrap hover */

.entries.has-image-full {
	.entry.has-image-first {
		.entry-wrap {
			background: var(--color-white);
			bottom: 0;
			left: 0;
			margin-left: 0;
			max-width: calc(100% - var(--spacing-xl));
			padding: var(--spacing-lg) var(--spacing-xl) var(--spacing-lg)
				var(--spacing-lg);
			position: absolute;

			h3 {
				margin-bottom: var(--spacing-sm);
			}
		}
	}
	.entry-image-link {
		/* border: 1px solid var(--color-primary-200); */
		box-shadow: var(--shadow);
	}
}

.entries.has-image-full {
	.entry.has-image-first:hover {
		.entry-wrap {
			background: var(--color-heading);
			bottom: 0;
			left: 0;
			margin-left: 0;
			max-width: calc(100% - var(--spacing-xl));
			padding-bottom: var(--spacing-xl);
			position: absolute;
			.entry-title-link,
			p {
				color: var(--color-primary-100);
			}
		}
	}
}

ul.flat {
	list-style-type: none;
	--list-margin-left: 0;
	--list-item-margin-bottom: var(--spacing-xxs);
}

.wp-block-list.square {
	margin-left: 1rem;
	list-style-type: square;
}

.lede,
.entry-excerpt-single {
	font-size: var(--font-size-lg);
	line-height: 1.4;
	/* font-style: italic; */
	margin-bottom: 1rem;
}

.p6 {
	background: url("assets/images/p6.webp") repeat;
	background-color: var(--color-primary-100);
	background-blend-mode: multiply;
}

.wp-block-media-text__content {
	padding-left: 0;
}