/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.0.0.1705503492
Updated: 2024-01-17 14:58:12

*/

.mobilates-reading-time {
	color: #5f6478;
	font-family: "Mulish", sans-serif;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	white-space: nowrap;
}

.mobilates-reading-time__separator {
	color: #d9238f;
	padding-inline-end: 0.35em;
}

.mobilates-back-to-top {
	position: fixed;
	left: 24px;
	bottom: 24px;
	z-index: 99980;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	padding: 0;
	border: 3px solid #ffffff;
	border-radius: 50%;
	background: #272262;
	color: #ffffff;
	box-shadow: 0 8px 24px rgba(39, 34, 98, 0.3);
	cursor: pointer;
	transition: background-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.mobilates-back-to-top[hidden] {
	display: none;
}

.mobilates-back-to-top:hover {
	background: #bf1473;
	transform: translateY(-2px);
}

.mobilates-back-to-top:focus-visible {
	outline: 3px solid #bf1473;
	outline-offset: 3px;
	box-shadow: 0 0 0 6px #ffffff, 0 8px 24px rgba(39, 34, 98, 0.3);
}

.mobilates-back-to-top svg {
	width: 24px;
	height: 24px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 2.4;
}

@media (max-width: 767px) {
	.mobilates-back-to-top {
		left: 18px;
		bottom: 18px;
		width: 48px;
		height: 48px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mobilates-back-to-top {
		transition: none;
	}
}

/* Keep Theme Builder header controls at an accessible pointer target size. */
.elementor-location-header .elementor-menu-toggle,
.elementor-location-header .elementor-button {
	min-width: 44px;
	min-height: 44px;
}

.elementor-location-header .elementor-nav-menu a {
	min-width: 44px;
}

.elementor-location-header .elementor-button {
	border-color: #bf1473 !important;
	background-color: #bf1473 !important;
}

.elementor-location-header .elementor-button:hover,
.elementor-location-header .elementor-button:focus-visible {
	border-color: #272262 !important;
	background-color: #272262 !important;
}

.elementor-location-header .elementor-item-active {
	color: #bf1473 !important;
}

main p a,
main li a {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 0.18em;
}

/* Elementor V4 leaves both navigation presentations in the DOM. */
@media (min-width: 1367px) {
	.elementor-695 .mobilates-header-nav .elementor-menu-toggle {
		display: none !important;
	}

	.elementor-695 .mobilates-header-nav {
		height: auto !important;
	}
}

@media (max-width: 1366px) {
	.elementor-695 .mobilates-header-nav .elementor-nav-menu--main {
		display: none !important;
	}

	.elementor-695 .mobilates-header-nav .elementor-menu-toggle {
		display: flex !important;
		align-items: center;
		justify-content: center;
	}

	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown.elementor-nav-menu__container[aria-hidden="false"] {
		display: block !important;
	}
}

/* Bridge Elementor's Laptop menu breakpoint without changing the header structure. */
@media (min-width: 1201px) and (max-width: 1366px) {
	.elementor-695 .mobilates-header-bar > .e-con-inner {
		display: grid;
		grid-template-columns: auto 1fr auto;
		gap: 12px;
		align-items: center;
	}

	.elementor-695 .mobilates-header-logo {
		grid-column: 1;
	}

	.elementor-695 .mobilates-header-cta {
		grid-column: 2;
		justify-self: end;
	}

	.elementor-695 .mobilates-header-nav {
		grid-column: 3;
		justify-self: end;
		width: auto;
	}

	.elementor-695 .mobilates-header-nav .elementor-menu-toggle {
		width: 46px;
		height: 46px;
		margin: 0;
		border-radius: 50%;
		background: #d9238f;
		color: #fffafe;
		font-size: 22px;
	}

	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown {
		position: fixed !important;
		top: 96px !important;
		left: 20px !important;
		right: 20px !important;
		width: auto !important;
		max-height: calc(100vh - 90px);
		overflow-y: auto;
		background: #fffafe !important;
		border: 1px solid rgba(39, 34, 98, 0.14);
		border-radius: 0 0 16px 16px;
		box-shadow: 0 18px 40px rgba(39, 34, 98, 0.16);
	}

	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown a {
		background: transparent !important;
		color: #272262 !important;
		font-family: "Mulish", sans-serif;
		font-size: 16px;
		font-weight: 700;
		line-height: 1.25;
		padding: 13px 18px;
	}

	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown a:hover,
	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown a:focus,
	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown a.elementor-item-active {
		background: #fce5f4 !important;
		color: #bf1473 !important;
	}

	.elementor-695 .mobilates-header-nav .elementor-nav-menu--dropdown .elementor-sub-item {
		padding-inline-start: 36px;
		font-weight: 600;
	}
}

/*
 * Legacy dynamic-template bridge only.
 *
 * Static shared heroes are styled entirely through their visible Elementor
 * Atomic global/local classes. These selectors remain solely for the two
 * Theme Builder templates whose Featured Image is still a legacy widget.
 */
.c-mobilates-hero.c-mobilates-hero--dynamic,
.c-mobilates-hero:has(> .global_hero_media) {
	position: relative;
	isolation: isolate;
	--mobilates-hero-image-position: center center;
	background-image: none !important;
	padding: 0 !important;
}

.c-mobilates-hero.c-mobilates-hero--dynamic::before,
.c-mobilates-hero:has(> .global_hero_media)::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;
	pointer-events: none;
	background: linear-gradient(
		90deg,
		#272262 0%,
		#272262 25%,
		rgb(46 34 105 / 94%) 37%,
		rgb(145 47 145 / 55%) 68%,
		rgb(222 80 170 / 15%) 100%
	);
}

.c-mobilates-hero.c-mobilates-hero--dynamic > .global_hero_media,
.c-mobilates-hero:has(> .global_hero_media) > .global_hero_media {
	position: absolute !important;
	inset: 0 !important;
	z-index: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	overflow: hidden !important;
}

.c-mobilates-hero.c-mobilates-hero--dynamic > .global_hero_media .elementor-widget-container,
.c-mobilates-hero.c-mobilates-hero--dynamic > .global_hero_media img,
.c-mobilates-hero:has(> .global_hero_media) > .global_hero_media .elementor-widget-container,
.c-mobilates-hero:has(> .global_hero_media) > .global_hero_media img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
}

