/**
 * Design tokenek — az "Iskola alapítvány" Figma fájl alapján
 * (rjkcvWwqlVKeKeOwe5zcHt, "Iskola Alapítvány web" szekció).
 *
 * A terv 1920px-es vászonra készült. A sablonok és a theme.css KIZÁRÓLAG ezeket
 * a változókat használják — nyers hexa érték ne kerüljön máshova.
 */

:root {
	/* ---- Márkaszínek (a Figmából kiolvasva) ---- */
	--color-teal:        #00897f;  /* elsődleges: navigáció, címsorok */
	--color-teal-dark:   #00675e;  /* sötét szekciók, lábléc */
	--color-orange:      #f48020;  /* akcentus: aktív menüpont, kiemelés */
	--color-green:       #98c93c;  /* CTA gombok */
	--color-yellow:      #ffc116;  /* dekoratív elemek */

	/* ---- Semleges ---- */
	--color-text:        #12261f;
	--color-text-muted:  #5a6b64;
	--color-bg:          #ffffff;
	--color-surface:     #f4f7f6;
	--color-border:      #dde5e2;

	/* ---- Tipográfia ----
	   A terv betűtípusa a Hatch Sans, az Adobe Fonts kitből (lásd fonts.css). */
	--font-sans: "hatch-sans", -apple-system, BlinkMacSystemFont,
	             "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	--text-nav:     18.381px;  /* fejléc menüpontok */
	--text-body:    18px;
	--text-lead:    24px;
	--text-h2:      54px;      /* szekciócímek: "Programok", "Média" */
	--text-hero:    64px;

	--weight-medium: 500;
	--weight-demi:   600;
	--weight-bold:   700;

	/* ---- Rács és térköz ----
	   A tervben a fejléc tartalma 410px bal / 416px jobb margóval ül az 1920px-es
	   vásznon, ami 1094px-es tartalomsávot ad. */
	--container:      1094px;
	--container-wide: 1440px;
	--gutter:         24px;

	--header-height: 88px;

	/* ---- Forma ---- */
	--chamfer: 24px;  /* a kártyák letört sarka */
}

@media (max-width: 1200px) {
	:root {
		--text-h2:   40px;
		--text-hero: 44px;
	}
}

@media (max-width: 720px) {
	:root {
		--text-h2:   32px;
		--text-hero: 34px;
		--text-lead: 19px;
		--gutter:    20px;
	}
}