/**
 * Grid / konteyner / breakpoint / z-index tokenları
 * Kaynak: twin-kit layout.css yapısı (docs/TWIN-IMPLEMENTATION-MAP.md).
 */

:root {
	/* Konteynerler  */
	--container-reading: 760px;
	--container-content: 1280px;
	--container-wide: 1536px;
	--container-full: 100%;
	--gutter-page: clamp(1.25rem, 4vw, 4.5rem);

	/* Kolon aralığı  */
	--gap-mobile: 16px;
	--gap-tablet: 24px;
	--gap-desktop: clamp(24px, 2vw, 36px);

	/* Z-index  */
	--z-base: 0;
	--z-raised: 10;
	--z-sticky: 100;
	--z-menu: 200;
	--z-modal: 300;
	--z-toast: 400;
}

/**
 * Referans breakpoint aralıkları  — belgeleme amaçlıdır, medya sorguları
 * bileşen dosyalarında bu aralıklara göre kurulur:
 * 0–639px mobil, 640–899px geniş mobil, 900–1199px tablet,
 * 1200–1599px masaüstü, 1600px+ geniş masaüstü.
 */

.carilo-container {
	width: min(100% - 2 * var(--gutter-page), var(--container-content));
	margin-inline: auto;
}

.carilo-container--wide {
	width: min(100% - 2 * var(--gutter-page), var(--container-wide));
	margin-inline: auto;
}

.carilo-container--reading {
	width: min(100% - 2 * var(--gutter-page), var(--container-reading));
	margin-inline: auto;
}