/* AEVIOON Energy GmbH - Corporate Design (Visitenkarten): Neon-Gruen / Schwarz / Weiss.
   Clean, modern, viel Weissraum. Akzent = Neon-Gruen. Text = Schwarz. */
:root{
  --av-neon:#8fe813;          /* Neon-Gruen (Visitenkarte) */
  --av-neon-soft:#c7f57e;     /* helles Gruen (Flaechen/Watermark) */
  --av-neon-dark:#6fb800;
  --av-black:#0a0a0a;
  --av-text:#111511;
  --av-muted:#5f6b60;
  --av-bg:#ffffff;
  --av-bg2:#f5f8f2;           /* ganz leicht gruenlich-weiss */
  --av-card:#ffffff;
  --av-border:#e6ece0;
}
*{scroll-behavior:smooth;}
body{background:var(--av-bg);color:var(--av-text);font-family:'Segoe UI',system-ui,-apple-system,sans-serif;}
a{text-decoration:none;color:var(--av-neon-dark);}
a:hover{color:var(--av-black);}

/* Logo AEVIOON mit Infinity-OO */
.av-logo{font-weight:800;letter-spacing:1px;color:var(--av-black);font-size:1.55rem;font-family:'Arial Black','Segoe UI',sans-serif;}
.av-logo .oo{color:var(--av-neon);letter-spacing:-2px;}
.av-sub{font-size:.7rem;color:var(--av-black);font-weight:700;letter-spacing:.5px;}
.av-sub .dot{color:var(--av-neon);}

