/* Pusti brand retained. Calm family landing page: variance 4, motion 2, density 4.
   Native HTML/CSS; no additional framework. Layers: header 10, skip link 20. */
@font-face{font-family:Figtree;src:url('../assets/fonts/Figtree.ttf') format('truetype');font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:Fredoka;src:url('../assets/fonts/Fredoka.ttf') format('truetype');font-weight:300 700;font-style:normal;font-display:swap}
:root{
  color-scheme:light dark;
  --bg-page:#f6f4ee;--bg:#efe9d5;--card:#fffef9;--green:#3f742f;--green-hover:#315c25;
  --green-subtle:#e9efdf;--green-border:#c1d0b6;--ink:#383327;--muted:#655f50;--line:#dbd7c9;
  --field:#f6f4eb;--header:rgba(246,244,238,.97);--button-ink:#fffef9;
  --shadow:0 12px 36px #3833270a,0 2px 5px #38332708;
  --font:Figtree,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --heading-font:Fredoka,Figtree,sans-serif;--radius:24px;--radius-sm:14px;
  --ease-out:cubic-bezier(.23,1,.32,1);
}
@media(prefers-color-scheme:dark){:root{
  --bg-page:#201f19;--bg:#29291f;--card:#302f26;--green:#b2d895;--green-hover:#c5e7ac;
  --green-subtle:#343d2b;--green-border:#5b6d4b;--ink:#f3eddf;--muted:#c5bead;--line:#4c4b3b;
  --field:#26261f;--header:rgba(32,31,25,.97);--button-ink:#202d19;--shadow:0 12px 36px #11130f26;
}}
*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,p,figure{margin:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:100px}
body{padding-inline:env(safe-area-inset-left,0px) env(safe-area-inset-right,0px);font-family:var(--font);font-size:17px;line-height:1.65;background:var(--bg-page);color:var(--ink);overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none;touch-action:manipulation}
button,input,summary{font:inherit;touch-action:manipulation}
button{color:inherit;cursor:pointer}
button:disabled{cursor:default;opacity:.55}
button,input{min-width:0}
button{border:0}
fieldset{border:0;padding:0;margin:0;min-width:0}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--green);outline-offset:5px}
#inhalt:focus{outline:none}
h1,h2,h3{font-weight:600;letter-spacing:-.035em;line-height:1.15;text-wrap:balance}
h1{font-family:var(--heading-font);font-size:clamp(2.6rem,4.2vw,3.7rem);font-weight:500;line-height:1.1}
h2{font-size:clamp(1.9rem,3.15vw,2.65rem)}
h3{font-size:1.28rem;line-height:1.3;letter-spacing:-.02em}
p{color:var(--muted);text-wrap:pretty}
strong{font-weight:650}
.container{width:min(100% - 80px,1160px);margin-inline:auto}
.section{padding-block:96px;scroll-margin-top:16px}
.section-heading{max-width:630px;margin-bottom:44px}
.section-heading>p,.section-copy>p{margin-top:20px;max-width:56ch}
.eyebrow{color:var(--green);font-weight:650;font-size:.84rem;letter-spacing:.035em;margin-bottom:18px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:48px;padding:11px 21px;border-radius:999px;font-size:.92rem;font-weight:650;line-height:1.4;text-align:center}
.btn-lg{min-height:54px;padding:15px 24px}
.btn-primary{background:var(--green);color:var(--button-ink)}
.btn-secondary{background:var(--card);color:var(--ink);border:1px solid var(--line)}
.text-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--green);font-size:.94rem;font-weight:600;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.caption-note{display:block;font-size:.78rem;color:var(--muted)}
.tag{padding:4px 10px;border-radius:999px;color:var(--green);background:var(--green-subtle);font-size:.75rem;font-weight:650}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:12px;left:16px;z-index:20;padding:12px 20px;background:var(--card);border:2px solid var(--green);border-radius:8px;transform:translateY(-180%)}
.skip-link:focus{transform:translateY(0)}
@media(hover:hover) and (pointer:fine){
  .btn-primary:hover{background:var(--green-hover)}
  .btn-secondary:hover{background:var(--green-subtle)}
  .text-link:hover{text-decoration-thickness:2px}
  nav a:hover{color:var(--green);text-decoration:underline;text-underline-offset:5px}
}
@media(max-width:767px){
  .container{width:calc(100% - 40px)}
  .section{padding-block:48px}
  .section-heading{margin-bottom:24px}
  h1{font-size:clamp(2rem,8.7vw,2.75rem);line-height:1.12}
  h2{font-size:clamp(1.75rem,7.5vw,2.15rem);line-height:1.2}
  body{font-size:16px}
}

::selection{background:var(--green);color:var(--button-ink)}
input{caret-color:var(--green)}

h1,h2,h3,.text-link{overflow-wrap:anywhere}
.text-link{max-width:100%}