/* MemberJet – Kursseiten-Design-Templates
   Überschreiben die CSS-Variablen + Schrift auf .mjet-page[data-mjet-template]. */

/* ---- Gemeinsame Basis für alle Templates ---- */
.mjet-page {
	--mjet-ink: #1f2430;
	--mjet-surface: #f7f8fa;
	color: var(--mjet-ink);
}
.mjet-page .mjet-lesson-view,
.mjet-page .mjet-course {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
}
.mjet-page .mjet-course-grid,
.mjet-page .mjet-account {
	max-width: 960px;
	margin-left: auto;
	margin-right: auto;
}

/* Lektionsinhalt: Typografie + Multimedia (Gutenberg-Blöcke) */
.mjet-page .mjet-lesson-view__content {
	font-size: 17px;
	line-height: 1.75;
}
.mjet-page .mjet-lesson-view__content > * + * { margin-top: 18px; }
.mjet-page .mjet-lesson-view__content h2 { font-size: 26px; line-height: 1.2; margin-top: 40px; color: var(--mjet-ink); }
.mjet-page .mjet-lesson-view__content h3 { font-size: 21px; margin-top: 30px; color: var(--mjet-ink); }
.mjet-page .mjet-lesson-view__content ul,
.mjet-page .mjet-lesson-view__content ol { padding-left: 24px; }
.mjet-page .mjet-lesson-view__content li { margin: 8px 0; }
.mjet-page .mjet-lesson-view__content a { color: var(--mjet-accent); }
.mjet-page .mjet-lesson-view__content blockquote {
	margin: 30px 0; padding: 6px 24px;
	border-left: 3px solid var(--mjet-accent);
	font-size: 1.2em; font-style: italic;
}
.mjet-page .mjet-lesson-view__content img,
.mjet-page .mjet-lesson-view__content video {
	max-width: 100%; height: auto; display: block;
	margin: 26px auto; border-radius: var(--mjet-radius);
}
.mjet-page .mjet-lesson-view__content audio { width: 100%; margin: 20px 0; }
.mjet-page .mjet-lesson-view__content figure { margin: 26px 0; }
.mjet-page .mjet-lesson-view__content figcaption {
	font-size: 14px; color: var(--mjet-muted); text-align: center; margin-top: 8px;
}
.mjet-page .mjet-lesson-view__content iframe { max-width: 100%; border-radius: var(--mjet-radius); }
.mjet-page .mjet-lesson-view__content .wp-block-embed { margin: 26px 0; }
.mjet-page .mjet-lesson-view__content .wp-block-embed.is-type-video .wp-block-embed__wrapper {
	position: relative; padding-top: 56.25%;
}
.mjet-page .mjet-lesson-view__content .wp-block-embed.is-type-video .wp-block-embed__wrapper iframe {
	position: absolute; inset: 0; width: 100%; height: 100%;
}

/* =========================================================
   EDITORIAL — edel & literarisch
   ========================================================= */
.mjet-page[data-mjet-template="editorial"] {
	--mjet-accent: #6d2233;
	--mjet-accent-dark: #521a29;
	--mjet-border: #e4e0d8;
	--mjet-muted: #726c64;
	--mjet-radius: 6px;
	--mjet-ink: #1b1a1d;
	--mjet-surface: #efece5;
	font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
}
.mjet-page[data-mjet-template="editorial"] .mjet-lesson-view,
.mjet-page[data-mjet-template="editorial"] .mjet-course { max-width: 680px; }
.mjet-page[data-mjet-template="editorial"] .mjet-btn { border-radius: 2px; letter-spacing: .02em; }
.mjet-page[data-mjet-template="editorial"] .mjet-quiz__title,
.mjet-page[data-mjet-template="editorial"] .mjet-tutor__title { letter-spacing: -0.01em; }

/* =========================================================
   STUDIO MINIMAL — klar & modern
   ========================================================= */
.mjet-page[data-mjet-template="minimal"] {
	--mjet-accent: #0e5c54;
	--mjet-accent-dark: #0a463f;
	--mjet-border: #e7e9ee;
	--mjet-muted: #697079;
	--mjet-radius: 12px;
	--mjet-ink: #15161a;
	--mjet-surface: #f5f7f8;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.mjet-page[data-mjet-template="minimal"] .mjet-lesson-view__content h2 { letter-spacing: -0.02em; }

/* =========================================================
   VERSPIELT — warm & farbig
   ========================================================= */
.mjet-page[data-mjet-template="playful"] {
	--mjet-accent: #f5623c;
	--mjet-accent-dark: #e04a24;
	--mjet-border: #f3e4d7;
	--mjet-muted: #8b7d73;
	--mjet-radius: 20px;
	--mjet-ink: #2c2622;
	--mjet-surface: #fff1e6;
	font-family: "Segoe UI", system-ui, ui-rounded, sans-serif;
}
.mjet-page[data-mjet-template="playful"] .mjet-quiz {
	border: 2px dashed color-mix(in srgb, var(--mjet-accent) 40%, var(--mjet-border));
}
.mjet-page[data-mjet-template="playful"] .mjet-btn {
	box-shadow: 0 8px 18px -8px color-mix(in srgb, var(--mjet-accent) 60%, transparent);
}