.c-mobilates-hero.c-mobilates-hero--dynamic > .global_hero_media img,
.c-mobilates-hero:has(> .global_hero_media) > .global_hero_media img {
	object-fit: cover !important;
	object-position: var(--mobilates-hero-image-position) !important;
}

.c-mobilates-hero.c-mobilates-hero--dynamic > :not(.global_hero_media),
.c-mobilates-hero:has(> .global_hero_media) > :not(.global_hero_media) {
	position: relative !important;
	z-index: 2 !important;
}

/* Remove only the legacy inner-wrapper spacing retained around dynamic tags. */
.c-mobilates-hero:has(> .global_hero_media) .elementor-element-783775d3,
.c-mobilates-hero:has(> .global_hero_media) .elementor-element-8b176fe4 {
	width: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	gap: clamp(0.75rem, 1.35vw, 1.25rem) !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__content,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__content {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: center !important;
	gap: 1.25rem !important;
	/* The 7vw gutters leave the visible title/copy span at about 55% of the hero. */
	box-sizing: border-box !important;
	width: 70% !important;
	max-width: 70% !important;
	min-height: inherit !important;
	padding: clamp(4rem, 7vw, 7.5rem) clamp(1.5rem, 7vw, 8rem) !important;
	color: #fff !important;
	text-align: left !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__eyebrow,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__eyebrow {
	margin: 0 !important;
	color: #ff9cdc !important;
	font-size: clamp(0.75rem, 1.2vw, 0.95rem) !important;
	font-weight: 800 !important;
	letter-spacing: 0.075em !important;
	line-height: 1.3 !important;
	text-transform: uppercase !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__title,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__title {
	margin: 0 !important;
	color: #fff !important;
	font-size: clamp(2.65rem, 5.3vw, 4.9rem) !important;
	font-weight: 800 !important;
	line-height: 0.98 !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__title :is(h1, h2, h3, h4, h5, h6),
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__title :is(h1, h2, h3, h4, h5, h6) {
	margin: 0 !important;
	color: #fff !important;
	font: inherit !important;
	line-height: inherit !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__copy,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__copy {
	max-width: 100% !important;
	margin: 0 !important;
	color: #fff !important;
	font-size: clamp(1rem, 1.35vw, 1.2rem) !important;
	line-height: 1.5 !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	width: 100% !important;
	gap: 1rem !important;
	margin-top: 0.75rem !important;
}

/*
 * Elementor's legacy Button widgets render a wrapper around the real link.
 * Apply button presentation to the interactive control only; styling the
 * wrapper as well produces a visible button inside another button.
 */
.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-primary :is(a, button, .elementor-button),
.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button),
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-primary :is(a, button, .elementor-button),
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button) {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 3.5rem !important;
	padding: 0.8rem 1.5rem !important;
	border-radius: 999px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-primary :is(a, button, .elementor-button),
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-primary :is(a, button, .elementor-button) {
	border: 2px solid #df1b86 !important;
	background: #df1b86 !important;
	color: #fff !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button),
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button) {
	border: 2px solid #fff !important;
	background: transparent !important;
	color: #fff !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-primary :is(a, button, .elementor-button):hover,
.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-primary :is(a, button, .elementor-button):focus-visible,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-primary :is(a, button, .elementor-button):hover,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-primary :is(a, button, .elementor-button):focus-visible {
	border-color: #ff72bb !important;
	background: #ff72bb !important;
	color: #272262 !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button):hover,
.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button):focus-visible,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button):hover,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__cta-secondary :is(a, button, .elementor-button):focus-visible {
	border-color: #ff9cdc !important;
	background: #fff !important;
	color: #272262 !important;
}

/* Classic Elementor containers place their children inside .e-con-inner. */
.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > .e-con-inner,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > .e-con-inner {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	width: 100% !important;
	gap: 1rem !important;
}

.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > :not(.e-con-inner),
.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > .e-con-inner > *,
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > :not(.e-con-inner),
.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > .e-con-inner > * {
	flex: 0 1 auto !important;
	width: auto !important;
}

/*
 * Shared Class archive-card media handle. Kept on the real Elementor Image
 * widget so the height, crop and focal point remain editable in the builder.
 * The taller landscape window preserves materially more of the square legacy
 * featured images while still using a clean cover crop.
 */
.c-mobilates-class-card__media,
.c-mobilates-class-card__media .elementor-widget-container {
	overflow: hidden !important;
}

.c-mobilates-class-card__media img {
	display: block !important;
	width: 100% !important;
	height: 320px !important;
	object-fit: cover !important;
	object-position: center center !important;
}

@media (max-width: 1024px) {
	.c-mobilates-hero.c-mobilates-hero--dynamic,
	.c-mobilates-hero:has(> .global_hero_media) {
		--mobilates-hero-image-position: center center;
	}

	.c-mobilates-class-card__media img {
		height: 280px !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__content,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__content {
		width: min(100%, 42rem) !important;
		max-width: none !important;
		padding-inline: clamp(1.5rem, 6vw, 4.5rem) !important;
	}
}

@media (max-width: 767px) {
	.c-mobilates-hero.c-mobilates-hero--dynamic,
	.c-mobilates-hero:has(> .global_hero_media) {
		--mobilates-hero-image-position: center center;
	}

	.c-mobilates-class-card__media img {
		height: 250px !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__content,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__content {
		width: 100% !important;
		max-width: none !important;
		min-height: 36rem !important;
		padding: 4.5rem 1.5rem 3.5rem !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__title,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__title {
		font-size: clamp(2.5rem, 12vw, 3.9rem) !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__copy,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__copy {
		font-size: 1.05rem !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions {
		width: 100% !important;
		flex-direction: column !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > .e-con-inner,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > .e-con-inner {
		flex-direction: column !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
	}

	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > :not(.e-con-inner),
	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > .e-con-inner > *,
	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > :not(.e-con-inner) :is(a, button, .elementor-button),
	.c-mobilates-hero:has(> .global_hero_media) .c-mobilates-hero__actions > .e-con-inner > * :is(a, button, .elementor-button),
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > :not(.e-con-inner),
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > .e-con-inner > *,
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > :not(.e-con-inner) :is(a, button, .elementor-button),
	.c-mobilates-hero.c-mobilates-hero--dynamic .c-mobilates-hero__actions > .e-con-inner > * :is(a, button, .elementor-button) {
		width: 100% !important;
	}
}