/* Webfonts — selbst gehostet statt über fonts.googleapis.com geladen.
   Grund: das LG München (Urteil v. 20.1.2022, Az. 3 O 17493/20) hat das
   dynamische Nachladen von Google Fonts vom Google-Server als DSGVO-Verstoß
   gewertet (Nutzer-IP geht ohne Einwilligung an Google) — Auslöser einer
   Abmahnwelle gegen deutsche Websites. Anton + DM Sans stehen unter der
   SIL Open Font License 1.1 (kostenlos, auch kommerziell, keine Lizenzpflicht) —
   nur eben lokal ausliefern statt vom Google-CDN nachladen. */
@font-face{
  font-family:"Anton";
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src:url("/assets/fonts/anton-latin-400-normal.woff2") format("woff2");
}
@font-face{
  font-family:"DM Sans";
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url("/assets/fonts/dm-sans-latin-300-700-normal.woff2") format("woff2");
}
@font-face{
  font-family:"DM Sans";
  font-style:italic;
  font-weight:400;
  font-display:swap;
  src:url("/assets/fonts/dm-sans-latin-400-italic.woff2") format("woff2");
}

:root{
  --font-display:"Anton","Arial Narrow Bold",Impact,sans-serif;
  --font-sans:"DM Sans","Helvetica Neue",Helvetica,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,monospace;
}
/* Base palette. Anchors taken verbatim from the brand sheet:
   Brunswick Green 0C4137 · Emerald 06D6A0 · Polar E6FBF6 */
