/* =========================================================
   LAYOUT.CSS - Genel sayfa iskeleti ve container yapısı
   ========================================================= */

.site-wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.site-content {
	flex: 1;
}

/* Sitenin her bölümü aynı ortalanmış genişliği kullansın diye
   ortak bir container sınıfı - PHP tarafında section'lara
   ".container" sınıfı ekleyeceğiz. */
.container,
.site-branding-row,
.category-navigation .category-menu-list,
.radio-slider-section,
.radio-grid-section,
.radio-groups-section,
.city-selector-section,
.footer-widgets-row,
.site-info {
	max-width: var(--container-width);
	margin-inline: auto;
	padding-inline: var(--space-lg);
}

.section-title {
	font-size: var(--fs-xl);
	font-weight: 700;
	color: var(--color-text);
	margin-bottom: var(--space-xs);
}

.section-subtitle {
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
	margin-bottom: var(--space-lg);
}

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