/* VARS */
/* Body*/
/* Section Main */
/* Section Fullwidth */
/* Container Main */
/* Button Group */
/* Button */
/* INDENTS */
/* COLORS */
/* Component Indents */

/* VARS */
:root {
	/* colors */
	--color-white: #fff;

	--color-primary: var(--dxp-g-root);
	--color-primary-light: #778fb5;

	--color-secondary: #ebe4da;

	--color-accent: #82bd5e;
	--color-accent-light: #92c474;

	--color-highlight: #e10600;

	--color-text: var(--dxp-g-root-contrast);
	--color-title: #779fb5;

	/* typography */
	--font-title-decor: "brixton-wood", serif;
	--font-size-body: clamp(15px, 18 / 1400 * 100vw, 18px);
	--font-size-lead: clamp(21px, 24 / 1400 * 100vw, 24px);
	--font-size-h3: clamp(28px, 28 / 1400 * 100vw, 35px);

	/* more */
	--transition: all 0.35s ease-in-out;
}

/* Body*/
body {
	font-size: var(--font-size-body);
	overflow-x: hidden;
}

/* Section Main */
.section-main {
	padding-top: clamp(60px, 65 / 1400 * 100vw, 65px);
	padding-bottom: clamp(60px, 65 / 1400 * 100vw, 65px);
}

/* Section Fullwidth */
.section-fullwidth {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
}

/* Container Main */
.container {
	width: 90%;
	max-width: 1350px;
	margin-left: auto;
	margin-right: auto;
}

/* Button Group */
.button-group {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 20px;
}

/* Button */
a.button {
	--dxp-c-link-text-color: var(--color-accent);
	--dxp-c-link-color-background: var(--color-accent);
	--dxp-c-link-text-decoration: none;
	--dxp-c-link-transition: all 0.5s;

	display: inline-block;

	font-size: clamp(16px, 18 / 1400 * 100vw, 18px);
	font-weight: 600;
	line-height: 100%;
	text-align: center;

	padding: 21px clamp(24px, 44 / 1400 * 100vw, 44px);
	border-radius: 16px;

	border: 1px solid var(--color-accent);
}

/* Button: Hover & Focus & Active */
a.button:hover,
a.button:focus,
a.button:active {
	--dxp-c-link-text-color: var(--color-white);
	--dxp-c-link-text-color-hover: var(--color-white);
	--dxp-c-link-text-color-focus: var(--color-white);
	--dxp-c-link-text-color-active: var(--color-white);

	--dxp-c-link-color-background: var(--color-accent);
	--dxp-c-link-color-background-hover: var(--color-accent);
	--dxp-c-link-color-background-focus: var(--color-accent);
	--dxp-c-link-color-background-active: var(--color-accent);

	--dxp-c-link-text-decoration: none;
	--dxp-s-link-text-decoration-hover: none;
	--dxp-s-link-text-decoration-focus: none;
	--dxp-s-link-text-decoration-active: none;

	color: var(--color-white);
	background-color: var(--color-accent);
	text-decoration: none;
}

/* Button White */
a.button-white {
	--dxp-c-link-text-color: var(--color-accent);
	--dxp-c-link-color-background: var(--color-white);
	--dxp-c-link-text-decoration: none;
	--dxp-c-link-transition: all 0.5s;

	display: inline-block;

	font-size: clamp(16px, 18 / 1400 * 100vw, 18px);
	font-weight: 600;
	line-height: 100%;
	text-align: center;

	padding: 21px clamp(24px, 44 / 1400 * 100vw, 44px);
	border-radius: 16px;

	border: 1px solid var(--color-accent);
}

/* Button White: Hover & Focus & Active */
a.button-white:hover,
a.button-white:focus,
a.button-white:active {
	--dxp-c-link-text-color: var(--color-white);
	--dxp-c-link-text-color-hover: var(--color-white);
	--dxp-c-link-text-color-focus: var(--color-white);
	--dxp-c-link-text-color-active: var(--color-white);

	--dxp-c-link-color-background: var(--color-accent);
	--dxp-c-link-color-background-hover: var(--color-accent);
	--dxp-c-link-color-background-focus: var(--color-accent);
	--dxp-c-link-color-background-active: var(--color-accent);

	--dxp-c-link-text-decoration: none;
	--dxp-s-link-text-decoration-hover: none;
	--dxp-s-link-text-decoration-focus: none;
	--dxp-s-link-text-decoration-active: none;

	color: var(--color-white);
	background-color: var(--color-accent);
	text-decoration: none;
}

