@import "./tokens.css";

/* Self-host subset font'lar — latin + latin-ext (Türkçe ş/ğ/ı/İ latin-ext'te), değişken ağırlık 400–700.
 * url() göreli: dist içinde ./fonts/ korunur → /assets/design/fonts/... */
@font-face {
	font-family: "Playfair Display";
	src: url("./fonts/playfair-display-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Playfair Display";
	src: url("./fonts/playfair-display-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF;
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("./fonts/plus-jakarta-sans-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122;
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Plus Jakarta Sans";
	src: url("./fonts/plus-jakarta-sans-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF;
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--text-base);
	line-height: var(--leading-normal);
	color: var(--color-ink);
	background: var(--color-surface);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	line-height: var(--leading-tight);
	font-weight: var(--weight-semibold);
}

:focus-visible {
	outline: 2px solid var(--color-primary);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		/* scroll/view timeline'ları zaman-tabanlı timeline'a döndürür → yukarıdaki 0.01ms'lik süreyle
		 * birleşince animasyon anında "bitmiş" (fill-mode:both'un TO durumu) haline gelir.
		 * `none` verilseydi timeline hiç BAŞLAMAZ, öğe FROM durumunda (örn. opacity:0) donardı. */
		animation-timeline: auto !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---- Sayfa geçişi: çok-sayfalı yüzeylerin (site, hukuk, teşekkürler) kendi
 * `@view-transition { navigation: auto; }` kuralı için ortak marka dili — yalnız CSS, 0 JS.
 * Etkinleşmeyen tarayıcıda hiçbir şey değişmez; yalnız varsayılan çapraz-solmanın süresi/eğrisi değişir. */
::view-transition-old(root),
::view-transition-new(root) {
	animation-duration: var(--duration-slow);
	animation-timing-function: var(--ease-emphasized);
}
::view-transition-old(root) {
	animation-name: page-out;
}
::view-transition-new(root) {
	animation-name: page-in;
}
@keyframes page-out {
	to { opacity: 0; transform: translateY(-8px); }
}
@keyframes page-in {
	from { opacity: 0; transform: translateY(8px); }
}
@media (prefers-reduced-motion: reduce) {
	/* `*` view-transition sözde-öğelerini kapsamaz → ayrı kapatma şart. */
	::view-transition-group(*),
	::view-transition-old(*),
	::view-transition-new(*) {
		animation: none !important;
	}
}