/*
 * Inner Glass: Elementor Free coexistence. Loaded only when Elementor is active.
 *
 * Usable in Advanced > CSS Classes on any container, section or widget:
 *   ig-glass  ig-glass--strong  ig-card  ig-hero__panel  ig-reveal  ig-eyebrow
 *   ig-btn--glass  ig-btn--ghost  ig-btn--sm   (on a Button widget)
 *
 * Specificity note: Elementor's kit prints widget defaults at (0,2,0) (Roboto, #6EC1E4, green buttons).
 * "body " in front lifts the theme to (0,2,1) so the theme wins by default, while anything a user sets
 * in a widget's own Style tab, printed with an element id, still wins over the theme.
 */

/* ---- Page shell ------------------------------------------------------ */
.elementor-template-canvas.ig-body {
	display: block;
}
.ig-main--full {
	padding: 0;
}
.ig-main--full > .elementor {
	width: 100%;
}

/* ---- Typography and colour inheritance --------------------------------- */
body .elementor-widget-heading .elementor-heading-title {
	color: var(--ig-text);
	font-family: var(--ig-font);
	line-height: 1.15; /* the widget stylesheet sets 1, which crowds wrapped headings */
}
body .elementor-widget-heading.ig-card__title .elementor-heading-title {
	font-size: inherit; /* the class sits on the widget wrapper, so the heading takes the card title size from there */
	line-height: 1.3;
}
body .elementor-widget-heading h1.elementor-heading-title {
	line-height: 1.08;
}
body .elementor-widget-heading :is(h3, h4, h5, h6).elementor-heading-title {
	line-height: 1.3;
}
body .elementor-widget-text-editor,
body .elementor-widget-icon-box .elementor-icon-box-description,
body .elementor-widget-image-box .elementor-image-box-description {
	color: var(--ig-text);
	font-family: var(--ig-font);
}
body .elementor-widget-text-editor a {
	color: var(--ig-accent-strong);
}
body .elementor-widget-text-editor :is(ul, ol) {
	padding-left: 1.4rem;
}
body .elementor-widget-text-editor li::marker {
	color: var(--ig-accent-strong);
}
body .elementor-widget-icon-list .elementor-icon-list-text {
	color: var(--ig-text);
	font-family: var(--ig-font);
}
body .elementor-widget-icon-list .elementor-icon-list-icon,
body .elementor-widget-icon .elementor-icon {
	color: var(--ig-accent-strong);
}
body .elementor-widget-icon-list .elementor-icon-list-icon svg,
body .elementor-widget-icon .elementor-icon svg {
	fill: currentColor;
}
body .elementor-widget-divider {
	--divider-color: var(--ig-line);
}
.elementor-widget-image img {
	max-width: 100%;
	height: auto;
}

/* ---- Buttons: pill, press scale, same family as .ig-btn ----------------- */
body .elementor-widget-button .elementor-button {
	min-height: 2.875rem;
	padding: 0.625rem 1.5rem;
	border: 1px solid transparent;
	border-radius: var(--ig-radius-pill);
	background-color: var(--ig-btn-bg);
	box-shadow:
		inset 0 1px 0 rgb(255 255 255 / 0.2),
		0 1px 2px rgb(var(--ig-shade) / 0.18),
		0 10px 20px -12px var(--ig-btn-bg);
	color: var(--ig-accent-ink);
	fill: var(--ig-accent-ink);
	font-family: var(--ig-font);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.005em;
	text-decoration: none;
	transition:
		background-color var(--ig-dur-fast) var(--ig-ease-out),
		border-color var(--ig-dur-fast) var(--ig-ease-out),
		color var(--ig-dur-fast) var(--ig-ease-out),
		transform var(--ig-dur-fast) var(--ig-ease-out);
}
body .elementor-widget-button .elementor-button:active {
	transform: scale(0.97);
	transition-duration: var(--ig-dur-press);
}
@media (hover: hover) {
	body .elementor-widget-button .elementor-button:hover {
		background-color: var(--ig-btn-hover);
		color: var(--ig-accent-ink);
	}
}
body .elementor-widget-button .elementor-button:focus-visible {
	outline: 2px solid var(--ig-focus);
	outline-offset: 3px;
}

