/* WingX GmbH – helles Design, angelehnt an ERP-Look (aber hell statt dunkel) */
:root{
  --wx-primary:#00b894;      /* türkis-grün, wie ERP-Akzent */
  --wx-primary-dark:#009878;
  --wx-dark:#0f2027;
  --wx-text:#1a2b32;
  --wx-muted:#5c6f78;
  --wx-bg:#f6f9fb;
  --wx-card:#ffffff;
  --wx-border:#e2e9ee;
}
*{scroll-behavior:smooth;}
body{background:var(--wx-bg);color:var(--wx-text);font-family:'Segoe UI',system-ui,sans-serif;}
a{text-decoration:none;color:var(--wx-primary);}
a:hover{color:var(--wx-primary-dark);}

/* Navbar */
.wingx-nav{background:#fff;border-bottom:1px solid var(--wx-border);box-shadow:0 2px 12px rgba(0,0,0,0.04);z-index:1040;}
.wingx-logo{font-weight:800;letter-spacing:-.5px;color:var(--wx-dark);font-size:1.4rem;}
.wingx-logo .x{color:var(--wx-primary);}
.wingx-sub{font-size:.7rem;color:var(--wx-muted);font-weight:600;vertical-align:super;}
.wingx-nav .nav-link{color:var(--wx-text)!important;font-weight:500;padding:.5rem 1rem;}
.wingx-nav .nav-link.active,.wingx-nav .nav-link:hover{color:var(--wx-primary)!important;}
.btn-wingx{background:var(--wx-primary);border:none;color:#fff!important;font-weight:600;border-radius:8px;}
.btn-wingx:hover{background:var(--wx-primary-dark);color:#fff;}
.btn-wingx-outline{border:2px solid var(--wx-primary);color:var(--wx-primary)!important;font-weight:600;border-radius:8px;background:transparent;}
.btn-wingx-outline:hover{background:var(--wx-primary);color:#fff!important;}

/* Hero */
.hero{background:linear-gradient(135deg,#0f2027 0%,#203a43 50%,#2c5364 100%);color:#fff;padding:5rem 0 4rem;position:relative;overflow:hidden;}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(0,184,148,0.25),transparent 50%);}
.hero h1{font-weight:800;font-size:2.8rem;line-height:1.15;position:relative;}
.hero .lead{color:#cfe3e8;position:relative;}
.hero .badge-ki{background:rgba(0,184,148,0.2);color:#5fffd0;border:1px solid rgba(0,184,148,0.4);font-weight:600;padding:.4rem .9rem;border-radius:20px;}

/* Cards */
.feature-card{background:var(--wx-card);border:1px solid var(--wx-border);border-radius:14px;padding:1.8rem;height:100%;transition:transform .2s,box-shadow .2s;}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px rgba(0,0,0,0.08);}
.feature-icon{width:54px;height:54px;border-radius:12px;background:linear-gradient(135deg,var(--wx-primary),#0088ff);display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:#fff;margin-bottom:1rem;}
.section{padding:4rem 0;}
.section-title{font-weight:800;font-size:2rem;margin-bottom:.5rem;}
.section-sub{color:var(--wx-muted);margin-bottom:2.5rem;}

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

/* CTA */
.cta-band{background:linear-gradient(135deg,var(--wx-primary),#0088ff);color:#fff;border-radius:18px;padding:3rem;text-align:center;}
.cta-band h2{font-weight:800;}

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

/* Footer */
.wingx-footer{background:#0f2027;color:#cfe3e8;padding:3rem 0 1.5rem;margin-top:4rem;}
.wingx-footer a{color:#9fd9cc;}
.wingx-footer a:hover{color:#fff;}
.wingx-footer h6{color:#fff;}
.wingx-footer hr{border-color:rgba(255,255,255,0.1);}
/* text-muted im dunklen Footer lesbar machen (Bootstrap-Default ist zu dunkel) */
.wingx-footer .text-muted{color:#a9c4cc !important;}
.wingx-footer p, .wingx-footer li{color:#cfe3e8;}
/* Logo im dunklen Footer: "Wing" weiss statt dunkel (X bleibt tuerkis) */
.wingx-footer .wingx-logo{color:#ffffff;}
.wingx-footer .wingx-sub{color:#a9c4cc;}

/* Partner logos */
.partner-card{background:#fff;border:1px solid var(--wx-border);border-radius:12px;padding:1.3rem;text-align:center;height:100%;}
.partner-card h6{color:var(--wx-primary);font-weight:700;}

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