/* ==========================================================================
   SkyTrade Aviation - Layout
   Container/grid system. Modern Flexbox/Grid throughout - no floats.
   ========================================================================== */

.container {
	max-width: var(--st-max-width);
	margin-inline: auto;
	padding-inline: var(--st-space-lg);
}

@media (min-width: 1280px) {
	.container {
		padding-inline: var(--st-space-xl);
	}
}

.container--wide {
	max-width: 1440px;
}

.container--narrow {
	max-width: 800px;
}

.grid {
	display: grid;
	gap: var(--st-space-lg);
}

.grid--2 {
	grid-template-columns: repeat(1, 1fr);
}
.grid--3 {
	grid-template-columns: repeat(1, 1fr);
}
.grid--4 {
	grid-template-columns: repeat(1, 1fr);
}

@media (min-width: 640px) {
	.grid--2 { grid-template-columns: repeat(2, 1fr); }
	.grid--3 { grid-template-columns: repeat(2, 1fr); }
	.grid--4 { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 960px) {
	.grid--3 { grid-template-columns: repeat(3, 1fr); }
	.grid--4 { grid-template-columns: repeat(4, 1fr); }
}

@media (min-width: 1200px) {
	.grid--2 { grid-template-columns: repeat(2, 1fr); }
}

.row {
	display: flex;
	align-items: center;
}

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

.row--gap-sm { gap: var(--st-space-sm); }
.row--gap-md { gap: var(--st-space-md); }
.row--gap-lg { gap: var(--st-space-lg); }

.section {
	padding-block: var(--st-space-3xl);
}

.section--tight {
	padding-block: var(--st-space-2xl);
}

.card {
	background-color: var(--st-navy-light);
	border: 1px solid var(--st-navy-mid);
	border-radius: var(--st-radius-card);
	padding: var(--st-space-lg);
}

.hide-mobile {
	display: none;
}
@media (min-width: 960px) {
	.hide-mobile { display: block; }
	.hide-desktop { display: none; }
}
