/* GENERATED from 'design/Leihnachbar Design System/tokens' by bin/build-css.sh — do not edit by hand. */
/* --- colors.css --- */
:root{
/* ── Paper ── the ground is warm off-white, never blue-white and never pure #fff */
--paper-000:#fffdf9;--paper-050:#faf6ef;--paper-100:#f4ece0;--paper-200:#eadfcd;--paper-300:#ddcdb3;

/* ── Ink ── the brand navy warmed and softened. --ink-900 is the logo plaque #0B2D5F, kept exactly. */
--ink-900:#0b2d5f;--ink-800:#16355f;--ink-700:#1d3a63;--ink-600:#2b4d78;--ink-500:#456c96;--ink-400:#7996b5;--ink-300:#adc1d5;--ink-200:#d3dfea;--ink-100:#e8eff6;--ink-050:#f3f7fb;

/* ── Clay ── the soft accent: earnings, ratings, lending, anything that should feel human */
--clay-700:#8f4a26;--clay-600:#b35f33;--clay-500:#cf7a4e;--clay-400:#e0a179;--clay-200:#f2d9c6;--clay-100:#f9ece1;

/* ── Warm neutrals ── browned greys, so text never looks cold against paper */
--warm-900:#2b2722;--warm-800:#3d3831;--warm-700:#544d44;--warm-600:#6b6259;--warm-500:#8b8074;--warm-400:#a89b8a;--warm-300:#c7bcaa;--warm-200:#e0d7c8;--warm-100:#efe9dd;--white:#ffffff;

/* ── Semantic, warm-leaning ── */
--green-700:#2f5f49;--green-600:#3f7a5e;--green-100:#e4efe9;--red-600:#b3503f;--red-100:#f7e7e2;--gold-600:#b78a1d;--gold-100:#f7edd6;

/* ── Semantic aliases ── */
--text-strong:var(--ink-900);--text-body:var(--warm-800);--text-muted:var(--warm-600);--text-subtle:var(--warm-500);--text-inverse:var(--paper-050);--text-link:var(--clay-600);--text-link-hover:var(--clay-700);
--surface-page:var(--paper-050);--surface-card:var(--paper-000);--surface-sunken:var(--paper-100);--surface-brand:var(--ink-900);--surface-brand-soft:var(--ink-100);--surface-accent:var(--clay-500);--surface-accent-soft:var(--clay-100);
--border-subtle:var(--paper-200);--border-default:var(--warm-200);--border-strong:var(--warm-300);--border-brand:var(--ink-900);--border-focus:var(--clay-500);
--action-primary:var(--ink-900);--action-primary-hover:var(--ink-700);--action-primary-active:#071f42;
--action-accent:var(--clay-500);--action-accent-hover:var(--clay-600);
--status-success:var(--green-600);--status-success-soft:var(--green-100);--status-warning:var(--gold-600);--status-warning-soft:var(--gold-100);--status-danger:var(--red-600);--status-danger-soft:var(--red-100);--status-info:var(--ink-600);--status-info-soft:var(--ink-100);
--focus-ring:0 0 0 3px rgba(207,122,78,.28);
--gradient-page:radial-gradient(130% 130% at 50% 30%,#fffdf9 0%,var(--paper-050) 55%,var(--paper-100) 100%);

/* ── Backwards-compatible aliases (the cool-navy names used by components) ── */
--navy-900:var(--ink-900);--navy-800:var(--ink-900);--navy-700:var(--ink-700);--navy-600:var(--ink-600);--navy-500:var(--ink-500);--navy-400:var(--ink-400);--navy-300:var(--ink-300);--navy-200:var(--ink-200);--navy-100:var(--ink-100);--navy-050:var(--ink-050);
--grey-900:var(--warm-900);--grey-800:var(--warm-800);--grey-700:var(--warm-700);--grey-600:var(--warm-600);--grey-500:var(--warm-500);--grey-400:var(--warm-400);--grey-300:var(--warm-300);--grey-200:var(--warm-200);--grey-100:var(--warm-100);--grey-050:var(--paper-050);
--ochre-700:var(--clay-700);--ochre-600:var(--clay-600);--ochre-500:var(--clay-500);--ochre-300:var(--clay-400);--ochre-100:var(--clay-100)}

/* --- typography.css --- */
:root{
/* Display — Fraunces, regular weight. Soft, never shouty; the roundness does the work, not the weight. */
--text-display-1:400 62px/1.08 var(--font-display);--text-display-2:400 46px/1.12 var(--font-display);--text-display-3:400 34px/1.2 var(--font-display);
--text-h1:500 30px/1.24 var(--font-display);--text-h2:500 24px/1.3 var(--font-display);--text-h3:600 19px/1.4 var(--font-sans);--text-h4:600 16px/1.45 var(--font-sans);
--text-body-lg:400 18px/1.72 var(--font-sans);--text-body:400 16px/1.7 var(--font-sans);--text-body-sm:400 14px/1.65 var(--font-sans);
--text-label:600 14px/1.45 var(--font-sans);--text-label-sm:600 12px/1.45 var(--font-sans);
--text-caption:400 13px/1.5 var(--font-sans);--text-overline:600 11px/1.3 var(--font-sans);
--text-price:800 23px/1 var(--font-wordmark);--text-price-lg:800 36px/1 var(--font-wordmark);
--tracking-tight:-0.015em;--tracking-normal:0;--tracking-wide:0.01em;--tracking-overline:0.09em}
.t-display-1{font:var(--text-display-1);letter-spacing:var(--tracking-tight);color:var(--text-strong)}
.t-display-2{font:var(--text-display-2);letter-spacing:var(--tracking-tight);color:var(--text-strong)}
.t-display-3{font:var(--text-display-3);color:var(--text-strong)}
.t-h1{font:var(--text-h1);letter-spacing:var(--tracking-tight);color:var(--text-strong)}
.t-h2{font:var(--text-h2);color:var(--text-strong)}
.t-h3{font:var(--text-h3);color:var(--text-strong)}
.t-h4{font:var(--text-h4);color:var(--text-strong)}
.t-body-lg{font:var(--text-body-lg);color:var(--text-body)}
.t-body{font:var(--text-body);color:var(--text-body)}
.t-body-sm{font:var(--text-body-sm);color:var(--text-body)}
.t-label{font:var(--text-label);color:var(--text-strong)}
.t-caption{font:var(--text-caption);color:var(--text-muted)}
.t-overline{font:var(--text-overline);letter-spacing:var(--tracking-overline);text-transform:uppercase;color:var(--text-subtle)}
.t-price{font:var(--text-price);color:var(--ink-900)}

/* --- spacing.css --- */
:root{--space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;--space-6:22px;--space-7:28px;--space-8:36px;--space-9:46px;--space-10:58px;--space-11:76px;--space-12:96px;--space-13:132px;
--layout-gutter:32px;--layout-max:1160px;--layout-max-narrow:680px;--control-h-sm:36px;--control-h-md:46px;--control-h-lg:56px}

/* --- radius.css --- */
:root{--radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:22px;--radius-xl:28px;--radius-2xl:36px;--radius-pill:999px;
/* the wordmark plaque's asymmetric cut: rounded on one diagonal, clipped on the other */
--plaque-radius:14px 4px 14px 4px;--border-w:1px;--border-w-strong:2px}

/* --- elevation.css --- */
:root{
/* warm shadows — brown-black, low opacity, wide and soft. Never a hard navy drop. */
--shadow-xs:0 1px 2px rgba(43,39,34,.05);--shadow-sm:0 2px 8px rgba(43,39,34,.055);--shadow-md:0 6px 20px rgba(43,39,34,.07);--shadow-lg:0 14px 40px rgba(43,39,34,.09);--shadow-xl:0 28px 70px rgba(43,39,34,.13);--shadow-inset:inset 0 1px 0 rgba(255,255,255,.7)}

/* --- motion.css --- */
:root{--ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */--ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */--ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
--dur-fast:120ms; /* @kind other */--dur-base:180ms; /* @kind other */--dur-slow:320ms; /* @kind other */--dur-entrance:700ms; /* @kind other */--rise-distance:10px}
@keyframes lnb-rise{from{opacity:0;transform:translateY(var(--rise-distance))}to{opacity:1;transform:none}}
@keyframes lnb-fade{from{opacity:0}to{opacity:1}}
.lnb-rise{animation:lnb-rise var(--dur-entrance) ease-out both}
@media (prefers-reduced-motion:reduce){.lnb-rise{animation:none}}

/* --- base.css --- */
*{box-sizing:border-box}
body{margin:0;font:var(--text-body);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid transparent;transition:color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover);border-bottom-color:currentColor}
::selection{background:var(--clay-200);color:var(--warm-900)}