/* Navbar */
.av-nav{background:#fff;border-bottom:1px solid var(--av-border);box-shadow:0 2px 14px rgba(10,10,10,0.05);z-index:1040;}
.av-nav .nav-link{color:var(--av-text)!important;font-weight:600;padding:.5rem 1rem;}
.av-nav .nav-link.active,.av-nav .nav-link:hover{color:var(--av-neon-dark)!important;}
.btn-av{background:var(--av-neon);border:none;color:var(--av-black)!important;font-weight:800;border-radius:6px;letter-spacing:.3px;}
.btn-av:hover{background:var(--av-neon-dark);color:#000!important;}
.btn-av-outline{border:2px solid var(--av-black);color:var(--av-black)!important;font-weight:700;border-radius:6px;background:transparent;}
.btn-av-outline:hover{background:var(--av-black);color:var(--av-neon)!important;}

/* Hero - weiss mit grossem Neon-Infinity-Watermark */
.hero{background:var(--av-bg);color:var(--av-black);padding:5.5rem 0 4.5rem;position:relative;overflow:hidden;border-bottom:1px solid var(--av-border);}
.hero::after{content:"\221E";position:absolute;right:-4%;top:35%;font-size:36rem;line-height:0;color:var(--av-neon-soft);opacity:.55;font-weight:900;pointer-events:none;z-index:0;}
.hero .container{position:relative;z-index:1;}
.hero h1{font-weight:800;font-size:3rem;line-height:1.1;color:var(--av-black);}
.hero .lead{color:var(--av-muted);}
.hero .badge-ki{background:var(--av-neon);color:var(--av-black);border:none;font-weight:700;padding:.4rem 1rem;border-radius:20px;}

/* Cards */
.feature-card{background:var(--av-card);border:1px solid var(--av-border);border-radius:14px;padding:1.8rem;height:100%;transition:transform .2s,box-shadow .2s;}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(143,232,19,0.18);border-color:var(--av-neon);}
.feature-icon{width:56px;height:56px;border-radius:12px;background:var(--av-neon);display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:var(--av-black);margin-bottom:1rem;}
.section{padding:4.5rem 0;}
.section:nth-of-type(even){background:var(--av-bg2);}
.section-title{font-weight:800;font-size:2.1rem;margin-bottom:.5rem;color:var(--av-black);}
.section-sub{color:var(--av-muted);margin-bottom:2.5rem;}

/* Zielgruppen */
.target-pill{background:#fff;border:1.5px solid var(--av-border);border-radius:30px;padding:.6rem 1.2rem;font-weight:600;color:var(--av-text);display:inline-flex;align-items:center;gap:.5rem;margin:.3rem;transition:.2s;}
.target-pill:hover{border-color:var(--av-neon);color:var(--av-black);transform:translateY(-2px);}
.target-pill i{color:var(--av-neon-dark);}

/* Spec-/Batterie-Karten */
.spec-card{background:var(--av-card);border:1px solid var(--av-border);border-radius:16px;padding:2rem 1.5rem;text-align:center;height:100%;transition:.2s;}
.spec-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(143,232,19,0.2);border-color:var(--av-neon);}
.spec-card .cap{font-size:2.4rem;font-weight:800;color:var(--av-black);line-height:1;}
.spec-card .cap small{font-size:1rem;color:var(--av-muted);font-weight:600;}

/* Stats */
.stat-box{text-align:center;padding:1.5rem;}
.stat-num{font-size:2.6rem;font-weight:800;color:var(--av-neon-dark);}
.stat-label{color:var(--av-muted);font-size:.9rem;}

/* Bild-Karten */
.img-card{border-radius:16px;overflow:hidden;border:1px solid var(--av-border);background:#fff;height:100%;}
.img-card img{width:100%;height:210px;object-fit:cover;display:block;background:var(--av-bg2);}
.img-card .body{padding:1.2rem 1.4rem;}
.img-ph{width:100%;height:210px;display:flex;align-items:center;justify-content:center;background:var(--av-neon-soft);color:var(--av-black);font-size:2.5rem;}

/* CTA-Band - Neon */
.cta-band{background:var(--av-neon);color:var(--av-black);border-radius:18px;padding:3.2rem;text-align:center;}
.cta-band h2{font-weight:800;color:var(--av-black);}
.cta-band .btn-dark{background:var(--av-black);color:var(--av-neon)!important;font-weight:800;border:none;}
.cta-band .btn-dark:hover{background:#222;}

/* SLA */
.sla-badge{display:inline-flex;align-items:center;gap:.6rem;background:var(--av-black);color:var(--av-neon);border-radius:12px;padding:1rem 1.6rem;font-weight:700;}
.sla-badge .big{font-size:1.6rem;color:#fff;}

/* Demo embed */
.demo-frame-wrap{border:1px solid var(--av-border);border-radius:14px;overflow:hidden;box-shadow:0 12px 40px rgba(10,10,10,0.12);background:#0d1117;}
.demo-frame{width:100%;height:80vh;border:0;display:block;}
.demo-bar{background:var(--av-black);color:var(--av-neon);padding:.6rem 1rem;font-size:.85rem;display:flex;align-items:center;justify-content:space-between;}

/* Steuerbare Komponenten */
.comp-row{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;}
.comp-chip{background:#fff;border:1px solid var(--av-border);border-radius:10px;padding:.5rem 1rem;font-weight:600;font-size:.9rem;color:var(--av-text);}
.comp-chip i{color:var(--av-neon-dark);margin-right:.4rem;}

/* Footer - schwarz mit neon */
.av-footer{background:var(--av-black);color:#d7ddd2;padding:3rem 0 1.5rem;margin-top:4rem;}
.av-footer a{color:var(--av-neon);}
.av-footer a:hover{color:#fff;}
.av-footer h6{color:#fff;}
.av-footer hr{border-color:rgba(255,255,255,0.1);}
.av-footer .text-muted{color:#9fa89a !important;}
.av-footer p,.av-footer li{color:#d7ddd2;}
.av-footer .av-logo{color:#fff;}
.av-footer .av-logo .oo{color:var(--av-neon);}
.av-footer .av-sub{color:#d7ddd2;}

@media(max-width:768px){.hero h1{font-size:2.1rem;}.section-title{font-size:1.6rem;}.hero::after{font-size:20rem;}}