/* INDENTS */
/* DEFAULT */
.indent-default {
	padding-top: clamp(60px, 65 / 1400 * 100vw, 65px);
	padding-bottom: clamp(60px, 65 / 1400 * 100vw, 65px);
}

/* Default Top */
.indent-default-top {
	padding-top: clamp(60px, 65 / 1400 * 100vw, 65px);
}

/* Default Bottom */
.indent-default-bottom {
	padding-bottom: clamp(60px, 65 / 1400 * 100vw, 65px);
}

/* LARGEST */
.indent-largest {
	padding-top: clamp(60px, 150 / 1400 * 100vw, 150px);
	padding-bottom: clamp(60px, 150 / 1400 * 100vw, 150px);
}

/* Largest Top */
.indent-largest-top {
	padding-top: clamp(60px, 150 / 1400 * 100vw, 150px);
}

/* Largest Bottom */
.indent-largest-bottom {
	padding-bottom: clamp(60px, 150 / 1400 * 100vw, 150px);
}

/* LARGE */
.indent-large {
	padding-top: clamp(60px, 120 / 1400 * 100vw, 120px);
	padding-bottom: clamp(60px, 120 / 1400 * 100vw, 120px);
}

/* Large Top */
.indent-large-top {
	padding-top: clamp(60px, 120 / 1400 * 100vw, 120px);
}

/* Large Bottom */
.indent-large-bottom {
	padding-bottom: clamp(60px, 120 / 1400 * 100vw, 120px);
}

/* MIDDLE */
.indent-middle {
	padding-top: clamp(60px, 100 / 1400 * 100vw, 100px);
	padding-bottom: clamp(60px, 100 / 1400 * 100vw, 100px);
}

/* Middle Top */
.indent-middle-top {
	padding-top: clamp(60px, 100 / 1400 * 100vw, 100px);
}

/* Middle Bottom */
.indent-middle-bottom {
	padding-bottom: clamp(60px, 100 / 1400 * 100vw, 100px);
}

/* SMALL */
.indent-small {
	padding-top: clamp(40px, 65 / 1400 * 100vw, 65px);
	padding-bottom: clamp(40px, 65 / 1400 * 100vw, 65px);
}

/* Small Top */
.indent-small-top {
	padding-top: clamp(40px, 65 / 1400 * 100vw, 65px);
}

/* Small Bottom */
.indent-small-bottom {
	padding-bottom: clamp(40px, 65 / 1400 * 100vw, 65px);
}

/* SMALLEST */
.indent-smallest {
	padding-top: 40px;
	padding-bottom: 40px;
}

/* Smallest Top */
.indent-smallest-top {
	padding-top: 40px;
}

/* Smallest Bottom */
.indent-smallest-bottom {
	padding-bottom: 40px;
}

/* COLORS */
.is-secondary {
	background-color: var(--color-secondary);
}

.is-primary-light {
	background-color: var(--color-primary-light);
}

/* Component Indents */
.content-container > community_layout-section {
	/* Desktop */
	--dxp-c-section-content-spacing-block-start: var(--dxp-c-l-component-spacer-size);
	--dxp-c-section-content-spacing-block-end: var(--dxp-c-l-component-spacer-size);

	/* Tablet */
	--dxp-c-section-content-spacing-block-start-tablet: var(--dxp-c-m-component-spacer-size);
	--dxp-c-section-content-spacing-block-end-tablet: var(--dxp-c-m-component-spacer-size);

	/* Mobile */
	--dxp-c-section-content-spacing-block-start-mobile: var(--dxp-c-s-component-spacer-size);
	--dxp-c-section-content-spacing-block-end-mobile: var(--dxp-c-s-component-spacer-size);
}