:root {
	--client-clr-blue-1: #1f3248;
	--client-clr-beige-1: #c9b393;
	--client-clr-white-1: #ffffff;
	--client-clr-black-1: #000000;

	--client-clr-red-1: #e42623;

	--strata-base: calc(1e4);
	--strata-base-background-1: calc(1e4 - 10);
	--strata-base-background-2: calc(1e4 - 20);

	--strata-fixed: calc(1e4 + 100);
	--strata-modal: calc(1e4 + 200);

	--strata-overlay: calc(1e4 + 300);
	--strata-overlay-background: calc(1e4 + 300 - 10);

	--strata-dialog: calc(1e4 + 400);
	--strata-tooltip: calc(1e4 + 500);

	--focus-outline-size: 4px;
	--focus-outline-offset: var(--focus-outline-size);
	--focus-outline-color: var(--client-clr-beige-1);
	--focus-outline-style: solid;
}

html {
	margin-top: 0 !important;
	scroll-behavior: smooth;
	scroll-padding-top: 195px;

	& body {
		min-height: 100vh;

		font-family: "Montserrat";
		overflow-x: hidden !important;
		padding: 0;
		margin: 0;

		/** GENERIC TO DIVI STRUCTURE */
		&.et-db #et-boc {
			min-height: 100vh;

			& .et_builder_outer_content {
				min-height: 100vh;

				@media screen and (min-width: 980px) {
					& {
						grid-template-rows: max-content 1fr max-content;
					}
				}

				&,
				& .et-l.et-l--body {
					display: grid;
					align-items: center;
				}

				& .et-l--header {
					position: relative;
					z-index: var(--strata-fixed);

					& a {
						&:focus,
						&:focus-within {
							outline: var(--focus-outline-size)
								var(--focus-outline-style)
								var(--focus-outline-color);
							outline-offset: var(--focus-outline-offset);
						}
					}

					& .et_pb_menu__logo {
						overflow: visible;

						& a {
							display: block;
							padding: 0;

							&:focus {
								outline: var(--focus-outline-size)
									var(--focus-outline-style)
									var(--focus-outline-color);
								outline-offset: var(--focus-outline-offset);
							}
						}
					}

					& ul[id*="main-menu"].et-menu {
						& li.menu-item {
							display: grid;
							grid-template-areas: "box";
							align-items: center;
							height: max-content;
							align-self: center;
							padding-inline: 1.5em;

							&:first-child {
								padding-inline-start: 11px;
							}

							&:last-child {
								padding-inline-end: 11px;
							}

							& a {
								padding: 0;
								margin: 0;
								border-bottom: 4px solid transparent;
								transition: color 250ms ease-in-out,
									border-bottom-color 250ms ease-in-out;

								&:hover {
									padding-bottom: 6px;
									border-bottom-color: var(
										--client-clr-beige-1
									);
								}
							}
						}

						& ul.sub-menu {
							top: 100% !important;
							border-top-width: 4px !important;
							border-bottom-width: 4px !important;

							width: auto;
							display: grid;
							row-gap: 4px;

							& li {
								& a {
									width: max-content;

									&:hover {
										background-color: transparent;
									}
								}
							}
						}
					}

					& ul[id*="mobile_menu"].et_mobile_menu {
						top: 120%;

						& ul.sub-menu {
							background-color: transparent !important;
						}
					}
				}

				.et-l.et-l--body,
				.et-l.et-l--footer {
					& strong {
						font-weight: 900;
					}

					& .et_pb_module a,
					& .et_pb_module.et_pb_text a,
					& a {
						display: inline-block;
						font-weight: 500;
						padding: 0;

						&:focus,
						&:focus-within {
							outline: var(--focus-outline-size)
								var(--focus-outline-style)
								var(--focus-outline-color);
							outline-offset: var(--focus-outline-offset);
						}
					}
				}

				& .et-l.et-l--body {
					& {
						min-height: 100%;

						grid-auto-rows: 1fr;
						grid-template-areas: "box";
						background-color: var(--client-clr-white-2);

						& .et_builder_inner_content {
							grid-area: box;
							min-height: 100%;

							@media screen and (max-width: 980px) {
								& .et_pb_section {
									& .et_pb_row {
										width: 80%;
										max-width: 1300px;
									}
								}
							}
						}
					}

					/** HELPER CLASSES */
					& .offset-border-with-radius {
						& [class*="wrap"] {
							padding: 4px;
							border: 4px solid var(--client-clr-blue-1);
							border-radius: 20px;

							& img {
								border-radius: 15px;
							}
						}
					}

					& .fullwidth-decoration {
						display: grid;
						grid-template-columns: max-content 1fr;
						column-gap: 15px;
						align-items: end;

						&::after {
							content: "";
							width: 100%;
							height: 4px;
							background-color: var(--client-clr-beige-1);
							border-radius: 100vh;
						}
					}

					& .fullwidth-blurb-fix {
						& .et_pb_blurb_content {
							max-width: max-content;
							padding-inline: 1em;

							display: grid;
							grid-template-columns: max-content 1fr;
							grid-template-rows: max-content;
							column-gap: 30px;
							align-items: center;

							& .et_pb_main_blurb_image,
							& .et_pb_blurb_container,
							& .et_pb_module_header {
								&,
								& span,
								& span > * {
									margin: 0;
									padding: 0;
								}

								& span {
									display: block;
								}
							}

							& .et_pb_main_blurb_image {
								width: max-content;
							}

							@media screen and (max-width: 980px) {
								& {
									max-width: 100%;
								}
							}

							@media screen and (max-width: 767px) {
								& {
									grid-template-columns: 1fr;
									row-gap: 30px;
								}
							}
						}

						&.align-left {
							& .et_pb_blurb_content {
								padding-inline: 0;
								margin-inline: 0;
							}
						}
					}
					/** HELPER CLASSES */

					/** ANIMATION CLASSES */
					& [class*="anime"][class*="fade"] {
						opacity: 0;

						&[class*="flip"] {
							opacity: 1;

							& img {
								opacity: 0;
							}
						}
					}
					/** ANIMATION CLASSES */

					/** SPECIFIC ELEMENTS */
					& #acors__section-5__module-button {
						cursor: pointer;
						transition: box-shadow 250ms ease-in-out,
							translate 250ms ease-in-out;

						&:hover {
							translate: 0 10px;
						}
					}
					/** SPECIFIC ELEMENTS */

					/** CUSTOM ELEMENT // ACORS SWIPER */
					& swiper {
						--max-height: 650px;

						width: 100dvw;
						height: var(--max-height);

						--swiper-navigation-size: 40px;
						--swiper-navigation-sides-offset: 40px;
						--swiper-navigation-color: var(--client-clr-beige-1);

						--swiper-pagination-color: var(--client-clr-beige-1);
						--swiper-pagination-bullet-size: 12px;
						--swiper-pagination-bottom: 20px;

						@media screen and (max-width: 980px) {
							& {
								width: 100%;
								height: auto;
								margin-inline: 0;
							}
						}

						& swiper-slide {
							display: grid;
							grid-template-areas: "box";
							max-height: var(--max-height);

							& swiper-slide-box {
								isolation: isolate;

								display: grid;
								grid-template-areas: "box";
								grid-area: box;
								max-height: var(--max-height);

								& > * {
									grid-area: box;
								}

								& swiper-overlay {
									position: relative;
									z-index: var(--strata-overlay);

									width: 80%;
									max-width: 1300px;
									margin-inline: auto;

									height: calc(100% - 20em);
									max-height: var(--max-height);

									display: grid;
									row-gap: 10px;
									grid-template-rows: max-content 1fr max-content;
									align-self: center;

									& > * {
										display: block;
									}

									& overlay-title,
									& overlay-content {
										font-family: inherit;
										font-style: normal;
										font-weight: 700;
									}

									& overlay-title {
										color: var(--client-clr-beige-1);
										font-size: 42px;
										line-height: 50px;
									}

									& overlay-content {
										color: var(--client-clr-white-1);
										font-size: 64px;
										line-height: 77px;
										white-space: break-spaces;
									}

									& overlay-button {
										& a[id^="overlay-button"] {
											color: var(--client-clr-blue-1);
											background-color: var(
												--client-clr-beige-1
											);
											border-radius: 100vh;

											/* Button Text */
											font-family: inherit;
											font-size: 24px;
											font-style: normal;
											font-weight: 700;
											line-height: 40px;

											padding: 10px 35px;

											&:hover {
												opacity: 0.6;
											}
										}
									}

									@media screen and (max-width: 980px) {
										& {
											height: calc(100% - 10px);
										}

										& overlay-title {
											font-size: 22px;
											line-height: 32px;
										}

										& overlay-content {
											font-size: 28px;
											line-height: 38px;
										}

										& overlay-button {
											& a[id^="overlay-button"] {
												font-size: 18px;
												line-height: 28px;
												text-align: center;
												padding: 2px 20px;
											}
										}
									}
								}

								& img {
									position: relative;
									z-index: var(--strata-base);

									object-fit: cover;
									object-position: center;
									width: 100%;
									height: 100%;
									margin-inline: auto;

									max-width: 1920px;
									max-height: var(--max-height);
								}
							}
						}
					}
					/** CUSTOM ELEMENT // ACORS SWIPER */

					/** CUSTOM ELEMENT // ACORS ACCORDION */
					& acors-accordion {
						display: grid;
						grid-template-columns: 1fr;
						row-gap: 30px;

						& > group {
							display: grid;
							grid-template-columns: 1fr;

							& > input[type="checkbox"][name],
							& > input[type="radio"][name] {
								display: none;
							}

							& > label {
								display: block;

								& toggle {
									--icon-size: 40px;
									--icon-thickness: 4px;

									display: grid;
									grid-template-columns: var(--icon-size) max-content max-content;
									column-gap: 20px;
									align-items: center;

									padding: 20px 25px;
									border-radius: 20px;

									color: var(--client-clr-beige-1);
									background-color: var(--client-clr-blue-1);

									cursor: pointer;

									& toggle-icon {
										display: grid;
										grid-template-areas: "box";
										align-items: center;
										width: var(--icon-size);
										height: var(--icon-size);

										box-sizing: border-box;
										padding: 5px;
										border: var(--icon-thickness) solid
											var(--client-clr-beige-1);
										border-radius: 100%;

										&::before,
										&::after {
											grid-area: box;
											content: "";
											display: block;
											background-color: var(
												--client-clr-beige-1
											);
											border-radius: 100vh;
											margin-inline: auto;
											max-width: var(--icon-size);
											max-height: var(--icon-size);
											transition: max-width 500ms
													ease-in-out,
												max-height 500ms ease-in-out;
										}

										&::before {
											width: 100%;
											height: var(--icon-thickness);
										}

										&::after {
											width: var(--icon-thickness);
											height: 100%;
										}
									}

									& toggle-title,
									& toggle-subtitle {
										font-family: inherit;
										font-style: normal;
									}

									& toggle-title {
										font-size: 42px;
										font-style: normal;
										font-weight: 700;
										line-height: 50px;
									}

									& toggle-subtitle {
										color: var(--client-clr-white-1);
										font-size: 30px;
										font-weight: 500;
										line-height: 40px;
										align-self: end;
									}

									@media screen and (max-width: 980px) {
										& {
											grid-template-columns: 1fr;
											grid-template-rows: auto;
											grid-template-areas:
												"icon title"
												"subtitle subtitle";
										}

										& toggle-icon {
											grid-area: icon;
										}

										& toggle-title {
											grid-area: title;
											font-size: 28px;
											line-height: 38px;
										}

										& toggle-subtitle {
											grid-area: subtitle;
											font-size: 20px;
											line-height: 30px;
											margin-top: 20px;
										}
									}
								}
							}

							& > content {
								--transition-length: 500ms;

								display: block;
								max-height: 0;
								margin-block: 0;
								opacity: 0;
								margin-block-end: calc(
									var(--original-height, 100vh) * -1
								);

								-webkit-user-select: none;
								user-select: none;
								pointer-events: none;

								transition: max-height 500ms ease-in-out,
									margin-top 250ms ease-in-out,
									opacity 1000ms ease-in-out,
									margin-block-end 1000ms linear;

								&[basic] {
									color: #000;
									font-family: inherit;
									font-size: 16px;
									font-style: normal;
									font-weight: 500;
									line-height: 28px;

									width: 100%;
									max-width: 1080px;
									margin-inline: auto;

									@media screen and (max-width: 980px) {
										max-width: unset;
										margin-inline: unset;
									}
								}

								&[advanced] {
									display: grid;
									row-gap: 60px;

									& > group {
										display: grid;
										grid-template-columns: 1fr 3fr;
										grid-auto-rows: 1fr;
										align-items: center;
										column-gap: 20px;

										height: 0;

										& img {
											display: block;
											margin-inline: auto;
										}

										& content {
											& content-name,
											& content-text {
												color: #000;
												font-family: inherit;
												font-style: normal;
											}

											& content-name {
												font-size: 20px;
												font-weight: 700;
												line-height: normal;
											}

											& content-text {
												font-size: 16px;
												font-weight: 500;
												line-height: 28px;
											}
										}

										@media screen and (max-width: 980px) {
											& {
												grid-template-columns: 1fr;
												grid-auto-rows: max-content;
												row-gap: 20px;
											}
										}
									}
								}
							}

							/** WHEN CLICKED */
							& > input[type="checkbox"][name]:checked,
							& > input[type="radio"][name]:checked {
								& ~ label {
									& toggle {
										& toggle-icon {
											&::after {
												max-height: 0px;
											}
										}
									}
								}

								& ~ content {
									max-height: var(--original-height, 100vh);
									margin-block: 40px;
									margin-block-end: 40px;
									opacity: 1;
									-webkit-user-select: unset;
									user-select: unset;
									pointer-events: unset;

									&[advanced] {
										& > group {
											height: initial;
										}
									}
								}

								@media screen and (max-width: 767px) {
									& ~ content[basic] {
										max-height: var(
											--original-height,
											max-content
										);
									}

									& ~ content[advanced] {
										--default__with-group-estimate: 1;
										max-height: var(
											--original-height,
											calc(
												100dvh * 2
													var(
														--default__with-group-estimate
													)
											)
										);
									}
								}
							}
						}
					}
					/** CUSTOM ELEMENT // ACORS ACCORDION */

					/** CUSTOM ELEMENT // ACORS FEATURES */
					& feature-list {
						display: grid;
						grid-template-columns: repeat(2, 1fr);
						grid-auto-rows: 1fr;
						column-gap: 10%;
						row-gap: 10px;

						width: 100%;
						max-width: 1080px;

						counter-reset: feature;

						@media screen and (max-width: 767px) {
							grid-template-columns: 1fr;
						}

						& feature {
							position: relative;

							display: grid;
							grid-template-columns: 2fr 10fr;
							column-gap: 20px;
							align-items: center;

							color: #ffffff;
							font-size: 16px;
							font-weight: 700;
							line-height: 28px;

							counter-increment: feature;

							padding-bottom: 10px;

							&,
							&::before {
								font-family: inherit;
								font-style: normal;
							}

							&::before {
								--stroke-size: 2px;

								--stroke-tl-h: calc(var(--stroke-size) * -1);
								--stroke-tl-v: calc(var(--stroke-size) * -1);
								--stroke-tl-corner: 0 var(--stroke-tl-v) 0
									var(--client-clr-blue-1);
								--stroke-top-left: var(--stroke-tl-h)
									var(--stroke-tl-v) 0
									var(--client-clr-blue-1);

								--stroke-tr-h: calc(var(--stroke-size) * 1);
								--stroke-tr-v: calc(var(--stroke-size) * -1);
								--stroke-tr-corner: var(--stroke-tr-h) 0 0
									var(--client-clr-blue-1);
								--stroke-top-right: var(--stroke-tr-h)
									var(--stroke-tr-v) 0
									var(--client-clr-blue-1);

								--stroke-bl-h: calc(var(--stroke-size) * -1);
								--stroke-bl-v: calc(var(--stroke-size) * 1);
								--stroke-bl-corner: var(--stroke-bl-h) 0 0
									var(--client-clr-blue-1);
								--stroke-bot-left: var(--stroke-bl-h)
									var(--stroke-bl-v) 0
									var(--client-clr-blue-1);

								--stroke-br-h: calc(var(--stroke-size) * 1);
								--stroke-br-v: calc(var(--stroke-size) * 1);
								--stroke-br-corner: 0 var(--stroke-br-v) 0
									var(--client-clr-blue-1);
								--stroke-bot-right: var(--stroke-br-h)
									var(--stroke-br-v) 0
									var(--client-clr-blue-1);

								content: counter(feature, decimal-leading-zero);
								display: block;
								color: var(--client-clr-beige-1);
								text-align: center;

								font-size: 42px;
								line-height: normal;
								font-weight: 400;
								letter-spacing: 4px;

								text-shadow: var(--stroke-top-left),
									var(--stroke-tl-corner),
									var(--stroke-top-right),
									var(--stroke-tr-corner),
									var(--stroke-bot-right),
									var(--stroke-br-corner),
									var(--stroke-bot-left),
									var(--stroke-bl-corner);
							}

							&::after {
								content: "";
								width: 100%;
								height: 2px;
								background-color: var(--client-clr-white-1);
								border-radius: 100vh;

								position: absolute;
								bottom: 0;
								right: 0;
							}

							&:nth-last-child(-n + 2) {
								&::after {
									background-color: transparent;
								}
							}
						}
					}
					/** CUSTOM ELEMENT // ACORS FEATURES */
				}

				& .et-l.et-l--footer {
					& #acors__footer__contact-form {
						& input,
						& textarea {
							border: 2px solid var(--client-clr-beige-1) !important;
						}

						& input.input {
							border-radius: 100vh !important;
						}

						& textarea {
							border-radius: 24px !important;
						}

						& input,
						& textarea,
						& button[type="submit"] {
							--focus-outline-offset: 2px;

							&:focus,
							&:focus-within {
								outline: var(--focus-outline-size)
									var(--focus-outline-style)
									var(--focus-outline-color) !important;
								outline-offset: var(
									--focus-outline-offset
								) !important;
							}
						}

						& input.input.et_contact_error,
						& textarea.et_contact_error {
							border-color: var(--client-clr-red-1) !important;
						}

						& .et-pb-contact-message {
							color: var(--client-clr-white-1);

							& > ul {
								display: flex;
								flex-wrap: wrap;
								justify-content: space-between;
								gap: 6px;
								margin-block-start: 10px;
								margin-block-end: 30px;

								& > li {
									flex: 0 0 0;
									border: 2px solid var(--client-clr-red-1);
									border-radius: 100vh;
									padding: 2px 6px;
									background-color: transparent;
									color: var(--client-clr-red-1);
									font-size: 14px;
								}

								& ~ ul {
									margin: 0;
									padding: 0;
								}
							}
						}
					}

					/** CUSTOM ELEMENT // ACORS SOCIALS */
					& social-list {
						--max-width: calc(1300px / 4 * 3);

						display: grid;
						grid-template-columns: repeat(3, 1fr);
						grid-auto-rows: max-content;
						gap: 15px;
						max-width: var(--max-width);

						& social-item {
							isolation: isolate;

							--item-icon-size: 32px;
							--icon-text-gap: 15px;
							--double-offset: 10px;

							display: grid;
							grid-template-areas: "box";

							& a[id*="acors-socials-item"] {
								grid-area: box;

								color: #ffffff;
								font-size: 18px;
								font-style: normal;
								font-weight: 500;
								line-height: 28px;

								display: grid;
								grid-template-columns: max-content 1fr;
								align-items: center;
								gap: var(--icon-text-gap);

								border-top-left-radius: 100vh;
								border-bottom-left-radius: 100vh;

								& social-icon {
									display: grid;
									grid-template-areas: "box";
									align-items: center;

									width: var(--item-icon-size);
									height: var(--item-icon-size);
									padding: 8px;
									color: var(--client-clr-blue-1);
									background-color: var(--client-clr-beige-1);
									border-radius: 100%;
									box-sizing: border-box;

									& > svg {
										grid-area: box;
										margin-inline: auto;
										width: 100%;
										height: 100%;
									}
								}

								& social-text {
								}

								/* The Gambi // Ajustes 2023-11-17 */
								&[id*="double"] {
									position: relative;
									top: var(--double-offset);

									margin-inline-start: calc(
										var(--item-icon-size) +
											var(--icon-text-gap)
									);

									z-index: var(--strata-base);

									& ~ a {
										position: relative;
										z-index: var(
											--strata-base-background-1
										);

										& social-text {
											position: relative;
											top: calc(
												var(--double-offset) * -1
											);
										}
									}
								}

								&:hover {
									opacity: 0.6;
								}
							}
						}

						@media screen and (max-width: 980px) {
							grid-template-columns: 1fr;
							max-width: 100%;
						}
					}
					/** CUSTOM ELEMENT // ACORS SOCIALS */
				}

				/** CUSTOM ELEMENT // ACORS SEPARATOR */
				& acors-separator {
					display: grid;
					grid-template-columns: 1fr max-content 1fr;
					align-items: center;
					column-gap: 15px;
					width: 100%;
					height: max-content;

					&::before,
					&::after {
						content: "";
						display: block;
						width: 100%;
						height: 6px;
						background-color: var(--client-clr-beige-1);
					}

					&::before {
						border-top-left-radius: 100vh;
						border-bottom-left-radius: 100vh;
					}

					&::after {
						border-top-right-radius: 100vh;
						border-bottom-right-radius: 100vh;
					}

					& separator-icon {
					}
				}
				/** CUSTOM ELEMENT // ACORS SEPARATOR */
			}
		}
		/** GENERIC TO DIVI STRUCTURE */

		/** SPECIFIC PAGE // CURSOS // ID: 56 */
		&.page-id-56 {
			&.et-db #et-boc {
				overflow: hidden;
			}
		}
		/** SPECIFIC PAGE // HOME // ID: 56 */
	}
}