/* The ig-btn* class sits on the widget wrapper: neutralise the standalone button look there. */
.elementor-widget-button:is(.ig-btn, .ig-btn--primary, .ig-btn--ghost, .ig-btn--glass, .ig-btn--sm) {
	display: block;
	min-height: 0;
	padding: 0;
	border: 0;
	background: none;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	box-shadow: none;
	transform: none;
}
body .elementor-widget-button.ig-btn--ghost .elementor-button {
	border-color: color-mix(in srgb, var(--ig-text) 22%, transparent);
	background-color: transparent;
	box-shadow: none;
	color: var(--ig-text);
}
body .elementor-widget-button.ig-btn--glass .elementor-button {
	background-color: var(--ig-glass-fill);
	background-image: var(--ig-glass-sheen);
	-webkit-backdrop-filter: var(--ig-glass-filter);
	backdrop-filter: var(--ig-glass-filter);
	box-shadow: var(--ig-glass-shadow);
	color: var(--ig-text);
}
@media (hover: hover) {
	body .elementor-widget-button.ig-btn--ghost .elementor-button:hover {
		border-color: color-mix(in srgb, var(--ig-text) 45%, transparent);
		background-color: var(--ig-tint);
		color: var(--ig-text);
	}
	body .elementor-widget-button.ig-btn--glass .elementor-button:hover {
		background-color: var(--ig-glass-fill-strong);
		color: var(--ig-text);
	}
}
body .elementor-widget-button.ig-btn--sm .elementor-button {
	min-height: 2.25rem;
	padding: 0.375rem 1rem;
	font-size: 0.8125rem;
}

/* ---- Containers and sections: defaults for the theme classes ---------------
 * Flexbox containers read their spacing from --padding-* and --gap, so a user's own values still win. */
.e-con:is(.ig-glass, .ig-card) {
	--padding-top: clamp(1.25rem, 1rem + 1vw, 1.75rem);
	--padding-right: clamp(1.25rem, 1rem + 1vw, 1.75rem);
	--padding-bottom: clamp(1.25rem, 1rem + 1vw, 1.75rem);
	--padding-left: clamp(1.25rem, 1rem + 1vw, 1.75rem);
	--gap: var(--ig-space-3);
}
.e-con.ig-hero__panel {
	--padding-top: clamp(1.5rem, 0.9rem + 3vw, 3.5rem);
	--padding-right: clamp(1.5rem, 0.9rem + 3vw, 3.5rem);
	--padding-bottom: clamp(1.5rem, 0.9rem + 3vw, 3.5rem);
	--padding-left: clamp(1.5rem, 0.9rem + 3vw, 3.5rem);
	--gap: var(--ig-space-4);
	max-width: 46rem;
	justify-items: start;
}
.e-con.ig-hero {
	--padding-top: clamp(2.5rem, 1rem + 7vw, 7rem);
	--padding-bottom: clamp(3rem, 1rem + 6vw, 6.5rem);
	position: relative;
	isolation: isolate;
	overflow: clip;
}
/* Flexbox containers set their own radius (0 by default), which flattened the glass corners. */
.e-con:is(.ig-glass, .ig-card) {
	border-radius: var(--ig-glass-radius, var(--ig-radius-m));
}
/* Elementor resets container margins, which would pin every boxed ig-container to the left. */
.e-con.ig-container {
	margin-inline: auto;
}
/* Hero image beside the glass panel on wide screens, as in the block layout. */
@media (min-width: 60rem) {
	.e-con.ig-hero__inner > .e-con-inner:has(> .ig-hero__media) {
		display: grid;
		grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr);
		gap: var(--ig-space-6);
		align-items: center;
	}
	.e-con.ig-hero__inner .ig-hero__media {
		justify-self: end;
	}
}
.elementor-section.ig-glass > .elementor-container {
	padding: clamp(1.25rem, 1rem + 1vw, 1.75rem);
}
.elementor-section.ig-glass {
	--ig-glass-radius: var(--ig-radius-l);
}
.elementor-widget.ig-hero__bg {
	position: absolute;
	margin: 0;
}
.elementor-widget:is(.ig-glass, .ig-card) {
	--ig-glass-radius: var(--ig-radius-m);
	padding: clamp(1rem, 0.8rem + 1vw, 1.5rem);
}

/* ---- Editor preview parity ---------------------------------------------
 * Elements inserted while editing never get the reveal class toggled, so show everything. */
.ig-reveal-on .elementor-editor-active .ig-reveal:not(.is-in) {
	opacity: 1;
	transform: none;
}
.elementor-editor-active .ig-header {
	position: relative;
	top: auto;
}