/* Design-Tokens.
 *
 * Stand 14.08.2026: umgestellt auf das Redesign-Handoff
 * ("Georgisches Restaurant Redesign", uploads/redesign/). Die Werte
 * stammen aus dessen Token-Tabelle und sind final gemeint.
 *
 * Farbherkunft ist weiterhin das Wappen des Kunden, nur waermer und
 * kontrastreicher gefasst: der Seitengrund geht ins Braunschwarz, das
 * Weinrot wird als eigene Flaeche eingesetzt (Gerichte, Fusszeile) statt
 * nur als Unterton, und das Gold ist heller als zuvor.
 *
 * Kontraste gerechnet, nicht geschaetzt. Gegen --ink:
 *   --gold 10,17   --cream 16,65   --cream-hell 17,50
 * Gegen --wine, die hellste Flaeche:
 *   --gold  8,40   --cream 13,74
 * Damit bleibt Gold auf jeder Flaeche als Text zulaessig.
 *
 * Eine Abweichung vom Handoff: dort steht fuer die georgische Schrift in
 * der Kuechen-Liste rgba(246,235,216,.40). Das ergibt auf --ink 3,33:1
 * und liegt damit unter den 4,5:1, die Fliesstext braucht. Der Wert ist
 * hier auf .55 angehoben (5,40:1). Die Wirkung bleibt dieselbe, die
 * Zeile ist naemlich weiterhin deutlich zurueckgenommen, nur eben
 * lesbar.
 */

:root {
	color-scheme: dark;

	/* Flaechen, von dunkel nach hell */
	--ink: #14080A;          /* Seitengrund */
	--ink-raised: #1B0C0E;   /* Tafeln, Karten mit Rahmen */
	--wine-deep: #2C0C0F;    /* Gerichtekarten, Text auf Gold */
	--wine: #3E1114;         /* Gerichte-Abschnitt, Fusszeile */

	/* Akzent */
	--gold: #E8B15C;
	--gold-hover: #F7D79B;
	--auf-gold: #2C0C0F;

	/* Text */
	--cream: #F6EBD8;
	--cream-hell: #F9F1E2;

	/* Textabstufungen. Als eigene Tokens, damit nicht an dreissig Stellen
	 * dieselbe rgba-Zahl steht und eine davon spaeter abweicht. */
	--cream-82: rgba(246, 235, 216, .82);
	--cream-75: rgba(246, 235, 216, .75);
	--cream-72: rgba(246, 235, 216, .72);
	--cream-66: rgba(246, 235, 216, .66);
	--cream-60: rgba(246, 235, 216, .60);
	--cream-50: rgba(246, 235, 216, .50);
	--cream-55: rgba(246, 235, 216, .55);   /* siehe Kopf: statt .40 */

	--gold-85: rgba(232, 177, 92, .85);
	--gold-70: rgba(232, 177, 92, .70);
	--gold-55: rgba(232, 177, 92, .55);
	--gold-40: rgba(232, 177, 92, .40);

	/* Linien */
	--linie: rgba(232, 177, 92, .16);
	--linie-2: rgba(232, 177, 92, .22);
	--linie-3: rgba(232, 177, 92, .35);

	/* Schrift */
	--font-kopf: 'Marcellus', 'Times New Roman', serif;
	--font-text: 'Karla', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--font-geo: 'Noto Serif Georgian', 'Marcellus', serif;

	/* Groessen */
	--t-hero: clamp(44px, 6.4vw, 92px);
	--t-h2: clamp(34px, 3.6vw, 52px);
	--t-h2-gross: clamp(38px, 4.4vw, 62px);
	--t-h3: 26px;
	--t-lead: 19px;
	--t-text: 17.5px;
	--t-klein: 15.5px;
	--t-meta: 13.5px;
	--t-mini: 12.5px;
	--t-eyebrow: 11px;

	/* Laufweiten */
	--sperr-eyebrow: .3em;
	--sperr-nav: .18em;
	--sperr-btn: .16em;
	--sperr-marke: .14em;

	/* Raster */
	--maxw: 1180px;
	--rand: clamp(20px, 4vw, 48px);
	--sektion: clamp(72px, 9vw, 120px);

	/* Radien */
	--radius: 4px;
	--radius-sm: 3px;
	--radius-xs: 2px;
	--radius-pill: 999px;

	/* Schatten */
	--schatten-cta: 0 18px 46px rgba(0, 0, 0, .45);
	--schatten-pille: 0 22px 60px rgba(0, 0, 0, .6);
	--schatten-logo: 0 4px 12px rgba(0, 0, 0, .5);
	--schatten-logo-gross: 0 18px 44px rgba(0, 0, 0, .7);

	/* Bewegung */
	--kurve: cubic-bezier(.3, .7, .4, 1);
	--dauer: .2s;
}