/* Sol-Trans-Text 2.3.0 - Elementor edge-to-edge boundary-safe layout */
.elementor-widget-sol_trans_text {
	--stt-component-bg: transparent;
	--stt-component-pad-top: 0px;
	--stt-component-pad-right: 0px;
	--stt-component-pad-bottom: 0px;
	--stt-component-pad-left: 0px;
	box-sizing: border-box;
	position: relative;
	width: auto;
	max-width: 100%;
	min-width: 0;
	min-height: 0;
	overflow: visible;
}

.elementor-widget-sol_trans_text *,
.elementor-widget-sol_trans_text *::before,
.elementor-widget-sol_trans_text *::after {
	box-sizing: border-box;
}

.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-widget,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-column,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-section {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	padding: var(--stt-component-pad-top) var(--stt-component-pad-right) var(--stt-component-pad-bottom) var(--stt-component-pad-left);
}

.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-column,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-section,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-container_auto,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-container_full,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-container_boxed,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-section_auto,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-section_full,
.elementor-widget-sol_trans_text.stt-component-active.stt-component-fill-section_boxed {
	min-height: 1px;
}

/* The actual Elementor boundary is measured by JS. These classes deliberately
 * do not impose a viewport width, max-width or height on the panel. */
.elementor-widget-sol_trans_text.stt-boundary-expanded {
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	overflow: visible !important;
}

.stt-component-target {
	box-sizing: border-box;
	min-width: 0;
}

.stt-component-target-static {
	position: relative;
}

.stt-overlay {
	--stt-x: 0px;
	--stt-y: 0px;
	--stt-stroke-width: 2px;
	--stt-stroke-color: currentColor;
	--stt-stroke-opacity: 1;
	--stt-shadow-color: rgba(255,255,255,.72);
	--stt-panel-color: #fff;
	--stt-panel-height-input: 280px;
	--stt-panel-height: var(--stt-panel-height-input,280px);
	--stt-panel-min-height: 120px;
	--stt-panel-max-height: 900px;
	--stt-stroke-bg: transparent;
	--stt-user-text-scale: 1;
	--stt-container-text-scale: 1;
	--stt-runtime-text-scale: 1;
	--stt-effective-text-scale: calc(var(--stt-user-text-scale,1) * var(--stt-container-text-scale,1) * var(--stt-runtime-text-scale,1));
	--stt-parent-width: 100%;
	--stt-surface-left: 0px;
	--stt-surface-top: 0px;
	--stt-surface-width: 100%;
	--stt-surface-height: var(--stt-panel-height,280px);
	display: block;	
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	padding: 0;
	background: var(--stt-stroke-bg);
	overflow: visible;
	position: relative;
	left: auto;
	top: auto;
	right: auto;
	bottom: auto;
	transform: none;
	translate: none;
	contain: none;
	container-type: inline-size;
	z-index: 1;
}

/* Component fill is mapped into the Elementor widget's local coordinate system.
 * No vw/vh sizing, negative margins or viewport transforms are used. */
.stt-overlay.stt-layout-surface.stt-position-relative,
.stt-overlay.stt-layout-surface.stt-position-absolute {
	position: absolute;
	left: var(--stt-surface-left);
	top: var(--stt-surface-top);
	width: var(--stt-surface-width);
	max-width: var(--stt-surface-width);
	height: var(--stt-surface-height);
	max-height: var(--stt-surface-height);
	min-height: 0;
	margin: 0;
	transform: none;
	translate: none;
}

.stt-overlay.stt-layout-surface.stt-position-fixed {
	position: absolute;
	left: var(--stt-surface-left);
	top: var(--stt-surface-top);
	width: var(--stt-surface-width);
	max-width: var(--stt-surface-width);
	height: var(--stt-surface-height);
	max-height: var(--stt-surface-height);
	transform: none;
	translate: none;
}

.stt-width-parent {
	width: 100%;
	max-width: 100%;
}

.stt-width-text {
	display: inline-block;
	width: fit-content;
	max-width: 100%;
}

.stt-width-screen {
	width: 100%;
	max-width: 100%;
	margin: 0;
	left: auto;
}

.stt-overlay--cutout {
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	height: clamp(var(--stt-panel-min-height,120px), var(--stt-panel-height,280px), var(--stt-panel-max-height,900px));
	min-height: var(--stt-panel-min-height,120px);
	max-height: var(--stt-panel-max-height,900px);
	background: transparent;
	line-height: 0;
	overflow: hidden;
	z-index: 1;
}

.stt-layout-surface.stt-overlay--cutout {
	width: var(--stt-surface-width, 100%);
	height: var(--stt-surface-height, var(--stt-panel-height,280px));
	min-width: 0;	
	min-height: 0;
	max-width: none;
	max-height: none;
	box-sizing: border-box;
}

