/* Core Tokens */
:root {
  /* Pflichtfarben */
  --primary-green: #2e4820;
  --accent-green: #c1dcaf;

  /* Neutrals & Paper */
  --ink: #1f2d1f;
  --muted: #5b695b;
  --paper: #ffffff;
  --text-strong: #203020;
  --text-soft: #2b3f2b;
  --text-muted-soft: #4c5d4c;

  /* Helle Sage-Töne */
  --sage-50: #f6fbf5;
  --sage-100: #eef6ee;
  --sage-150: #e6f1e4;
  --sage-200: #dcead9;

  --border: #d9e6d3;
  --border-strong: #c8d9c2;

  /* Surfaces */
  --surface-card: #ffffff;
  --surface-soft: #f7fbf6;

  --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 12px 28px rgba(0, 0, 0, 0.14);

  --r: 18px;
  --r-lg: 26px;
  --container: min(1180px, 92vw);
  --section-pad: clamp(64px, 8vw, 120px);

  /* Typography */
  --font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto,
    Arial, sans-serif;
  --font-serif: "Lora", Georgia, "Times New Roman", serif;

  /* Alias */
  --brand-grad: linear-gradient(
    135deg,
    var(--accent-green),
    var(--primary-green)
  );

  /* Unified background system */
  --bg-body: #e8f1e6;
  --bg-side-shadow-left: linear-gradient(
    90deg,
    rgba(46, 72, 32, 0.08) 0%,
    rgba(46, 72, 32, 0) 16%
  );
  --bg-side-shadow-right: linear-gradient(
    270deg,
    rgba(46, 72, 32, 0.08) 0%,
    rgba(46, 72, 32, 0) 16%
  );

  --bg-radial-accent: radial-gradient(
    900px 460px at 90% -10%,
    rgba(193, 220, 175, 0.3),
    transparent 60%
  );
  --bg-radial-soft-left: radial-gradient(
    760px 340px at 10% 0%,
    rgba(193, 220, 175, 0.22),
    transparent 62%
  );
  --bg-sheen-brand: linear-gradient(
      110deg,
      rgba(255, 255, 255, 0) 28%,
      rgba(255, 255, 255, 0.5) 49%,
      rgba(255, 255, 255, 0) 70%
    ),
    linear-gradient(
      112deg,
      rgba(46, 72, 32, 0.2) 0%,
      rgba(193, 220, 175, 0.52) 100%
    );
  --bg-page: linear-gradient(180deg, var(--paper) 0%, var(--sage-50) 100%);
  --bg-section: linear-gradient(180deg, var(--sage-100) 0%, var(--sage-150) 100%);
  --bg-section-strong: linear-gradient(
    180deg,
    var(--sage-150) 0%,
    var(--sage-200) 100%
  );
  --footer-grad: linear-gradient(
    160deg,
    rgba(224, 236, 217, 0.98),
    rgba(206, 224, 196, 0.98)
  );

  /* Typo-Helfer */
  --text-balance: balance;
  --text-pretty: pretty;

  /* Layout */
  --header-height: 74px;
}