/**
 * Stratus Interactive - Custom Block Supplemental Styles
 *
 * Additional styles for custom blocks beyond what their
 * individual style.css files handle.
 *
 * @package StratusInteractive
 */

/* ========================================================================
   Portfolio Grid Block - Layout Variations
   ======================================================================== */

.stratus-portfolio-grid.alignwide .stratus-portfolio-items {
	padding: 0 2rem;
}

.stratus-portfolio-grid.alignfull .stratus-portfolio-items {
	padding: 0 4rem;
}

@media (max-width: 600px) {
	.stratus-portfolio-grid.alignfull .stratus-portfolio-items {
		padding: 0 1rem;
	}
}

/* ========================================================================
   Team Member Block - Grid Layouts
   ======================================================================== */

.stratus-team-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2rem;
}

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

@media (max-width: 768px) {
	.stratus-team-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.stratus-team-grid {
		grid-template-columns: 1fr;
		max-width: 320px;
		margin: 0 auto;
	}
}

/* ========================================================================
   Stats Counter Block - Row Layout
   ======================================================================== */

.stratus-stats-row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 2rem;
}

@media (max-width: 768px) {
	.stratus-stats-row {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.stratus-stats-row {
		grid-template-columns: 1fr;
	}
}