:root {
	--spx-content-width: min(1200px, 100% - 3rem);
	--spx-wide-width: min(1440px, 100% - 2rem);
	--spx-font-family-base: "Manrope", system-ui, sans-serif;
	--spx-font-family-heading: "Sora", "Manrope", system-ui, sans-serif;
	--spx-font-weight-body: 400;
	--spx-font-weight-heading: 800;
	--spx-font-weight-button: 800;
	--spx-font-size-body: clamp(0.98rem, 0.96rem + 0.12vw, 1.05rem);
	--spx-font-size-h1: clamp(2.45rem, 4.85vw, 4.65rem);
	--spx-font-size-h2: clamp(1.75rem, 1.25rem + 1.4vw, 2.55rem);
	--spx-font-size-h3: clamp(1.45rem, 1.85vw, 2rem);
	--spx-font-size-h4: clamp(1.18rem, 1.3vw, 1.45rem);
	--spx-font-size-h5: clamp(1rem, 1.05vw, 1.14rem);
	--spx-font-size-h6: 0.95rem;
	--spx-font-size-button: 0.96rem;
	--spx-line-height-body: 1.6;
	--spx-line-height-display: 0.98;
	--spx-line-height-heading: 1.08;
	--spx-line-height-button: 1.2;
	--spx-letter-spacing-display: -0.065em;
	--spx-letter-spacing-heading: -0.045em;
	--spx-button-radius: 999px;
	--spx-button-min-height: 52px;
	--spx-button-padding-inline: 1.35rem;
	/* Brand palette: black base with a controlled orange secondary accent. */
	--spx-color-surface: #ffffff;
	--spx-color-surface-alt: #fbfcf8;
	--spx-color-surface-soft: #f7f8fa;
	--spx-color-text: #101820;
	--spx-color-text-strong: #1f2933;
	--spx-color-text-muted: #5d6b7a;
	--spx-color-ink: #111111;
	--spx-color-surface-inverse: #05080c;
	--spx-color-surface-inverse-soft: #101318;
	--spx-color-accent: #ff7829;
	--spx-color-accent-strong: #d95f15;
	--spx-color-accent-soft: #fff1e8;
	--spx-color-accent-rgb: 255, 120, 41;
	--spx-color-accent-contrast: #111111;
	--spx-color-border: rgba(29, 45, 61, 0.12);
	--spx-color-border-strong: rgba(17, 17, 17, 0.12);
	--spx-editor-outline: #c6d4ff;
	--spx-button-shadow-accent: 0 18px 34px rgba(255, 120, 41, 0.24);
}

body {
	background: var(--spx-color-surface);
	color: var(--spx-color-text);
	font-family: var(--spx-font-family-base);
	font-size: var(--spx-font-size-body);
	font-weight: var(--spx-font-weight-body);
	line-height: var(--spx-line-height-body);
}

p,
li,
dt,
dd,
label,
input,
textarea,
select {
	color: inherit;
	font-family: inherit;
	font-size: var(--spx-font-size-body);
	line-height: var(--spx-line-height-body);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-block: 0;
	color: inherit;
	font-family: var(--spx-font-family-heading);
	font-weight: var(--spx-font-weight-heading);
	line-height: var(--spx-line-height-heading);
	letter-spacing: var(--spx-letter-spacing-heading);
	text-wrap: pretty;
}

h1 {
	font-size: var(--spx-font-size-h1);
	line-height: var(--spx-line-height-display);
	letter-spacing: var(--spx-letter-spacing-display);
}

h2 {
	font-size: var(--spx-font-size-h2);
}

h3 {
	font-size: var(--spx-font-size-h3);
}

h4 {
	font-size: var(--spx-font-size-h4);
}

h5 {
	font-size: var(--spx-font-size-h5);
}

h6 {
	font-size: var(--spx-font-size-h6);
}

a {
	color: inherit;
}

button,
.button,
.wp-element-button,
.wp-block-button__link,
.wc-block-components-button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
	font-family: var(--spx-font-family-base);
	font-size: var(--spx-font-size-button);
	font-weight: var(--spx-font-weight-button);
	line-height: var(--spx-line-height-button);
	border-radius: var(--spx-button-radius);
}

.button,
.wp-element-button,
.wp-block-button__link,
.wc-block-components-button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
	border: 1px solid transparent;
	background: linear-gradient(135deg, var(--spx-color-accent) 0%, #ffb45a 100%);
	color: var(--spx-color-accent-contrast);
	box-shadow: var(--spx-button-shadow-accent);
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.button,
.wp-element-button,
.wp-block-button__link,
.wc-block-components-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--spx-button-min-height);
	padding-block: 0.85rem;
	padding-inline: var(--spx-button-padding-inline);
	text-decoration: none;
}

.button:hover,
.button:focus-visible,
.wp-element-button:hover,
.wp-element-button:focus-visible,
.wp-block-button__link:hover,
.wp-block-button__link:focus-visible,
.wc-block-components-button:hover,
.wc-block-components-button:focus-visible,
input[type="button"]:hover,
input[type="button"]:focus-visible,
input[type="submit"]:hover,
input[type="submit"]:focus-visible,
input[type="reset"]:hover,
input[type="reset"]:focus-visible {
	transform: translateY(-1px);
	box-shadow: 0 22px 40px rgba(255, 120, 41, 0.28);
}

.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button__link.is-style-outline {
	border-color: currentColor;
	background: transparent;
	color: inherit;
	box-shadow: none;
}

.spx-layout-shell {
	position: relative;
}

.spx-layout-shell.is-width-content > .spx-layout-shell__inner {
	max-width: var(--spx-content-width);
	margin-inline: auto;
}

.spx-layout-shell.is-width-wide > .spx-layout-shell__inner {
	max-width: var(--spx-wide-width);
	margin-inline: auto;
}

.spx-layout-shell.is-width-full > .spx-layout-shell__inner {
	max-width: 100%;
}

.spx-canvas-template .spx-canvas-main {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.spx-flow > * + * {
	margin-block-start: var(--spx-flow-space, 1.5rem);
}