.stt-overlay--cutout:focus {
	outline: 2px solid color-mix(in srgb, var(--stt-panel-color,#fff) 40%, #9637ad);
	outline-offset: 4px;
}

.stt-overlay--cutout.stt-is-minimized {
	--stt-panel-height: var(--stt-panel-min-height,120px);
}

.stt-svg {
	display: block;
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
	min-width: 0;
	min-height: 0;
	background: transparent;
	overflow: hidden;
	transform: none;
	translate: none;
}

.stt-svg-panel {
	fill: var(--stt-panel-color,#fff);
	x: 0;
	y: 0;
	width: 100%;
	height: 100%;
	shape-rendering: geometricPrecision;
}

.stt-svg-text,
.stt-svg-stroke {
	dominant-baseline: middle;
	font-family: Montserrat, Arial, sans-serif;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	text-anchor: var(--stt-text-anchor,middle);
	text-transform: none;
}

.stt-fit-height .stt-svg-text,
.stt-fit-height .stt-svg-stroke {
}

.stt-fit-both .stt-svg-text,
.stt-fit-both .stt-svg-stroke {
}

.stt-svg-stroke {
	fill: transparent;
	opacity: var(--stt-stroke-opacity);
	paint-order: stroke fill;
	stroke: var(--stt-stroke-color);
	stroke-linejoin: round;
	stroke-width: var(--stt-stroke-width);
	vector-effect: non-scaling-stroke;
}

.stt-svg-text--mask {
	fill: #000;
	stroke: #000;
	stroke-width: 0;
}

.stt-text {
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: transparent !important;
	color: transparent !important;
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	overflow-wrap: anywhere;
	text-wrap: balance;
	white-space: pre-line;
	opacity: var(--stt-stroke-opacity);
	paint-order: stroke fill;
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke: var(--stt-stroke-width) var(--stt-stroke-color);
	text-stroke: var(--stt-stroke-width) var(--stt-stroke-color);
	text-shadow: 1px 0 0 var(--stt-shadow-color), -1px 0 0 var(--stt-shadow-color), 0 1px 0 var(--stt-shadow-color), 0 -1px 0 var(--stt-shadow-color);
}

.stt-align-justify .stt-text { text-align: justify; text-align-last: auto; }
.stt-align-left { margin-left: 0; margin-right: auto; }
.stt-align-center { margin-left: auto; margin-right: auto; }
.stt-align-right { margin-left: auto; margin-right: 0; }
.stt-align-justify { width: 100%; margin-left: 0; margin-right: 0; }

.stt-effect-ghost .stt-text {
	backdrop-filter: blur(8px) saturate(1.25);
	-webkit-backdrop-filter: blur(8px) saturate(1.25);
	filter: drop-shadow(0 14px 32px rgba(0,0,0,.18));
	-webkit-text-stroke: calc(var(--stt-stroke-width) * 1.2) color-mix(in srgb, var(--stt-stroke-color) 72%, transparent);
	text-stroke: calc(var(--stt-stroke-width) * 1.2) color-mix(in srgb, var(--stt-stroke-color) 72%, transparent);
}

.stt-position-fixed:not(.stt-layout-surface) {
	position: fixed;
	max-width: 100vw;
}

.stt-position-absolute:not(.stt-layout-surface) {
	position: absolute;
}

.elementor-editor-active .stt-overlay {
	outline: 1px dashed rgba(150,55,173,.35);
	outline-offset: 3px;
}

.stt-editor-placeholder {
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 1rem;
	border: 1px dashed rgba(150,55,173,.45);
	border-radius: 12px;
	background: rgba(150,55,173,.06);
	color: #51205f;
	font-family: inherit;
	font-weight: 800;
	line-height: 1.1;
	text-align: center;
	overflow-wrap: anywhere;
}

.stt-editor-placeholder__label { display: inline-block; max-width: 100%; }

@supports (-webkit-text-stroke: 1px #fff) {
	.stt-text { text-shadow: none; }
}


/* Sol-Trans-Text 2.3.0 edge-to-edge Elementor layout corrections. */
.elementor-widget-sol_trans_text.stt-component-active {
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
}

.elementor-widget-sol_trans_text.stt-component-active > * {
	box-sizing: border-box;
}

/* The selected Elementor boundary, not the viewport, owns the visual surface. */
.stt-overlay.stt-layout-surface {
	box-sizing: border-box !important;
	margin: 0 !important;
	padding: 0 !important;
	max-width: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
	border-width: 0;
	overflow: hidden !important;
}

/* All three effects use the same exact boundary model. */
.stt-overlay.stt-layout-surface:not(.stt-overlay--cutout) {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.stt-overlay.stt-layout-surface.stt-align-left:not(.stt-overlay--cutout) {
	justify-content: flex-start;
	text-align: left;
}

.stt-overlay.stt-layout-surface.stt-align-right:not(.stt-overlay--cutout) {
	justify-content: flex-end;
	text-align: right;
}

.stt-overlay.stt-layout-surface.stt-align-justify:not(.stt-overlay--cutout) {
	justify-content: stretch;
	text-align: justify;
}

.stt-overlay.stt-layout-surface:not(.stt-overlay--cutout) .stt-text {
	flex: 1 1 auto;
	width: 100%;
	max-width: 100%;
	margin: 0 !important;
	padding: 0 !important;
}

/* Never let Elementor/theme defaults create an extra widget edge around a
 * boundary-filled effect. The actual section/container padding is preserved;
 * the effect simply covers the complete measured boundary box. */
.stt-component-target .stt-component-target,
.stt-component-target-static {
	box-sizing: border-box;
}

/* The SVG itself must occupy the complete measured panel. `none` prevents the
 * SVG viewport from letterboxing its panel when the Elementor section has a
 * different aspect ratio from the widget's authoring viewBox. */
.stt-overlay--cutout .stt-svg {
	preserveAspectRatio: none;
	object-fit: fill;
	object-position: center;
}

/* Remove CSS constraints that can re-introduce side gaps after Elementor
 * calculates a responsive width. */
.stt-overlay--cutout.stt-layout-surface {
	width: var(--stt-surface-width) !important;
	height: var(--stt-surface-height) !important;
	max-width: none !important;
	max-height: none !important;
	min-width: 0 !important;
	min-height: 0 !important;
}

.stt-overlay--cutout.stt-layout-surface .stt-svg {
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
}

/* Elementor can put a clipping context on an intermediate column/container.
 * The JS only adds this class to wrappers between the widget and selected
 * boundary, so other page elements are not affected. */
.stt-boundary-bridge {
	overflow: visible !important;
}

/* Elementor owns overflow/clipping in the editor. Do not override it there;
 * changing an editor Section/Column overflow can make the widget appear to
 * escape the active column while the user is dragging or resizing it. */
.elementor-editor-active .stt-boundary-bridge {
	overflow: revert !important;
}

/* Editor preview should show the exact current control state immediately. */
.elementor-editor-active .stt-overlay.stt-layout-surface {
	transition: none !important;
}

/* Prevent default heading/paragraph margins from producing a visible gap in
 * outline and ghost modes. */
.stt-overlay .stt-text:is(h1,h2,h3,p,div,span) {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

/* Sol-Trans-Text 2.0.0: Elementor editor is a managed layout canvas.
 * Never position the effect against a Section/Container ancestor inside the
 * editor preview. Keep the visual surface inside the widget's own cell so
 * Elementor can select, drag, resize and rerender it without displacement. */
.elementor-editor-active .elementor-widget-sol_trans_text.stt-editor-local-boundary {
	position: relative !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	transform: none !important;
	translate: none !important;
	overflow: hidden !important;
}

.elementor-editor-active .stt-editor-preview-shell {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
}

.elementor-editor-active .stt-overlay.stt-editor-preview,
.elementor-editor-active .stt-editor-preview-shell .stt-overlay {
	position: relative !important;
	inset: auto !important;
	left: auto !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	transform: none !important;
	translate: none !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

.elementor-editor-active .stt-editor-preview .stt-text {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	box-sizing: border-box !important;
	text-align: center;
	white-space: normal;
	word-break: normal;
	overflow-wrap: anywhere;
}

.elementor-editor-active .stt-editor-preview-empty .stt-text {
	min-height: 64px;
}

.elementor-editor-active .stt-editor-preview .stt-svg,
.elementor-editor-active .stt-editor-preview-shell .stt-svg {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
}


/* v2.3.0 typography source of truth: Elementor Typography controls own
 * font-size and line-height. Runtime JavaScript never writes those properties. */
/* v2.1.0 responsive typography. Container query units follow the actual
 * Elementor widget surface; they are intentionally free of viewport-width
 * compensation so browser zoom is allowed to scale CSS pixels naturally. */
.stt-overlay {
	container-type: inline-size;
	container-name: stt-surface;
}

.stt-text, .stt-svg-text, .stt-svg-stroke {
	max-inline-size: 100%;
}


@media (max-width: 767px) {
	.stt-overlay {
		--stt-panel-min-height: 96px;
		--stt-panel-max-height: 70vh;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.stt-overlay {
		--stt-panel-min-height: 120px;
		--stt-panel-max-height: 80vh;
	}
}

/* v2.3.0: Elementor Typography remains the sole typography source of truth.
 * These rules only constrain layout; they never set font-size/line-height/weight. */
.stt-text, .stt-svg-text, .stt-svg-stroke {
	min-width: 0;
	max-width: 100%;
}
.stt-text {
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
}
.stt-svg-text, .stt-svg-stroke {
	font-size: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	line-height: inherit;
}

/* Keep the selected Elementor font size intact while allowing the text box to
 * reflow naturally at every breakpoint and browser zoom level. */
@media (max-width: 767px) {
	.stt-text {
		white-space: pre-wrap;
		overflow-wrap: anywhere;
		word-break: normal;
	}
}
@media (min-width: 768px) and (max-width: 1024px) {
	.stt-text {
		white-space: pre-wrap;
		overflow-wrap: anywhere;
	}
}
@media (min-width: 1025px) {
	.stt-text {
		white-space: pre-wrap;
		overflow-wrap: anywhere;
	}
}

/* Browser zoom is intentionally not counter-scaled. CSS pixels, Elementor's
 * responsive rules, and SVG dimensions are allowed to scale together naturally.
 * This prevents the plugin fitter from cancelling browser zoom. */