/* --- fonts.css --- */
/*
 * Self-hosted webfonts.
 *
 * These used to be an @import from fonts.googleapis.com, which had two costs.
 *
 * The privacy one decided it: hotlinking sends every visitor's IP address to
 * Google on every page load, while the privacy policy promises "kein Tracking
 * durch Dritte". One of those had to change, and it was not going to be the
 * promise (§71).
 *
 * The performance one: an @import inside a stylesheet is the slowest way to
 * load anything. The browser must fetch and parse this file before it even
 * discovers the font URL, then resolve a second DNS name and open a second TLS
 * connection before requesting it — all of it blocking the first paint (§39).
 * Same-origin files start downloading on the connection that is already open.
 *
 * Files live in ../fonts and are served with a one-year immutable cache.
 * Regenerate with bin/build-css.sh after changing anything here.
 *
 * Only latin and latin-ext are shipped. German needs latin (ä ö ü ß all live
 * there); latin-ext carries the Polish and Czech letters that turn up in
 * member names. Vietnamese and Sinhala subsets Google also offers are dropped
 * — unicode-range means an omitted subset costs nothing until such a character
 * appears, and then it falls back to a system font rather than to nothing.
 *
 * Fraunces and Public Sans are variable fonts: ONE file each covers the whole
 * weight range. Google serves a separate URL per weight, all byte-identical —
 * shipping them under three names would have the browser download the same
 * bytes three times.
 */

