:root{
  --green:#6BAF6E;
  --green-dark:#2B7A34;
  --green-soft:#EAF5E7;
  --bg:#FAFAFA;
  --text:#222;
  --muted:#667;
  --radius:20px;
  --shadow:0 14px 40px rgba(0,0,0,.08);
  --maxw:1200px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:16px/1.55 "Manrope",system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:var(--bg)}
a{color:inherit}
.container{width:min(var(--maxw),92vw);margin-inline:auto}
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.70);
  backdrop-filter: saturate(140%) blur(10px);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-weight:800}
.brand-dot{width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 30% 30%, var(--green), #8fd999)}
.mainnav ul{list-style:none;margin:0;padding:0;display:flex;gap:.6rem;flex-wrap:wrap}
.mainnav a{display:inline-block;padding:.5rem .85rem;border-radius:999px;text-decoration:none;border:1px solid transparent}
.mainnav a:hover{background:var(--green-soft);border-color:rgba(0,0,0,.06)}
.site-main{padding:clamp(16px,3vw,28px) 0}
.content{display:block}
.card{border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);border:1px solid rgba(0,0,0,.05)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1rem;border-radius:999px;border:1px solid rgba(0,0,0,.06);text-decoration:none;font-weight:700;background:#fff;transition:box-shadow .2s ease,transform .08s ease}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--green);color:#fff;border-color:transparent}
.section{scroll-margin-top:86px;padding:clamp(18px,3vw,30px) 0}
.section .wrap{width:min(var(--maxw),92vw);margin-inline:auto}
.section-title{margin:0 0 .6rem;font-size:clamp(24px,3.6vw,34px)}
.section-muted{color:var(--muted);margin-top:.25rem}
.site-footer{border-top:1px solid rgba(0,0,0,.06);background:var(--green-soft);margin-top:16px}
.footer-inner{display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:.9rem 0}
.muted{color:var(--muted)}
/* ===== Glass Header + Burger-Menü ===== */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.65);
  backdrop-filter: blur(12px);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  max-width:1200px; margin-inline:auto;
  padding:.6rem clamp(12px,3vw,24px);
}
.mainnav ul{display:flex;gap:1rem;list-style:none;margin:0;padding:0;}
.mainnav a{text-decoration:none;color:#2b2b2b;font-weight:600;}
.mainnav a:hover{color:#6BAF6E;}

/* Burger */
.menu-toggle{
  display:none; flex-direction:column; justify-content:center; gap:4px;
  width:34px; height:26px; background:none; border:none; cursor:pointer;
}
.menu-toggle span{
  display:block; width:100%; height:3px; background:#2b2b2b; border-radius:3px;
  transition:.3s ease;
}

/* Offcanvas für mobil */
@media(max-width:900px){
  .mainnav{
    position:fixed; inset:0 0 0 auto;
    width:70%; max-width:320px;
    background:rgba(255,255,255,.96);
    backdrop-filter: blur(12px);
    box-shadow:-4px 0 24px rgba(0,0,0,.12);
    padding:4rem 1.5rem;
    transform:translateX(100%);
    transition:transform .4s ease;
    display:flex; flex-direction:column; align-items:flex-start;
  }
  .mainnav.open{ transform:translateX(0); }
  .mainnav ul{flex-direction:column; gap:1rem;}
  .menu-toggle{display:flex;}
  .menu-toggle.active span:nth-child(1){transform:rotate(45deg) translateY(7px);}
  .menu-toggle.active span:nth-child(2){opacity:0;}
  .menu-toggle.active span:nth-child(3){transform:rotate(-45deg) translateY(-7px);}
}