/**
 * Theme Name:       fivek
 * Theme URI:        https://bizbudding.com/mai-theme/
 * Description:      Mai Slate starter theme for the Genesis Framework.
 * Author:           Bizbudding / 5kwebsite
 * Author URI:       https://5kwebsite.com
 * Version:          2.1.1
 * Text Domain:      mai-slate
 * Template:         genesis
 * Template Version: 3.3.5
 * License:          GPL-2.0-or-later
 * License URI:      http://www.gnu.org/licenses/gpl-2.0.html
 */


@font-face {
	font-family: "Fixel Variable";
	src: url("assets/fonts/FixelVariable.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 75% 100%;
	font-style: normal;
	font-display: swap;
	font-feature-settings: "onum" 1, "dlig" 1, "case" 1;

}

@font-face {
	font-family: "Fixel Variable";
	src: url("assets/fonts/FixelVariableItalic.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 75% 100%;
	font-style: italic;
	font-display: swap;
	font-feature-settings: "onum" 1, "dlig" 1, "case" 1;
}

:root {
	--body-font-family: "Fixel Variable", system-ui, sans-serif !important;
	--body-line-height: 1.5;
	--body-font-weight: 460;

	--heading-font-family: "Fixel Variable", system-ui, serif !important; --heading-font-weight: 700;

	/* --alt-font-family: "PoltikVF", system-ui, sans-serif !important; */

	--menu-font-family: var(--color-body-font-family);
	/* --menu-font-weight: 700;
	--menu-font-size: calc(var(--font-size-md) + .15vw); */
	--submenu-font-size: 1em;
	--menu-letter-spacing: .025em;

	--button-font-size: var(--font-size-base);
	--button-font-family: var(--body-font-family);
	--button-font-weight: 600;
	--button-letter-spacing: var(--menu-letter-spacing);
	--button-text-transform: uppercase;
	--button-color: var(--color-white);
	--button-color-hover: var(--color-white);
	--button-background: var(--color-primary);
	--button-background-hover: var(--color-primary-600);
	--button-border-radius: 0;
	--button-max-height: calc(100% - (var(--button-outline-width, 2px) * 2));

	--button-secondary-color: var(--color-white);
	--button-secondary-color-hover: var(--color-white);
	--button-secondary-background: var(--color-secondary);
	--button-secondary-background-hover: var(--color-secondary-600);

	--color-border: rgb(106 106 106 /.3);
	--border-radius: 0;
	--border-width: 1px;
	--border: var(--border-width) solid var(--color-border);

	--link-text-decoration: underline;
	--link-text-decoration-offset: 3px;

	--content-sidebar-wrap-margin-top: calc(var(--spacing-xxl) * 2);
	--site-header-border-bottom: none;

	--entry-wrap-border: 1px solid hsl(from var(--color-neutral-900) h s l / 0.2);

	/* neutral */

	--color-neutral-50: #fbfbfb;
	--color-alt: #f3f3f3;
	--color-neutral-200: #e4e4e4;
	--color-neutral-300: #cfcfcf;
	--color-neutral-400: #bababa;
	--color-neutral-500: #a6a6a6;
	--color-neutral-600: #838383;
	--color-body: #6a6a6a;
	--color-neutral-800: #4b4b4b;
	--color-link: #2e2e2e;
	--color-black: #141414;

	/* primary */

	--color-primary-50: #f9fcfe;
	--color-primary-100: #ecf5fd;
	--color-primary-200: #d0e7fb;
	--color-primary-300: #abd4f7;
	--color-primary-400: #83c0f5;
	--color-primary-500: #4896d5;
	--color-primary: #3f89c6;
	--color-primary-700: #316e9f;
	--color-heading: #214d72;
	--color-primary-900: #123149;
	--color-primary-950: #051522;

	/* secondary */

	--color-secondary: #111827;
	--color-secondary-600: #030712;


	/* https://www.colorhexa.com/f2e058 */
	/* https://www.colorhexa.com/f29358 */

	--color-highlight-50: #fdfbe9;
	--color-highlight-100: #fcf7c5;
	--color-highlight-200: #faed8e;
	--color-highlight-300: #f6db4e;
	--color-highlight-400: #f1c618;
	--color-highlight: #e1b011;
	--color-highlight-600: #e6b01a;

	--color-rose-overlay: #9cf2fd;
	--color-rose-overlay-600: #6aebfc;
	--color-blue-overlay: #4fc5fa;
	--color-purple-blue: #4c40f1;
}

/* -------------------------------- defaults -------------------------------- */

.wp-block {
}

body {
	font-stretch: 75%;
	font-weight: 460;
}

#wpadminbar {
	font-stretch: 100%;
}

h2,
h3,
h4,
h5,
.is-style-heading,
.is-style-subheading {
	--heading-font-weight: 700;
	font-stretch: 100%;
	line-height: 1.1;
}

h1 {
	font-weight: 900;
	font-stretch: 100%;
	line-height: 1;
}

.content-sidebar-wrap,
.entry-wrap {
	border: none;
}


.entry-excerpt.entry-excerpt-single,
.not-excerpt {
	font-style: italic;
	font-size: var(--font-size-lg);
}

.entry-content {
	a:not(.button):not(.entry-title-link) {
		--ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
		background-image: linear-gradient(transparent 50%,var(--color-primary-200) 50%);
		background-size: 0 100%;
		background-repeat: no-repeat;
		/* will-change: background-size; */
		transition: background-size .3s var(--ease-in-out);
		display: inline;
		&:hover {
			background-size: 100% 100%;
		}
	}
}


/* ----------------------------- view transition ---------------------------- */

@view-transition {
	navigation: auto;
}


@media not (prefers-reduced-motion: reduce) {
	h1.entry-title,
	h1.archive-title {
		view-transition-name: entry-title;
	}
}

/* -------------------------------------------------------------------------- */
/*                                   layout                                   */
/* -------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------- */
/*                                 navigation                                 */
/* -------------------------------------------------------------------------- */

.nav-header {
	--menu-font-size: 16px;
	--menu-font-family: var(--heading-font-family);
	--menu-font-weight: 600;
	--sub-menu-font-size: 1em;
	text-transform: uppercase;
	font-stretch: 100%;
}

/* -------------------------------- slabtext -------------------------------- */

.slab {
	font-weight: 900;
}

.slab.uc {
	text-transform: uppercase;
}

.slabtexted .slabtext {
    display: -moz-inline-box;
    display: inline-block;
    white-space: nowrap;
}

.slabtextinactive .slabtext {
    display: inline;
    white-space: normal;
    font-size: 1em !important;
    letter-spacing: inherit !important;
    word-spacing: inherit !important;
    *letter-spacing: normal !important;
    *word-spacing: normal !important;
}

.slabtextdone .slabtext {
    display: block;

}

/* ----------------------------------- cta ---------------------------------- */

.cta {
	padding: 2.25em 2.5em 1.5em;
	h2 {
		margin-bottom: .5em;
	}
	p {
		margin-bottom: var(--spacing-lg);
	}
}

.cta.has-dark-background {
	background: url("assets/images/cta-bg-dark.svg") no-repeat;
	background-size: contain;
	background-position: center left -8dvw;
	background-blend-mode: overlay;
	h2 {
		color: var(--color-primary-200);
	}
	p {
		color: var(--color-primary-100);
		margin-bottom: var(--spacing-lg);
		font-size: calc(var(--font-size-lg) - .15vw);
	}
}

.cta.shine {
	background: url("assets/images/shine-bg.png") no-repeat;
	background-position: center left -5dvw;
}

/* -------------------------------------------------------------------------- */
/*                                   plugins                                  */
/* -------------------------------------------------------------------------- */

/* -------------------------------- mai-grid -------------------------------- */

.entry-grid {
	.entry-excerpt {
		font-size: var(--font-size-md);
		color: inherit;
	}
}


@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) {
	:not(.single-post) {
		.entry-excerpt.entry-excerpt-single,
		.not-excerpt {
			max-width: 60vw;
		}
	}
}