:root{--dark:#04201a;--deep:#0a3329;--green:#4cb515;--green-d:#3d940f;--bg:#fafafa;--text:#2b2f2d;--wood:#c98a52}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text);font:400 17px/1.7 "DM Sans",system-ui,sans-serif}
h1,h2{font-family:Lexend,"DM Sans",sans-serif;font-weight:500;line-height:1.2;margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.wrap{max-width:960px;margin:0 auto;padding:0 24px}

header{background:var(--dark);color:#fff;position:sticky;top:0;z-index:5;border-bottom:1px solid rgba(255,255,255,.08)}
header .wrap{display:flex;align-items:center;gap:32px;min-height:66px;flex-wrap:wrap;max-width:1040px}
.logo{font:500 19px Lexend,sans-serif;text-decoration:none;margin-right:auto;display:flex;align-items:center;gap:12px}
.logo::before{content:"";width:22px;height:22px;border-radius:50%;border:2px solid var(--green);box-shadow:inset 0 0 0 5px var(--dark),inset 0 0 0 9px var(--green)}
nav{display:flex;gap:26px;font-size:15px}
nav a{text-decoration:none;padding:4px 0;border-bottom:2px solid transparent}
nav a:hover{border-color:rgba(255,255,255,.4)}
nav a[aria-current]{color:var(--green);border-color:var(--green)}
.btn{display:inline-block;background:var(--green);color:#fff;font-weight:700;font-size:15px;padding:13px 26px;border-radius:8px;text-decoration:none;border:2px solid var(--green);cursor:pointer;transition:background .2s}
.btn:hover{background:var(--green-d);border-color:var(--green-d)}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.5)}
.btn.ghost:hover{background:rgba(255,255,255,.1)}
header .btn{font-size:14px;padding:10px 20px}

.hero{background:radial-gradient(circle at 80% 40%,var(--deep),var(--dark) 65%);color:#fff;padding:88px 0 120px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;max-width:1040px}
.kicker{margin:0 0 16px;color:var(--wood);font-weight:700}
.hero h1{font-size:clamp(34px,5.4vw,56px);letter-spacing:-.01em}
.lead{font-size:19px;max-width:44ch;margin:24px 0 36px;color:#dbe6e1}
.actions{display:flex;gap:14px;flex-wrap:wrap;margin:0}
.rings{width:100%;max-width:400px;justify-self:center}

.notice{background:#fff;border-left:6px solid var(--wood);border-radius:0 16px 16px 0;box-shadow:0 14px 40px rgba(4,32,26,.15);padding:32px 36px;margin-top:-72px;position:relative}
.notice h2{font-size:22px;color:var(--dark);margin-bottom:12px}
.notice p{margin:0 0 .8em;max-width:68ch}.notice p:last-child{margin:0}

.about{padding:96px 0 56px}
.two{display:grid;grid-template-columns:1fr 1.5fr;gap:48px}
h2{color:var(--dark)}
.about h2,.themes h2,.report h2{font-size:clamp(26px,3.6vw,34px)}
.about p{margin:0 0 28px;max-width:60ch}
.facts{margin:0;border-top:1px solid #d9ddd9}
.facts div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid #d9ddd9}
.facts dt{font-weight:700;color:var(--dark)}.facts dd{margin:0}

.themes{padding:24px 0 72px}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:12px;padding:0;margin:28px 0 0}
.chips li{background:#e8f3df;color:var(--dark);border-radius:999px;padding:8px 20px;font-size:16px}
.chips li:nth-child(3n){background:#f5e6d6}
.chips li:nth-child(3n+2){background:#dfe9e5}

.report{padding:56px 0 24px;background:#fff;border-top:1px solid #ecefec}
.report h2{margin-bottom:32px}
details.bericht{border-top:1px solid #d9ddd9;border-bottom:1px solid #d9ddd9}
details.bericht summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;align-items:center;gap:16px;font:500 18px Lexend,sans-serif;color:var(--dark)}
details.bericht summary::-webkit-details-marker{display:none}
details.bericht summary::after{content:"+";margin-left:auto;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--green);color:#fff;font-size:24px;line-height:1}
details.bericht[open] summary::after{content:"–"}
.cols{columns:2 300px;column-gap:56px;font-size:16px;padding:8px 0 32px}
.cols p{margin:0 0 1.3em;break-inside:avoid-column}

.cta{background:radial-gradient(circle at 15% 100%,var(--deep),var(--dark) 60%);color:#fff;text-align:center;padding:88px 0;margin-top:56px}
.cta h2{color:#fff;font-size:clamp(26px,4vw,36px);margin-bottom:16px}
.cta p{margin:0 0 32px;color:#dbe6e1}

footer{background:var(--dark);text-align:center;padding:28px 24px;font-weight:700;font-size:14px;color:#a9bbb4}

.page{padding:72px 0 80px}
.page h1{font-size:clamp(28px,5vw,40px);color:var(--dark);margin-bottom:32px}
.page h2{font-size:20px;color:var(--dark);margin:36px 0 10px}
.page p{margin:0 0 1.1em;max-width:75ch}
.page ul{margin:0 0 1.1em;padding-left:1.2em}
.page a{color:var(--green-d);font-weight:500}
.band{height:110px;background:radial-gradient(circle at 85% 50%,var(--deep),var(--dark) 70%)}
.kontakt-card{background:var(--dark);color:#fff;border-radius:0 0 40px 0;padding:40px 44px;max-width:560px}
.kontakt-card h2{color:#fff;margin-top:0;font-size:20px}
.kontakt-card a{color:#fff;font-size:20px;font-weight:700;text-underline-offset:4px}
.kontakt-card p{margin:12px 0 0}

@media (max-width:760px){
 .hero{padding:56px 0 110px}.hero-grid,.two{grid-template-columns:1fr;gap:28px}
 .rings{max-width:260px;order:-1}.notice{padding:26px 22px}.facts div{grid-template-columns:1fr;gap:2px}
 header .wrap{gap:12px 20px;padding:10px 24px}
}
