/* ─────────────────────────────────────────────────────────────────────
   viennaestate.ai — Design-Tokens
   Farben + Schriften 1:1 aus www.viennaestate.com extrahiert.
   ───────────────────────────────────────────────────────────────────── */

:root {
  /* ── Farbpalette ──────────────────────────────────────────────────── */

  /* Primär — das warme Bronze-Gold aus der Marke (9× im Live-CSS) */
  --ve-gold:           #a07a4d;
  --ve-gold-hover:     #8a663d;
  --ve-gold-soft:      #c2a37d;
  --ve-gold-tint:      #f5ede1;

  /* Tintenfarben (Logo-Anthrazit + dunkle Headlines) */
  --ve-ink:            #363A3F;
  --ve-ink-soft:       #4B4F57;
  --ve-ink-deep:       #111827;
  --ve-black:          #000000;

  /* Sand- und Bläulichgrau-Töne aus der Live-Seite */
  --ve-sand:           #D2CDC9;
  --ve-mist:           #f0f4f7;
  --ve-line:           #e5e7eb;
  --ve-line-soft:      #f3f4f6;
  --ve-muted:          #6b7280;
  --ve-muted-soft:     #9ca3af;

  /* Hintergrund + Kontrast */
  --ve-bg:             #ffffff;
  --ve-bg-cream:       #fbfaf7;

  /* Status */
  --ve-success:        #1f7a4e;
  --ve-error:          #a23b3b;
  --ve-warning:        #b8771f;

  /* ── Typografie ────────────────────────────────────────────────────
     Bodoni Moda  — Headlines / Display
     Open Sans    — Body / UI
     (siehe partials/head.ejs für Google-Fonts-Link)
  */
  --ve-font-display: 'Bodoni Moda', Georgia, 'Times New Roman', serif;
  --ve-font-body:    'Open Sans', -apple-system, BlinkMacSystemFont,
                     'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --ve-font-mono:    ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Schriftgrößen / Skala */
  --ve-fs-display:   clamp(2.4rem, 4vw + 1rem, 3.6rem);
  --ve-fs-h1:        clamp(1.8rem, 2.5vw + 0.8rem, 2.6rem);
  --ve-fs-h2:        1.7rem;
  --ve-fs-h3:        1.3rem;
  --ve-fs-body:      1rem;
  --ve-fs-small:     0.875rem;
  --ve-fs-micro:     0.75rem;

  /* Zeilenhöhen */
  --ve-lh-tight:     1.15;
  --ve-lh-snug:      1.35;
  --ve-lh-base:      1.65;
  --ve-lh-loose:     1.85;

  /* Letter-Spacing — die Marke nutzt sehr weiten Spacing für H1/Versalien */
  --ve-ls-display:   0.04em;
  --ve-ls-caps:      0.18em;
  --ve-ls-base:      0;

  /* ── Spacing ───────────────────────────────────────────────────── */
  --ve-space-1:      0.25rem;
  --ve-space-2:      0.5rem;
  --ve-space-3:      0.75rem;
  --ve-space-4:      1rem;
  --ve-space-5:      1.5rem;
  --ve-space-6:      2rem;
  --ve-space-7:      3rem;
  --ve-space-8:      4rem;
  --ve-space-9:      6rem;

  /* ── Layout-Constraints ────────────────────────────────────────── */
  --ve-content-narrow:  32rem;   /* Login, Forms */
  --ve-content-medium:  48rem;   /* Articles */
  --ve-content-wide:    72rem;   /* Dashboards */
  --ve-content-max:     90rem;   /* Hero */

  /* ── Radien — Marke ist sehr klassisch, kaum gerundet ──────────── */
  --ve-radius-xs:    2px;
  --ve-radius-sm:    4px;
  --ve-radius-md:    6px;

  /* ── Schatten (subtil) ─────────────────────────────────────────── */
  --ve-shadow-card:  0 1px 2px rgba(17,24,39,0.04),
                     0 4px 12px rgba(17,24,39,0.04);
  --ve-shadow-pop:   0 4px 16px rgba(17,24,39,0.08),
                     0 12px 32px rgba(17,24,39,0.06);

  /* ── Transitions ───────────────────────────────────────────────── */
  --ve-tx-quick:     120ms cubic-bezier(0.4, 0, 0.2, 1);
  --ve-tx-base:      220ms cubic-bezier(0.4, 0, 0.2, 1);
}