:root{--bg:#0b0f14;--text:#eaf2fb;--muted:#a9bed4;--accent:#f59e0b;--accent2:#25D366;--border:rgba(255,255,255,.08);--radius:18px;--shadow:0 10px 30px rgba(0,0,0,.35)}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;line-height:1.6}

a{color:#ffd089;text-decoration:none}img{max-width:100%;height:auto;display:block}
header{position:sticky;top:0;z-index:60;background:rgba(11,15,20,.72);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.container{max-width:1200px;margin:0 auto;padding:0 22px}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:140px}
.brand img{height:200px;width:auto;filter:drop-shadow(0 8px 24px rgba(0,0,0,.5));animation:egFade 600ms ease-out both}
@keyframes egFade{from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:none}}
nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;align-items:center}
nav a{color:var(--text);font-weight:700;opacity:.92;font-size:20px}nav a:hover{opacity:1}
.whatsapp{display:inline-flex;align-items:center;gap:10px;padding:12px 16px;border-radius:999px;background:var(--accent2);color:#101010;font-weight:800;border:0}
.hero{padding:28px 0 32px}.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:center}
h1{font-size:44px;line-height:1.1;margin:0 0 10px}h2{font-size:28px;margin:0 0 14px}.sub{color:var(--muted);margin:0 0 18px;font-size:18px}
.hero-photo{border-radius:16px;overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow)}
.hero-photo img{width:100%;height:100%;object-fit:cover}
.card{background:linear-gradient(180deg,#111826 0%,#0d1420 100%);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:var(--radius);padding:22px}
section{padding:30px 0}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.list{margin:6px 0 0 18px}.cta{display:flex;gap:12px;flex-wrap:wrap}.btn{border:none;border-radius:14px;padding:12px 16px;font-weight:800;cursor:pointer}
.btn-primary{background:var(--accent);color:#1a1a1a}.btn-outline{background:transparent;color:#ffd089;border:2px solid #ffd089}
footer{padding:32px 0;color:var(--muted);border-top:1px solid var(--border);background:rgba(0,0,0,.25);margin-top:32px}
.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}

.slider{position:relative;border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
.slide{display:none}.slide.active{display:block}
.slider .nav{position:absolute;top:50%;width:100%;display:flex;justify-content:space-between;transform:translateY(-50%)}
.slider button{background:rgba(0,0,0,.45);color:#fff;border:0;border-radius:999px;width:44px;height:44px;font-size:18px;cursor:pointer;opacity:0;transition:opacity .25s ease, transform .25s ease}
.slider:hover button{opacity:1}.slider button:hover{transform:scale(1.05)}
.slider .dots{position:absolute;left:0;right:0;bottom:8px;display:flex;gap:6px;justify-content:center}
.slider .dots span{width:8px;height:8px;border-radius:50%;background:#ffffff55}.slider .dots span.active{background:#fff}

.nocopy{position:relative; display:block}
.nocopy::after{content:''; position:absolute; inset:0; background:transparent; pointer-events:auto}
.nocopy img{user-select:none; -webkit-user-drag:none; pointer-events:none}

.menu-toggle{display:none; background:transparent; border:0; width:44px; height:44px; position:relative; cursor:pointer}
.menu-toggle span, .menu-toggle::before, .menu-toggle::after{
  content:''; position:absolute; left:10px; right:10px; height:2px; background:#fff; transition:transform .25s ease, opacity .25s ease;
}
.menu-toggle span{top:21px}.menu-toggle::before{top:14px}.menu-toggle::after{top:28px}
.menu-toggle.active span{opacity:0}
.menu-toggle.active::before{transform:translateY(7px) rotate(45deg)}
.menu-toggle.active::after{transform:translateY(-7px) rotate(-45deg)}

@media(max-width:980px){
  header .container.nav{display:grid; grid-template-columns:44px 1fr; align-items:center; gap:10px; min-height:72px}
  .menu-toggle{display:inline-block; grid-column:1; justify-self:start}
  .brand{grid-column:2; justify-self:center}
  .brand img{height:120px}
  nav ul{display:none; position:fixed; top:72px; left:0; width:76vw; max-width:330px; height:calc(100vh - 72px);
    background:rgba(11,15,20,.98); border-right:1px solid var(--border); flex-direction:column; gap:12px; padding:18px;
    transform:translateX(-105%); transition:transform .25s ease}
  nav ul.show{display:flex; transform:translateX(0)}
  .mobile-intro{display:block; padding:16px 0}
  .mobile-intro .logo-wrap{display:flex; justify-content:center; align-items:center; margin:8px 0 4px}
  .mobile-intro img{height:140px; width:auto; filter:drop-shadow(0 6px 20px rgba(0,0,0,.55))}
  .mobile-intro .claim{color:var(--muted); text-align:center; font-weight:700}
}
.refs-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:18px}
@media(max-width:980px){ .refs-grid{grid-template-columns:1fr} }

/* V5.8.2: Slider-Bilder füllen den Rahmen vollständig */
.slider{height:60vh; max-height:720px}
@media(max-width:980px){ .slider{height:45vh; max-height:520px} }
.slide{display:none; height:100%}
.slide.active{display:block; height:100%}
.slide .nocopy, .slide img{width:100%; height:100%}
.slide img{object-fit:cover}

/* V5.8.5: Blocking Consent Modal (weekly) */
.consent-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter: blur(2px);display:none;align-items:center;justify-content:center;z-index:9999}
.consent-modal{width:min(560px,92vw);background:#101418;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:24px;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.consent-modal h3{margin:0 0 8px 0;font-size:1.25rem}
.consent-modal p{opacity:.9;line-height:1.55}
.consent-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:18px}
.btn-accept{background:#22c55e;color:#061016;border:none;padding:10px 16px;border-radius:10px;font-weight:700;cursor:pointer}
.btn-settings{background:transparent;border:1px solid rgba(255,255,255,.18);padding:10px 14px;border-radius:10px;color:#e2e8f0;cursor:pointer}
.lock-scroll{overflow:hidden;height:100vh}

/* V5.8.7: Global background image (contain, centered, dim overlay) */
html, body { height: 100%; }
body{background:#0d1116;}
/* subtle dark overlay for readability */

/* ensure main content stays above overlay */
header, main, footer, .page, .container, .hero { position: relative; z-index: 1; }

/* V5.8.8: Full-cover blurred background with dim overlay */
html, body { height: 100%; }
body{ background:#0d1116; }

/* Image layer (blurred, full cover) */
body::before{
  content:"";
  position:fixed; inset:0;
  background: url('/assets/bg-tools.jpg') center center / cover no-repeat fixed;
  filter: blur(9px) saturate(1.05);
  transform: scale(1.03); /* compensate blur edge */
  z-index:0;
  pointer-events:none;
}

/* Dim overlay for text readability */
body::after{
  content:"";
  position:fixed; inset:0;
  background: rgba(0,0,0,0.46);
  z-index:1;
  pointer-events:none;
}

/* Ensure content sits above background layers */
header, main, footer, .page, .container, .hero { position: relative; z-index: 2; }
