/* SMG Navigationskurse v1.3.3 */
:root { --smg-blue:#0b1f44; --smg-bg:#f5f8ff; --smg-card:#ffffff; --smg-radius:22px; }
.smg-container { max-width: 1100px; margin: 0 auto; padding: 24px; font-family: 'Inter',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif;}
.smg-hero { border-radius: var(--smg-radius); margin-top: 10px; position: relative; overflow: hidden; background: var(--smg-hero) center/cover no-repeat; }
.smg-hero-inner { position:relative; padding: 64px 32px 46px; color: var(--smg-blue); text-shadow: 0 1px 0 rgba(255,255,255,.15); }
.smg-hero.smg-hero--light .smg-hero-inner { color: #ffffff; text-shadow: 0 1px 0 rgba(0,0,0,.18); }
.smg-eyebrow { font-weight: 700; letter-spacing:.2px; opacity: .95; display:inline-block; background: rgba(255,255,255,.6); padding:6px 10px; border-radius:999px; }
.smg-hero.smg-hero--light .smg-eyebrow { background: rgba(0,0,0,.3); color:#fff; }
.smg-title { font-size: clamp(30px, 4vw, 56px); line-height: 1.04; margin: 12px 0 12px; letter-spacing: -0.5px;}
.smg-sub { max-width: 960px; font-size: clamp(16px, 1.6vw, 19px); opacity: .96; }
.smg-cta { display: inline-block; margin-top: 18px; background: var(--smg-blue); color: #fff; padding: 13px 20px; border-radius: 14px; text-decoration: none; box-shadow: 0 8px 24px rgba(11,31,68,.18);}
.smg-badges { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.smg-badges span { background:#0b1f4415; color: var(--smg-blue); padding:6px 10px; border-radius: 999px; font-weight:600; font-size:14px; border:1px solid transparent;}
.smg-hero.smg-hero--light .smg-badges span { background: rgba(255,255,255,.2); color:#fff; border-color: rgba(255,255,255,.35); }
.smg-hero.smg-hero--light .smg-cta { background:#ffffff; color:#0b1f44; }

.smg-pills { list-style:none; display:flex; flex-wrap:wrap; gap:10px; margin:24px 0 18px; padding:0;}
.smg-pills li { background:#0b1f4415; color:var(--smg-blue); padding:8px 12px; border-radius:999px; font-weight:600;}

.smg-grid { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:20px; }
@media (max-width: 860px) { .smg-grid { grid-template-columns: 1fr; } .smg-hero-inner{ padding: 36px 18px; } .smg-container{ padding: 16px; } }

.smg-card { background: var(--smg-card); border-radius: var(--smg-radius); padding: 22px; box-shadow: 0 10px 30px rgba(10,30,60,.08); border: 1px solid #0b1f4415;}
.smg-card h2 { margin-top:4px; font-size: clamp(22px, 2.2vw, 30px); color: var(--smg-blue);}
.smg-card p { line-height: 1.5; }

.smg-list { list-style: none; padding-left: 0; margin-top: 12px; color: var(--smg-blue); }
.smg-list > li { margin: 8px 0; font-size: 15px; }
.smg-list strong { font-weight: 700; }
.smg-sublist { list-style: disc; margin: 6px 0 0 18px; padding-left: 0; }
.smg-sublist li { margin: 3px 0; }

.smg-pre { white-space: pre-wrap; background:#f6f8ff; border-radius:12px; padding:10px; border:1px dashed #cdd6ff; margin-top:4px; }

.smg-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top: 14px; }
.smg-btn { display:inline-block; background:#001a36; color:#fff; text-decoration:none; padding:10px 16px; border-radius:14px; font-weight:600; box-shadow: 0 8px 24px rgba(0,0,0,.16); }
.smg-btn-book { background:#0b7a3b; }

.smg-info { background: #f7f9ff; border: 1px solid #e5ecff; border-radius: var(--smg-radius); padding: 18px; margin-top: 22px;}
.smg-info h3 { margin: 4px 0 10px; color: var(--smg-blue); }
.smg-note { font-weight: 600; }

/* FAQ – Kartenstil & volle Breite */
.smg-faq-wrap { width: 100%; margin-top: 24px; }
.smg-faq-wrap h3 { margin: 8px 0 10px; color: var(--smg-blue); }
.smg-faq { width: 100%; max-width: 100%; display: grid; gap: 10px; margin-bottom: 16px; }
.smg-faq details { width: 100%; background:#fff; border-radius: var(--smg-radius); padding: 0; border: 1px solid #e6ebff; box-shadow: 0 8px 24px rgba(10,30,60,.06); overflow: hidden; }
.smg-faq summary { cursor:pointer; font-weight:700; color:var(--smg-blue); padding: 14px 16px; list-style: none; display:flex; gap:10px; align-items: center; }
.smg-faq summary::-webkit-details-marker { display:none; }
.smg-faq details > *:not(summary) { padding: 0 16px 14px; }
.smg-faq p { margin: 10px 0 0; }