/**
 * Venexian — Utility classes (utilities.css)
 * ------------------------------------------------------------------
 * Single-purpose helpers for theme-rendered markup and opt-in use inside
 * Elementor HTML widgets. No .elementor-* selectors. Load AFTER main.css.
 * ------------------------------------------------------------------ */

/* =========================================================
   DISPLAY
   ========================================================= */
.vx-d-none    { display: none !important; }
.vx-d-block   { display: block !important; }
.vx-d-inline  { display: inline-block !important; }
.vx-d-flex    { display: flex !important; }
.vx-d-grid    { display: grid !important; }

/* =========================================================
   FLEX HELPERS
   ========================================================= */
.vx-flex-col      { flex-direction: column !important; }
.vx-flex-wrap     { flex-wrap: wrap !important; }
.vx-items-center  { align-items: center !important; }
.vx-items-start   { align-items: flex-start !important; }
.vx-items-end     { align-items: flex-end !important; }
.vx-justify-center  { justify-content: center !important; }
.vx-justify-between { justify-content: space-between !important; }
.vx-justify-end     { justify-content: flex-end !important; }

/* =========================================================
   GAP
   ========================================================= */
.vx-gap-xs { gap: var(--vx-space-xs) !important; }
.vx-gap-sm { gap: var(--vx-space-sm) !important; }
.vx-gap-md { gap: var(--vx-space-md) !important; }
.vx-gap-lg { gap: var(--vx-space-lg) !important; }
.vx-gap-xl { gap: var(--vx-space-xl) !important; }

/* =========================================================
   SPACING — margin
   ========================================================= */
.vx-m-0  { margin: 0 !important; }
.vx-mt-0 { margin-top: 0 !important; }
.vx-mb-0 { margin-bottom: 0 !important; }

.vx-mt-sm { margin-top: var(--vx-space-sm) !important; }
.vx-mt-md { margin-top: var(--vx-space-md) !important; }
.vx-mt-lg { margin-top: var(--vx-space-lg) !important; }
.vx-mt-xl { margin-top: var(--vx-space-xl) !important; }
.vx-mt-2xl { margin-top: var(--vx-space-2xl) !important; }

.vx-mb-sm { margin-bottom: var(--vx-space-sm) !important; }
.vx-mb-md { margin-bottom: var(--vx-space-md) !important; }
.vx-mb-lg { margin-bottom: var(--vx-space-lg) !important; }
.vx-mb-xl { margin-bottom: var(--vx-space-xl) !important; }
.vx-mb-2xl { margin-bottom: var(--vx-space-2xl) !important; }

.vx-mx-auto { margin-inline: auto !important; }

/* =========================================================
   SPACING — padding
   ========================================================= */
.vx-p-0  { padding: 0 !important; }
.vx-p-md { padding: var(--vx-space-md) !important; }
.vx-p-lg { padding: var(--vx-space-lg) !important; }
.vx-p-xl { padding: var(--vx-space-xl) !important; }

.vx-py-sm { padding-block: var(--vx-space-sm) !important; }
.vx-py-md { padding-block: var(--vx-space-md) !important; }
.vx-py-lg { padding-block: var(--vx-space-lg) !important; }
.vx-py-xl { padding-block: var(--vx-space-xl) !important; }
.vx-py-2xl { padding-block: var(--vx-space-2xl) !important; }

.vx-px-md { padding-inline: var(--vx-space-md) !important; }
.vx-px-lg { padding-inline: var(--vx-space-lg) !important; }

/* =========================================================
   TYPOGRAPHY HELPERS
   ========================================================= */
.vx-font-heading { font-family: var(--vx-font-heading) !important; }
.vx-font-body    { font-family: var(--vx-font-body) !important; }

.vx-text-xs   { font-size: var(--vx-text-xs) !important; }
.vx-text-sm   { font-size: var(--vx-text-sm) !important; }
.vx-text-base { font-size: var(--vx-text-base) !important; }
.vx-text-lg   { font-size: var(--vx-text-lg) !important; }
.vx-text-xl   { font-size: var(--vx-text-xl) !important; }

.vx-fw-300 { font-weight: 300 !important; }
.vx-fw-400 { font-weight: 400 !important; }
.vx-fw-500 { font-weight: 500 !important; }
.vx-fw-600 { font-weight: 600 !important; }

.vx-uppercase { text-transform: uppercase !important; }
.vx-italic    { font-style: italic !important; }
.vx-tracking-wide  { letter-spacing: var(--vx-tracking-wide) !important; }
.vx-tracking-xwide { letter-spacing: var(--vx-tracking-xwide) !important; }
.vx-leading-snug   { line-height: var(--vx-leading-snug) !important; }

.vx-text-left   { text-align: left !important; }
.vx-text-center { text-align: center !important; }
.vx-text-right  { text-align: right !important; }

/* =========================================================
   COLOR HELPERS
   ========================================================= */
.vx-text-gold       { color: var(--vx-gold) !important; }
.vx-text-gold-light { color: var(--vx-gold-light) !important; }
.vx-text-white      { color: var(--vx-white) !important; }
.vx-text-muted      { color: var(--vx-ink-60) !important; }
.vx-text-dark       { color: var(--vx-black) !important; }

.vx-bg-black   { background-color: var(--vx-black) !important; }
.vx-bg-surface { background-color: var(--vx-surface) !important; }
.vx-bg-gold    { background-color: var(--vx-gold) !important; }
.vx-bg-white   { background-color: var(--vx-white) !important; }

/* =========================================================
   RADIUS / SHADOW
   ========================================================= */
.vx-rounded-sm { border-radius: var(--vx-radius-sm) !important; }
.vx-rounded    { border-radius: var(--vx-radius) !important; }
.vx-rounded-lg { border-radius: var(--vx-radius-lg) !important; }
.vx-rounded-pill { border-radius: var(--vx-radius-pill) !important; }

.vx-shadow-sm { box-shadow: var(--vx-shadow-sm) !important; }
.vx-shadow-lg { box-shadow: var(--vx-shadow-lg) !important; }

/* =========================================================
   WIDTH HELPERS
   ========================================================= */
.vx-w-full { width: 100% !important; }
.vx-maxw-narrow { max-width: var(--vx-container-narrow) !important; }
.vx-maxw-content { max-width: var(--vx-container) !important; }

/* =========================================================
   ACCESSIBILITY / VISIBILITY
   ========================================================= */
.vx-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Responsive show / hide */
@media (max-width: 768px) {
	.vx-hide-mobile { display: none !important; }
}

@media (min-width: 769px) {
	.vx-hide-desktop { display: none !important; }
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
