/* ==========================================================================
   moventure — Stylesheet
   Design-Tokens aus dem moventure Design System (tokens.css Handoff-Export).
   Schriften lokal gehostet, keine externen Requests.
   ========================================================================== */

/* --- Schriften (selbst gehostet, kein Google-CDN) ----------------------- */
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:600;font-display:swap;
  src:url('fonts/bricolage-grotesque-latin-600-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Bricolage Grotesque';font-style:normal;font-weight:700;font-display:swap;
  src:url('fonts/bricolage-grotesque-latin-700-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,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:400;font-display:swap;
  src:url('fonts/public-sans-latin-400-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,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:700;font-display:swap;
  src:url('fonts/public-sans-latin-700-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url('fonts/ibm-plex-mono-latin-500-normal.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* --- Tokens: Farben ---------------------------------------------------- */
:root{
--forest-950:#132018;--forest-900:#1c2b20;--forest-800:#243a29;--forest-700:#2f4a34;--forest-600:#3d5d42;--forest-500:#4f7350;--forest-400:#75906f;--forest-300:#a0b596;--forest-200:#c9d7bf;--forest-100:#e6ede0;--forest-50:#f4f7f0;
--sand-900:#7a5a2e;--sand-800:#8f6c38;--sand-700:#a67f44;--sand-600:#bb9457;--sand-500:#cca971;--sand-400:#d8c093;--sand-300:#e3d3b0;--sand-200:#eee3c9;--sand-100:#f5eede;--sand-50:#faf6ec;
--stone-950:#1b1815;--stone-900:#262220;--stone-800:#3a3531;--stone-700:#534c46;--stone-600:#706760;--stone-500:#8f847c;--stone-400:#ada199;--stone-300:#c9beb5;--stone-200:#e2dad2;--stone-100:#f0eae4;--stone-50:#f8f5f1;--white:#fff;
--amber-600:#a3701f;--amber-100:#f7e8cf;--forest-success-600:#3f6b4a;--forest-success-100:#e0ebe2;--rust-600:#9c3b2e;--rust-100:#f5e0dc;
--surface-page:var(--stone-50);--surface-card:var(--white);--surface-sunken:var(--stone-100);--surface-inverse:var(--forest-900);--surface-accent-subtle:var(--sand-50);
--text-primary:var(--stone-900);--text-secondary:var(--stone-600);--text-tertiary:var(--stone-500);--text-inverse:var(--stone-50);--text-on-accent:var(--white);
--border-default:var(--stone-200);--border-strong:var(--stone-400);--border-inverse:rgba(255,255,255,.16);
--brand-primary:var(--forest-900);--brand-primary-hover:var(--forest-800);--brand-primary-active:var(--forest-950);
--accent:var(--sand-800);--accent-hover:var(--sand-900);--accent-active:var(--sand-900);
--link:var(--forest-700);--link-hover:var(--sand-800);
--success:var(--forest-success-600);--success-subtle:var(--forest-success-100);--warning:var(--amber-600);--warning-subtle:var(--amber-100);--danger:var(--rust-600);--danger-subtle:var(--rust-100);
}

/* --- Tokens: Typografie ------------------------------------------------ */
:root{
--font-display:'Bricolage Grotesque','Public Sans',-apple-system,sans-serif;
--font-body:'Public Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',monospace;
--text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-md:1.125rem;--text-lg:1.25rem;--text-xl:1.5rem;--text-2xl:1.875rem;--text-3xl:2.25rem;--text-4xl:3rem;--text-5xl:3.75rem;
--leading-tight:1.15;--leading-snug:1.35;--leading-normal:1.6;--leading-relaxed:1.75;
--tracking-tight:-.01em;--tracking-normal:0;--tracking-wide:.04em;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;
}

/* --- Tokens: Spacing --------------------------------------------------- */
: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;
--content-max:1160px;--content-narrow:720px;
}

/* --- Tokens: Effects --------------------------------------------------- */
:root{
--radius-sm:4px;--radius-md:8px;--radius-lg:14px;--radius-xl:20px;--radius-full:999px;
--shadow-sm:0 1px 2px rgba(38,34,32,.08);
--shadow-md:0 4px 12px rgba(38,34,32,.10),0 1px 2px rgba(38,34,32,.06);
--shadow-lg:0 12px 32px rgba(38,34,32,.14),0 2px 6px rgba(38,34,32,.08);
--shadow-inset:inset 0 1px 2px rgba(38,34,32,.08);
--ease-standard:cubic-bezier(.4,0,.2,1);
--ease-out:cubic-bezier(.16,1,.3,1);
--duration-fast:120ms;
--duration-normal:200ms;
--border-width:1px;
--header-h:64px;
}

/* --- Basis ------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0;
  background:var(--surface-page);
  color:var(--text-primary);
  font-family:var(--font-body);
  font-size:var(--text-base);
  line-height:var(--leading-normal);
  -webkit-font-smoothing:antialiased;
  overflow-wrap:break-word;
}

a{color:var(--link);text-decoration:none;transition:color var(--duration-fast) var(--ease-standard)}
a:hover{color:var(--link-hover)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--radius-sm)}

.shell{max-width:var(--content-max);margin:0 auto;padding-left:var(--space-8);padding-right:var(--space-8);width:100%}
.narrow{max-width:var(--content-narrow);margin:0 auto}

.skip{position:absolute;left:-9999px}
.skip:focus{
  left:var(--space-4);top:var(--space-4);z-index:20;
  background:var(--surface-card);color:var(--text-primary);
  padding:var(--space-3) var(--space-4);border:var(--border-width) solid var(--border-default);
  border-radius:var(--radius-md);
}

/* --- Header ------------------------------------------------------------ */
.site-header{
  position:sticky;top:0;z-index:10;
  height:var(--header-h);
  background:var(--surface-page);
  border-bottom:var(--border-width) solid var(--border-default);
}
.site-header .shell{
  height:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);
}

.wordmark{
  font-family:var(--font-display);
  font-weight:var(--weight-bold);
  font-size:var(--text-lg);
  letter-spacing:var(--tracking-tight);
  color:var(--forest-900);
  line-height:1;
}
.wordmark .mo{color:var(--sand-800)}
a.wordmark:hover{color:var(--forest-900)}


/* --- Hero -------------------------------------------------------------- */
.hero{
  background:var(--surface-inverse);
  color:var(--white);
  padding:var(--space-24) var(--space-8);
  text-align:center;
}
.hero h1{
  font-family:var(--font-display);
  font-weight:var(--weight-bold);
  font-size:var(--text-4xl);
  line-height:var(--leading-tight);
  letter-spacing:var(--tracking-tight);
  max-width:720px;
  margin:0 auto;
  color:var(--white);
}
.hero p{
  font-family:var(--font-body);
  font-size:1.0625rem;
  line-height:var(--leading-normal);
  color:var(--stone-300);
  max-width:560px;
  margin:var(--space-5) auto 0;
}

/* --- Abschnitte -------------------------------------------------------- */
.section{padding:88px var(--space-8)}
.section-sunken{background:var(--surface-sunken)}
[id]{scroll-margin-top:var(--header-h)}

.eyebrow{
  font-family:var(--font-body);
  font-size:var(--text-xs);
  font-weight:var(--weight-bold);
  letter-spacing:var(--tracking-wide);
  text-transform:uppercase;
  color:var(--accent);
  margin:0;
}
.section h2{
  font-family:var(--font-display);
  font-weight:var(--weight-bold);
  font-size:var(--text-2xl);
  line-height:var(--leading-snug);
  letter-spacing:var(--tracking-tight);
  color:var(--text-primary);
  margin:10px 0 0;
}
.section .body{
  font-size:var(--text-sm);
  line-height:var(--leading-relaxed);
  color:var(--text-secondary);
  margin:18px 0 0;
  max-width:66ch;
}
.section .body + .body{margin-top:var(--space-4)}

/* QuoteBlock */
.quote{
  margin:var(--space-8) 0 0;
  padding-left:var(--space-5);
  border-left:2px solid var(--sand-400);
}
.quote p{
  font-family:var(--font-display);
  font-weight:var(--weight-semibold);
  font-size:var(--text-md);
  line-height:var(--leading-snug);
  color:var(--text-primary);
  margin:0;
}
.quote footer{
  font-size:var(--text-xs);
  color:var(--text-tertiary);
  margin-top:var(--space-3);
}

/* StatBlock */
.stats{
  display:flex;gap:var(--space-12);flex-wrap:wrap;
  margin:var(--space-10) 0 0;padding:0;list-style:none;
}
.stats .num{
  display:block;
  font-family:var(--font-mono);
  font-weight:500;
  font-size:var(--text-xl);
  color:var(--forest-900);
  line-height:1.2;
}
.stats .lbl{
  display:block;
  font-size:var(--text-xs);
  color:var(--text-secondary);
  margin-top:var(--space-2);
}

/* --- Rechtstext-Seiten ------------------------------------------------- */
.legal h1{
  font-family:var(--font-display);
  font-weight:var(--weight-bold);
  font-size:var(--text-2xl);
  line-height:var(--leading-snug);
  letter-spacing:var(--tracking-tight);
  color:var(--text-primary);
  margin:0;
}
.legal .block{margin-top:var(--space-8)}
.legal h2{
  font-family:var(--font-display);
  font-weight:var(--weight-semibold);
  font-size:var(--text-lg);
  color:var(--text-primary);
  margin:0 0 var(--space-2);
}
.legal p{
  font-size:var(--text-sm);
  line-height:var(--leading-normal);
  color:var(--text-secondary);
  margin:0 0 var(--space-3);
  max-width:66ch;
}
.legal p:last-child{margin-bottom:0}

/* --- Footer ------------------------------------------------------------ */
.site-footer{
  background:var(--surface-sunken);
  border-top:var(--border-width) solid var(--border-default);
  padding:var(--space-12) var(--space-8);
}
.site-footer .cols{
  display:flex;flex-wrap:wrap;gap:var(--space-8) var(--space-16);
  align-items:flex-start;justify-content:space-between;
}
.site-footer .addr{
  font-size:var(--text-sm);
  color:var(--text-secondary);
  font-style:normal;
  margin-top:var(--space-4);
  line-height:var(--leading-normal);
}
.site-footer nav{display:flex;flex-direction:column;gap:var(--space-2)}
.site-footer nav a{font-size:var(--text-sm);color:var(--text-secondary)}
.site-footer nav a:hover{color:var(--link-hover)}
.site-footer .copy{
  font-size:var(--text-xs);
  color:var(--text-tertiary);
  margin:var(--space-10) 0 0;
  padding-top:var(--space-5);
  border-top:var(--border-width) solid var(--border-default);
}

/* --- Responsive -------------------------------------------------------- */
@media (max-width:640px){
  .shell{padding-left:var(--space-5);padding-right:var(--space-5)}
  .hero{padding:var(--space-16) var(--space-5)}
  /* Fliessend, damit beide Zeilen auch auf 320px zweizeilig bleiben */
  .hero h1{font-size:clamp(1.5rem,7vw,var(--text-3xl))}
  .section{padding:var(--space-16) var(--space-5)}
  .site-footer{padding:var(--space-10) var(--space-5)}
  .stats{gap:var(--space-6) var(--space-8)}
  .site-footer .cols{gap:var(--space-6)}
}

/* --- Druck ------------------------------------------------------------- */
@media print{
  .site-header,.skip{display:none}
  body{background:#fff}
  .hero{background:none;color:#000;padding:0 0 var(--space-8)}
  .hero h1,.hero p{color:#000}
  .site-footer{background:none}
  a{color:#000}
}
