/* ==========================================================================
   tokens.css — tasarım sistemi değişkenleri (tema-spec.md §1)
   Burada başka hiçbir şey tanımlanmaz: yalnızca custom property'ler.
   ========================================================================== */

:root {
	/* -------------------------------------------------- Renk (LIGHT) */
	--background: 30 20% 97%;
	--foreground: 20 15% 8%;
	--card: 30 15% 94%;
	--card-foreground: 20 15% 8%;
	--primary: 15 80% 38%;
	--primary-foreground: 0 0% 100%;
	--secondary: 350 70% 44%;
	--secondary-foreground: 0 0% 100%;
	--muted: 30 10% 88%;
	--muted-foreground: 20 8% 38%;
	--accent: 30 90% 50%;
	--accent-foreground: 0 0% 100%;
	--destructive: 0 84% 60%;
	--border: 30 10% 82%;
	--input: 30 10% 55%;
	--ring: 15 80% 38%;
	--radius: .5rem;

	/* ------------------------------------------------------ Tipografi */
	--font-display: "Syne", "Trebuchet MS", system-ui, sans-serif;
	--font-body: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

	--text-meta: .75rem;      /* 12px */
	--text-mono-sm: .8125rem; /* 13px */
	--text-sm: .875rem;       /* 14px */
	--text-base: 1rem;
	--text-card-title: 1.125rem;

	/* ---------------------------------------------------------- Layout */
	--container-max: 1400px;
	--container-pad: 1rem;
	--wrap-content: 72rem;
	--wrap-article: 42rem;
	--wrap-about: 48rem;
	--nav-h: 80px;
	--section-y: 4rem;

	/* -------------------------------------------------------- Yüzeyler */
	--radius-card: 16px;
	--radius-media: 12px;
	--radius-control: 6px;
	--tap-target: 44px;

	/* ------------------------------------------------------- Hareket */
	--ease: cubic-bezier(.4, 0, .2, 1);
	--dur-fast: .15s;
	--dur: .3s;

	/* --------------------------------------------------------- Katman */
	--z-blob: -1;
	--z-nav: 50;
	--z-overlay: 60;
	--z-progress: 70;

	color-scheme: light;
}

.dark {
	--background: 20 15% 7%;
	--foreground: 30 10% 90%;
	--card: 20 12% 11%;
	--card-foreground: 30 10% 90%;
	--primary: 15 80% 55%;
	--primary-foreground: 20 15% 7%;
	--secondary: 350 70% 61%;
	--secondary-foreground: 20 15% 7%;
	--muted: 20 10% 18%;
	--muted-foreground: 30 5% 55%;
	--accent: 30 90% 60%;
	--accent-foreground: 20 15% 7%;
	--destructive: 0 62% 30%;
	--border: 20 10% 20%;
	--input: 20 10% 38%;
	--ring: 15 80% 55%;

	color-scheme: dark;
}

@media (min-width: 640px) {
	:root {
		--container-pad: 1.5rem;
	}
}

@media (min-width: 768px) {
	:root {
		--section-y: 6rem;
	}
}

@media (min-width: 1280px) {
	:root {
		--section-y: 8rem;
	}
}