/* ============================================================
   CB Steuerberatung – Kurs-Landingpage
   ============================================================ */

.kurs-hero {
  position: relative;
  background: #fff url('../img/Pattern-Background.png') 50% 50% / cover no-repeat;
  padding: 110px 0 170px;
}
.kurs-hero::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 140px;
  background: linear-gradient(to bottom right, rgba(255,255,255,0) 49.8%, #fff 50.2%);
  pointer-events: none;
}
.kurs-hero .eyebrow {
  display: inline-block; font-size: 15px; font-weight: 600; letter-spacing: 1px;
  text-transform: uppercase; color: #8a8f96; margin-bottom: 18px;
}
.kurs-hero h1 { font-size: 50px; font-weight: 800; line-height: 1.1; color: var(--navy); max-width: 820px; }
.kurs-hero .sub { margin-top: 26px; max-width: 640px; font-size: 18px; }
.kurs-hero .cta-row { margin-top: 40px; display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }
.kurs-price { font-size: 30px; font-weight: 800; color: var(--navy); }
.kurs-price small { display: block; font-size: 13px; font-weight: 400; color: #8a8f96; }

.kurs-badges { display: flex; gap: 40px; flex-wrap: wrap; margin-top: 56px; }
.kurs-badge { display: flex; align-items: center; gap: 14px; font-size: 16px; color: var(--navy); font-weight: 600; }
.kurs-badge svg { width: 30px; height: 30px; fill: var(--navy); flex: 0 0 auto; }

/* Module */
.kurs-module { padding: 90px 0 40px; }
.module-grid { margin-top: 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.module-card { border: 1px solid #e8e8e8; padding: 36px 34px; background: #fff; transition: box-shadow .25s; }
.module-card:hover { box-shadow: 0 14px 34px rgba(26,42,65,.10); }
.module-card .mod-nr {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border-radius: 50%;
  background: var(--navy); color: #fff; font-weight: 700; font-size: 18px; margin-bottom: 20px;
}
.module-card h3 { font-size: 21px; color: var(--navy); font-weight: 700; margin-bottom: 14px; }
.module-card ul { list-style: none; }
.module-card li { display: flex; gap: 12px; font-size: 16px; color: var(--text); }
.module-card li + li { margin-top: 10px; }
.module-card li svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: var(--navy); stroke-width: 34; margin-top: 3px; }

/* Inhalte / Für wen */
.kurs-inhalt { padding: 60px 0; }
.ki-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; margin-top: 50px; align-items: start; }
.ki-box h3 { font-size: 24px; color: var(--navy); font-weight: 700; margin-bottom: 22px; }
.ki-box ul { list-style: none; }
.ki-box li { display: flex; gap: 14px; font-size: 16px; }
.ki-box li + li { margin-top: 14px; }
.ki-box li svg { width: 23px; height: 23px; flex: 0 0 auto; fill: none; stroke: var(--navy); stroke-width: 30; margin-top: 2px; }

/* Anbieter */
.kurs-anbieter {
  position: relative;
  background: #fff url('../img/Triangles-Pattern-Background2.png') 0 100% / cover no-repeat;
  padding: 170px 0 120px;
}
.kurs-anbieter::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 140px;
  background: linear-gradient(to bottom right, #fff 49.8%, rgba(255,255,255,0) 50.2%);
  pointer-events: none;
}
.ka-grid { display: grid; grid-template-columns: 300px 1fr; gap: 60px; align-items: center; }
.ka-grid img { width: 100%; }
.ka-grid h2 { font-size: 34px; color: var(--navy); font-weight: 700; margin-bottom: 20px; }

/* Abschluss-CTA */
.kurs-cta { padding: 100px 0 80px; text-align: center; }
.kurs-cta h2 { font-size: 38px; font-weight: 800; color: var(--navy); }
.kurs-cta p { max-width: 620px; margin: 22px auto 0; }
.kurs-cta .btn-primary { margin-top: 36px; font-size: 16px; padding: 24px 44px; }
.kurs-cta .hinweis { font-size: 13px; color: #9aa0a7; margin-top: 18px; }

@media (max-width: 992px) {
  .kurs-hero h1 { font-size: 38px; }
  .module-grid, .ki-grid { grid-template-columns: 1fr; }
  .ka-grid { grid-template-columns: 1fr; }
  .ka-grid img { max-width: 300px; }
}
@media (max-width: 680px) {
  .kurs-hero { padding: 70px 0 130px; }
  .kurs-hero h1 { font-size: 30px; }
  .kurs-cta h2 { font-size: 28px; }
}

/* ======== Kurzbeschreibung (Intro) ======== */
.kurs-intro { padding: 80px 0; background: #fff; }
.ki2-grid {
  display: grid; grid-template-columns: 380px 1fr;
  gap: 60px; align-items: center;
}
.ki2-img img {
  width: 100%; height: auto; border-radius: 10px;
  box-shadow: 0 20px 45px rgba(26,42,65,.25);
}
.ki2-text h2 {
  font-size: 32px; font-weight: 700; color: var(--navy);
  line-height: 1.3; margin: 0 0 22px;
}
.ki2-text p { font-size: 17px; color: #555; line-height: 1.75; margin: 0 0 18px; }
.ki2-text .btn-primary { margin-top: 10px; }
@media (max-width: 900px) {
  .ki2-grid { grid-template-columns: 1fr; gap: 36px; }
  .ki2-img { max-width: 340px; margin: 0 auto; }
  .ki2-text h2 { font-size: 26px; }
}