:root{
  /* deep greens — the dark end of the system */
  --green-990:#03100C;
  --green-950:#04140F;
  --green-900:#07211B;
  --green-850:#0A2E26;
  --green-800:#0C4137; /* Brunswick Green */
  --green-700:#12574A;
  --green-600:#177060;
  --green-500:#1E8B76;

  /* emerald — the single accent hue */
  --emerald-700:#048A69;
  --emerald-600:#04AE83;
  --emerald-500:#06D6A0; /* Emerald */
  --emerald-400:#3FE3B5;
  --emerald-300:#7CEDCC;
  --emerald-200:#B4F3DF;

  /* polar — cool light end */
  --polar-50:#F4FDFA;
  --polar-100:#E6FBF6; /* Polar */
  --polar-200:#D2F6EE;
  --polar-300:#B4EEE2;

  /* warm neutrals — used only on light surfaces, keeps care pages from going clinical */
  --clay-50:#FAF8F4;
  --clay-100:#F3EFE9;
  --clay-200:#E4DED3;
  --bark-700:#3B3A34;

  /* semantic — status */
  --signal-ok:#06D6A0;
  --signal-info:#5FC8E8;
  --signal-warn:#E8B44F;
  --signal-error:#E2705F;

  /* ——— semantic aliases: use these in components ——— */
  --bg-deep:var(--green-990);
  --bg-base:var(--green-950);
  --bg-raised:var(--green-900);
  --bg-light:var(--polar-100);
  --bg-warm:var(--clay-100);

  --surface-glass:rgba(230,251,246,.07);
  --surface-glass-strong:rgba(230,251,246,.12);
  --surface-card:rgba(7,33,27,.66);
  --surface-card-light:#FFFFFF;
  --surface-inset:rgba(3,16,12,.42);

  --text-primary:var(--polar-100);
  --text-secondary:rgba(230,251,246,.72);
  --text-muted:rgba(230,251,246,.48);
  --text-on-light:var(--green-850);
  --text-on-light-muted:rgba(10,46,38,.62);
  --text-on-accent:var(--green-950);

  --accent:var(--emerald-500);
  --accent-hover:var(--emerald-400);
  --accent-press:var(--emerald-600);
  --accent-quiet:rgba(6,214,160,.14);

  --border-hairline:rgba(230,251,246,.12);
  --border-hairline-strong:rgba(230,251,246,.22);
  --border-on-light:rgba(10,46,38,.12);
  --focus-ring:rgba(6,214,160,.55);
}
:root{
  /* display — Spectral, always light weight, never all-caps */
  --fs-display-1:clamp(3rem,7.2vw,6.5rem); /* @kind font */
  --fs-display-2:clamp(2.5rem,5vw,4.25rem); /* @kind font */
  --fs-display-3:clamp(2rem,3.4vw,3rem); /* @kind font */
  --fs-title:clamp(1.5rem,2.2vw,2rem); /* @kind font */
  --fs-subtitle:1.25rem; /* @kind font */

  /* text — DM Sans */
  --fs-lead:clamp(1.0625rem,1.35vw,1.3125rem); /* @kind font */
  --fs-body:1rem; /* @kind font */
  --fs-body-sm:.9375rem; /* @kind font */
  --fs-caption:.8125rem; /* @kind font */
  --fs-eyebrow:.75rem; /* @kind font */

  --lh-display:1.06; /* @kind font */
  --lh-title:1.18; /* @kind font */
  --lh-lead:1.6; /* @kind font */
  --lh-body:1.68; /* @kind font */
  --lh-tight:1.35; /* @kind font */

  --tracking-display:-0.02em; /* @kind font */
  --tracking-title:-0.01em; /* @kind font */
  --tracking-body:0em; /* @kind font */
  --tracking-eyebrow:0.18em; /* @kind font */

  --weight-display:300; /* @kind font */
  --weight-display-em:400; /* @kind font */
  --weight-body:400; /* @kind font */
  --weight-medium:500; /* @kind font */
  --weight-strong:600; /* @kind font */

  --measure-prose:62ch; /* @kind font */
  --measure-lead:46ch; /* @kind font */
}
:root{
  /* 4px base, doubling rhythm above 32 */
  --sp-0:0; /* @kind spacing */
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:20px;
  --sp-6:24px;
  --sp-8:32px;
  --sp-10:40px;
  --sp-12:48px;
  --sp-16:64px;
  --sp-20:80px;
  --sp-24:96px;
  --sp-32:128px;
  --sp-40:160px;

  /* page rhythm */
  --section-y:clamp(80px,9vw,160px); /* @kind spacing */
  --section-y-tight:clamp(56px,5vw,96px); /* @kind spacing */
  --gutter:clamp(20px,4vw,64px); /* @kind spacing */
  --container:1240px; /* @kind spacing */
  --container-narrow:760px; /* @kind spacing */
  --stack-gap:var(--sp-6);
}
:root{
  --r-xs:8px;
  --r-sm:12px;
  --r-md:18px;
  --r-lg:28px;   /* glass panels, feature cards */
  --r-xl:40px;   /* full-bleed hero shells */
  --r-2xl:56px;
  --r-pill:999px;
  --r-orb:50%;
}
:root{
  /* soft-3d: shadows are green-tinted, never neutral black */
  --shadow-xs:0 1px 2px rgba(3,16,12,.28);
  --shadow-sm:0 4px 14px rgba(3,16,12,.32);
  --shadow-card:0 18px 44px -18px rgba(3,16,12,.72);
  --shadow-lift:0 34px 80px -28px rgba(3,16,12,.85);
  --shadow-glass:0 24px 60px -24px rgba(3,16,12,.7),0 2px 0 rgba(230,251,246,.06) inset;
  --shadow-orb:0 60px 120px -40px rgba(6,214,160,.45);
  --glow-accent:0 0 0 1px rgba(6,214,160,.35),0 18px 48px -18px rgba(6,214,160,.55);

  /* inner light: the top edge highlight that makes glass read as glass */
  --inset-sheen:inset 0 1px 0 rgba(230,251,246,.22);
  --inset-floor:inset 0 -1px 0 rgba(3,16,12,.35);
  --inset-well:inset 0 2px 10px rgba(3,16,12,.45);

  --blur-glass:22px; /* @kind other */
  --blur-veil:40px; /* @kind other */
  --saturate-glass:1.35; /* @kind other */

  --stone-blur:4px; /* @kind other */
  --stone-saturate:1; /* @kind other */
  --stone-scale:1.06; /* @kind other */
}
:root{
  /* the brand mesh: three soft light sources over deep green, no hard stops */
  --grad-mesh:radial-gradient(58% 74% at 18% 12%,rgba(6,214,160,.30) 0%,rgba(6,214,160,0) 62%),
              radial-gradient(52% 62% at 86% 26%,rgba(30,139,118,.42) 0%,rgba(30,139,118,0) 66%),
              radial-gradient(70% 80% at 62% 104%,rgba(4,174,131,.26) 0%,rgba(4,174,131,0) 68%),
              linear-gradient(168deg,#07211B 0%,#04140F 58%,#03100C 100%); /* @kind color */
  --grad-mesh-quiet:radial-gradient(60% 70% at 24% 8%,rgba(30,139,118,.28) 0%,rgba(30,139,118,0) 64%),
              linear-gradient(180deg,#04140F 0%,#03100C 100%); /* @kind color */
  --grad-accent:linear-gradient(158deg,#3FE3B5 0%,#06D6A0 46%,#04AE83 100%); /* @kind color */
  --grad-accent-soft:linear-gradient(158deg,rgba(6,214,160,.22) 0%,rgba(4,174,131,.06) 100%); /* @kind color */
  --grad-glass:linear-gradient(152deg,rgba(230,251,246,.16) 0%,rgba(230,251,246,.05) 44%,rgba(230,251,246,.02) 100%); /* @kind color */
  --grad-sheen:linear-gradient(100deg,transparent 0%,rgba(230,251,246,.14) 46%,transparent 72%); /* @kind color */
  --grad-light:linear-gradient(180deg,#F4FDFA 0%,#E6FBF6 100%); /* @kind color */
  --grad-warm:linear-gradient(180deg,#FAF8F4 0%,#F3EFE9 100%); /* @kind color */

  /* protection veils — laid under text that sits on imagery */
  --veil-bottom:linear-gradient(to top,rgba(3,16,12,.86) 0%,rgba(3,16,12,.5) 42%,rgba(3,16,12,0) 100%); /* @kind color */
  --veil-top:linear-gradient(to bottom,rgba(3,16,12,.7) 0%,rgba(3,16,12,0) 100%); /* @kind color */
  --veil-edge:linear-gradient(90deg,rgba(3,16,12,.8) 0%,rgba(3,16,12,0) 58%); /* @kind color */

  /* hairline that catches light along a panel's top edge */
  --grad-hairline:linear-gradient(90deg,rgba(230,251,246,0) 0%,rgba(230,251,246,.35) 26%,rgba(6,214,160,.5) 52%,rgba(230,251,246,0) 100%); /* @kind color */

  /* sheer mesh: same light sources, aber durchlässig — liegt ÜBER dem Steinbild */
  --grad-mesh-sheer:radial-gradient(58% 74% at 18% 12%,rgba(6,214,160,.22) 0%,rgba(6,214,160,0) 62%),
              radial-gradient(52% 62% at 86% 26%,rgba(30,139,118,.30) 0%,rgba(30,139,118,0) 66%),
              linear-gradient(168deg,rgba(7,33,27,.58) 0%,rgba(4,20,15,.70) 58%,rgba(3,16,12,.80) 100%); /* @kind color */
  --grad-mesh-sheer-light:linear-gradient(180deg,rgba(244,253,250,.88) 0%,rgba(230,251,246,.82) 100%); /* @kind color */
}
:root{
  /* nothing bounces. everything eases out and settles. */
  --ease-calm:cubic-bezier(.22,.61,.36,1); /* @kind other */
  --ease-glide:cubic-bezier(.16,.84,.44,1); /* @kind other */
  --ease-veil:cubic-bezier(.4,0,.2,1); /* @kind other */

  --dur-instant:120ms; /* @kind other */
  --dur-fast:200ms; /* @kind other */
  --dur-base:320ms; /* @kind other */
  --dur-slow:560ms; /* @kind other */
  --dur-reveal:900ms; /* @kind other */
  --dur-drift:22s; /* @kind other */
  --dur-breathe:7s; /* @kind other */

  --lift-hover:-2px; /* @kind other */
  --press-scale:.985; /* @kind other */
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-base);color:var(--text-primary);font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--weight-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--weight-display);letter-spacing:var(--tracking-display);line-height:var(--lh-display);margin:0}
h3,h4{letter-spacing:var(--tracking-title);line-height:var(--lh-title)}
p{margin:0}
a{color:var(--accent);text-decoration:none;text-underline-offset:.22em;transition:color var(--dur-fast) var(--ease-calm),opacity var(--dur-fast) var(--ease-calm)}
a:hover{color:var(--accent-hover);text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;border-radius:var(--r-xs)}
::selection{background:var(--accent-quiet);color:var(--text-primary)}
img{max-width:100%;display:block}
button{font:inherit;color:inherit}
.bk-light a{color:var(--emerald-700)}
.bk-light a:hover{color:var(--emerald-600)}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}
