/* ==========================================================================
   Designtokenek — minden szín az iskola címeréből (Luther-rózsa) való.

   A címer pixeleit árnyalat szerint csoportosítva öt alapszín adódott; a
   többi érték ugyanezen árnyalatok világos tónusa. Egy kivétel van: az
   arany szövegként fehéren csak 3,0:1 lenne, ezért szövegre a sötétített
   --arany-szoveg (5,8:1) használandó, a --arany pedig csak kitöltésre.
   ========================================================================== */

:root {
	/* a címer öt alapszíne */
	--kek: #2166CF;          /* a rózsa kék mezeje    — fehér rajta 5,43:1 */
	--sotetkek: #1D3483;     /* a mező árnyéka        — fehér rajta 11,2:1 */
	--arany: #DFCD68;        /* a gyűrű               — tinta rajta 9,77:1 */
	--piros: #BC1E1A;        /* a szív                — fehér rajta 6,29:1 */
	--zold: #23712A;         /* a levelek             — fehér rajta 6,06:1 */

	/* ugyanezen árnyalatok tónusai */
	--kek-vil: #418DCB;
	--arany-mely: #AF9146;   /* csak díszítésre/árnyéknak */
	--arany-szoveg: #7A6320; /* aranyszín SZÖVEG — fehéren 5,78:1 */
	--kek-50: #EDF4FD;
	--kek-100: #D6E6FA;
	--arany-50: #FCF8E8;
	--arany-100: #F6EEC3;
	--piros-50: #FCEDEC;
	--zold-50: #EAF4EB;
	--zold-mely: #174D1C;

	--tinta: #15204A;        /* szöveg — a sötétkékből */
	--tinta-70: #48527A;
	--papir: #FFFDF7;

	/* betűk — saját tárhelyről (theme.json fontFace), rendszerbetű tartalékkal */
	--betu-cim: "Baloo 2", "Arial Rounded MT Bold", ui-rounded, system-ui, sans-serif;
	--betu-szoveg: "Nunito", ui-rounded, system-ui, "Segoe UI", sans-serif;
	--betu-kezi: "Caveat", "Segoe Print", "Comic Sans MS", cursive;

	/* formák */
	--r-s: 12px;
	--r-m: 20px;
	--r-l: 28px;
	--r-xl: 40px;
	--pad: clamp(16px, 4vw, 32px);
	--keret: 1200px;
	--hasab: 760px;

	--arnyek: 0 2px 4px rgba(21, 32, 74, .06), 0 10px 26px rgba(21, 32, 74, .10);
	--arnyek-l: 0 22px 50px rgba(21, 32, 74, .18);

	/* a ragadós fejléc magassága — horgonyugrásnál ennyivel lejjebb áll meg */
	--fejlec-m: 86px;
}

/* Színválasztó osztályok: egy kártya/csempe/címke ezekkel kapja a színét.
   --c    szövegre és vonalra biztonságos szín
   --fill kitöltés (ikondoboz, matrica)
   --on   szöveg/ikon a kitöltésen
   --h    világos háttér */
.szin-kek      { --c: var(--kek);          --fill: var(--kek);      --on: #fff;          --h: var(--kek-50); }
.szin-piros    { --c: var(--piros);        --fill: var(--piros);    --on: #fff;          --h: var(--piros-50); }
.szin-zold     { --c: var(--zold);         --fill: var(--zold);     --on: #fff;          --h: var(--zold-50); }
.szin-arany    { --c: var(--arany-szoveg); --fill: var(--arany);    --on: var(--tinta);  --h: var(--arany-100); }
.szin-sotetkek { --c: var(--sotetkek);     --fill: var(--sotetkek); --on: #fff;          --h: var(--kek-100); }