.pinxel-text--auxiliary {
	color: var(--pinxel-component-highlight, var(--pinxel-color-primary-text, var(--pinxel-color-primary, #5b3df5)));
	font-family: var(--pinxel-font-auxiliary, Didot, "Bodoni 72", "Bodoni MT", "Times New Roman", serif);
	font-style: italic;
	font-weight: 400;
}

.pinxel-text--primary,
.pinxel-text--primary .pinxel-text--auxiliary,
.pinxel-text--auxiliary .pinxel-text--primary {
	color: var(--pinxel-color-primary-text, var(--pinxel-color-primary, #5b3df5));
}

.pinxel-text--secondary,
.pinxel-text--secondary .pinxel-text--auxiliary,
.pinxel-text--auxiliary .pinxel-text--secondary {
	color: var(--pinxel-color-secondary, #18181b);
}

.pinxel-component-scheme--light.pinxel-component-background--base {
	--pinxel-component-background: var(--pinxel-color-background, #fff);
	--pinxel-component-elevated: var(--pinxel-color-surface, #f5f5f7);
	--pinxel-component-text: var(--pinxel-color-text, #18181b);
	--pinxel-component-muted: var(--pinxel-color-muted, #63636e);
	--pinxel-component-highlight: var(--pinxel-color-primary-text, var(--pinxel-color-primary, #5b3df5));
	--pinxel-component-highlight-soft: var(--pinxel-color-primary-soft, color-mix(in srgb, var(--pinxel-color-primary, #5b3df5) 12%, var(--pinxel-color-surface, #f5f5f7)));
	--pinxel-component-overlay: linear-gradient(90deg, color-mix(in srgb, var(--pinxel-color-background, #fff) 88%, transparent), color-mix(in srgb, var(--pinxel-color-background, #fff) 42%, transparent));
}

.pinxel-component-scheme--light.pinxel-component-background--soft {
	--pinxel-component-background: var(--pinxel-color-surface, #f5f5f7);
	--pinxel-component-elevated: var(--pinxel-color-background, #fff);
	--pinxel-component-text: var(--pinxel-color-text, #18181b);
	--pinxel-component-muted: var(--pinxel-color-muted, #63636e);
	--pinxel-component-highlight: var(--pinxel-color-primary-text, var(--pinxel-color-primary, #5b3df5));
	--pinxel-component-highlight-soft: var(--pinxel-color-primary-soft, color-mix(in srgb, var(--pinxel-color-primary, #5b3df5) 12%, var(--pinxel-color-surface, #f5f5f7)));
	--pinxel-component-overlay: linear-gradient(90deg, color-mix(in srgb, var(--pinxel-color-surface, #f5f5f7) 90%, transparent), color-mix(in srgb, var(--pinxel-color-surface, #f5f5f7) 44%, transparent));
}

.pinxel-component-scheme--dark.pinxel-component-background--base {
	--pinxel-component-background: var(--pinxel-color-dark-background, #18181b);
	--pinxel-component-elevated: var(--pinxel-color-dark-surface, #27272a);
	--pinxel-component-text: var(--pinxel-color-dark-text, #fff);
	--pinxel-component-muted: var(--pinxel-color-dark-muted, #d4d4d8);
	--pinxel-component-highlight: var(--pinxel-color-accent, #f4b942);
	--pinxel-component-highlight-soft: color-mix(in srgb, var(--pinxel-color-accent, #f4b942) 14%, transparent);
	--pinxel-component-overlay: linear-gradient(90deg, color-mix(in srgb, var(--pinxel-color-dark-background, #18181b) 86%, transparent), color-mix(in srgb, var(--pinxel-color-dark-background, #18181b) 36%, transparent));
}

.pinxel-component-scheme--dark.pinxel-component-background--soft {
	--pinxel-component-background: var(--pinxel-color-dark-surface, #27272a);
	--pinxel-component-elevated: var(--pinxel-color-dark-background, #18181b);
	--pinxel-component-text: var(--pinxel-color-dark-text, #fff);
	--pinxel-component-muted: var(--pinxel-color-dark-muted, #d4d4d8);
	--pinxel-component-highlight: var(--pinxel-color-accent, #f4b942);
	--pinxel-component-highlight-soft: color-mix(in srgb, var(--pinxel-color-accent, #f4b942) 14%, transparent);
	--pinxel-component-overlay: linear-gradient(90deg, color-mix(in srgb, var(--pinxel-color-dark-surface, #27272a) 88%, transparent), color-mix(in srgb, var(--pinxel-color-dark-surface, #27272a) 38%, transparent));
}

.pinxel-component-background--primary {
	--pinxel-component-background: var(--pinxel-color-primary, #5b3df5);
	--pinxel-component-elevated: var(--pinxel-color-primary-surface, var(--pinxel-color-primary, #5b3df5));
	--pinxel-component-text: var(--pinxel-color-on-primary, var(--pinxel-color-text, #18181b));
	--pinxel-component-muted: var(--pinxel-color-primary-muted, var(--pinxel-color-on-primary, #fff));
	--pinxel-component-highlight: var(--pinxel-color-on-primary, var(--pinxel-color-text, #18181b));
	--pinxel-component-highlight-soft: var(--pinxel-color-primary-surface, var(--pinxel-color-primary, #5b3df5));
	--pinxel-component-action-background: var(--pinxel-color-on-primary, #fff);
	--pinxel-component-action-text: var(--pinxel-color-primary, #5b3df5);
	--pinxel-component-focus: var(--pinxel-color-on-primary, #fff);
	--pinxel-component-overlay: linear-gradient(90deg, var(--pinxel-color-primary, #5b3df5) 0%, var(--pinxel-color-primary, #5b3df5) 42%, color-mix(in srgb, var(--pinxel-color-primary, #5b3df5) 72%, transparent) 100%);
}

.pinxel-component-background--secondary {
	--pinxel-component-background: var(--pinxel-color-secondary, #18181b);
	--pinxel-component-elevated: var(--pinxel-color-secondary-surface, var(--pinxel-color-secondary, #18181b));
	--pinxel-component-text: var(--pinxel-color-on-secondary, var(--pinxel-color-dark-text, #fff));
	--pinxel-component-muted: var(--pinxel-color-secondary-muted, var(--pinxel-color-on-secondary, #fff));
	--pinxel-component-highlight: var(--pinxel-color-on-secondary, var(--pinxel-color-dark-text, #fff));
	--pinxel-component-highlight-soft: var(--pinxel-color-secondary-surface, var(--pinxel-color-secondary, #18181b));
	--pinxel-component-action-background: var(--pinxel-color-on-secondary, #fff);
	--pinxel-component-action-text: var(--pinxel-color-secondary, #18181b);
	--pinxel-component-focus: var(--pinxel-color-on-secondary, #fff);
	--pinxel-component-overlay: linear-gradient(90deg, var(--pinxel-color-secondary, #18181b) 0%, var(--pinxel-color-secondary, #18181b) 42%, color-mix(in srgb, var(--pinxel-color-secondary, #18181b) 72%, transparent) 100%);
}

.pinxel-component-background--primary .pinxel-text--primary,
.pinxel-component-background--primary .pinxel-text--secondary,
.pinxel-component-background--secondary .pinxel-text--primary,
.pinxel-component-background--secondary .pinxel-text--secondary {
	color: var(--pinxel-component-text);
}

.pinxel-section-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center;
	margin-top: clamp(2rem, 4vw, 3rem);
}

.pinxel-section-action {
	align-items: center;
	border: var(--pinxel-button-border-width, 2px) solid transparent;
	border-radius: var(--pinxel-button-radius, 8px);
	box-sizing: border-box;
	display: inline-flex;
	font-family: var(--pinxel-font-body, sans-serif);
	font-size: var(--pinxel-button-font-size, 1rem);
	font-weight: var(--pinxel-button-font-weight, 700);
	justify-content: center;
	line-height: 1.2;
	padding: var(--pinxel-button-padding-y, 0.9rem) var(--pinxel-button-padding-x, 1.35rem);
	text-align: center;
	text-decoration: none;
	transition: filter 160ms ease, transform 160ms ease;
}

.pinxel-section-action--primary {
	background: var(--pinxel-component-action-background, var(--pinxel-color-primary, #5b3df5));
	color: var(--pinxel-component-action-text, var(--pinxel-color-on-primary, #fff));
}

.pinxel-section-action--secondary {
	background: transparent;
	border-color: currentColor;
	color: var(--pinxel-component-text, var(--pinxel-color-text, #18181b));
}

.pinxel-section-action:hover,
.pinxel-section-action:focus-visible {
	filter: brightness(0.92);
	text-decoration: none;
	transform: translateY(-1px);
}

.pinxel-form-protection {
	box-sizing: border-box;
	margin-top: 1.25rem;
	max-width: 100%;
}

.pinxel-form-protection .cf-turnstile {
	min-height: 65px;
}

.pinxel-form-protection noscript,
.pinxel-form-protection--error,
.pinxel-form-protection--preview {
	background: var(--pinxel-component-elevated, #f5f5f7);
	border: 1px solid color-mix(in srgb, var(--pinxel-component-text, #18181b) 22%, transparent);
	border-radius: var(--pinxel-radius-small, 8px);
	color: var(--pinxel-component-text, #18181b);
	display: block;
	font-size: 0.9rem;
	line-height: 1.45;
	padding: 0.85rem 1rem;
}

.pinxel-form-protection--error {
	border-color: color-mix(in srgb, #c62828 58%, var(--pinxel-component-background, #fff));
}

.pinxel-form-protection--preview {
	display: grid;
	gap: 0.2rem;
}

.pinxel-form-protection--preview span {
	color: var(--pinxel-component-muted, #63636e);
}

.pinxel-section-action:focus-visible {
	outline: 3px solid var(--pinxel-component-focus, var(--pinxel-color-accent, #f4b942));
	outline-offset: 3px;
}

@media (max-width: 480px) {
	.pinxel-section-actions {
		align-items: stretch;
		flex-direction: column;
	}

	.pinxel-section-action {
		width: 100%;
	}
}
