:root{
  --bg-0:#000308;
  --bg-1:#01040d;
  --bg-2:#02061a;
  --panel:#04091f;
  --panel-2:#050d28;
  --border:#0e2a66;
  --blue:#1f7bff;
  --blue-2:#3b9dff;
  --blue-glow:#3aa0ff;
  --text:#dce6ff;
  --muted:#7d94c2;
  --heading:#ffffff;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--bg-0);color:var(--text);font-family:'Inter',sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
body{
  min-height:100vh;
  background:#061026;
}
body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 500px at 80% 10%, rgba(31,123,255,.12), transparent 70%),
    radial-gradient(700px 500px at -10% 40%, rgba(31,123,255,.08), transparent 70%),
    radial-gradient(900px 600px at 110% 80%, rgba(31,123,255,.07), transparent 70%);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1180px;margin:0 auto;padding:0 28px}

/* ---------- HEADER ---------- */
.site-header{
  position:absolute;top:42px;left:0;right:0;z-index:50;
  background:transparent;border-bottom:none;
  background-image:linear-gradient(180deg, rgba(2,6,16,.55), rgba(2,6,16,0));
}
.nav{display:flex;align-items:center;justify-content:space-between;padding:18px 0;gap:24px}
.brand{display:flex;flex-direction:column;line-height:1;text-decoration:none}
.brand .wm{
  font-family:'Oswald',sans-serif;font-weight:600;font-size:24px;letter-spacing:6px;color:#fff;
}
.brand .wm em{color:#3aa0ff;font-style:normal}
.brand .sub{
  font-family:'Dancing Script',cursive;font-size:14px;color:#7fb6ff;margin-top:2px;letter-spacing:.5px;
}
.brand-img{display:none}
.foot-about .brand-img{height:70px}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{font-size:13px;font-weight:600;letter-spacing:1.2px;color:#cdd9f5;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:#3aa0ff;text-shadow:0 0 10px rgba(58,160,255,.6)}
.nav-links .has-caret i{font-size:10px;margin-left:4px;opacity:.7}

.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:12px 22px;border-radius:8px;font-weight:700;font-size:13px;letter-spacing:1px;
  cursor:pointer;border:1px solid transparent;transition:transform .15s, box-shadow .2s, background .2s;
  font-family:inherit;text-decoration:none;
}
.btn-primary{background:#1f7bff;color:#fff}
.btn-primary:hover{background:#1466d6}
.btn-ghost{background:transparent;color:#cfe3ff;border:1px solid rgba(110,170,255,.35)}
.btn-ghost:hover{background:rgba(31,123,255,.08);border-color:rgba(110,170,255,.6)}

/* ---------- HERO (Cinema Billboard) ---------- */
.hero{
  position:relative;min-height:88vh;display:flex;align-items:flex-end;
  overflow:hidden;margin-top:-1px;isolation:isolate;
}
.hero::before{
  content:"";position:absolute;inset:-4%;z-index:0;
  background:url('assets/header.jpg') center/cover no-repeat;
  transform-origin:55% 45%;
  animation:kenburns 28s ease-in-out infinite alternate;
  will-change:transform;
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(2,6,20,.35) 0%, rgba(2,6,20,.55) 40%, rgba(6,16,38,.98) 92%, #061026 100%),
    linear-gradient(90deg, rgba(2,6,20,.85) 0%, rgba(2,6,20,.4) 50%, rgba(2,6,20,.2) 100%);
}
@keyframes kenburns{
  0%   {transform:scale(1.05) translate(0,0)}
  100% {transform:scale(1.18) translate(-2%,-1.5%)}
}

/* sanftes Einblenden des Hero-Inhalts beim Laden */
.hero .container > *{animation:fadeUp 1s cubic-bezier(.2,.7,.2,1) both}
.hero .eyebrow{animation-delay:.15s}
.hero h1{animation-delay:.35s}
.hero p.lead{animation-delay:.55s}
.hero-ctas{animation-delay:.75s}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none}}

@media (prefers-reduced-motion:reduce){
  .hero::before{animation:none;transform:scale(1.05)}
  .hero .container > *{animation:none}
}
.hero .container{padding-top:180px;padding-bottom:80px;position:relative;z-index:2;width:100%}
.hero-grid{display:block;max-width:680px}
.eyebrow{color:#3aa0ff;font-weight:700;letter-spacing:4px;font-size:12px}
.hero h1{
  font-family:'Oswald',sans-serif;font-weight:600;
  font-size:88px;line-height:.95;color:#fff;letter-spacing:1px;margin:18px 0 22px;
}
.hero p.lead{color:#cfe0ff;max-width:520px;margin-bottom:34px;font-size:17px;line-height:1.55}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero-ctas .btn{padding:14px 28px;font-size:14px}

/* legacy hero-art / logo / divider hidden in cinema mode */
.hero-art,.pulse-divider{display:none}

/* ---------- VALUES STRIP ---------- */
.values{
  margin:30px auto 60px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;
}
.value{display:flex;align-items:center;gap:18px;padding:28px 30px}
.v-icon{
  width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;
  color:#3aa0ff;font-size:24px;
}
.v-text h4{font-family:'Oswald',sans-serif;letter-spacing:2px;color:#fff;font-size:14px;margin-bottom:4px}
.v-text p{font-size:12.5px;color:#9bb1de;line-height:1.5}

/* ---------- ABOUT ---------- */
.about{
  position:relative;
  padding:90px 0;display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:center;
}
.about::before{
  content:"";position:absolute;left:-10%;top:50%;width:520px;height:520px;
  transform:translateY(-50%);border-radius:50%;pointer-events:none;z-index:-1;
  background:radial-gradient(circle, rgba(58,160,255,.18), transparent 65%);
  filter:blur(20px);
}
.video-card{
  position:relative;border-radius:6px;overflow:hidden;aspect-ratio:16/11;
  background-image:url('https://images.unsplash.com/photo-1437622368342-7a3d40e5d75e?auto=format&fit=crop&w=1400&q=85');
  background-size:cover;background-position:center;
  box-shadow:0 0 0 1px rgba(110,170,255,.25), 0 30px 80px rgba(2,8,30,.8), 0 0 60px rgba(31,123,255,.15);
}
.video-card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(2,6,20,.15) 0%, rgba(2,6,20,.55) 100%);
}
.video-card .play{position:absolute;inset:0;display:grid;place-items:center;z-index:2}
.video-card .play span{
  width:92px;height:92px;border-radius:50%;display:grid;place-items:center;
  background:rgba(15,40,100,.45);backdrop-filter:blur(8px);
  border:2px solid rgba(180,210,255,.8);color:#fff;font-size:28px;
  box-shadow:0 0 40px rgba(58,160,255,.6), inset 0 0 20px rgba(58,160,255,.2);
  transition:transform .3s ease, box-shadow .3s ease;
}
.video-card:hover .play span{transform:scale(1.08);box-shadow:0 0 60px rgba(58,160,255,.9), inset 0 0 30px rgba(58,160,255,.3)}
.about-text{position:relative;padding-left:22px}
.about-text::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg, transparent, #3aa0ff 30%, #3aa0ff 70%, transparent);
}
.about .eyebrow{font-size:12px;letter-spacing:5px}
.about h2{
  font-family:'Oswald',sans-serif;color:#fff;font-size:56px;letter-spacing:2px;
  margin:14px 0 22px;line-height:1;font-weight:600;
}
.about p.txt{color:#cfe0ff;margin-bottom:24px;max-width:520px;font-size:16px;line-height:1.65}
.checks{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:30px}
.checks li{display:flex;gap:12px;align-items:center;color:#cfe0ff;font-size:14.5px}
.checks i{color:#3aa0ff;text-shadow:0 0 12px #3aa0ff;font-size:16px}

/* ---------- SECTIONS ---------- */
.section{padding:90px 0;position:relative}
.section-head{text-align:center;margin-bottom:50px;position:relative}
.section-head::after{
  content:"";display:block;width:60px;height:2px;margin:22px auto 0;
  background:#3aa0ff;box-shadow:0 0 12px rgba(58,160,255,.8);
}
.section-head .eyebrow{display:block;margin-bottom:10px;letter-spacing:5px}
.section-head h2{font-family:'Oswald',sans-serif;color:#fff;font-size:54px;letter-spacing:2px;line-height:1.02;font-weight:600}
.section-head p{color:#a9bee6;max-width:680px;margin:14px auto 0;font-size:14.5px}

.work-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.work-card{
  border:1px solid rgba(58,120,220,.18);border-radius:6px;overflow:hidden;
  background:linear-gradient(180deg, rgba(8,20,46,.65), rgba(2,6,20,.4));
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;position:relative;
  box-shadow:0 12px 40px rgba(2,8,30,.5);
}
.work-card:hover{
  transform:translateY(-6px);
  box-shadow:0 30px 60px rgba(2,8,30,.85), 0 0 0 1px rgba(58,160,255,.55), 0 0 40px rgba(31,123,255,.2);
  border-color:rgba(58,160,255,.6);
}
.work-img{position:relative;aspect-ratio:4/3;background-size:cover;background-position:center;transition:transform .6s ease}
.work-card:hover .work-img{transform:scale(1.04)}
.work-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent 40%, rgba(6,16,38,.95))}
.work-icon{
  position:absolute;left:50%;bottom:-26px;transform:translateX(-50%);
  width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle, #1f5fc8, #0a2a78);
  border:2px solid rgba(160,200,255,.55);color:#dceaff;font-size:22px;z-index:2;
  box-shadow:0 0 24px rgba(58,160,255,.55);
}
.work-body{padding:46px 22px 28px;text-align:center}
.work-body h4{font-family:'Oswald',sans-serif;letter-spacing:2px;color:#fff;font-size:18px;margin-bottom:12px}
.work-body p{font-size:13px;color:#9bb1de;line-height:1.6}
.section-cta{text-align:center;margin-top:36px}

/* ---------- HELP SECTION ---------- */
.help-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center}
.help-card{padding:30px 18px;border:1px solid rgba(58,120,220,.15);border-radius:6px;
  background:linear-gradient(180deg, rgba(8,20,46,.5), rgba(2,6,20,.3));
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.help-card:hover{transform:translateY(-6px);border-color:rgba(58,160,255,.5);
  box-shadow:0 30px 60px rgba(2,8,30,.7), 0 0 40px rgba(31,123,255,.18);
}
.help-icon{
  width:86px;height:86px;border-radius:50%;margin:0 auto 20px;display:grid;place-items:center;
  background:radial-gradient(circle, rgba(31,123,255,.45), rgba(31,123,255,0) 70%);
  border:2px solid rgba(110,170,255,.5);color:#bcdcff;font-size:32px;
  box-shadow:0 0 36px rgba(58,160,255,.55), inset 0 0 18px rgba(58,160,255,.15);
}
.help-card h4{font-family:'Oswald',sans-serif;letter-spacing:2px;color:#fff;font-size:18px;margin-bottom:12px}
.help-card p{font-size:13px;color:#9bb1de;margin-bottom:14px;max-width:230px;margin-inline:auto;line-height:1.6}
.help-card .link{color:#3aa0ff;font-weight:700;letter-spacing:2px;font-size:12px;text-shadow:0 0 10px rgba(58,160,255,.5)}
.help-card .link i{margin-left:6px}

/* ---------- NEWSLETTER ---------- */
.newsletter{
  position:relative;border:1px solid rgba(58,120,220,.2);border-radius:6px;
  background:
    radial-gradient(600px 300px at 100% 0%, rgba(31,123,255,.18), transparent 60%),
    linear-gradient(180deg, rgba(8,20,46,.75), rgba(2,6,20,.5));
  display:grid;grid-template-columns:.9fr 1.4fr .7fr;gap:30px;align-items:center;padding:34px;
  box-shadow:0 24px 60px rgba(2,8,30,.7);
}
.nl-img{
  aspect-ratio:4/3;border-radius:4px;background-size:cover;background-position:center;
  background-image:url('https://images.unsplash.com/photo-1444212477490-ca407925329e?auto=format&fit=crop&w=900&q=80');
  box-shadow:0 0 0 1px rgba(110,170,255,.25), 0 20px 50px rgba(2,8,30,.6);
}
.nl-body .eyebrow{font-size:12px;letter-spacing:5px}
.nl-body h3{font-family:'Oswald',sans-serif;color:#fff;font-size:38px;letter-spacing:2px;margin:10px 0 14px;line-height:1.05}
.nl-body p{color:#a9bee6;font-size:14px;margin-bottom:18px;max-width:430px}
.nl-form{display:flex;gap:10px;max-width:430px}
.nl-form input{
  flex:1;background:rgba(4,10,30,.6);border:1px solid rgba(110,170,255,.3);border-radius:8px;
  padding:12px 14px;color:#cfe0ff;font-family:inherit;font-size:13px;outline:none;
}
.nl-form input::placeholder{color:#7a93c2}
.nl-form input:focus{border-color:#3aa0ff;box-shadow:0 0 0 3px rgba(58,160,255,.18)}
.nl-note{color:#7a93c2;font-size:11px;margin-top:10px}
.nl-paw{display:grid;place-items:center}
.nl-paw svg{width:170px;filter:drop-shadow(0 0 22px rgba(58,160,255,.7))}

/* ---------- FOOTER ---------- */
footer{margin-top:80px;padding:60px 0 24px;border-top:1px solid rgba(58,120,220,.2);background:linear-gradient(180deg, rgba(2,6,20,0), rgba(2,6,20,.6))}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.3fr;gap:30px}
.foot-about p{color:#9bb1de;font-size:13px;margin:14px 0 18px}
.socials{display:flex;gap:10px}
.socials a{
  width:34px;height:34px;display:grid;place-items:center;border-radius:8px;
  background:rgba(31,123,255,.1);border:1px solid rgba(110,170,255,.25);color:#9ec8ff;font-size:14px;
  transition:.2s;
}
.socials a:hover{background:rgba(31,123,255,.2);box-shadow:0 0 16px rgba(58,160,255,.4)}
.foot-col h5{color:#3aa0ff;font-family:'Oswald',sans-serif;letter-spacing:2px;font-size:14px;margin-bottom:14px;text-shadow:0 0 10px rgba(58,160,255,.4)}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.foot-col a{color:#bccbed;font-size:13px}
.foot-col a:hover{color:#3aa0ff}
.foot-msg p{color:#bccbed;font-size:13px;margin-top:14px;line-height:1.5}
.foot-art{margin-top:14px;display:grid;place-items:end}
.foot-art svg{width:170px;filter:drop-shadow(0 0 14px rgba(58,160,255,.5))}
.foot-bottom{
  margin-top:40px;padding-top:18px;border-top:1px solid rgba(58,120,220,.15);
  display:flex;justify-content:space-between;color:#7a93c2;font-size:12px;
}

/* ---------- EMERGENCY BANNER ---------- */
.emergency{
  position:absolute;top:0;left:0;right:0;z-index:51;
  background:linear-gradient(90deg, rgba(140,20,20,.85), rgba(20,40,80,.85));
  backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(220,80,80,.25);
  padding:9px 0;font-size:13px;color:#ffd9d9;
}
.emergency .container{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center}
.emergency .pill{
  background:#dc2626;color:#fff;font-weight:700;letter-spacing:1px;font-size:11px;
  padding:3px 10px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;
}
.emergency a{color:#fff;text-decoration:underline;font-weight:600}

/* ---------- IMPACT STATS ---------- */
.stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 auto;
  padding:60px 0;
}
.stat{text-align:center;padding:0 24px;position:relative}
.stat .num{
  font-family:'Oswald',sans-serif;font-size:84px;color:#fff;letter-spacing:1px;line-height:1;font-weight:600;
  display:inline-block;
}
.stat .num small{font-size:36px;color:#3aa0ff;margin-left:2px;font-weight:500;vertical-align:top;line-height:1.4}
.stat .accent{
  display:block;width:36px;height:2px;background:#3aa0ff;margin:18px auto 14px;
}
.stat .label{color:#9bb1de;font-size:12px;letter-spacing:2.5px;text-transform:uppercase;font-weight:500}

/* ---------- CAMPAIGNS ---------- */
.campaigns{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.camp-card{
  border:1px solid rgba(58,120,220,.18);border-radius:6px;overflow:hidden;
  background:linear-gradient(180deg, rgba(8,20,46,.65), rgba(2,6,20,.4));
  display:flex;flex-direction:column;
  box-shadow:0 12px 40px rgba(2,8,30,.5);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.camp-card:hover{transform:translateY(-6px);border-color:rgba(58,160,255,.55);
  box-shadow:0 30px 60px rgba(2,8,30,.85), 0 0 40px rgba(31,123,255,.2);
}
.camp-img{aspect-ratio:16/10;background-size:cover;background-position:center;position:relative}
.camp-tag{
  position:absolute;top:12px;left:12px;background:rgba(220,38,38,.9);color:#fff;
  font-size:11px;font-weight:700;letter-spacing:1px;padding:5px 10px;border-radius:4px;text-transform:uppercase;
}
.camp-tag.green{background:rgba(34,160,90,.9)}
.camp-tag.blue{background:rgba(31,123,255,.9)}
.camp-body{padding:20px;display:flex;flex-direction:column;gap:12px;flex:1}
.camp-body h4{font-family:'Oswald',sans-serif;color:#fff;letter-spacing:2px;font-size:20px}
.camp-body p{font-size:13px;color:#9bb1de;line-height:1.55;flex:1}
.progress-wrap{margin-top:8px}
.progress-row{display:flex;justify-content:space-between;font-size:12px;color:#cfe0ff;margin-bottom:6px}
.progress-row b{color:#3aa0ff}
.progress{height:8px;background:rgba(31,123,255,.15);border-radius:999px;overflow:hidden;position:relative}
.progress span{display:block;height:100%;background:linear-gradient(90deg,#1f7bff,#3aa0ff);box-shadow:0 0 12px rgba(58,160,255,.6);border-radius:999px}
.camp-meta{display:flex;justify-content:space-between;font-size:12px;color:#7d94c2;margin-top:4px}

/* ---------- DONATE BLOCK ---------- */
.donate{
  position:relative;border:1px solid rgba(58,120,220,.2);border-radius:6px;
  background:
    radial-gradient(700px 360px at 85% -10%, rgba(31,123,255,.22), transparent 60%),
    radial-gradient(600px 300px at -10% 110%, rgba(31,123,255,.15), transparent 60%),
    linear-gradient(180deg, rgba(8,20,46,.8), rgba(2,6,20,.7));
  padding:50px;display:grid;grid-template-columns:1fr 1.1fr;gap:50px;align-items:center;
  box-shadow:0 30px 80px rgba(2,8,30,.7);
}
.donate h3{font-family:'Oswald',sans-serif;color:#fff;font-size:42px;letter-spacing:2px;margin-bottom:14px;line-height:1.05}
.donate p{color:#a9bee6;font-size:14px;margin-bottom:18px}
.donate-impact{display:flex;flex-direction:column;gap:10px}
.donate-impact div{
  display:flex;align-items:center;gap:12px;font-size:13px;color:#cfe0ff;
  padding:10px 14px;background:rgba(31,123,255,.08);border:1px solid rgba(58,120,220,.2);border-radius:8px;
}
.donate-impact i{color:#3aa0ff;font-size:16px}
.donate-form .amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.amount-btn{
  background:rgba(4,10,30,.6);border:1px solid rgba(110,170,255,.3);color:#cfe0ff;
  padding:14px;border-radius:10px;font-family:'Oswald',sans-serif;font-size:18px;letter-spacing:1px;
  cursor:pointer;transition:.2s;
}
.amount-btn:hover{border-color:#3aa0ff;color:#fff}
.amount-btn.active{background:linear-gradient(180deg,#2b8bff,#1466d6);border-color:#3aa0ff;color:#fff;box-shadow:0 0 20px rgba(58,160,255,.5)}
.frequency{display:flex;gap:10px;margin-bottom:14px;background:rgba(4,10,30,.6);padding:5px;border-radius:10px;border:1px solid rgba(110,170,255,.2)}
.frequency button{
  flex:1;background:transparent;border:none;color:#9bb1de;padding:10px;border-radius:7px;
  font-weight:600;letter-spacing:1px;font-size:12px;cursor:pointer;transition:.2s;font-family:inherit;
}
.frequency button.active{background:rgba(31,123,255,.25);color:#fff}
.donate-form .custom{
  display:flex;align-items:center;gap:10px;margin-bottom:16px;
  background:rgba(4,10,30,.6);border:1px solid rgba(110,170,255,.3);border-radius:10px;padding:0 14px;
}
.donate-form .custom span{color:#3aa0ff;font-size:18px;font-weight:700}
.donate-form .custom input{flex:1;background:transparent;border:none;color:#fff;padding:14px 0;font-size:16px;outline:none;font-family:inherit}
.donate-form .btn{width:100%;justify-content:center;padding:16px}

/* ---------- TESTIMONIALS ---------- */
.testis{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.testi{
  border:1px solid rgba(58,120,220,.18);border-radius:6px;
  background:linear-gradient(180deg, rgba(8,20,46,.65), rgba(2,6,20,.4));
  padding:34px 28px;display:flex;flex-direction:column;gap:18px;position:relative;
  box-shadow:0 12px 40px rgba(2,8,30,.5);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.testi:hover{transform:translateY(-4px);border-color:rgba(58,160,255,.45);
  box-shadow:0 26px 50px rgba(2,8,30,.75), 0 0 30px rgba(31,123,255,.15);
}
.testi .quote-mark{position:absolute;top:18px;right:22px;font-size:64px;color:rgba(58,160,255,.3);font-family:Georgia,serif;line-height:1;text-shadow:0 0 20px rgba(58,160,255,.3)}
.testi p{color:#cfe0ff;font-size:14.5px;line-height:1.7;font-style:italic}
.testi-author{display:flex;align-items:center;gap:12px;margin-top:auto}
.avatar{width:46px;height:46px;border-radius:50%;background-size:cover;background-position:center;border:2px solid rgba(58,160,255,.4)}
.testi-author b{color:#fff;font-size:14px;display:block}
.testi-author small{color:#7d94c2;font-size:12px}

/* ---------- TEAM ---------- */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.team-card{
  border:1px solid rgba(58,120,220,.18);border-radius:6px;overflow:hidden;
  background:linear-gradient(180deg, rgba(8,20,46,.65), rgba(2,6,20,.4));text-align:center;
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  box-shadow:0 12px 40px rgba(2,8,30,.5);
}
.team-card:hover{transform:translateY(-6px);border-color:rgba(58,160,255,.55);
  box-shadow:0 30px 60px rgba(2,8,30,.85), 0 0 40px rgba(31,123,255,.2);
}
.team-img{aspect-ratio:1/1;background-size:cover;background-position:center;position:relative;transition:transform .6s ease}
.team-card:hover .team-img{transform:scale(1.04)}
.team-img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent 55%, rgba(6,16,38,.95))}
.team-body{padding:22px 18px}
.team-body h5{font-family:'Oswald',sans-serif;color:#fff;letter-spacing:2px;font-size:18px;margin-bottom:6px}
.team-body .role{color:#3aa0ff;font-size:12px;letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;text-shadow:0 0 10px rgba(58,160,255,.4)}
.team-body .bio{color:#9bb1de;font-size:13px;line-height:1.6}

/* ---------- TRUST BADGES ---------- */
.trust{
  border:1px solid rgba(58,120,220,.2);border-radius:6px;
  background:linear-gradient(180deg, rgba(8,20,46,.65), rgba(2,6,20,.4));
  padding:38px;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;
  box-shadow:0 12px 40px rgba(2,8,30,.5);
}
.trust-item{display:flex;gap:14px;align-items:flex-start}
.trust-icon{
  width:50px;height:50px;flex-shrink:0;border-radius:10px;display:grid;place-items:center;
  background:radial-gradient(circle, rgba(31,123,255,.25), rgba(31,123,255,0) 70%);
  border:1px solid rgba(110,170,255,.3);color:#3aa0ff;font-size:20px;
}
.trust-item h6{font-family:'Oswald',sans-serif;color:#fff;font-size:14px;letter-spacing:1px;margin-bottom:4px}
.trust-item p{color:#9bb1de;font-size:12px;line-height:1.5}

/* ---------- FAQ ---------- */
.faq-grid{max-width:820px;margin:0 auto}
.faq{
  border:1px solid rgba(58,120,220,.18);border-radius:6px;
  background:linear-gradient(180deg, rgba(8,20,46,.6), rgba(2,6,20,.4));
  margin-bottom:12px;overflow:hidden;
  transition:border-color .25s ease, box-shadow .25s ease;
}
.faq:hover{border-color:rgba(58,160,255,.4)}
.faq summary{
  list-style:none;cursor:pointer;padding:22px 26px;display:flex;justify-content:space-between;align-items:center;gap:14px;
  color:#fff;font-family:'Oswald',sans-serif;letter-spacing:1.5px;font-size:16px;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:#3aa0ff;font-size:24px;font-weight:300;transition:transform .2s}
.faq[open] summary::after{content:"−"}
.faq[open]{border-color:rgba(58,160,255,.5);box-shadow:0 0 18px rgba(58,160,255,.15)}
.faq .faq-body{padding:0 22px 20px;color:#a9bee6;font-size:13.5px;line-height:1.65}

/* ---------- PARTNERS ---------- */
.partners{border-top:1px solid rgba(58,120,220,.18);border-bottom:1px solid rgba(58,120,220,.18);padding:28px 0;margin:40px 0;text-align:center}
.partners .label{color:#7d94c2;font-size:12px;letter-spacing:2px;margin-bottom:18px;text-transform:uppercase}
.partner-row{display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap;gap:30px;opacity:.7}
.partner-row span{font-family:'Oswald',sans-serif;color:#9bb1de;letter-spacing:2px;font-size:18px;display:inline-flex;align-items:center;gap:8px}
.partner-row i{color:#3aa0ff}

/* ---------- CINEMATIC FULL-BLEED ---------- */
.cinema{
  position:relative;min-height:780px;display:grid;align-items:center;
  margin:0;overflow:hidden;isolation:isolate;
  background-color:#061026;
  background-image:
    linear-gradient(180deg, rgba(2,6,20,.2) 0%, rgba(2,6,20,.7) 70%, rgba(6,16,38,1) 100%),
    url('https://images.unsplash.com/photo-1568430462989-44163eb1752f?auto=format&fit=crop&w=1800&q=85');
  background-size:cover;background-position:center;background-attachment:fixed;
}
.cinema::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,
    #061026 0%,
    rgba(6,16,38,.92) 14%,
    rgba(6,16,38,.5) 35%,
    rgba(6,16,38,.6) 70%,
    rgba(6,16,38,.95) 90%,
    #061026 100%);
}
.cinema .container{padding:160px 28px 150px;max-width:1180px;position:relative;z-index:1}
.cinema .eyebrow{margin-bottom:18px;color:#9ec8ff;letter-spacing:6px;font-size:13px}
.cinema h2{
  font-family:'Oswald',sans-serif;color:#fff;font-size:96px;letter-spacing:2px;line-height:.96;
  max-width:980px;font-weight:600;
}
.cinema h2 em{font-family:'Dancing Script',cursive;font-style:normal;color:#3aa0ff;font-weight:700;text-shadow:0 0 30px rgba(58,160,255,.4)}
.cinema p{color:#cfe0ff;font-size:19px;max-width:640px;margin:32px 0 40px;line-height:1.65}
.cinema .quote-line{
  display:block;width:80px;height:2px;background:#3aa0ff;margin-bottom:28px;
  box-shadow:0 0 14px rgba(58,160,255,.8);
}

/* ---------- SECTION DIVIDER (subtle separator with number) ---------- */
.divider-num{
  text-align:center;padding:30px 0;color:#7d94c2;font-size:11px;letter-spacing:4px;
}
.divider-num::before, .divider-num::after{
  content:"";display:inline-block;width:60px;height:1px;background:rgba(58,120,220,.3);vertical-align:middle;margin:0 16px;
}

/* ============================================================
   PAGE-SPECIFIC STYLES (Subseiten)
   ============================================================ */

/* Page hero (kleinerer Header für Unterseiten) */
.page-hero{
  padding:80px 0 60px;text-align:center;
  background:radial-gradient(800px 400px at 50% -20%, rgba(31,123,255,.18), transparent 70%);
  border-bottom:1px solid rgba(58,120,220,.15);
}
.page-hero .breadcrumb{
  display:flex;justify-content:center;gap:8px;color:#7d94c2;font-size:12px;letter-spacing:1.5px;margin-bottom:16px;
}
.page-hero .breadcrumb a{color:#3aa0ff}
.page-hero h1{
  font-family:'Oswald',sans-serif;font-size:54px;color:#fff;letter-spacing:1.5px;line-height:1.05;
  text-shadow:0 0 22px rgba(58,160,255,.4);
}
.page-hero p{color:#a9bee6;max-width:680px;margin:18px auto 0;font-size:15px}

/* Prose / Text-Inhalte (Impressum, Datenschutz, AGB) */
.prose{max-width:820px;margin:0 auto;color:#cfe0ff;font-size:14.5px;line-height:1.75}
.prose h2{font-family:'Oswald',sans-serif;color:#fff;font-size:24px;letter-spacing:1px;margin:32px 0 12px;border-bottom:1px solid rgba(58,120,220,.25);padding-bottom:8px}
.prose h3{font-family:'Oswald',sans-serif;color:#3aa0ff;font-size:17px;letter-spacing:.5px;margin:22px 0 8px}
.prose p{margin-bottom:14px;color:#bccbed}
.prose ul{margin:8px 0 16px 24px;color:#bccbed}
.prose ul li{margin-bottom:6px}
.prose strong{color:#fff}
.prose a{color:#3aa0ff;text-decoration:underline}

/* Kontakt Form */
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:32px;align-items:start}
.contact-info{
  border:1px solid rgba(58,120,220,.3);border-radius:14px;padding:28px;
  background:linear-gradient(180deg, rgba(4,10,30,.65), rgba(2,6,20,.6));
}
.contact-info h3{font-family:'Oswald',sans-serif;color:#fff;letter-spacing:1px;font-size:20px;margin-bottom:18px}
.contact-info ul{list-style:none}
.contact-info li{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid rgba(58,120,220,.15);font-size:14px;color:#cfe0ff}
.contact-info li:last-child{border-bottom:none}
.contact-info i{color:#3aa0ff;font-size:18px;width:24px;text-align:center;margin-top:2px}
.contact-info b{color:#fff;display:block;margin-bottom:2px}
.contact-form{
  border:1px solid rgba(58,120,220,.3);border-radius:14px;padding:28px;
  background:linear-gradient(180deg, rgba(4,10,30,.65), rgba(2,6,20,.6));
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:12px;color:#9bb1de;letter-spacing:1px;font-weight:600;text-transform:uppercase}
.field input, .field textarea, .field select{
  background:rgba(4,10,30,.7);border:1px solid rgba(110,170,255,.25);border-radius:8px;
  padding:12px 14px;color:#fff;font-family:inherit;font-size:14px;outline:none;transition:.2s;
}
.field input:focus, .field textarea:focus, .field select:focus{border-color:#3aa0ff;box-shadow:0 0 0 3px rgba(58,160,255,.15)}
.field textarea{min-height:140px;resize:vertical}
.field-check{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:#9bb1de;margin:14px 0}
.field-check input{margin-top:3px;accent-color:#3aa0ff}

/* Patenschaften / Adoption-Karten */
.pet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pet-card{
  border:1px solid rgba(58,120,220,.3);border-radius:14px;overflow:hidden;
  background:linear-gradient(180deg, rgba(4,10,30,.6), rgba(2,6,20,.55));
  display:flex;flex-direction:column;transition:.25s;
}
.pet-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(2,8,30,.6),0 0 0 1px rgba(58,160,255,.4)}
.pet-img{aspect-ratio:4/3;background-size:cover;background-position:center;position:relative}
.pet-status{position:absolute;top:12px;right:12px;background:rgba(31,123,255,.92);color:#fff;font-size:11px;font-weight:700;letter-spacing:1px;padding:5px 10px;border-radius:4px;text-transform:uppercase}
.pet-status.urgent{background:rgba(220,38,38,.92)}
.pet-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.pet-body h4{font-family:'Oswald',sans-serif;color:#fff;letter-spacing:1px;font-size:20px}
.pet-meta{display:flex;flex-wrap:wrap;gap:10px;font-size:12px;color:#9bb1de}
.pet-meta span{background:rgba(31,123,255,.08);border:1px solid rgba(58,120,220,.2);padding:4px 10px;border-radius:999px}
.pet-body p{font-size:13.5px;color:#a9bee6;line-height:1.55;flex:1}
.pet-price{display:flex;justify-content:space-between;align-items:center;margin-top:8px;padding-top:12px;border-top:1px solid rgba(58,120,220,.18)}
.pet-price b{color:#3aa0ff;font-family:'Oswald',sans-serif;font-size:22px}
.pet-price small{color:#7d94c2;font-size:11px;letter-spacing:1px}

/* Blog */
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.blog-card{
  border:1px solid rgba(58,120,220,.3);border-radius:14px;overflow:hidden;
  background:linear-gradient(180deg, rgba(4,10,30,.6), rgba(2,6,20,.55));
  display:flex;flex-direction:column;transition:.25s;
}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 0 0 1px rgba(58,160,255,.4)}
.blog-img{aspect-ratio:16/10;background-size:cover;background-position:center}
.blog-body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.blog-meta{display:flex;justify-content:space-between;font-size:11px;color:#7d94c2;letter-spacing:1px;text-transform:uppercase}
.blog-meta .cat{color:#3aa0ff}
.blog-body h4{font-family:'Oswald',sans-serif;color:#fff;letter-spacing:1px;font-size:18px;line-height:1.3}
.blog-body p{color:#a9bee6;font-size:13.5px;line-height:1.6;flex:1}
.blog-body .more{color:#3aa0ff;font-size:12px;font-weight:700;letter-spacing:1.5px;margin-top:6px}
.blog-body .more i{margin-left:6px}

/* Hilfe-Grid (Helfen Seite – große Cards) */
.help-large{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.help-large .card{
  border:1px solid rgba(58,120,220,.3);border-radius:14px;padding:30px;
  background:linear-gradient(180deg, rgba(4,10,30,.6), rgba(2,6,20,.55));
  display:flex;gap:22px;align-items:flex-start;
}
.help-large .card .icon{
  width:64px;height:64px;border-radius:14px;flex-shrink:0;display:grid;place-items:center;
  background:radial-gradient(circle, rgba(31,123,255,.4), rgba(31,123,255,0) 70%);
  border:1px solid rgba(110,170,255,.4);color:#bcdcff;font-size:26px;
  box-shadow:0 0 24px rgba(58,160,255,.4);
}
.help-large h4{font-family:'Oswald',sans-serif;color:#fff;letter-spacing:1px;font-size:20px;margin-bottom:8px}
.help-large p{color:#a9bee6;font-size:13.5px;line-height:1.6;margin-bottom:14px}
.help-large .link{color:#3aa0ff;font-weight:700;letter-spacing:1.5px;font-size:12px}

/* Notfall-Liste */
.alert-list{display:flex;flex-direction:column;gap:16px}
.alert{
  display:flex;gap:18px;align-items:center;padding:20px 22px;
  border:1px solid rgba(220,80,80,.3);border-left:4px solid #dc2626;border-radius:10px;
  background:linear-gradient(90deg,rgba(220,38,38,.08),rgba(4,10,30,.6));
}
.alert .alert-icon{
  width:50px;height:50px;border-radius:50%;background:rgba(220,38,38,.18);
  display:grid;place-items:center;color:#ff8080;font-size:20px;flex-shrink:0;
}
.alert .alert-text{flex:1}
.alert h4{color:#fff;font-family:'Oswald',sans-serif;letter-spacing:1px;font-size:16px;margin-bottom:4px}
.alert p{color:#cfe0ff;font-size:13px}
.alert small{color:#9bb1de;font-size:11.5px;display:block;margin-top:4px}

/* RESPONSIVE */
@media (max-width:980px){
  .hero-grid,.about,.newsletter,.foot-grid,.contact-grid{grid-template-columns:1fr}
  .values,.work-grid,.help-grid,.help-large{grid-template-columns:repeat(2,1fr)}
  .value+.value{border-left:none}
  .hero h1{font-size:40px}
  .nav-links{display:none}
  .hero-art{min-height:380px}
  .stats,.campaigns,.testis,.team-grid,.trust,.donate,.pet-grid,.blog-grid{grid-template-columns:1fr 1fr}
  .donate{grid-template-columns:1fr}
  .stat{border-right:none;border-bottom:1px solid rgba(58,120,220,.18);padding-bottom:14px}
  .stat:last-child{border-bottom:none}
  .donate-form .amounts{grid-template-columns:repeat(2,1fr)}
  .page-hero h1{font-size:38px}
  .form-row{grid-template-columns:1fr}
  .cinema h2{font-size:46px}
  .stat .num{font-size:46px}
  .hero h1{font-size:54px}
  .hero{min-height:70vh}
  .section-head h2{font-size:32px}
}
@media (max-width:560px){
  .values,.work-grid,.help-grid,.help-large{grid-template-columns:1fr}
  .hero h1{font-size:32px}
  .about h2,.section-head h2,.nl-body h3{font-size:26px}
  .stats,.campaigns,.testis,.team-grid,.trust,.pet-grid,.blog-grid{grid-template-columns:1fr}
  .page-hero{padding:50px 0 40px}
  .page-hero h1{font-size:30px}
  .help-large .card{flex-direction:column}
}

/* =====================================================================
   CINEMATIC RESTRUCTURE — full-bleed alternating Bühnen, Stages, Tiles
   ===================================================================== */

/* SPLIT — About */
.split{
  position:relative;display:grid;grid-template-columns:1fr 1.05fr;align-items:stretch;
  min-height:640px;
}
.split-img{
  position:relative;background-size:cover;background-position:center;
}
.split-img::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, transparent 60%, #061026 100%);
}
.split-play{
  position:absolute;inset:0;margin:auto;width:96px;height:96px;border-radius:50%;
  background:rgba(15,40,100,.35);backdrop-filter:blur(8px);
  border:2px solid rgba(180,210,255,.85);color:#fff;font-size:28px;cursor:pointer;
  box-shadow:0 0 40px rgba(58,160,255,.6);transition:transform .3s ease, box-shadow .3s ease;
  z-index:2;
}
.split-play:hover{transform:scale(1.08);box-shadow:0 0 60px rgba(58,160,255,.95)}
.split-text{
  display:flex;flex-direction:column;justify-content:center;
  padding:100px 7vw 100px 80px;position:relative;
}
.split-text .eyebrow{margin-bottom:18px;letter-spacing:5px}
.split-text h2{
  font-family:'Oswald',sans-serif;color:#fff;font-size:78px;letter-spacing:2px;
  line-height:.96;font-weight:600;margin-bottom:28px;
}
.split-text p{color:#cfe0ff;font-size:17px;line-height:1.65;max-width:520px;margin-bottom:28px}
.split-text .checks{margin-bottom:34px}
.split-text .btn{align-self:flex-start}

/* BÜHNEN — Cinematic Work Stages */
.bühnen{position:relative;padding:100px 0 0}
.bühnen-head{margin-bottom:60px;text-align:center}
.bühnen-head .eyebrow{display:block;margin-bottom:12px;letter-spacing:5px}
.bühnen-head h2{
  font-family:'Oswald',sans-serif;color:#fff;font-size:60px;letter-spacing:2px;
  line-height:1.02;font-weight:600;
}
.bühne{
  position:relative;min-height:680px;display:flex;align-items:center;
  background-size:cover;background-position:center;background-attachment:fixed;
  overflow:hidden;isolation:isolate;
}
.bühne-overlay{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(90deg, rgba(2,6,20,.94) 0%, rgba(2,6,20,.78) 35%, rgba(2,6,20,.25) 65%, transparent 100%);
}
.bühne-right .bühne-overlay{
  background:linear-gradient(270deg, rgba(2,6,20,.94) 0%, rgba(2,6,20,.78) 35%, rgba(2,6,20,.25) 65%, transparent 100%);
}
.bühne-content{position:relative;z-index:1;max-width:600px;padding:120px 28px}
.bühne-right .bühne-content{margin-left:auto;text-align:right}
.bühne-num{
  display:inline-block;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:6px;
  color:#3aa0ff;font-weight:600;margin-bottom:22px;text-shadow:0 0 12px rgba(58,160,255,.5);
}
.bühne-content .eyebrow{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;letter-spacing:5px}
.bühne-content .eyebrow i{color:#3aa0ff;text-shadow:0 0 12px rgba(58,160,255,.7)}
.bühne-right .eyebrow{flex-direction:row-reverse}
.bühne-content h3{
  font-family:'Oswald',sans-serif;color:#fff;font-size:72px;letter-spacing:2px;
  line-height:.96;font-weight:600;margin-bottom:28px;
}
.bühne-content p{color:#dce6ff;font-size:17px;line-height:1.65;margin-bottom:34px;max-width:540px}
.bühne-right .bühne-content p{margin-left:auto}
.bühne-link{
  color:#fff;font-family:'Oswald',sans-serif;letter-spacing:3px;font-size:13px;font-weight:600;
  display:inline-flex;align-items:center;gap:14px;
  border-bottom:2px solid rgba(58,160,255,.6);padding-bottom:8px;
  transition:gap .25s ease, color .25s ease, border-color .25s ease;
}
.bühne-link:hover{gap:22px;color:#3aa0ff;border-bottom-color:#3aa0ff}
.bühne-link i{color:#3aa0ff;text-shadow:0 0 10px rgba(58,160,255,.7)}

/* HELP TILES — 4-image cinematic hover grid */
.help-tiles{padding:120px 0 100px}
.help-tiles-head{text-align:center;margin-bottom:60px}
.help-tiles-head .eyebrow{display:block;margin-bottom:12px;letter-spacing:5px}
.help-tiles-head h2{font-family:'Oswald',sans-serif;color:#fff;font-size:60px;letter-spacing:2px;line-height:1.02;font-weight:600}
.help-tiles-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.help-tile{
  position:relative;min-height:480px;background-size:cover;background-position:center;
  overflow:hidden;color:#fff;display:flex;align-items:flex-end;
  transition:flex .5s ease;
}
.help-tile-overlay{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg, rgba(2,6,20,.4) 0%, rgba(2,6,20,.85) 60%, rgba(2,6,20,.95) 100%);
  transition:background .35s ease;
}
.help-tile:hover .help-tile-overlay{
  background:linear-gradient(180deg, rgba(2,6,20,.2) 0%, rgba(31,123,255,.55) 80%, rgba(31,80,200,.92) 100%);
}
.help-tile-body{
  position:relative;z-index:1;padding:36px 28px;width:100%;
  transform:translateY(60px);transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.help-tile:hover .help-tile-body{transform:translateY(0)}
.help-tile-icon{font-size:34px;color:#3aa0ff;margin-bottom:18px;text-shadow:0 0 18px rgba(58,160,255,.8);transition:color .35s ease}
.help-tile:hover .help-tile-icon{color:#fff}
.help-tile-body h4{font-family:'Oswald',sans-serif;color:#fff;font-size:26px;letter-spacing:2.5px;margin-bottom:12px}
.help-tile-body p{color:#cfe0ff;font-size:14px;line-height:1.6;margin-bottom:18px;opacity:0;transition:opacity .35s ease .1s}
.help-tile:hover .help-tile-body p{opacity:1}
.help-tile-cta{
  display:inline-flex;align-items:center;gap:10px;color:#3aa0ff;
  font-family:'Oswald',sans-serif;letter-spacing:2.5px;font-size:12px;font-weight:600;
  opacity:0;transform:translateY(10px);transition:opacity .35s ease .15s, transform .35s ease .15s;
}
.help-tile:hover .help-tile-cta{opacity:1;transform:none;color:#fff}

/* DONATE STAGE — Cinematic */
.donate-stage{
  position:relative;padding:140px 0;background-size:cover;background-position:center;
  background-attachment:fixed;overflow:hidden;
}
.donate-stage-overlay{
  position:absolute;inset:0;
  background:
    radial-gradient(800px 400px at 80% 30%, rgba(31,123,255,.18), transparent 70%),
    linear-gradient(180deg, rgba(2,6,20,.92), rgba(2,6,20,.92));
}
.donate-stage-grid{
  position:relative;z-index:1;display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center;
}
.donate-stage-text .eyebrow{letter-spacing:5px;margin-bottom:18px;display:block}
.donate-stage-text h3{
  font-family:'Oswald',sans-serif;color:#fff;font-size:68px;letter-spacing:2px;
  line-height:.96;font-weight:600;margin-bottom:24px;
}
.donate-stage-text p{color:#cfe0ff;font-size:17px;line-height:1.65;margin-bottom:30px;max-width:520px}
.donate-stage .donate-impact{display:flex;flex-direction:column;gap:12px;max-width:520px}
.donate-stage .donate-impact div{
  display:flex;align-items:center;gap:14px;font-size:14px;color:#cfe0ff;
  padding:14px 18px;background:rgba(8,20,46,.55);border:1px solid rgba(58,160,255,.18);border-radius:6px;
  backdrop-filter:blur(8px);
}
.donate-stage .donate-impact i{color:#3aa0ff;font-size:18px;text-shadow:0 0 12px rgba(58,160,255,.6)}
.donate-stage .donate-impact b{color:#fff;font-weight:700}
.donate-stage .donate-form{
  background:rgba(4,10,30,.85);border:1px solid rgba(58,160,255,.25);
  border-radius:6px;padding:36px;backdrop-filter:blur(12px);
  box-shadow:0 30px 80px rgba(0,0,0,.5);
}
.donate-stage .donate-form .field label{
  display:block;color:#9ec8ff;font-family:'Oswald',sans-serif;letter-spacing:3px;font-size:11px;margin-bottom:8px;
}
.donate-stage .donate-form input[type=number]{
  width:100%;background:rgba(2,6,20,.6);border:1px solid rgba(110,170,255,.3);border-radius:6px;
  padding:16px 18px;color:#fff;font-family:'Oswald',sans-serif;font-size:24px;letter-spacing:1px;outline:none;
}
.donate-stage .donate-form input[type=number]:focus{border-color:#3aa0ff;box-shadow:0 0 0 3px rgba(58,160,255,.18)}
.freq-toggle{display:flex;gap:8px;background:rgba(2,6,20,.5);padding:5px;border-radius:6px;border:1px solid rgba(110,170,255,.2)}
.freq-toggle label{
  flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;
  border-radius:4px;cursor:pointer;color:#9bb1de;font-size:13px;letter-spacing:1.5px;
  transition:.2s;font-family:'Oswald',sans-serif;
}
.freq-toggle label:has(input:checked){background:rgba(31,123,255,.35);color:#fff;box-shadow:0 0 16px rgba(58,160,255,.3)}
.freq-toggle input{display:none}

/* QUOTE SLIDER — Testimonials */
.quote-stage{
  position:relative;padding:140px 0;overflow:hidden;isolation:isolate;
}
.quote-stage-bg{
  position:absolute;inset:0;background-size:cover;background-position:center;
  background-attachment:fixed;filter:saturate(.6) blur(2px);z-index:-2;
}
.quote-stage-overlay{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg, #061026 0%, rgba(6,16,38,.88) 30%, rgba(6,16,38,.88) 70%, #061026 100%);
}
.quote-stage .eyebrow{display:block;text-align:center;letter-spacing:5px;margin-bottom:60px;color:#9ec8ff}
.quote-slider{max-width:880px;margin:0 auto;position:relative;overflow:hidden}
.quote-track{display:flex;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.quote-slide{
  flex:0 0 100%;text-align:center;padding:0 40px;
}
.quote-slide > i{font-size:40px;color:#3aa0ff;opacity:.6;margin-bottom:30px;text-shadow:0 0 24px rgba(58,160,255,.5)}
.quote-slide p{
  font-family:'Oswald',sans-serif;font-weight:500;color:#fff;font-size:30px;letter-spacing:1px;
  line-height:1.4;margin-bottom:36px;font-style:normal;
}
.quote-slide footer{display:flex;align-items:center;justify-content:center;gap:14px}
.quote-slide .avatar{
  width:60px;height:60px;border-radius:50%;background-size:cover;background-position:center;
  border:2px solid rgba(58,160,255,.6);box-shadow:0 0 18px rgba(58,160,255,.4);
}
.quote-slide footer b{color:#fff;font-size:15px;display:block;font-family:'Inter',sans-serif}
.quote-slide footer small{color:#9ec8ff;font-size:12px;letter-spacing:1.5px;text-transform:uppercase}

/* TEAM PORTRAITS */
.team-stage{padding:120px 0}
.team-stage .section-head{margin-bottom:60px}
.team-portraits{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.portrait{
  position:relative;aspect-ratio:3/4;background-size:cover;background-position:center;
  overflow:hidden;border-radius:4px;color:#fff;
}
.portrait::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(2,6,20,.1) 0%, rgba(2,6,20,.4) 50%, rgba(2,6,20,.95) 100%);
  transition:background .35s ease;
}
.portrait:hover::before{background:linear-gradient(180deg, rgba(2,6,20,.4) 0%, rgba(2,6,20,.7) 30%, rgba(2,6,20,.95) 100%)}
.portrait-meta{
  position:absolute;left:0;right:0;bottom:0;padding:24px 22px;
  transform:translateY(48px);transition:transform .45s cubic-bezier(.2,.7,.2,1);
}
.portrait:hover .portrait-meta{transform:translateY(0)}
.portrait-meta .role{color:#3aa0ff;font-size:11px;letter-spacing:2.5px;margin-bottom:6px;text-shadow:0 0 10px rgba(58,160,255,.5)}
.portrait-meta h5{font-family:'Oswald',sans-serif;color:#fff;font-size:22px;letter-spacing:2px;margin-bottom:10px}
.portrait-meta p{color:#cfe0ff;font-size:13px;line-height:1.55;opacity:0;transition:opacity .35s ease .1s}
.portrait:hover .portrait-meta p{opacity:1}

/* TRUST BAND — Compact */
.trust-band{padding:80px 0;border-top:1px solid rgba(58,120,220,.15);border-bottom:1px solid rgba(58,120,220,.15)}
.trust-band-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-bottom:50px;
}
.trust-band-grid > div{
  display:flex;align-items:center;gap:16px;padding:0 8px;
  border-left:1px solid rgba(58,120,220,.15);
}
.trust-band-grid > div:first-child{border-left:none}
.trust-band-grid i{
  font-size:26px;color:#3aa0ff;text-shadow:0 0 14px rgba(58,160,255,.5);flex-shrink:0;
}
.trust-band-grid b{color:#fff;font-family:'Oswald',sans-serif;letter-spacing:1.5px;font-size:14px;display:block;margin-bottom:3px}
.trust-band-grid small{color:#9bb1de;font-size:12px}

/* Mobile fallback for new layouts */
@media (max-width:980px){
  .split,.donate-stage-grid{grid-template-columns:1fr}
  .split-img{min-height:340px}
  .split-text{padding:60px 28px}
  .split-text h2{font-size:48px}
  .bühne{background-attachment:scroll;min-height:auto}
  .bühne-content{padding:100px 28px;max-width:none}
  .bühne-right .bühne-content{text-align:left}
  .bühne-right .bühne-overlay,.bühne-overlay{
    background:linear-gradient(180deg, rgba(2,6,20,.45) 0%, rgba(2,6,20,.92) 100%);
  }
  .bühne-content h3{font-size:42px}
  .bühne-right .bühne-content p{margin-left:0}
  .help-tiles-grid{grid-template-columns:repeat(2,1fr)}
  .help-tile-body{transform:none}
  .help-tile-body p,.help-tile-cta{opacity:1;transform:none}
  .donate-stage{padding:90px 0;background-attachment:scroll}
  .donate-stage-text h3{font-size:42px}
  .quote-stage{padding:90px 0}
  .quote-slide p{font-size:22px}
  .team-portraits{grid-template-columns:repeat(2,1fr)}
  .portrait-meta{transform:none}
  .portrait-meta p{opacity:1}
  .trust-band-grid{grid-template-columns:repeat(2,1fr)}
  .trust-band-grid > div:nth-child(3){border-left:none}
}
@media (max-width:560px){
  .help-tiles-grid,.team-portraits,.trust-band-grid{grid-template-columns:1fr}
  .trust-band-grid > div{border-left:none}
  .bühnen-head h2,.help-tiles-head h2{font-size:38px}
  .donate-stage-text h3{font-size:34px}
  .split-text h2{font-size:36px}
  .bühne-content h3{font-size:34px}
}

/* =====================================================================
   JS-driven UI (Burger, Cookie, Lightbox, Reveal, Forms, Back-to-Top)
   ===================================================================== */

/* Sticky header on scroll */
.site-header.is-scrolled{
  position:fixed;top:0;
  background:rgba(2,6,20,.85);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(58,120,220,.18);
  animation:slideDown .3s ease;
}
@keyframes slideDown{from{transform:translateY(-100%)}to{transform:translateY(0)}}

/* Burger Menu */
.nav-burger{
  display:none;width:42px;height:42px;background:transparent;border:none;cursor:pointer;
  padding:10px;position:relative;z-index:60;
}
.nav-burger span{
  display:block;height:2px;width:100%;background:#fff;border-radius:2px;
  transition:transform .3s ease, opacity .3s ease;
}
.nav-burger span + span{margin-top:5px}
.site-header.nav-open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.site-header.nav-open .nav-burger span:nth-child(2){opacity:0}
.site-header.nav-open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:980px){
  .nav-burger{display:block}
  .nav-links{
    position:fixed;inset:0;background:rgba(4,10,30,.97);backdrop-filter:blur(14px);
    flex-direction:column;justify-content:center;align-items:center;gap:24px;
    transform:translateX(100%);transition:transform .35s ease;
    display:flex !important;
  }
  .site-header.nav-open .nav-links{transform:translateX(0)}
  .nav-links a{font-size:22px;letter-spacing:3px}
}

/* Reveal-on-scroll */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
}

/* Form messages & error states */
.form-msg{
  margin-top:14px;padding:12px 16px;border-radius:6px;font-size:13.5px;
  border:1px solid;animation:fadeUp .3s ease;
}
.form-msg-success{background:rgba(34,160,90,.12);border-color:rgba(34,160,90,.5);color:#a8f0c4}
.form-msg-error{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.5);color:#ffc8c8}
.field-error,
input.field-error,
textarea.field-error{border-color:rgba(220,38,38,.7) !important;box-shadow:0 0 0 3px rgba(220,38,38,.18) !important}

/* Cookie Banner */
.cookie-banner{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:9999;
  border:1px solid rgba(58,120,220,.35);border-radius:8px;
  background:rgba(4,10,30,.95);backdrop-filter:blur(14px);
  box-shadow:0 24px 60px rgba(0,0,0,.6);
  transform:translateY(140%);transition:transform .4s cubic-bezier(.2,.7,.2,1);
  max-width:980px;margin:0 auto;
}
.cookie-banner.cookie-in{transform:translateY(0)}
.cookie-inner{
  display:flex;gap:24px;align-items:center;padding:18px 22px;flex-wrap:wrap;
}
.cookie-inner p{color:#cfe0ff;font-size:13.5px;line-height:1.55;flex:1;min-width:240px;margin:0}
.cookie-inner a{color:#3aa0ff;text-decoration:underline}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-actions .btn{padding:10px 18px;font-size:12px}

/* Back to Top */
.to-top{
  position:fixed;right:22px;bottom:22px;z-index:90;
  width:46px;height:46px;border-radius:50%;border:1px solid rgba(58,160,255,.5);
  background:rgba(4,10,30,.85);backdrop-filter:blur(8px);color:#3aa0ff;font-size:16px;
  cursor:pointer;opacity:0;transform:translateY(20px) scale(.9);pointer-events:none;
  transition:opacity .3s ease, transform .3s ease, background .2s ease;
  box-shadow:0 0 24px rgba(58,160,255,.25);
}
.to-top-show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:rgba(31,123,255,.3);box-shadow:0 0 30px rgba(58,160,255,.6)}

/* Lightbox */
.lightbox{
  position:fixed;inset:0;z-index:9998;background:rgba(2,6,20,.94);backdrop-filter:blur(8px);
  display:none;align-items:center;justify-content:center;padding:30px;
  opacity:0;transition:opacity .3s ease;
}
.lightbox-show{display:flex;opacity:1}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.7)}
.lightbox-close{
  position:absolute;top:18px;right:22px;background:transparent;border:none;color:#fff;
  font-size:42px;line-height:1;cursor:pointer;font-family:inherit;
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  transition:background .2s ease;
}
.lightbox-close:hover{background:rgba(255,255,255,.1)}

/* Carousel basics (dots / arrows) */
.carousel{position:relative;overflow:hidden;border-radius:6px}
.carousel-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:48px;height:48px;border-radius:50%;border:1px solid rgba(58,160,255,.5);
  background:rgba(4,10,30,.7);backdrop-filter:blur(6px);color:#fff;font-size:16px;cursor:pointer;
  transition:.2s;
}
.carousel-arrow:hover{background:rgba(31,123,255,.4)}
.carousel-arrow.prev{left:18px}
.carousel-arrow.next{right:18px}
.carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:18px}
.carousel-dots [data-carousel-dot]{
  width:10px;height:10px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(110,170,255,.3);transition:.2s;
}
.carousel-dots [data-carousel-dot].active{background:#3aa0ff;box-shadow:0 0 10px rgba(58,160,255,.7);width:28px;border-radius:6px}

/* Filter buttons */
[data-filter-group]{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:30px}
[data-filter]{
  background:rgba(4,10,30,.6);border:1px solid rgba(110,170,255,.3);color:#cfe0ff;
  padding:9px 18px;border-radius:999px;cursor:pointer;font-family:'Oswald',sans-serif;
  font-size:12px;letter-spacing:2px;transition:.2s;
}
[data-filter]:hover{border-color:#3aa0ff;color:#fff}
[data-filter].active{background:linear-gradient(180deg,#2b8bff,#1466d6);border-color:#3aa0ff;color:#fff;box-shadow:0 0 16px rgba(58,160,255,.4)}