/* Display Classes */
.block {
	display: block;
}
.inline-block {
	display: inline-block;
}
.inline {
	display: inline;
}
.flex {
	display: flex;
}
.inline-flex {
	display: inline-flex;
}
.table {
	display: table;
}
.inline-table {
	display: inline-table;
}
.table-caption {
	display: table-caption;
}
.table-cell {
	display: table-cell;
}
.table-column {
	display: table-column;
}
.table-column-group {
	display: table-column-group;
}
.table-footer-group {
	display: table-footer-group;
}
.table-header-group {
	display: table-header-group;
}
.table-row-group {
	display: table-row-group;
}
.table-row {
	display: table-row;
}
.flow-root {
	display: flow-root;
}
.grid {
	display: grid;
}
.inline-grid {
	display: inline-grid;
}
.contents {
	display: contents;
}
.list-item {
	display: list-item;
}
.hidden {
	display: none;
}

.flex-col {
	flex-direction: column;
}

@media screen and (max-width: 1024px) {
	.lg\:hidden {
		display: none !important;
	}

	.lg\:flex {
		display: flex;
	}

	.lg\:flex-row {
		flex-direction: row;
	}

	.lg\:flex-col {
		flex-direction: column;
	}
}

@media screen and (max-width: 768px) {
	.md\:hidden {
		display: none;
	}

	.md\:flex-row {
		flex-direction: row;
	}

	.md\:block {
		display: block;
	}
}

@media screen and (max-width: 640px) {
	.sm\:hidden {
		display: none;
	}

	.sm\:flex-col {
		flex-direction: column;
	}

	.sm\:flex-row {
		flex-direction: row;
	}
}

/* Text Decoration Classes */
.no-underline {
	text-decoration-line: none;
}

.hover\:underline:hover {
	text-decoration-line: underline;
}

