/* ==========================================================================
   THEME – DomizilCenter.ch  (Premium-Relaunch 2026-06)
   Design-Tokens: Farben/Schriften/Abstände/Radien. base.css + admin.css
   verwenden ausschliesslich diese Variablen. Schriften lokal/self-hosted
   (Datenschutz, CSP self). Marke: Navy-Slate (#203e4c) + Schweizer-Rot (#d23137).
   ========================================================================== */

/* --- Self-hosted Webfonts (latin subset, WOFF2, swap) --------------------- */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap;
    src: url("/assets/fonts/inter-400.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap;
    src: url("/assets/fonts/inter-500.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap;
    src: url("/assets/fonts/inter-600.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("/assets/fonts/inter-700.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 600; font-display: swap;
    src: url("/assets/fonts/sourceserif-600.woff2") format("woff2"); }
@font-face { font-family: "Source Serif 4"; font-style: normal; font-weight: 700; font-display: swap;
    src: url("/assets/fonts/sourceserif-700.woff2") format("woff2"); }

:root {
    /* --- Markenfarben --- */
    --color-primary:          #203e4c;   /* Navy/Slate (Haus + Wortmarke) */
    --color-primary-dark:     #16303b;
    --color-primary-light:    #38647a;
    --color-primary-contrast: #ffffff;
    --color-accent:           #d23137;   /* Schweizer-Rot (Kreuz) */
    --color-accent-dark:      #b3282d;
    --color-accent-light:     #e87d82;
    --color-accent-contrast:  #ffffff;
    --color-gold:             #b8924e;   /* dezenter Premium-Akzent (Linien/Eyebrow) */

    /* --- Neutrale Farben --- */
    --color-text:           #16242b;
    --color-text-muted:     #586a73;
    --color-bg:             #ffffff;
    --color-bg-alt:         #f4f1ec;     /* warmes Off-White (Sektionen) */
    --color-warm-bg:        #faf8f4;     /* warmes Hero-/Karten-Off-White */
    --color-bg-dark:        #16303b;     /* Footer */
    --color-border:         #e4ddd3;     /* warmer Rahmen */
    --color-border-cool:    #dde5e8;     /* kühler Rahmen (Formulare/Admin) */

    /* --- Statusfarben --- */
    --color-error:          #b3261e;
    --color-error-bg:       #fbe9e7;
    --color-success:        #1e7d4f;
    --color-success-bg:     #e6f4ea;

    /* --- Typografie --- */
    --font-base:   "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-head:   "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --fs-base:     1.0625rem;
    --fs-lead:     1.25rem;
    --fs-h1:       clamp(2.25rem, 5vw, 3.5rem);
    --fs-h2:       clamp(1.65rem, 3.2vw, 2.4rem);
    --fs-h3:       1.3rem;
    --line-base:   1.7;
    --fw-normal:   400;
    --fw-medium:   500;
    --fw-semibold: 600;
    --fw-bold:     700;

    /* --- Abstände --- */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 1rem;
    --space-4: 1.5rem;
    --space-5: 2.5rem;
    --space-6: 4.5rem;

    /* --- Layout --- */
    --container-max: 1180px;
    --radius:        16px;
    --radius-sm:     9px;
    --radius-lg:     24px;
    --shadow-sm:     0 2px 8px rgba(22, 48, 59, .06);
    --shadow:        0 8px 30px rgba(22, 48, 59, .10);
    --shadow-lg:     0 20px 60px rgba(22, 48, 59, .16);
    --transition:    .22s cubic-bezier(.4, 0, .2, 1);
}