@charset "UTF-8";

/**
 * Grid layouts.
 * Custom grid classes for responsive two and three column layouts.
 *
 * @package treowtheme
 */

/**
 * Base grid
 */

.tw-grid {
	display: grid;
}

/* WordPress grid block gap and alignment override */
.is-layout-grid {
	gap: var(--wp--preset--spacing--tw-normal);
	justify-content: center;
}

.tw-grid-full {
	grid-column: 1 / -1;
}

/**
 * Two-column responsive grid
 * Single column on mobile, two columns on tablet and above.
 */

.tw-grid-2-col {
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--tw-normal) !important;
	margin-block-start: 0 !important;
	margin-bottom: var(--wp--preset--spacing--tw-normal) !important;
}

.tw-grid-2-col > .wp-block-group {
	margin-block-start: 0;
}

/* Mobile: visual column always first */
.tw-grid-2-col .tw-grid-2-col-visual {
	order: 1;
}

.tw-grid-2-col .tw-grid-2-col-content {
	order: 2;
}

/**
 * Three-column grid
 * First item spans full width.
 */

.tw-grid-3-col .wp-block-post:first-child {
	grid-column: 1 / -1;
}

/**
 * Testimonial grid
 */

.tw-grid-testimonial h2 {
	font-size: var(--wp--preset--font-size--tw-4);
}

/**
 * Archive card grid
 * Used with the tw-card block style variation.
 */

.wp-block-post-template .wp-block-post .is-style-tw-card {
	display: grid;
	grid-template-rows: auto auto 1fr;
}

/**
 * Media queries
 */

/* Tablet and desktop: two equal columns with natural order */
@media only screen and (min-width: 600px) {
	.tw-grid-2-col {
		grid-template-columns: 1fr 1fr;
	}

	.tw-grid-2-col .tw-grid-2-col-visual,
	.tw-grid-2-col .tw-grid-2-col-content {
		order: initial;
	}
}