/* Grid Column Start / End Classes */
.col-span-1 {
	grid-column: span 1 / span 1;
}
.col-span-2 {
	grid-column: span 2 / span 2;
}
.col-span-3 {
	grid-column: span 3 / span 3;
}
.col-span-4 {
	grid-column: span 4 / span 4;
}
.col-span-5 {
	grid-column: span 5 / span 5;
}
.col-span-6 {
	grid-column: span 6 / span 6;
}
.col-span-7 {
	grid-column: span 7 / span 7;
}
.col-span-8 {
	grid-column: span 8 / span 8;
}
.col-span-9 {
	grid-column: span 9 / span 9;
}
.col-span-10 {
	grid-column: span 10 / span 10;
}
.col-span-11 {
	grid-column: span 11 / span 11;
}
.col-span-12 {
	grid-column: span 12 / span 12;
}
.col-span-full {
	grid-column: 1 / -1;
}
@media (max-width: 1280px) {
	.xl\:col-span-1 {
		grid-column: span 1 / span 1;
	}
	.xl\:col-span-2 {
		grid-column: span 2 / span 2;
	}
	.xl\:col-span-3 {
		grid-column: span 3 / span 3;
	}
	.xl\:col-span-4 {
		grid-column: span 4 / span 4;
	}
	.xl\:col-span-5 {
		grid-column: span 5 / span 5;
	}
	.xl\:col-span-6 {
		grid-column: span 6 / span 6;
	}
	.xl\:col-span-7 {
		grid-column: span 7 / span 7;
	}
	.xl\:col-span-8 {
		grid-column: span 8 / span 8;
	}
	.xl\:col-span-9 {
		grid-column: span 9 / span 9;
	}
	.xl\:col-span-10 {
		grid-column: span 10 / span 10;
	}
	.xl\:col-span-11 {
		grid-column: span 11 / span 11;
	}
	.xl\:col-span-12 {
		grid-column: span 12 / span 12;
	}
	.xl\:col-span-full {
		grid-column: 1 / -1;
	}
}
@media (max-width: 1024px) {
	.lg\:col-span-1 {
		grid-column: span 1 / span 1;
	}
	.lg\:col-span-2 {
		grid-column: span 2 / span 2;
	}
	.lg\:col-span-3 {
		grid-column: span 3 / span 3;
	}
	.lg\:col-span-4 {
		grid-column: span 4 / span 4;
	}
	.lg\:col-span-5 {
		grid-column: span 5 / span 5;
	}
	.lg\:col-span-6 {
		grid-column: span 6 / span 6;
	}
	.lg\:col-span-7 {
		grid-column: span 7 / span 7;
	}
	.lg\:col-span-8 {
		grid-column: span 8 / span 8;
	}
	.lg\:col-span-9 {
		grid-column: span 9 / span 9;
	}
	.lg\:col-span-10 {
		grid-column: span 10 / span 10;
	}
	.lg\:col-span-11 {
		grid-column: span 11 / span 11;
	}
	.lg\:col-span-12 {
		grid-column: span 12 / span 12;
	}
	.lg\:col-span-full {
		grid-column: 1 / -1;
	}
}
@media (max-width: 768px) {
	.md\:col-span-1 {
		grid-column: span 1 / span 1;
	}
	.md\:col-span-2 {
		grid-column: span 2 / span 2;
	}
	.md\:col-span-3 {
		grid-column: span 3 / span 3;
	}
	.md\:col-span-4 {
		grid-column: span 4 / span 4;
	}
	.md\:col-span-5 {
		grid-column: span 5 / span 5;
	}
	.md\:col-span-6 {
		grid-column: span 6 / span 6;
	}
	.md\:col-span-7 {
		grid-column: span 7 / span 7;
	}
	.md\:col-span-8 {
		grid-column: span 8 / span 8;
	}
	.md\:col-span-9 {
		grid-column: span 9 / span 9;
	}
	.md\:col-span-10 {
		grid-column: span 10 / span 10;
	}
	.md\:col-span-11 {
		grid-column: span 11 / span 11;
	}
	.md\:col-span-12 {
		grid-column: span 12 / span 12;
	}
	.md\:col-span-full {
		grid-column: 1 / -1;
	}
}
@media (max-width: 640px) {
	.sm\:col-span-1 {
		grid-column: span 1 / span 1;
	}
	.sm\:col-span-2 {
		grid-column: span 2 / span 2;
	}
	.sm\:col-span-3 {
		grid-column: span 3 / span 3;
	}
	.sm\:col-span-4 {
		grid-column: span 4 / span 4;
	}
	.sm\:col-span-5 {
		grid-column: span 5 / span 5;
	}
	.sm\:col-span-6 {
		grid-column: span 6 / span 6;
	}
	.sm\:col-span-7 {
		grid-column: span 7 / span 7;
	}
	.sm\:col-span-8 {
		grid-column: span 8 / span 8;
	}
	.sm\:col-span-9 {
		grid-column: span 9 / span 9;
	}
	.sm\:col-span-10 {
		grid-column: span 10 / span 10;
	}
	.sm\:col-span-11 {
		grid-column: span 11 / span 11;
	}
	.sm\:col-span-12 {
		grid-column: span 12 / span 12;
	}
	.sm\:col-span-full {
		grid-column: 1 / -1;
	}
}

.flex-wrap {
	flex-wrap: wrap;
}

.items-start {
	align-items: flex-start;
}

.items-end {
	align-items: flex-end;
}

.items-center {
	align-items: center;
}

.items-baseline {
	align-items: baseline;
}

.items-stretch {
	align-items: stretch;
}

@media (max-width: 1024px) {
	.lg\:items-center {
		align-items: center;
	}
	.lg\:items-start {
		align-items: flex-start;
	}
	.lg\:items-end {
		align-items: flex-end;
	}
	.lg\:items-baseline {
		align-items: baseline;
	}
	.lg\:items-stretch {
		align-items: stretch;
	}
}

@media (max-width: 768px) {
	.md\:items-center {
		align-items: center;
	}
	.md\:items-start {
		align-items: flex-start;
	}
	.md\:items-end {
		align-items: flex-end;
	}
	.md\:items-baseline {
		align-items: baseline;
	}
	.md\:items-stretch {
		align-items: stretch;
	}
}

