:root{
    --green: rgb(56,180,72);
    --green-dark: rgb(38,130,52);
    --cream: #f5f6f2;
    --ink: #1f2a20;
    --ink-soft: #55604f;
    --moss: #17271c;
    --paper: #f2f4ec;
    --amber: #d9a544;
    --font-display: 'Newsreader', Georgia, 'Times New Roman', serif;
    --font-body: 'Work Sans', system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  }
  *{ box-sizing: border-box; }
  html{
    scroll-behavior:smooth;
  }
  html,body{
    margin:0;
    min-height:100%;
    background-color:var(--paper);
    background-image:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='170'%3E%3Cpath d='M0 36 Q40 10 80 36 T160 36 T240 36 T320 36' fill='none' stroke='%2338b448' stroke-opacity='0.09' stroke-width='1.3'/%3E%3Cpath d='M0 104 Q40 78 80 104 T160 104 T240 104 T320 104' fill='none' stroke='%2338b448' stroke-opacity='0.06' stroke-width='1.3'/%3E%3Cpath d='M0 150 Q40 132 80 150 T160 150 T240 150 T320 150' fill='none' stroke='%2338b448' stroke-opacity='0.05' stroke-width='1.1'/%3E%3C/svg%3E");
    background-repeat:repeat;
    background-attachment:fixed;
    color:var(--ink);
    font-family:var(--font-body);
  }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
  }
  a{ color: inherit; }
 
  #intro-stage{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--paper);
    z-index:100;
  }
 
  #logo-wrap{
    display:block;
    width:min(60vmin,380px);
  }
  #logo{
    display:block;
    width:100%;
    height:auto;
    overflow:visible;
  }
 
  #skip-intro{
    position:fixed;
    top:22px;
    right:24px;
    z-index:1001;
    padding:9px 20px;
    border:1px solid rgba(31,42,32,0.25);
    border-radius:999px;
    background:rgba(245,246,242,0.85);
    color:var(--ink);
    font-size:13px;
    font-weight:600;
    font-family:inherit;
    cursor:pointer;
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    transition:background .2s ease, transform .15s ease;
  }
  #skip-intro:hover{
    background:#fff;
  }
  #skip-intro:active{
    transform:scale(.96);
  }
  @media (max-width:480px){
    #skip-intro{
      top:14px;
      right:14px;
      padding:8px 16px;
      font-size:12px;
    }
  }
 
  #plant-stem{
    clip-path: inset(100% 0% 0% 0%) fill-box;
  }
  .bud-half{
    transform: scale(0);
  }
  #ring-inner-circle{
    fill:none;
    stroke:var(--green);
    stroke-linecap:butt;
    opacity:0;
  }
  #ring-outer-circle{
    fill:none;
    stroke:var(--green);
  }
  #ring-outer{
    clip-path: inset(0% 100% 0% 0%);
  }
  .letter{
    opacity:0;
    transform: rotate(-26deg) scale(.85);
    transition: opacity .4s cubic-bezier(.22,1,.36,1), transform .4s cubic-bezier(.22,1,.36,1);
  }
  .letter.visible{
    opacity:1;
    transform: rotate(0deg) scale(1);
  }
 
  header{
    position:sticky;
    top:0;
    z-index:10;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:14px 28px;
    background:none;
    box-shadow: 0 1px 3px rgba(31, 42, 32, 0.564);
    backdrop-filter: blur(5px);
  }
 
  .header-bg{
    position:absolute;
    inset:0;
    background: linear-gradient(135deg, rgba(17,34,25,0.96) 0%, rgba(33,60,41,0.94) 55%, rgba(45, 108, 70, 0.92) 100%);
    opacity: 1;
    backdrop-filter: blur(15px);
    border-bottom:1px solid rgba(31,42,32,0.1);
    clip-path:inset(0 100% 0 0);
    transition:clip-path .4s cubic-bezier(.65,0,.35,1);
    z-index:-1;
    
  }
  header.bar-in .header-bg{
    clip-path:inset(0 0% 0 0);
  }
  /* Wenn die besonderen Animationen (Session) schon einmal gelaufen sind,
     werden Header-Übergänge (Hintergrund, Marke, Nav, Menü-Button)
     ausgeschaltet, damit der Header sofort im Endzustand steht statt
     erneut "reinzuwischen". */
  header.no-reveal-transition .header-bg,
  header.no-reveal-transition .brand-name,
  header.no-reveal-transition nav#site-nav a,
  header.no-reveal-transition #menu-toggle{
    transition:none !important;
  }
 
  #header-logo-slot{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    position:relative;
    width:50px;
    height:50px;
    border-radius:50%;
    background:#fff;
    overflow:hidden;
    box-shadow:0 1px 3px rgba(31,42,32,0.18);
  }
  /* Logo größer reinskaliert und so positioniert, dass der Ring den Kreis
     gut ausfüllt; der leere Rand der (sehr hohen) Original-SVG wird durch
     overflow:hidden am quadratischen Container einfach weggeschnitten,
     statt die Headerhöhe aufzublähen. Werte aus der Ring-Transform-Matrix
     berechnet (Ring-Mittelpunkt 49.91%/45.05%, Ring-Durchmesser 83.34% der
     SVG-Breite), Ziel: Ring füllt 88% des 50px-Kreises. */
  #header-logo-slot #logo-wrap{
    position:absolute;
    width:52.8px;
    left:-1.35px;
    top:-8.63px;
  }
  .brand-name{
    font-family:var(--font-display);
    font-style:italic;
    font-size:16px;
    font-weight:500;
    line-height:1.2;
    white-space:nowrap;
    color:#fff;
    opacity:0;
    transition:opacity .3s ease .15s;
  }
  header.bar-in .brand-name{
    opacity:1;
  }
  .brand-name span{
    display:block;
    font-family:var(--font-body);
    font-style:normal;
    font-weight:400;
    font-size:11px;
    letter-spacing:0.02em;
    color:rgba(255,255,255,0.75);
  }
 
  
  nav#site-nav{
    display:flex;
    gap:24px;
    font-size:15px;
    position:relative;
  }
  nav#site-nav a{
    position:relative;
    text-decoration:none;
    color:#fff;
    padding:4px 2px;
    opacity:0;
    transform:translateY(8px);
    transition:color .25s ease, opacity .3s ease, transform .3s ease;
  }
  nav#site-nav a::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-2px;
    height:2px;
    background:linear-gradient(90deg, #c9f2ce 0%, #72d57e 100%);
    transform:scaleX(0);
    transform-origin:left center;
    opacity:0;
    transition:transform .32s cubic-bezier(.22,1,.36,1), opacity .2s ease;
  }
  nav#site-nav a:nth-child(1){ transition-delay:0ms, 0ms, 0ms, 0ms; }
  nav#site-nav a:nth-child(2){ transition-delay:0ms, 0ms, 70ms, 70ms; }
  nav#site-nav a:nth-child(3){ transition-delay:0ms, 0ms, 140ms, 140ms; }
  nav#site-nav a:nth-child(4){ transition-delay:0ms, 0ms, 210ms, 210ms; }
  nav#site-nav a:nth-child(5){ transition-delay:0ms, 0ms, 280ms, 280ms; }
  nav#site-nav a:nth-child(6){ transition-delay:0ms, 0ms, 350ms, 350ms; }
  nav#site-nav.items-in a{
    opacity:1;
    transform:translateY(0);
  }
  nav#site-nav a:hover,
  nav#site-nav a:focus-visible{
    color:#c9f2ce;
  }
  nav#site-nav a:hover::after,
  nav#site-nav a:focus-visible::after{
    transform:scaleX(1);
    opacity:1;
  }
 
  #menu-toggle{
    display:none;
    width:40px;
    height:40px;
    border:none;
    background:transparent;
    cursor:pointer;
    padding:0;
    position:relative;
    opacity:0;
    transition:opacity .4s ease;
  }
  header.bar-in #menu-toggle{
    opacity:1;
  }
  #menu-toggle span{
    position:absolute;
    left:8px;
    right:8px;
    height:2px;
    background:#fff;
    border-radius:2px;
    transition:transform .3s ease, opacity .3s ease, top .3s ease;
  }
  #menu-toggle span:nth-child(1){ top:14px; }
  #menu-toggle span:nth-child(2){ top:20px; }
  #menu-toggle span:nth-child(3){ top:26px; }
  #menu-toggle.open span:nth-child(1){ top:20px; transform:rotate(45deg); }
  #menu-toggle.open span:nth-child(2){ opacity:0; }
  #menu-toggle.open span:nth-child(3){ top:20px; transform:rotate(-45deg); }
 
  #mobile-menu{
    position:fixed;
    inset:0;
    z-index:300;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:32px;
    background-color:#2b2a27;
    background: linear-gradient(135deg, rgba(17,34,25,0.96) 0%, rgb(33, 60, 41) 55%, rgb(53, 135, 86) 100%);
    background-size: cover;
    background-position: center;
    opacity:0;
    visibility:hidden;
    transition:opacity .35s ease, visibility 0s linear .35s;
  }
  #mobile-menu.open{
    opacity:1;
    visibility:visible;
    transition:opacity .35s ease, visibility 0s linear 0s;
  }
  #mobile-menu::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(20,20,18,0.45);
  }
  #mobile-menu-close{
    position:absolute;
    top:22px;
    right:24px;
    width:40px;
    height:40px;
    border:none;
    background:transparent;
    cursor:pointer;
    z-index:2;
  }
  #mobile-menu-close span{
    position:absolute;
    top:19px;
    left:8px;
    right:8px;
    height:2px;
    background:#f5f6f2;
    border-radius:2px;
  }
  #mobile-menu-close span:first-child{ transform:rotate(45deg); }
  #mobile-menu-close span:last-child{ transform:rotate(-45deg); }
 
  #mobile-menu-list{
    list-style:none;
    margin:0;
    padding:0;
    position:relative;
    z-index:2;
  }
  #mobile-menu-list li{
    border-bottom:1px solid rgba(245,246,242,0.15);
  }
  #mobile-menu-list li:first-child{
    border-top:1px solid rgba(245,246,242,0.15);
  }
  #mobile-menu-list a{
    display:block;
    padding:18px 4px;
    color:#f5f6f2;
    text-decoration:none;
    font-size:22px;
    font-weight:500;
    opacity:0;
    transform:translateY(10px);
    transition:opacity .4s ease, transform .4s ease;
  }
  #mobile-menu.open #mobile-menu-list a{
    opacity:1;
    transform:translateY(0);
  }
  #mobile-menu.open #mobile-menu-list li:nth-child(1) a{ transition-delay:80ms; }
  #mobile-menu.open #mobile-menu-list li:nth-child(2) a{ transition-delay:150ms; }
  #mobile-menu.open #mobile-menu-list li:nth-child(3) a{ transition-delay:220ms; }
  #mobile-menu.open #mobile-menu-list li:nth-child(4) a{ transition-delay:290ms; }
  #mobile-menu.open #mobile-menu-list li:nth-child(5) a{ transition-delay:360ms; }
  #mobile-menu.open #mobile-menu-list li:nth-child(6) a{ transition-delay:430ms; }
  #mobile-menu-list .teaser{
    display:block;
    font-size:12px;
    font-weight:400;
    color:rgba(245,246,242,0.6);
    margin-top:2px;
  }
 
  @media (max-width:900px){
    nav#site-nav{ display:none; }
    #menu-toggle{ display:block; }
  }
 
  main{
    position:relative;
    max-width:760px;
    margin:0 auto;
    padding:64px 24px 96px;
  }

  .growth-spine{ display:none; }
  @media (min-width:1040px){
    .growth-spine{
      display:block;
      position:absolute;
      left:-54px;
      top:6px;
      bottom:6px;
      width:2px;
    }
    .growth-spine-track{
      position:absolute; inset:0;
      background:linear-gradient(180deg, rgba(31,42,32,0.14) 0%, rgba(31,42,32,0.03) 100%);
      border-radius:2px;
    }
    .growth-spine-fill{
      position:absolute;
      left:0; top:0;
      width:100%;
      height:0%;
      background:linear-gradient(180deg, var(--green) 0%, var(--green-dark) 100%);
      border-radius:2px;
      box-shadow:0 0 14px rgba(56,180,72,0.4);
    }
    main > section{ position:relative; }
    main > section::before{
      content:'';
      position:absolute;
      left:-59px;
      top:6px;
      width:12px;
      height:12px;
      border-radius:50%;
      background:var(--paper);
      border:2px solid rgba(56,180,72,0.55);
      transform:scale(0.72);
      transition:background .5s ease, transform .5s ease, box-shadow .5s ease, border-color .5s ease;
    }
    main > section.is-visible::before,
    main > section.hero::before{
      background:var(--green);
      border-color:var(--green);
      transform:scale(1);
      box-shadow:0 0 0 6px rgba(56,180,72,0.14);
    }
  }
  @media (prefers-reduced-motion: reduce){
    .growth-spine-fill{ transition:none; }
  }

  main > section > h2{
    display:flex;
    align-items:center;
    gap:16px;
    font-family:var(--font-display);
    font-style:italic;
    font-weight:500;
    font-size:30px;
    letter-spacing:-0.01em;
    margin:0 0 30px;
    color:var(--ink);
  }

  @media (max-width:1040px){
    main > section > h2::before{
      content:'';
      flex-shrink:0;
      width:30px;
      height:30px;
      border-radius:50%;
    background:
      radial-gradient(circle at 50% 50%,
        transparent 0 36%,
        var(--green) 37% 40%,
        transparent 41% 56%,
        var(--amber) 57% 60%,
        transparent 61% 100%);
  }
  }

  
  .hero{
    opacity:0;
    transform:translateY(-14px);
    transition:opacity .5s ease .1s, transform .5s ease .1s;
  }
  body.hero-ready .hero{
    opacity:1;
    transform:translateY(0);
  }
  .hero h1{
    font-family:var(--font-display);
    font-style:italic;
    font-weight:500;
    font-size:clamp(30px,5vw,46px);
    line-height:1.2;
    letter-spacing:-0.01em;
    margin:0 0 14px;
  }
  .hero p{
    font-size:17px;
    line-height:1.7;
    color:var(--ink-soft);
    max-width:58ch;
    margin:0 0 28px;
  }
  .hero-actions{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:8px;
  }
  .button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:0 22px;
    border-radius:999px;
    text-decoration:none;
    font-weight:700;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
  }
  .button:hover,
  .button:focus-visible{
    transform:translateY(-1px);
  }
  .button-primary{
    background:linear-gradient(135deg, var(--green) 0%, var(--green-dark) 100%);
    color:#fff;
    box-shadow:0 14px 28px rgba(56,180,72,0.22);
  }
  .button-secondary{
    border:1px solid rgba(31,42,32,0.18);
    background:rgba(255,255,255,0.5);
    color:var(--ink);
  }
  .hero-cursor{
    display:inline-block;
    width:3px;
    height:0.85em;
    margin-left:4px;
    vertical-align:-0.1em;
    background:var(--ink);
    animation:hero-cursor-blink 1s step-end infinite;
  }
  .hero-cursor.done{
    animation:none;
    opacity:0;
  }
  @keyframes hero-cursor-blink{
    0%, 100%{ opacity:1; }
    50%{ opacity:0; }
  }

  /* Impact cards removed — styles cleaned up */

  #ueber-uns{
    margin-top:88px;
    scroll-margin-top:90px;
  }
  #ueber-uns h2{
    font-size:26px;
    margin:0 0 24px;
  }
  .ueber-uns-text{
    font-size:17px;
    line-height:1.8;
  }
  .ueber-uns-text p{
    color:var(--ink-soft);
    margin:0 0 22px;
  }
  .ueber-uns-text p:last-child{
    margin-bottom:0;
  }
  .ueber-uns-text p:first-of-type::first-letter{
    font-family:var(--font-display);
    font-style:italic;
    font-weight:500;
    font-size:3.6em;
    line-height:0.72;
    float:left;
    padding:0.06em 0.1em 0 0;
    color:var(--green-dark);
  }
  .ueber-uns-text a{
    color:var(--ink);
    font-weight:600;
    text-decoration:none;
    background:linear-gradient(180deg, transparent 64%, rgba(56,180,72,0.32) 64%);
    padding:0 1px;
  }

  #projekte{
    margin-top:88px;
    scroll-margin-top:90px;
  }
  #projekte h2{
    font-size:26px;
    margin:0 0 24px;
  }
  .projekte-list{
    display:flex;
    flex-direction:column;
  }
  .projekt-post{
    display:grid;
    grid-template-columns:108px 1fr;
    column-gap:28px;
    padding:36px 0;
    border-top:1px dashed rgba(31,42,32,0.2);
  }
  .projekt-post:first-child{
    padding-top:0;
    border-top:none;
  }
  .projekt-date{
    grid-column:1;
    grid-row:1;
    margin:0;
    padding-top:5px;
    font-family:var(--font-mono);
    font-size:11px;
    font-weight:600;
    letter-spacing:0.03em;
    color:var(--green-dark);
  }
  .projekt-post h3{
    grid-column:2;
    grid-row:1;
    font-family:var(--font-display);
    font-style:italic;
    font-weight:500;
    font-size:23px;
    line-height:1.3;
    margin:0 0 14px;
    color:var(--ink);
  }
  .projekt-text{
    grid-column:2;
    grid-row:2;
  }
  .projekt-text p{
    font-size:16px;
    line-height:1.75;
    color:var(--ink-soft);
    margin:0 0 20px;
  }
  .projekt-text p:last-child{
    margin-bottom:0;
  }
  @media (max-width:560px){
    .projekt-post{
      grid-template-columns:1fr;
      row-gap:6px;
    }
    .projekt-date{ grid-column:1; grid-row:1; padding-top:0; }
    .projekt-post h3{ grid-column:1; grid-row:2; margin-top:4px; }
    .projekt-text{ grid-column:1; grid-row:3; }
  }

  .reveal-on-scroll .reveal-item{
    opacity:0;
    transform:translateY(-18px);
    transition:opacity .6s ease, transform .6s ease;
  }
  .reveal-on-scroll .reveal-item:nth-of-type(1){ transition-delay:0ms; }
  .reveal-on-scroll .reveal-item:nth-of-type(2){ transition-delay:180ms; }
  .reveal-on-scroll.is-visible .reveal-item{
    opacity:1;
    transform:translateY(0);
  }
  #termine{
    margin-top:88px;
    scroll-margin-top:90px;
  }
  .calendar-wrap{
    max-width:760px;
    margin:0 auto;
    padding:0 8px;
  }
  .calendar-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
    padding:18px 18px 16px;
    background:linear-gradient(135deg, #1f3128 0%, #2a4534 30%, #173721 100%);
    border:1px solid rgba(255,255,255,0.12);
    border-radius:24px;
    box-shadow:0 22px 42px rgba(19,32,24,0.18);
    position:relative;
    overflow:hidden;
  }
  .calendar-header::after{
    content:'';
    position:absolute;
    inset:auto -15% -50% auto;
    width:220px;
    height:220px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(113,179,110,0.35) 0%, rgba(113,179,110,0) 70%);
    pointer-events:none;
  }
  .calendar-title-wrap{
    display:flex;
    flex:1;
    flex-direction:column;
    align-items:center;
    gap:10px;
    min-width:0;
    position:relative;
    z-index:1;
  }
  .calendar-title{
    font-size:clamp(1rem, 1.5vw, 1.35rem);
    font-weight:600;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:#f5f9f5;
    text-align:center;
    font-family: var(--font-mono);
  }
  .calendar-pickers{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
  }
  .cal-select{
    appearance:none;
    border:1px solid rgba(255,255,255,0.16);
    background:rgba(255,255,255,0.08);
    color:#f3f8f3;
    border-radius:12px;
    min-width:96px;
    max-width:120px;
    padding:8px 32px 8px 12px;
    font:inherit;
    font-size:12px;
    font-weight:700;
    cursor:pointer;
    background-image:
      linear-gradient(45deg, transparent 50%, rgba(255,255,255,0.9) 50%),
      linear-gradient(135deg, rgba(255,255,255,0.9) 50%, transparent 50%);
    background-position:
      calc(100% - 14px) calc(50% - 2px),
      calc(100% - 9px) calc(50% - 2px);
    background-size:5px 5px, 5px 5px;
    background-repeat:no-repeat;
    transition:border-color .2s ease, box-shadow .2s ease, transform .15s ease, background .2s ease;
    backdrop-filter:blur(6px);
    -webkit-backdrop-filter:blur(6px);
  }
  .cal-select:focus{
    outline:none;
    border-color:rgba(182,225,176,0.9);
    box-shadow:0 0 0 3px rgba(122,167,125,0.18);
  }
  .cal-select:hover{
    background-color:rgba(255,255,255,0.12);
    border-color:rgba(182,225,176,0.8);
  }
  .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;
  }
  .cal-nav{
    width:42px;
    height:42px;
    border:none;
    background:transparent;
    font-size:32px;
    line-height:1;
    cursor:pointer;
    color:#f4fbf4;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
    border-radius:50%;
    transition:all .18s ease;
    position:relative;
    z-index:1;
    box-shadow:none;
    transform-origin:center;
  }
  .cal-nav:hover{
    background:radial-gradient(circle at center, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.08) 46%, rgba(255,255,255,0) 72%);
    box-shadow:0 8px 22px rgba(0, 0, 0, 0.12);
    transform:translateY(-1px) scale(1.02);
  }
  .cal-nav:before{
    content:'';
    position:absolute;
    inset:50% auto auto 50%;
    width:28px;
    height:28px;
    transform:translate(-50%, -50%);
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0) 70%);
    pointer-events:none;
    z-index:-1;
  }
  .cal-nav:active{
    transform:translateY(0);
  }
  .cal-nav:focus-visible{
    outline:2px solid rgba(182,225,176,0.8);
    outline-offset:2px;
  }

  .calendar-viewport{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    background:linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(246,248,243,0.96) 100%);
    border:1px solid rgba(27,44,31,0.08);
    box-shadow:0 18px 42px rgba(22,29,24,0.08);
    transition:transform .65s cubic-bezier(.65,0,.35,1), box-shadow .65s ease;
    transform-origin:center center;
  }
  .calendar-viewport.panning{
    transform:scale(.985);
    box-shadow:0 16px 32px rgba(22,29,24,0.12);
  }
  .calendar-track{
    display:flex;
    width:300%;
    will-change:transform;
  }
  .calendar-page{
    flex:0 0 33.3334%;
    box-sizing:border-box;
    padding:18px 16px 20px;
    background:linear-gradient(180deg, rgba(250,251,248,0.8) 0%, rgba(242,245,239,0.7) 100%);
    border-radius:20px;
  }

  .cal-weekdays{
    display:grid;
    grid-template-columns:repeat(7,1fr);
    text-align:center;
    font-size:10px;
    font-weight:800;
    letter-spacing:0.14em;
    color:#66746a;
    margin-bottom:12px;
    text-transform:uppercase;
  }
  .cal-days{
    display:grid;
    grid-template-columns:repeat(7,1fr);
    gap:8px;
  }
  .cal-day{
    position:relative;
    min-height:74px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:var(--font-mono);
    font-size:14px;
    font-weight:500;
    border-radius:16px;
    background:linear-gradient(180deg, #fbfcfa 0%, #eef3ee 100%);
    border:1px solid rgba(35,49,38,0.06);
    color:#1f2a20;
    transition:transform .15s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
    overflow:hidden;
  }
  .cal-day.empty{
    background:transparent;
    border-color:transparent;
    box-shadow:none;
  }
  .cal-day.has-entries{
    cursor:pointer;
    background:linear-gradient(180deg, #f2f8f1 0%, #e5f0e4 100%);
    border-color:rgba(74,120,74,0.16);
    transition:background .15s ease, transform .15s ease, box-shadow .15s ease;
  }
  .cal-day.has-entries:hover{
    background:linear-gradient(180deg, #e7f3e6 0%, #dfefe2 100%);
    transform:translateY(-1px);
    box-shadow:0 12px 20px rgba(63,82,63,0.08);
  }
  .cal-day.is-today{
    box-shadow:inset 0 0 0 2px rgba(90,145,92,0.9);
    background:linear-gradient(180deg, #edf9ef 0%, #dfeee0 100%);
    font-weight:700;
  }
  .cal-day.selected{
    background:linear-gradient(135deg, #3d7a48 0%, #2d6240 100%);
    color:#fff;
    box-shadow:0 14px 26px rgba(45,98,64,0.18);
    border-color:transparent;
  }
  .cal-badge{
    position:absolute;
    top:5px;
    right:6px;
    min-width:18px;
    height:18px;
    padding:0 5px;
    border-radius:999px;
    background:linear-gradient(180deg, #6aa16d 0%, #4d8253 100%);
    color:#fff;
    font-size:9px;
    line-height:18px;
    text-align:center;
    font-weight:800;
    box-shadow:0 6px 12px rgba(69,110,81,0.18);
  }
  .cal-day.selected .cal-badge{
    background:#fff;
    color:#3d7a48;
    box-shadow:none;
  }

  .cal-details{
    margin-top:18px;
    background:linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(243,247,241,0.98) 100%);
    border:1px solid rgba(32,46,35,0.08);
    border-radius:20px;
    padding:20px 18px 18px;
    box-shadow:0 18px 30px rgba(19,34,25,0.08);
    position:relative;
    color:#243126;
  }
  .cal-details[hidden]{
    display:none;
  }
  .cal-details-close{
    position:absolute;
    top:12px;
    right:12px;
    width:28px;
    height:28px;
    border:none;
    background:rgba(47,72,52,0.06);
    border-radius:50%;
    font-size:20px;
    line-height:1;
    cursor:pointer;
    color:#41544a;
  }
  .cal-details h3{
    margin:0 28px 14px 0;
    font-size:1.05rem;
    font-weight:800;
    color:#1f2a20;
  }
  .cal-details ul{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:14px;
  }
  .cal-entry{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:12px 12px 11px;
    border-radius:14px;
    background:rgba(255,255,255,0.72);
    border:1px solid rgba(33,48,36,0.08);
    box-shadow:0 6px 12px rgba(31,42,32,0.03);
  }
  .cal-entry-status{
    width:20px;
    height:20px;
    border-radius:7px;
    border:1.5px solid rgba(36,49,38,0.2);
    flex-shrink:0;
    margin-top:2px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
  }
  .cal-entry-status svg{
    display:block;
    width:11px;
    height:11px;
  }
  .cal-entry-ongoing .cal-entry-status{
    border-color:#4e8b53;
    background:rgba(99,160,101,0.12);
  }
  .cal-entry-ongoing .cal-entry-status::after{
    content:'';
    width:7px;
    height:7px;
    border-radius:50%;
    background:#4e8b53;
  }
  .cal-entry-past .cal-entry-status{
    border-color:transparent;
    background:rgba(36,49,38,0.12);
  }
  .cal-entry-past .cal-entry-status svg{
    stroke:#fff;
  }
  .cal-entry-ongoing .cal-entry-time{
    color:#406a44;
    font-weight:700;
  }
  .cal-entry-past .cal-entry-time,
  .cal-entry-past .cal-entry-title,
  .cal-entry-past .cal-entry-desc{
    color:#58685d;
  }
  .cal-entry-body{
    min-width:0;
  }
  .cal-entry-time{
    display:block;
    font-size:12px;
    color:#4f5d4f;
    font-weight:700;
    letter-spacing:0.02em;
  }
  .cal-entry-title{
    display:block;
    font-size:14px;
    font-weight:800;
    color:#243126;
  }
  .cal-entry-desc{
    display:block;
    font-size:13px;
    color:#5b685d;
    margin-top:3px;
    line-height:1.45;
  }
  .cal-empty-msg{
    font-size:14px;
    color:#5b685d;
    border-left:none;
    padding-left:0;
  }

  @media (max-width:480px){
    .cal-day{ font-size:12px; border-radius:8px; }
    .calendar-title{ font-size:16px; }
  }

  #mitgliedschaft{
    margin-top:88px;
    scroll-margin-top:90px;
  }
  .mitgliedschaft-card{
    display:grid;
    grid-template-columns:1.2fr 1fr;
    gap:24px;
    padding:28px 24px;
    background:linear-gradient(135deg, rgba(238,245,239,0.96) 0%, rgba(251,252,249,0.96) 100%);
    border:1px solid rgba(31,42,32,0.08);
    border-radius:24px;
    box-shadow:0 18px 38px rgba(19,32,24,0.06);
    margin-bottom:20px;
  }
  .eyebrow{
    margin:0 0 10px;
    font-family:var(--font-mono);
    font-size:11px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    font-weight:700;
    color:var(--green-dark);
  }
  .mitgliedschaft-copy h3{
    margin:0 0 12px;
    font-family:var(--font-display);
    font-size:32px;
    line-height:1.1;
    font-style:italic;
    font-weight:500;
    color:var(--ink);
  }
  .mitgliedschaft-copy p{
    margin:0;
    line-height:1.7;
    color:var(--ink-soft);
  }
  .mitgliedschaft-actions{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:14px;
  }
  .mitgliedschaft-text{
    font-size:17px;
    line-height:1.8;
  }
  .mitgliedschaft-text p{
    color:var(--ink-soft);
    margin:0 0 20px;
  }
  .mitgliedschaft-text p:last-child{
    margin-bottom:0;
  }
  .mitgliedschaft-text a{
    color:var(--ink);
    font-weight:600;
    text-decoration:none;
    background:linear-gradient(180deg, transparent 64%, rgba(217,165,68,0.42) 64%);
    padding:0 1px;
  }

  /* Mitmachen-Card: responsives Verhalten (muss NACH den Basis-Regeln
     oben stehen, da gleiche Spezifität und CSS sonst die spätere,
     nicht-responsive Regel gewinnen lässt) */
  @media (max-width: 780px){
    .mitgliedschaft-card{
      grid-template-columns: 1fr;
      padding: 20px;
      gap: 16px;
    }
    .mitgliedschaft-copy h3{
      font-size: 24px;
      line-height: 1.15;
    }
    .mitgliedschaft-actions{
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
      width: 100%;
    }
    .mitgliedschaft-actions .button{
      width: 100%;
      min-height: 48px;
      white-space: normal;
      text-align: center;
    }
  }

  @media (max-width: 480px){
    .mitgliedschaft-card{
      padding: 16px;
      border-radius: 18px;
    }
    .mitgliedschaft-copy h3{
      font-size: 21px;
    }
    .eyebrow{
      font-size: 10px;
    }
  }

  @media (prefers-reduced-motion: reduce){
    header, .hero, .reveal-on-scroll .reveal-item{ transition:none; }
    .letter{ transition:none; }
    .calendar-track, .calendar-viewport{ transition:none !important; }
  }







  .site-footer {
      background: linear-gradient(180deg, rgba(23,39,28,0.97) 0%, rgba(20,34,25,0.98) 100%);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      clip-path: polygon(
        0% 46px, 5% 22px, 10% 40px, 15% 10px, 21% 34px, 27% 4px, 33% 30px,
        39% 14px, 45% 36px, 51% 8px, 57% 28px, 63% 2px, 69% 32px, 75% 12px,
        81% 34px, 87% 6px, 93% 26px, 100% 16px, 100% 100%, 0% 100%
      );
      padding: 96px 0 20px 0;
      width: 100%;
      font-family: inherit;
      margin-top: 60px;
      color: rgba(255,255,255,0.85);
    }
    .site-footer::before{
      content:'';
      position:absolute;
      left:0; right:0;
      top:-1px;
      height:80px;
      background:linear-gradient(180deg, rgba(56,180,72,0.16) 0%, rgba(56,180,72,0) 100%);
      pointer-events:none;
    }
    .site-footer{ position:relative; }


    .footer-container {
      display: flex;
      justify-content: space-between;
      gap: 40px;
      max-width: 1600px;
      margin: 0 auto;
      padding: 0 40px;
      box-sizing: border-box;
    }

    .footer-brand {
      flex: 2;
      max-width: 400px;
      color: rgba(255,255,255,0.85);
    }

    .footer-logo-container {
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      
    }

    .footer-logo-img {
      height: 65px;
      width: auto;  
      object-fit: contain;
      filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.3)); 
      border-radius: 100px;
    }

    .footer-logo-img2 {
      height: 55px;
      width: auto;  
      object-fit: contain;
      filter: drop-shadow(0px 4px 10px rgba(0, 0, 0, 0.3)); 
    }

    @media (max-width: 768px) {
      .footer-logo-container {
        justify-content: center; 
      }
    }

    .footer-brand p {
      font-size: 14px;
      line-height: 1.6;
      opacity: 0.6;
      margin: 0;
    }


    .footer-nav, .footer-contact {
      flex: 1;
    }

    .footer-nav h4, .footer-contact h4 {
      font-family: var(--font-mono);
      font-size: 0.78rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      margin: 0 0 20px 0;
      color: rgba(255,255,255,0.95);
    }

    .footer-nav ul, .footer-contact ul {
      list-style: none;
      padding: 0;
      margin: 0;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .footer-nav a, .footer-contact a {
      color: rgba(255,255,255,0.75);
      text-decoration: none;
      font-size: 14px;
      opacity: 0.85;
      transition: opacity 0.2s ease, color 0.2s ease;
    }

    .footer-nav a:hover, .footer-contact a:hover {
      opacity: 1;
      color: #c9f2ce;
    }

    .footer-mail {
      word-break: break-all;
      font-weight: 500;
    }


    .footer-bottom {
      max-width: 100%;
      margin: 40px auto 0 auto;
      padding: 20px 40px 0 40px;
      border-top: 1px solid rgba(255, 255, 255, 0.18);
      text-align: center;
    }

    .footer-bottom p {
      font-size: 12px;
      opacity: 0.55;
      margin: 0;
      color: rgba(255,255,255,0.85);
    }


    @media (max-width: 768px) {
      .footer-container {
        flex-direction: column;
        gap: 32px;
        padding: 0 20px;
      }

      .footer-brand, .footer-nav, .footer-contact {
        max-width: 100%;
        text-align: center;
      }

      .footer-bottom {
        padding: 20px 20px 0 20px;
      }
    }

  /* ---------- Quiz ---------- */
  #quiz{
    margin-top:88px;
    scroll-margin-top:90px;
  }
  .quiz-card{
    padding:28px 24px;
    background:linear-gradient(135deg, rgba(238,245,239,0.96) 0%, rgba(251,252,249,0.96) 100%);
    border:1px solid rgba(31,42,32,0.08);
    border-radius:24px;
    box-shadow:0 18px 38px rgba(19,32,24,0.06);
  }
  .quiz-card h3{
    margin:0 0 12px;
    font-family:var(--font-display);
    font-size:30px;
    line-height:1.15;
    font-style:italic;
    font-weight:500;
    color:var(--ink);
  }
  .quiz-card h3.quiz-q{ font-size:24px; margin-bottom:18px; }
  .quiz-card > p{ margin:0 0 20px; line-height:1.7; color:var(--ink-soft); }
  .quiz-card button.button{ font:inherit; font-weight:700; cursor:pointer; }
  .quiz-card button.button-primary{ border:0; }
  .quiz-modes{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; }
  .quiz-mode, .quiz-answer{
    font:inherit;
    text-align:left;
    color:var(--ink);
    cursor:pointer;
    border:1px solid rgba(31,42,32,0.16);
    background:rgba(255,255,255,0.72);
    border-radius:16px;
    padding:16px;
    transition:border-color .18s ease, background .18s ease, transform .18s ease;
  }
  .quiz-mode strong{
    display:block;
    margin-bottom:6px;
    font-family:var(--font-display);
    font-size:20px;
    font-style:italic;
    font-weight:600;
  }
  .quiz-mode span{ font-size:14px; line-height:1.5; color:var(--ink-soft); }
  .quiz-mode:hover, .quiz-mode:focus-visible,
  .quiz-answer:not(:disabled):hover, .quiz-answer:not(:disabled):focus-visible{
    border-color:var(--green);
    background:#fff;
    transform:translateY(-1px);
  }
  .quiz-progress{
    height:6px;
    margin-bottom:16px;
    border-radius:6px;
    background:rgba(31,42,32,0.1);
    overflow:hidden;
  }
  .quiz-progress i{
    display:block;
    height:100%;
    background:linear-gradient(90deg, var(--green), var(--green-dark));
    transition:width .4s ease;
  }
  .quiz-answers{ display:grid; gap:10px; }
  .quiz-answer{ line-height:1.5; font-size:16px; }
  .quiz-answer:disabled{ cursor:default; color:var(--ink); opacity:.75; }
  .quiz-answer.correct{ opacity:1; border-color:var(--green); background:rgba(56,180,72,0.15); }
  .quiz-answer.wrong{ opacity:1; border-color:#c0443a; background:rgba(192,68,58,0.1); }
  .quiz-feedback{
    margin:18px 0 16px;
    padding:14px 16px;
    border:1px solid rgba(31,42,32,0.16);
    border-radius:16px;
    background:rgba(31,42,32,0.06);
    line-height:1.6;
    color:var(--ink);
  }
  .quiz-score{
    margin:0 0 6px;
    font-family:var(--font-display);
    font-size:72px;
    line-height:1;
    font-weight:500;
    color:var(--green-dark);
  }
  .quiz-score span{ font-size:32px; color:var(--ink-soft); }
  .quiz-actions{ display:flex; flex-wrap:wrap; gap:12px; }
  .quiz-cert{
    margin-top:20px;
    padding:18px;
    border:1px dashed rgba(31,42,32,0.28);
    border-radius:16px;
    background:rgba(255,255,255,0.6);
    animation:quiz-open .3s ease;
  }
  .quiz-cert[hidden]{ display:none; }
  @keyframes quiz-open{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:none; } }
  .quiz-cert label{ display:block; margin-bottom:10px; font-weight:600; }
  .quiz-cert-row{ display:flex; flex-wrap:wrap; gap:12px; }
  .quiz-cert input{
    flex:1 1 220px;
    min-height:48px;
    padding:0 16px;
    font:inherit;
    color:var(--ink);
    border:1px solid rgba(31,42,32,0.25);
    border-radius:999px;
    background:#fff;
  }
  .quiz-cert input:focus{ outline:2px solid var(--green); outline-offset:1px; }
  .quiz-note{ margin:12px 0 0; font-size:14px; color:var(--ink-soft); }
  .quiz-note.is-error{ color:#b3362c; font-weight:600; }
  @media (max-width:640px){
    .quiz-modes{ grid-template-columns:1fr; }
    .quiz-card{ padding:22px 18px; }
    .quiz-card h3{ font-size:26px; }
    .quiz-card h3.quiz-q{ font-size:21px; }
    .quiz-actions .button, .quiz-cert-row .button{ width:100%; }
  }
  @media (prefers-reduced-motion: reduce){
    .quiz-progress i, .quiz-mode, .quiz-answer{ transition:none; }
    .quiz-cert{ animation:none; }
  }


  /* ---------- Impressum / Datenschutz ---------- */
  .legal-logo{ display:block; width:100%; height:100%; object-fit:cover; }
  main.legal{ padding-top:56px; }
  .legal h1{
    margin:0 0 28px;
    font-family:var(--font-display);
    font-style:italic;
    font-weight:500;
    font-size:38px;
    letter-spacing:-0.01em;
    color:var(--ink);
  }
  .legal h2{
    margin:44px 0 14px;
    font-family:var(--font-display);
    font-style:italic;
    font-weight:500;
    font-size:26px;
    line-height:1.25;
    color:var(--ink);
  }
  .legal h3{ margin:28px 0 8px; font-size:17px; font-weight:700; color:var(--ink); }
  .legal p{ margin:0 0 16px; font-size:16px; line-height:1.75; color:var(--ink-soft); overflow-wrap:anywhere; }
  .legal a{
    color:var(--ink);
    font-weight:600;
    text-decoration:none;
    background:linear-gradient(180deg, transparent 64%, rgba(56,180,72,0.32) 64%);
  }
  @media (max-width:560px){ .legal h1{ font-size:32px; } .legal h2{ font-size:23px; } }

  /* ---------- 404 ---------- */
  main.not-found{
    display:grid;
    min-height:clamp(400px, 52vh, 600px);
    place-items:center;
    padding:56px 24px;
  }
  main.not-found > section::before{ display:none; }
  .not-found-card{
    width:min(100%, 640px);
    padding:clamp(24px, 4vw, 44px);
    border:1px solid rgba(31,42,32,0.1);
    border-radius:28px;
    background:rgba(255,255,255,0.72);
    box-shadow:0 24px 70px rgba(31,42,32,0.08);
    text-align:center;
  }
  .not-found-code{
    margin:0 0 6px;
    color:var(--green-dark);
    font-family:var(--font-display);
    font-size:clamp(76px, 16vw, 124px);
    font-weight:500;
    font-style:italic;
    line-height:0.9;
    letter-spacing:-0.07em;
  }
  .not-found-card .eyebrow{ margin:16px 0 8px; }
  .not-found-card h1{
    margin:0;
    font-family:var(--font-display);
    font-size:clamp(30px, 4vw, 44px);
    font-weight:500;
    font-style:italic;
    line-height:1.1;
    letter-spacing:-0.02em;
  }
  .not-found-copy{
    max-width:56ch;
    margin:14px auto 22px;
    color:var(--ink-soft);
    font-size:16px;
    line-height:1.7;
  }
  .not-found-card .hero-actions{ justify-content:center; }
  @media (max-width:560px){
    main.not-found{ min-height:450px; padding:48px 18px; }
    .not-found-card{ border-radius:20px; }
    .not-found-card .hero-actions{ align-items:stretch; flex-direction:column; }
  }


  /* Satzung: Download-Hinweis (Über uns) */
  .satzung-link{
    margin-top:8px;
    font-size:17px;
    line-height:1.8;
  }
  .insta-hint{
    margin-top:40px;
    font-size:17px;
    line-height:1.8;
  }
  .insta-hint p{
    margin:0 0 16px;
    color:var(--ink-soft);
  }
  /* Instagram-Button: grün, beim Hover läuft der Instagram-Verlauf von links ein */
  .insta-button{
    position:relative;
    isolation:isolate;
    overflow:hidden;
  }
  .insta-button::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    border-radius:inherit;
    background:linear-gradient(90deg, #833ab4 0%, #c13584 22%, #e1306c 40%, #fd1d1d 55%, #f56040 70%, #fcaf45 85%, #ffdc80 100%);
    clip-path:inset(0 100% 0 0);
    transition:clip-path .6s cubic-bezier(.65,0,.35,1);
  }
  .insta-button:hover::before,
  .insta-button:focus-visible::before{
    clip-path:inset(0 0 0 0);
  }
  @media (prefers-reduced-motion: reduce){
    .insta-button::before{ transition:none; }
  }
  .satzung-link p{
    margin:0 0 16px;
    color:var(--ink-soft);
  }

  /* Satzung: Bestätigung beim Antrag */
  .satzung-consent{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px 16px;
    background:rgba(255,255,255,0.65);
    border:1px solid rgba(31,42,32,0.14);
    border-radius:14px;
    transition:border-color .18s ease, background .18s ease;
  }
  .satzung-consent input{
    flex:none;
    width:22px;
    height:22px;
    margin:1px 0 0;
    accent-color:var(--green-dark);
    cursor:pointer;
  }
  .satzung-consent label{
    line-height:1.5;
    color:var(--ink);
    cursor:pointer;
  }
  .satzung-consent a{
    font-weight:600;
    color:var(--green-dark);
  }
  .satzung-consent.has-error{
    border-color:#c0392b;
    background:rgba(192,57,43,0.06);
    animation:satzung-shake .4s ease;
  }
  .satzung-error{
    margin:0;
    font-size:14px;
    line-height:1.5;
    font-weight:600;
    color:#c0392b;
  }
  .satzung-error[hidden]{ display:none; }
  @keyframes satzung-shake{
    0%,100%{ transform:translateX(0); }
    25%{ transform:translateX(-6px); }
    75%{ transform:translateX(6px); }
  }
  @media (prefers-reduced-motion: reduce){
    .satzung-consent.has-error{ animation:none; }
  }