/* Giefer Design System – Tokens, extrahiert aus "Tischlerei Giefer Website.html" (Claude Design, 08.10.2026) */
/* Schriften lokal (DSGVO) – variable Fonts, je latin + latin-ext */
@font-face{font-family:'Jost';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/jost-latin-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/jost-latin-ext-var.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/source-sans-3-latin-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 600;font-display:swap;src:url(../fonts/source-sans-3-latin-ext-var.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
/* brand — sampled from the Giefer logo (PDF vector) */
--color-orange-500:#FF9929;
--color-orange-600:#F08A1B;
--color-orange-700:#D97812;
--color-orange-100:#FFE9CE;
--color-taupe-500:#857E6F;
--color-taupe-600:#6C6659;
--color-taupe-100:#E8E5DF;
/* neutrals — cool, kept separate from the warm brand hues so the accent reads clearly */
--gray-0:#FFFFFF;
--gray-50:#F7F7F8;
--gray-100:#EEEEF0;
--gray-200:#DCDCE0;
--gray-300:#C2C2C8;
--gray-400:#9E9EA6;
--gray-500:#7A7A84;
--gray-600:#5C5C66;
--gray-700:#40404A;
--gray-800:#292930;
--gray-900:#16161B;
/* feedback */
--color-success:#3F8F5F;
--color-error:#C6463D;
/* semantic aliases */
--surface-page:var(--gray-0);
--surface-card:var(--gray-0);
--surface-muted:var(--gray-50);
--surface-sunken:var(--gray-100);
--border-default:var(--gray-200);
--border-strong:var(--gray-300);
--text-primary:var(--gray-900);
--text-secondary:var(--gray-600);
--text-muted:var(--gray-400);
--text-on-accent:#FFFFFF;
--brand-primary:var(--color-orange-500);
--brand-primary-hover:var(--color-orange-600);
--brand-primary-active:var(--color-orange-700);
--brand-primary-tint:var(--color-orange-100);
--brand-secondary:var(--color-taupe-500);
--brand-secondary-hover:var(--color-taupe-600);
--brand-secondary-tint:var(--color-taupe-100);
--focus-ring:var(--color-orange-500);
}
:root{
/* Futura LT Book (from the logo's PDF metadata) is not licensed for web use and no font
   files were supplied. Jost is the closest freely-licensed geometric-sans match on Google
   Fonts — same circular "o", low-contrast strokes, single-story "a". Flagged for the user.
   Jost carries display/heading use (lowercase, wide sizes); Source Sans 3 is a plain
   humanist sans for long-form body copy, where a geometric face gets fatiguing to read. */
--font-display:'Jost',sans-serif;
--font-body:'Source Sans 3',sans-serif;
--weight-light:300;
--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;
--weight-bold:700;
--text-xs:0.75rem;
--text-sm:0.875rem;
--text-base:1rem;
--text-md:1.125rem;
--text-lg:1.375rem;
--text-xl:1.75rem;
--text-2xl:2.25rem;
--text-3xl:3rem;
--text-4xl:4rem;
--leading-tight:1.1;
--leading-snug:1.3;
--leading-normal:1.5;
--leading-relaxed:1.65;
--tracking-tight:-0.01em;
--tracking-normal:0;
--tracking-wide:0.06em;
}
:root{
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--space-10:40px;
--space-12:48px;
--space-16:64px;
--space-20:80px;
--space-24:96px;
--space-32:128px;
--container-max:1180px;
}
:root{
/* angular system: hard corners everywhere; radius-xs only for tiny controls (checkbox) */
--radius-none:0px;
--radius-xs:2px;
--radius-sm:0px;
--radius-md:0px;
--radius-lg:0px;
--shadow-sm:0 1px 2px rgba(22,22,27,0.06);
--shadow-md:0 4px 14px rgba(22,22,27,0.08);
--shadow-lg:0 16px 40px rgba(22,22,27,0.14);
--overlay-protect:linear-gradient(180deg,rgba(22,22,27,0) 40%,rgba(22,22,27,0.72) 100%); /* @kind other */
--ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
--duration-fast:120ms; /* @kind other */
--duration-normal:200ms; /* @kind other */
--duration-slow:480ms; /* @kind other */
}
:root{
/* Typografie: Jost für Überschriften (kleingeschrieben), Source Sans 3 für Fließtext */
--font-body:'Source Sans 3',sans-serif;
--font-display:'Jost',sans-serif;
--leading-normal:1.5;
--leading-relaxed:1.65;
--leading-snug:1.3;
--leading-tight:1.1;
--text-2xl:2.25rem;
--text-3xl:3rem;
--text-4xl:4rem;
--text-base:1rem;
--text-lg:1.375rem;
--text-md:1.125rem;
--text-sm:0.875rem;
--text-xl:1.75rem;
--text-xs:0.75rem;
--tracking-normal:0;
--tracking-tight:-0.01em;
--tracking-wide:0.06em;
--weight-bold:700;
--weight-light:300;
--weight-medium:500;
--weight-regular:400;
--weight-semibold:600;
}