/* ========= NextLearn – Global styles ========= */
:root{
  --blue:#148AFF; --dark:#091c3e; --bg:#f7f9fc; --text:#0b1020;
  --muted:#6b7280; --card:#ffffff; --radius:16px;
  --shadow:0 10px 30px rgba(9,28,62,.08);
}

/* Base */
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:'Barlow',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--text);background:var(--bg)}
img{max-width:100%;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
.mute{color:var(--muted)}
.bg-white{background:#ffffff}
.mt-16{margin-top:16px}

/* Layout */
.container{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.footer-grid{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}

/* Header / Nav */
header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.8);backdrop-filter:blur(10px);border-bottom:1px solid #eef2f7}
.nav{display:flex;align-items:center;justify-content:space-between;height:70px;gap:24px}
.brand{display:flex;align-items:center;gap:14px}
.brand img{height:34px}
.nav a{color:var(--dark);font-weight:600}
.nav-links{display:flex;gap:18px;align-items:center}
.nav a.active{color:var(--blue);font-weight:700}

/* Buttons */
.btn{display:inline-block;padding:12px 18px;border-radius:999px;font-weight:700;letter-spacing:.2px;transition:transform .06s ease,box-shadow .2s ease}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--blue);color:#fff;box-shadow:0 8px 20px rgba(20,138,255,.25)}
.btn.dark{background:var(--dark);color:#fff}

/* Hero / Page headers */
.hero{position:relative;padding:96px 0 72px;background:linear-gradient(180deg,#fff 0%,#f2f7ff 100%);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
.kicker{font-weight:800;color:var(--blue);letter-spacing:.8px;text-transform:uppercase;font-size:12px}
h1{font-size:48px;line-height:1.05;margin:10px 0 16px;color:var(--dark)}
.lead{font-size:18px;color:var(--muted);max-width:56ch}
.page-header{position:relative;padding:96px 0 64px;background:linear-gradient(180deg,#fff 0%,#f2f7ff 100%)}

/* Sections / Cards */
.section{padding:72px 0}
.section h2{font-size:36px;color:var(--dark);margin:0 0 16px}
.card{background:var(--card);border:1px solid #edf1f7;border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.card h3{margin:8px 0 6px;font-size:20px;color:var(--dark)}
.price{font-weight:800;color:var(--dark)}
.pill{padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px;background:#eaf4ff;color:var(--blue);display:inline-block}
.hero-figure{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow)}
.hero-figure img{width:100%;height:100%;object-fit:cover}

/* Footer CTA & Footer */
.footer-cta{background:var(--dark);color:#fff;border-radius:20px;padding:36px;display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center}
footer{padding:48px 0}

/* Kontaktformular */
form.grid-stack{display:grid;gap:12px;margin-top:20px}
input[type="text"],input[type="email"],textarea{
  padding:12px;border-radius:8px;border:1px solid #dbe2ec;font-family:'Barlow',sans-serif
}

/* Responsive */
@media (max-width:980px){
  .hero-grid,.grid,.split,.footer-cta{grid-template-columns:1fr}
  h1{font-size:40px}
  .page-header h1{font-size:36px}
}

/* Aktivt menupunkt */
.nav a[aria-current="page"],
.nav-links a[aria-current="page"] {
  color: var(--blue);
  position: relative;
}
.nav a[aria-current="page"]::after,
.nav-links a[aria-current="page"]::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;
  background: var(--blue);
  border-radius: 2px;
}