@media (max-width: 640px) {
	.sm\:items-center {
		align-items: center;
	}
	.sm\:items-start {
		align-items: flex-start;
	}
	.sm\:items-end {
		align-items: flex-end;
	}
	.sm\:items-baseline {
		align-items: baseline;
	}
	.sm\:items-stretch {
		align-items: stretch;
	}
}

.justify-normal {
	justify-content: normal;
}

.justify-start {
	justify-content: flex-start;
}

.justify-end {
	justify-content: flex-end;
}

.justify-center {
	justify-content: center;
}

.justify-between {
	justify-content: space-between;
}

.justify-around {
	justify-content: space-around;
}

.justify-evenly {
	justify-content: space-evenly;
}

.justify-stretch {
	justify-content: stretch;
}

@media (max-width: 1024px) {
	.lg\:justify-start {
		justify-content: start;
	}
	.lg\:justify-center {
		justify-content: center;
	}
	.lg\:justify-between {
		justify-content: space-between;
	}
	.lg\:justify-around {
		justify-content: space-around;
	}
	.lg\:justify-evenly {
		justify-content: space-evenly;
	}
	.lg\:justify-stretch {
		justify-content: stretch;
	}
}

@media (max-width: 768px) {
	.md\:justify-center {
		justify-content: center;
	}
	.md\:justify-between {
		justify-content: space-between;
	}
	.md\:justify-around {
		justify-content: space-around;
	}
	.md\:justify-evenly {
		justify-content: space-evenly;
	}
	.md\:justify-stretch {
		justify-content: stretch;
	}
}

@media (max-width: 640px) {
	.sm\:justify-center {
		justify-content: center;
	}
	.sm\:justify-between {
		justify-content: space-between;
	}
	.sm\:justify-around {
		justify-content: space-around;
	}
	.sm\:justify-evenly {
		justify-content: space-evenly;
	}
	.sm\:justify-stretch {
		justify-content: stretch;
	}
}

.capitalize {
	text-transform: capitalize;
}

.gap-4 {
	gap: 4px;
}

.gap-8 {
	gap: 8px;
}

.gap-12 {
	gap: 12px;
}

.gap-16 {
	gap: 16px;
}

.gap-24 {
	gap: 24px;
}

.gap-32 {
	gap: 32px;
}

.mb-0 {
	margin-bottom: 0px !important;
}

.mb-4 {
	margin-bottom: 4px !important;
}

.mb-8 {
	margin-bottom: 8px !important;
}

.mb-12 {
	margin-bottom: 12px !important;
}

.mb-16 {
	margin-bottom: 16px !important;
}

.mb-24 {
	margin-bottom: 24px !important;
}

.mb-32 {
	margin-bottom: 32px !important;
}

.mb-40 {
	margin-bottom: 40px !important;
}

.mt-0 {
	margin-top: 0px !important;
}

.mt-4 {
	margin-top: 4px !important;
}

.mt-8 {
	margin-top: 8px !important;
}

.mt-24 {
	margin-top: 24px !important;
}

.ml-8 {
	margin-left: 8px;
}

.font-extralight {
	font-weight: 200;
}

.font-light {
	font-weight: 300;
}

.font-normal {
	font-weight: 400;
}

.font-medium {
	font-weight: 500;
}

.font-semibold {
	font-weight: 600;
}
.font-bold {
	font-weight: 700;
}

.sr-only {
	position: absolute;
	width: 0;
	height: 0;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 0 !important;
}

.flex-shrink-0 {
	flex-shrink: 0;
}

.unstyled-list {
	list-style: none;
	padding: 0;
}

.columns-2 {
	column-count: 2;
}

@media screen and (max-width: 1280px) {
	.columns-1-tablet {
		column-count: 1;
	}
}

@media screen and (max-width: 640px) {
	.columns-1-mobile {
		column-count: 1;
	}

	.sm\:columns-1 {
		column-count: 1;
	}
}

.max-width-450 {
	max-width: 450px;
}

.max-width-580 {
	max-width: 580px;
}

.width-100 {
	width: 100%;
}

.flex-grow-0 {
	flex-grow: 0;
}
.flex-grow {
	flex-grow: 1;
}

.text-uppercase {
	text-transform: uppercase;
}

