/* Zinnhandel Jenster: einzige Quelle fuer Design-Werte. Nichts hiervon in site.css doppeln. */
:root {
  /* Farben */
  --primaer:        #1E2A30;
  --primaer-weich:  #2A3940;
  --akzent:         #1F5C57;
  --akzent-hell:    #2E7A73;
  --hintergrund:    #F5F4F0;
  --flaeche:        #FFFFFF;
  --text:           #1E2A30;
  --text-gedaempft: #5A666C;
  --rahmen:         #D9D7D0;
  --hinweis:        #ECEAE3;
  --auf-dunkel:     #F5F4F0;
  --auf-dunkel-weich: rgba(245,244,240,.72);

  /* Schrift */
  --serif: 'IBM Plex Serif', Georgia, 'Times New Roman', serif;
  --sans:  'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --fs-preis: clamp(3.2rem, 9vw, 5.5rem);
  --fs-h1:    clamp(2rem, 4.5vw, 3.2rem);
  --fs-h2:    clamp(1.6rem, 3vw, 2.2rem);
  --fs-h3:    1.2rem;
  --fs-text:  1.0625rem;   /* 17px */
  --fs-klein: 0.9375rem;   /* 15px */

  /* Abstaende */
  --r1: 4px;  --r2: 8px;  --r3: 12px; --r4: 16px; --r5: 24px;
  --r6: 32px; --r7: 48px; --r8: 64px; --r9: 96px; --r10: 128px;
  --sektion: clamp(64px, 9vw, 112px);
  --breite: 1160px;
  --breite-text: 680px;

  /* Form */
  --radius-s: 4px;
  --radius-l: 8px;
  --schatten: 0 2px 4px rgba(30,42,48,.04), 0 12px 32px rgba(30,42,48,.08);
  --schatten-stark: 0 8px 48px rgba(30,42,48,.22);

  /* Bewegung */
  --kurve: cubic-bezier(.2,.7,.2,1);
  --kurz: 200ms;
  --lang: 600ms;
}