/* ==========================================================================
   Sınav Bilimi — Tasarım Tokenları (tek doğruluk kaynağı)
   Kaynak: sb_web_homepage.psd (1196px referans genişlik)
   ========================================================================== */

:root {
	/* Marka renkleri */
	--sb-primary: #ef4d5e;   /* pembe-kırmızı */
	--sb-amber:   #faa61a;
	--sb-orange:  #f7941d;
	--sb-blue:    #00aeef;
	--sb-green:   #8dc63f;
	--sb-purple:  #a23f97;
	--sb-teal:    #00abbd;
	--sb-indigo:  #250081;
	--sb-yellow:   #ffe400;   /* test banner vurgusu */
	--sb-red-deep: #f83c59; /* test banner zemin yedeği */

	/* Nötrler */
	--sb-ink:      #231f20;
	--sb-gray-700: #5c5c5c;
	--sb-gray-500: #898989;
	--sb-gray-400: #b2b2b2;
	--sb-line:      #f0ece9; /* kart kenarlığı */
	--sb-line-soft: #eee9e4; /* blog satır ayracı */
	--sb-bg:       #f4f2ef;
	--sb-surface:  #ffffff; /* beyaz — zemin ve vurgu üstü metin */
	--sb-card-bg:  #fbf7f5;

	/* Tintler (seminer kartı başlık zeminleri) */
	--sb-tint-orange: #fff0d8;
	--sb-tint-blue:   #e9f7fe;
	--sb-tint-pink:   #fde8e7;

	/* Tipografi */
	--sb-font-main: "REM", system-ui, sans-serif;
	--sb-font-alt: "Barlow Semi Condensed", "Arial Narrow", sans-serif; /* Korolev vekili */

	--sb-fs-menu:    0.875rem;   /* 14px — büyütülmüş menü */
	--sb-fs-btn:     0.8125rem;  /* 13px */
	--sb-fs-small:   0.9375rem;  /* 15px */
	--sb-fs-body:    1.0625rem;  /* 17px */
	--sb-fs-body-lg: 1.1875rem;  /* 19px */
	--sb-fs-card:    1.55rem;    /* 24.8px — mimari kart başlığı */
	--sb-fs-faq:     1.375rem;   /* 22px */
	--sb-fs-h3:      1.5rem;     /* 24px — seminer kart başlığı */
	--sb-fs-section: 1.5rem;     /* 24px — bölüm başlıkları */
	--sb-fs-banner:  3rem;       /* 48px — banner vurgu satırı (sarı) */
	--sb-fs-hero:    3.8rem;     /* 61px */

	/* Yerleşim */
	--sb-container: clamp(59rem, 92vw, 80rem); /* 944px–1280px akışkan: 92vw ile esner, 80rem tavanda durur */
	--sb-container-prose: 60rem; /* 960px — makale içeriği (single/page, theme.json contentSize) */
	--sb-container-wide: 88rem; /* 1408px — blok editör geniş hizalaması (theme.json wideSize) */
	--sb-gutter: 1.5rem;
	--sb-radius-sm: 0.75rem;
	--sb-radius: 1.5rem;         /* kartlar */
	--sb-radius-lg: 2.5rem;      /* banner, gradient kart, footer */
	--sb-radius-pill: 999px;

	/* Gölge */
	--sb-shadow-card: 0 10px 30px rgb(35 31 32 / 0.08);
	--sb-shadow-drawer: -18px 0 44px rgb(35 31 32 / 0.16); /* mobil menü çekmecesi */
	--sb-backdrop: rgb(35 31 32 / 0.45);                   /* mobil menü perdesi */
	--sb-shadow-btn: 0 8px 20px rgb(35 31 32 / 0.15);
	--sb-shadow-chip: 0 1px 3px rgb(35 31 32 / 0.12);      /* bölmeli anahtarda etkin hap */
	--sb-shadow-modal: 0 24px 60px rgb(35 31 32 / 0.28);   /* diyalog penceresi */

	/* Form alanı odak halkası */
	--sb-focus-ring: 0 0 0 3px color-mix(in srgb, var(--sb-primary) 18%, transparent);
}

/* Dar ekranda kenar boşluğu daralır.
   1.5rem sabitken 390px'lik bir telefonda iki yandan 48px, yani ekranın
   %12'si gidiyordu; kart dolgularıyla birlikte metin kenardan ~46px içeride
   kalıyordu. Değer TOKEN olduğu için konteyner, editör önizlemesi ve soru
   kutusu dolgusu birlikte daralır.
   Blok dosyanın SONUNDA: medya sorgusu özgüllük eklemez, :root'tan önce
   yazılsaydı hiç uygulanmazdı. */
@media (max-width: 600px) {
	:root {
		--sb-gutter: 1rem;
	}
}

@media (max-width: 380px) {
	:root {
		--sb-gutter: 0.875rem;
	}
}