.width-100 > img {
	width: 100%;
}

.no-underline {
	text-decoration: none;
}

.no-underline a {
	text-decoration: none;
}

.underline {
	text-decoration: underline;
}

.text-center {
	text-align: center;
}

.text-left {
	text-align: left;
}

.overflow-visible {
	overflow: visible;
}

/* Height Clamping Utility Classes */
/* Based on wp_get_computed_fluid_typography_value() function */
/* Common height clamp presets - min height, max height, min viewport (400px), max viewport (1600px) */

/* Small height clamps */
.h-clamp-200-400 {
	height: clamp(200px, calc(200px + ((1vw - 4px) * 16.667)), 400px);
}

.h-clamp-300-500 {
	height: clamp(300px, calc(300px + ((1vw - 4px) * 16.667)), 500px);
}

.h-clamp-400-600 {
	height: clamp(400px, calc(400px + ((1vw - 4px) * 16.667)), 600px);
}

/* Compact height clamps - smaller elements with max heights */
.h-clamp-24-50 {
	height: clamp(24px, calc(24px + ((1vw - 4px) * 2)), 50px) !important;
}
.h-clamp-36-72 {
	height: clamp(36px, calc(36px + ((1vw - 4px) * 3)), 72px) !important;
}

.h-clamp-50-100 {
	height: clamp(50px, calc(50px + ((1vw - 4px) * 4.167)), 100px) !important;
}

.h-clamp-60-120 {
	height: clamp(60px, calc(60px + ((1vw - 4px) * 5)), 120px) !important;
}

.h-clamp-80-160 {
	height: clamp(80px, calc(80px + ((1vw - 4px) * 6.667)), 160px) !important;
}

/* Medium height clamps */
.h-clamp-500-800 {
	height: clamp(500px, calc(500px + ((1vw - 4px) * 25)), 800px);
}

.h-clamp-600-1000 {
	height: clamp(600px, calc(600px + ((1vw - 4px) * 33.333)), 1000px);
}

.h-clamp-800-1200 {
	height: clamp(800px, calc(800px + ((1vw - 4px) * 33.333)), 1200px);
}

/* Large height clamps */
.h-clamp-1000-1600 {
	height: clamp(1000px, calc(1000px + ((1vw - 4px) * 50)), 1600px);
}

.h-clamp-1200-2000 {
	height: clamp(1200px, calc(1200px + ((1vw - 4px) * 66.667)), 2000px);
}

/* Viewport-based height clamps (using vh units) */
/* Note: These use vh units but scale based on viewport width (vw) */
.h-clamp-50vh-100vh {
	height: clamp(50vh, calc(50vh + ((1vw - 4vh) * 4.167)), 100vh);
}

.h-clamp-60vh-100vh {
	height: clamp(60vh, calc(60vh + ((1vw - 4vh) * 3.333)), 100vh);
}

.h-clamp-70vh-100vh {
	height: clamp(70vh, calc(70vh + ((1vw - 4vh) * 2.5)), 100vh);
}

.h-clamp-80vh-100vh {
	height: clamp(80vh, calc(80vh + ((1vw - 4vh) * 1.667)), 100vh);
}

/* Custom height clamp - use CSS custom properties for flexibility */
/* Usage: Set --h-min, --h-max, --vw-min, --vw-max on the element */
.h-clamp-custom {
	--h-min: 400px;
	--h-max: 800px;
	--vw-min: 400px;
	--vw-max: 1600px;
	--linear-factor: calc(
		(var(--h-max) - var(--h-min)) / (var(--vw-max) - var(--vw-min)) * 100
	);
	--viewport-offset: calc(var(--vw-min) / 100);
	height: clamp(
		var(--h-min),
		calc(
			var(--h-min) +
				((1vw - var(--viewport-offset)) * var(--linear-factor))
		),
		var(--h-max)
	);
}

@media screen and (max-width: 1024px) {
	.lg\:basis-full {
		flex-basis: 100% !important;
	}

	.lg\:flex {
		display: flex !important;
	}

	.lg\:flex-row-reverse {
		flex-direction: row-reverse !important;
	}
}