.elementor .surface{/* A field-coloured panel with the resting border (mobile menu header and footer, search header) */
background-color: var(--surface);
border-color: var(--surface-border);
\n}.elementor .header-bar{/* Floating header bar, Glass: frosted surface from the kit material knobs (card recipe, minus the drop shadow and the white surface edge — the border reads --surface-border so it follows a dark header). Radius, border width/style and padding stay native. */
border-color: var(--surface-border);
background-color: color-mix(in srgb, var(--surface) var(--surface-alpha), transparent);
background-image: var(--surface-highlight);
backdrop-filter: var(--surface-backdrop);\n}.elementor .section-s{padding-block-start:calc(clamp(3.5rem, 6vw + 2.15rem, 5rem) + var(--header-offset, 0px));padding-block-end:clamp(3.5rem, 6vw + 2.15rem, 5rem);padding-inline-start:max(5%, calc((100% - var(--boxed-width-s)) / 2));padding-inline-end:max(5%, calc((100% - var(--boxed-width-s)) / 2));gap:var(--spacing-m);}.elementor .tight-row-gaps{flex-direction:row;gap:var(--spacing-m);align-items:center;}.elementor .mobile-menu-link{width:100%;font-weight:400;text-align:start;padding-block-start:var(--spacing-m);padding-block-end:var(--spacing-m);padding-inline-start:var(--spacing-l);padding-inline-end:var(--spacing-l);border-radius:0px;border-block-start-width:0px;border-block-end-width:var(--border-s);border-inline-start-width:0px;border-inline-end-width:0px;color: var(--brand-text);
background-color: transparent;
border-color: var(--surface-border);
/* Cancels the button Default Style shadow */
box-shadow: none;\n}.elementor .mobile-menu-link:hover,.elementor .mobile-menu-link:focus-visible{background-color: transparent;
border-color: var(--surface-border);
/* Cancels the button default hover lift/shadow */
transform: none;
box-shadow: none;\n}.elementor .mobile-menu-link:focus{/* No shadow on mouse focus (the button default restates one, also with :hover) */
&:not(:focus-visible) {
box-shadow: none;
}
&:not(:focus-visible):hover {
box-shadow: none;
}\n}.elementor .eyebrow{font-family:var(--eyebrows);font-weight:500;font-size:0.75rem;letter-spacing:5%;line-height:var(--heading-line-height);text-transform:uppercase;color: var(--eyebrow-color); /* eyebrow ink; each invert sets --eyebrow-color */\n}.elementor .badge-still{/* Badge on the eyebrow paragraph itself (&:where(p) so a wrapper never styles itself), or on a flexbox that holds only an Internal Content instance (styles its eyebrow). Third arm = the same path through the editor canvas widget wrappers. All arms are (0,2,0) so per-element styles (card badge positioning) still win */
:is(&:where(p), :where(&) > .e-con > .eyebrow, :where(&) > :where(.elementor-widget-e-component) > .e-con > :where(.elementor-widget-e-paragraph) > .eyebrow) {
	display: flex;
	align-items: center;
	gap: .45em;
	flex: 0 0 auto;
	position: relative;
	overflow: hidden;
	z-index: 0;
	padding: var(--badge-padding-vertical) var(--badge-padding-horizontal);
	border-radius: var(--radius-l);
	font-weight: 600;
	color: var(--badge-ink, var(--on-accent));
	background-color: var(--badge-fill, var(--accent));
	box-shadow: inset 0 0 0 var(--border-m) var(--badge-border, transparent); /* outline hook; a shadow so the badge size never changes */
}

:is(&:where(p), :where(&) > .e-con > .eyebrow, :where(&) > :where(.elementor-widget-e-component) > .e-con > :where(.elementor-widget-e-paragraph) > .eyebrow)::before {
	content: "";
	flex: none;
	width: .5em;
	height: .5em;
	border-radius: 50%;
	background: var(--badge-dot, currentColor); /* dot = the badge ink */
	display: var(--badge-dot-display, block); /* none = no dot */
}
\n}.elementor .button-s{/* Button one step smaller. On the button itself, or on a wrapper flexbox to every button inside its child flexboxes at any depth (Internal Content buttons sit one flexbox down). Both arms are (0,2,0) so per-element styles still win; descendant combinators also survive the editor canvas wrappers */
:is(&:where(.e-button-base), :where(&) .e-con .e-button-base) {
	font-size: var(--body-s-size);
}
\n}.elementor .button-ghost{/* Border colour comes from the button default; no resting shadow */
color: var(--ghost-text, var(--brand-text));
background-color: var(--surface);
box-shadow: none;\n}.elementor .button-ghost:hover,.elementor .button-ghost:focus-visible{box-shadow:var(--box-shadow-h) var(--box-shadow-v-light) var(--box-shadow-b-light) var(--box-shadow-s) var(--color-box-shadow-light);/* Restated over the button default hover fill */
background-color: var(--tint);
border-color: var(--brand);\n}.elementor .button-ghost:focus{/* Mouse-focus shadows: none at rest, light on hover */
&:not(:focus-visible) {
box-shadow: none;
}
&:not(:focus-visible):hover {
box-shadow: var(--shadow-rest);
}\n}.elementor .logo{width:auto;height:clamp(2rem, .9091vw + 1.7955rem, 2.5rem);border-radius:0px;}.elementor .divider-s{height:var(--border-s);/* Override per element with --divider-color */
background-color: var(--divider-color, var(--brand));\n}.elementor .divider-m{height:var(--border-m);/* Override per element with --divider-color */
background-color: var(--divider-color, var(--brand));\n}.elementor .svg-icon-m{width:auto;height:2.1rem;}.elementor .svg-icon-outline{aspect-ratio:1 / 1;/* Override per element with --icon-color */

container-type: inline-size;

 * {
fill: none;
color: var(--icon-color, var(--brand));
}

svg {
      stroke-width: clamp(2px, 2.68cqw + 1.5px, 10px)
}
 svg :is(path, circle, rect, line, polyline, polygon, ellipse) {
      vector-effect: non-scaling-stroke;
}\n}