/* Pulse Academy – Katalog im Liquid-Glas-Look (theme-neutral, .pa- gescoped). */

.pa-academy { --pa-accent:#e5007a; --pa-blue:#104786; --pa-radius:14px; }
.pa-academy * { box-sizing: border-box; }

.pa-section { margin: 0 0 2.5rem; }
.pa-section__title { font-size: 1.6rem; margin: 0 0 1rem; color: var(--pa-blue); }
.pa-cat { margin: 0 0 1.75rem; }
.pa-cat__title { font-size: 1.15rem; margin: 0 0 .75rem; color: var(--pa-blue); opacity: .9; }

/* Filterleiste + Monatsgruppen */
.pa-filters { display: flex; flex-direction: column; gap: .5rem; margin: 0 0 1.6rem; }
.pa-filter { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.pa-filter__label { font-weight: 700; color: var(--pa-blue); font-size: .9rem; margin-right: .3rem; }
.pa-pill { cursor: pointer; border: 1px solid rgba(16,71,134,.2); background: rgba(255,255,255,.6); color: var(--pa-blue); border-radius: 999px; padding: .32rem .85rem; font-size: .85rem; line-height: 1.2; transition: background .2s, color .2s, border-color .2s; }
.pa-pill:hover { border-color: var(--pa-accent); color: var(--pa-accent); }
.pa-pill.is-active { background: linear-gradient(135deg, #104786, #244e93); color: #fff; border-color: transparent; }
.pa-month { margin: 0 0 1.6rem; }
.pa-month__title { font-size: 1.15rem; color: var(--pa-blue); margin: 0 0 .8rem; }
.pa-empty-msg { color: #44566b; font-style: italic; }

.pa-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 20px;
	align-items: start;
}

.pa-card {
	display: flex; flex-direction: column;
	text-align: left; padding: 0; cursor: pointer;
	background: rgba(255,255,255,.6);
	-webkit-backdrop-filter: blur(16px) saturate(150%);
	backdrop-filter: blur(16px) saturate(150%);
	border: 1px solid rgba(255,255,255,.6);
	border-radius: var(--pa-radius);
	box-shadow: 0 12px 32px rgba(16,71,134,.12), inset 0 1px 0 rgba(255,255,255,.6);
	overflow: hidden;
	transition: transform .25s cubic-bezier(.34,1.56,.64,1), box-shadow .25s ease, border-color .25s ease;
}
.pa-card:hover, .pa-card:focus-visible {
	transform: translateY(-6px);
	border-color: rgba(255,255,255,.95);
	box-shadow: 0 20px 38px rgba(16,71,134,.2);
	outline: none;
}
/* Cover als echtes Bild in natuerlicher Breite -> Breitbild-Banner werden NICHT
   beschnitten (zeigt das volle Motiv, Hoehe richtet sich nach dem Bild). */
.pa-card__media {
	display: block; width: 100%; height: auto;
	background-color: #eef2f8;
}
.pa-card__media--empty { aspect-ratio: 16 / 9; }
.pa-card__content { display: flex; flex-direction: column; gap: .35rem; padding: 14px 16px 18px; }
.pa-card__sub { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--pa-accent); font-weight: 700; }
.pa-card__title { font-size: 1.02rem; font-weight: 700; line-height: 1.25; color: var(--pa-blue); }
.pa-card__meta { display: flex; flex-wrap: wrap; gap: .25rem .7rem; font-size: .82rem; color: #44566b; margin-top: .15rem; }
/* Sichtbarer "Details"-Hinweis (die ganze Karte ist klickbar; dies signalisiert es). */
.pa-card__cta {
	align-self: flex-start; margin-top: .7rem;
	display: inline-flex; align-items: center; gap: .3rem;
	padding: .42rem .95rem; border-radius: 999px;
	background: var(--pa-accent); color: #fff;
	font-size: .8rem; font-weight: 700; line-height: 1;
	transition: filter .2s ease, transform .2s ease;
}
.pa-card:hover .pa-card__cta, .pa-card:focus-visible .pa-card__cta { filter: brightness(1.08); transform: translateX(2px); }
.pa-meta__price { font-weight: 700; color: #104786; }
.pa-meta__tax { font-weight: 400; color: #6b7a8c; }
.pa-meta__lock { color: #7a6f00; }
.pa-meta__lock::before { content: "🔒 "; }

.pa-empty { display: inline-block; padding: .6rem 0; color: var(--pa-accent); text-decoration: none; font-weight: 600; }

.pa-notice { padding: 1rem 1.2rem; border-radius: var(--pa-radius); background: rgba(255,255,255,.6); border: 1px solid rgba(255,255,255,.6); }
.pa-notice--error { color: #8a1f1f; }

/* Detail-Overlay */
.pa-modal { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; padding: 20px; }
.pa-modal[hidden] { display: none; }
.pa-modal__backdrop { position: absolute; inset: 0; background: rgba(16,28,46,.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.pa-modal__box {
	position: relative; z-index: 1; width: min(640px, 100%); max-height: 88vh; overflow: auto;
	background: rgba(255,255,255,.92);
	-webkit-backdrop-filter: blur(20px) saturate(160%); backdrop-filter: blur(20px) saturate(160%);
	border: 1px solid rgba(255,255,255,.7); border-radius: 18px;
	box-shadow: 0 30px 70px rgba(16,71,134,.3);
}
.pa-modal__close { position: absolute; top: 10px; right: 14px; z-index: 2; border: 0; background: transparent; font-size: 28px; line-height: 1; cursor: pointer; color: #2b3a4d; }
.pa-modal__media { width: 100%; aspect-ratio: 16 / 8; background-size: contain; background-repeat: no-repeat; background-position: center; background-color: #eef2f8; border-radius: 18px 18px 0 0; }
.pa-modal__body { padding: 20px 24px 24px; }
.pa-modal__sub { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--pa-accent); font-weight: 700; margin: 0 0 .25rem; }
.pa-modal__title { font-size: 1.5rem; margin: 0 0 .6rem; color: var(--pa-blue); }
.pa-modal__meta { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .9rem; color: #44566b; margin-bottom: .9rem; }
.pa-modal__desc { color: #2f3e4f; line-height: 1.55; margin-bottom: 1.4rem; }
.pa-modal__desc p { margin: 0 0 .8rem; }
.pa-modal__desc h2, .pa-modal__desc h3, .pa-modal__desc h4 { color: var(--pa-blue); line-height: 1.25; margin: 1.1rem 0 .4rem; }
.pa-modal__desc h2 { font-size: 1.15rem; }
.pa-modal__desc h3 { font-size: 1.04rem; }
.pa-modal__desc h4 { font-size: .98rem; }
.pa-modal__desc ul, .pa-modal__desc ol { margin: 0 0 .9rem 1.25rem; padding: 0; }
.pa-modal__desc li { margin: .25rem 0; }
.pa-modal__desc a { color: var(--pa-accent); font-weight: 600; }
.pa-modal__desc blockquote { margin: 0 0 .9rem; padding-left: .9rem; border-left: 3px solid rgba(16,71,134,.25); color: #44566b; }
.pa-btn {
	display: inline-block; padding: .8rem 1.4rem; border-radius: 12px; text-decoration: none; font-weight: 700;
	color: #fff; background: linear-gradient(135deg, #e5007a 0%, #c9006c 100%);
	box-shadow: 0 8px 22px rgba(229,0,122,.3); transition: transform .15s ease, box-shadow .25s ease;
}
.pa-btn:hover { transform: translateY(-1px); box-shadow: 0 12px 28px rgba(229,0,122,.4); color:#fff; }
.pa-modal__cta--top { margin-bottom: 1.3rem; }
.pa-modal__meta .pa-meta__price { font-weight: 700; color: #104786; }
.pa-modal__note { background: rgba(16,71,134,.07); border: 1px solid rgba(16,71,134,.12); border-radius: 10px; padding: .7rem .95rem; font-size: .92rem; color: #2f3e4f; margin-bottom: 1.2rem; }
.pa-modal__note a { color: var(--pa-accent); font-weight: 700; }

body.pa-modal-open { overflow: hidden; }

/* ----------------------------------------------------- [pulse_academy_page] */
/* Einzelne Circle-Seite, ins KP-Design eingebettet (Content-Reflow).        */
.pa-page { color: inherit; }
.pa-page .pa-section { margin: 0 0 2.5rem; }
.pa-page .pa-section:last-child { margin-bottom: 0; }
.pa-page h1, .pa-page h2, .pa-page h3 { margin: 0 0 .6em; line-height: 1.2; }
.pa-page p { margin: 0 0 1em; line-height: 1.6; }
.pa-page .pa-img { max-width: 100%; height: auto; border-radius: 12px; display: block; }
.pa-page .pa-img-link { display: inline-block; }

/* Karten-Raster (CardCallToAction) */
.pa-page .pa-section > .pa-card,
.pa-page .pa-cards { display: grid; gap: 1.5rem; }
.pa-page .pa-section { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); align-items: start; }
.pa-page .pa-section > h1, .pa-page .pa-section > h2, .pa-page .pa-section > h3,
.pa-page .pa-section > p { grid-column: 1 / -1; }
.pa-page .pa-card {
	background: #fff; border: 1px solid rgba(16,71,134,.12); border-radius: 14px;
	padding: 1.4rem; box-shadow: 0 2px 14px rgba(16,71,134,.06);
	display: flex; flex-direction: column; gap: .7rem;
}
.pa-page .pa-card .pa-img { border-radius: 10px; }

/* Badges */
.pa-page .pa-badges { display: flex; flex-wrap: wrap; gap: .4rem; }
.pa-page .pa-badge {
	display: inline-block; font-size: .82rem; font-weight: 600; line-height: 1;
	padding: .4em .8em; border-radius: 999px;
	background: rgba(16,71,134,.08); color: #104786;
}

/* Buttons */
.pa-page .pa-btn {
	display: inline-block; font-weight: 700; text-decoration: none;
	padding: .7em 1.4em; border-radius: 8px; background: var(--pa-accent, #e5007a); color: #fff;
}
.pa-page .pa-btn--secondary { background: transparent; color: #104786; border: 2px solid #104786; }
.pa-page .pa-btn:hover { filter: brightness(.95); }

/* Liquid-Layout: volle Breite ausnutzen */
.pa-page--liquid { width: 100%; }
.pa-page--liquid .pa-section { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }

/* Seminar-Termine auf Desktop als vollbreite Listen-Zeilen (Bild links, Infos rechts).
   So bleibt kein leerer Raum rechts, wenn ein Monat nur wenige Termine hat. Die
   eLearning-Kacheln (.pa-elearnings) bleiben als Grid; mobil bleibt alles gestapelt. */
@media (min-width: 800px) {
	.pa-seminars .pa-grid { grid-template-columns: 1fr; gap: 12px; }
	/* Bild mit FESTER Hoehe im Banner-Format (kein Seiten-Crop) und vertikal zentriert.
	   Die Zeilenhoehe darf bei langem (2-zeiligem) Titel mitwachsen -> nichts wird
	   abgeschnitten; bei kurzem Titel fuellt das Bild die Zeile (wie gewuenscht). */
	.pa-seminars .pa-card { flex-direction: row; align-items: center; }
	.pa-seminars .pa-card__media {
		width: 360px; min-width: 360px; height: 116px; align-self: center;
		object-fit: cover; object-position: center; aspect-ratio: auto;
	}
	.pa-seminars .pa-card__media--empty { aspect-ratio: auto; }
	.pa-seminars .pa-card__content { flex: 1; justify-content: center; gap: .1rem; padding: 10px 20px; }
	.pa-seminars .pa-card__sub { font-size: .68rem; }
	.pa-seminars .pa-card__title {
		font-size: .92rem; line-height: 1.15; margin: 0;
		display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
	}
	.pa-seminars .pa-card__meta { font-size: .8rem; gap: .05rem .9rem; margin-top: .15rem; }
	.pa-seminars .pa-card__cta { margin-top: .35rem; padding: .3rem .8rem; font-size: .73rem; }
}
