/* Webfonts via Google Fonts (Substitution: keine eigenen Fontdateien vorhanden) */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Karla:ital,wght@0,400;0,500;0,700;1,400&family=Caveat:wght@400;600&display=swap');

:root {
  /* ——— Basisfarben, direkt aus Linas Leinwänden gegriffen ——— */
  /* Sonnenuntergang (warm) */
  --sand: #E9CD9A;
  --gold: #E3A93F;
  --amber: #D97F2F;
  --terrakotta: #BC5F3B;
  --zinnober: #A63A2E;
  --wein: #7C2E3B;
  /* Rosé & Lavendel */
  --rose: #E7A9BC;
  --pink: #D9849F;
  --flieder: #C3A4D8;
  --lavendel: #A98FCB;
  --magenta: #A94A8C;
  /* Himmel & Wasser (kühl) */
  --eisblau: #BCE0E6;
  --himmel: #8FCFDA;
  --jeans: #5B84C4;
  /* Wiese & Olive */
  --maigruen: #9CAF3B;
  --olive: #7E8A2E;
  --tanne: #47563B;
  /* Neutrals — Galeriewand & Leinwand */
  --leinwand: #FBF8F2;
  --wand: #F6F3EE;
  --nebel: #E9E3D9;
  --stein: #A79E90;
  --umbra: #6B6257;
  --tinte: #2E2A25;

  /* ——— Semantische Aliase ——— */
  --surface-page: var(--wand);
  --surface-card: var(--leinwand);
  --surface-tint-warm: #F4E4D2;
  --surface-tint-rose: #F5E3E9;
  --surface-tint-cool: #E4EFF1;
  --surface-tint-green: #ECEEDC;
  --text-body: var(--tinte);
  --text-soft: var(--umbra);
  --text-faint: var(--stein);
  --text-inverse: var(--leinwand);
  --accent: var(--terrakotta);
  --accent-hover: #A84F2E;
  --accent-soft: var(--surface-tint-warm);
  --link: var(--terrakotta);
  --link-hover: var(--zinnober);
  --border-soft: var(--nebel);
  --border-strong: #D6CDBE;
  --focus-ring: rgba(188, 95, 59, 0.45);
  --shadow-card: 0 10px 30px rgba(46, 42, 37, 0.10);
  --shadow-lift: 0 18px 50px rgba(46, 42, 37, 0.16);
}

:root {
  --font-display: 'Cormorant Garamond', Georgia, serif;   /* emotional, poetisch */
  --font-body: 'Karla', 'Helvetica Neue', sans-serif;      /* ruhig, klar */
  --font-hand: 'Caveat', cursive;                          /* verspielt, wie die gemalte Signatur */

  --text-hero: 500 56px/1.08 var(--font-display);
  --text-h1: 500 42px/1.12 var(--font-display);
  --text-h2: 500 32px/1.18 var(--font-display);
  --text-h3: 600 22px/1.3 var(--font-display);
  --text-lead: italic 400 21px/1.5 var(--font-display);
  --text-body-m: 400 16px/1.65 var(--font-body);
  --text-body-s: 400 14px/1.6 var(--font-body);
  --text-caption: 400 12.5px/1.5 var(--font-body);
  --text-label: 700 12px/1.2 var(--font-body);
  --tracking-label: 0.14em; /* Labels immer VERSAL + gesperrt */
  --text-hand: 600 24px/1.3 var(--font-hand);
}

:root {
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;
  /* Leinwände sind scharfkantig — Bilder nie runden. UI darf weich sein. */
  --radius-img: 0;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-pill: 999px;
  --page-max: 1200px;
}