@font-face{
  font-family:'Abhaya Libre';
  font-style:normal;
  font-weight:800;
  font-display:swap;
  src:url(../fonts/abhaya-libre-800-normal-latin.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:'Abhaya Libre';
  font-style:normal;
  font-weight:800;
  font-display:swap;
  src:url(../fonts/abhaya-libre-800-normal-latin-ext.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face{
  font-family:'Fraunces';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url(../fonts/fraunces-normal-latin.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:'Fraunces';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url(../fonts/fraunces-normal-latin-ext.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face{
  font-family:'Public Sans';
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url(../fonts/public-sans-normal-latin.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:'Public Sans';
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url(../fonts/public-sans-normal-latin-ext.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face{
  font-family:'Public Sans';
  font-style:italic;
  font-weight:400 600;
  font-display:swap;
  src:url(../fonts/public-sans-italic-latin.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:'Public Sans';
  font-style:italic;
  font-weight:400 600;
  font-display:swap;
  src:url(../fonts/public-sans-italic-latin-ext.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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root{
/* Abhaya Libre ExtraBold — the wordmark face. Logo and price numerals only, never running headlines. */
--font-wordmark:"Abhaya Libre","Abhaya Libre ExtraBold",Georgia,serif;
/* Fraunces — the voice. Headlines, section titles, item names. Soft, slightly old-fashioned, warm. */
--font-display:"Fraunces","Abhaya Libre",Georgia,"Times New Roman",serif;
/* Public Sans — everything you actually read and click. */
--font-sans:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
--font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace}