/* =========================================================
   Philatelistische Akademie e.V.
   Designsystem
   ========================================================= */

/* source-sans-3-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/source-sans-3-v19-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-200italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 200;
  src: url('../fonts/source-sans-3-v19-latin-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/source-sans-3-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/source-sans-3-v19-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/source-sans-3-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/source-sans-3-v19-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/source-sans-3-v19-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/source-sans-3-v19-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/source-sans-3-v19-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/source-sans-3-v19-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/source-sans-3-v19-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/source-sans-3-v19-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/source-sans-3-v19-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 800;
  src: url('../fonts/source-sans-3-v19-latin-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/source-sans-3-v19-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* source-sans-3-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Source Sans 3';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/source-sans-3-v19-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* libre-baskerville-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/libre-baskerville-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/libre-baskerville-v24-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/libre-baskerville-v24-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/libre-baskerville-v24-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/libre-baskerville-v24-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/libre-baskerville-v24-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/libre-baskerville-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* libre-baskerville-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Libre Baskerville';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/libre-baskerville-v24-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



:root {
    --pa-blue: #0060b0;
    --pa-blue-dark: #123f70;
    --pa-ink: #21384d;
    --pa-muted: #607386;
    --pa-paper: #f6f7f7;
    --pa-border: #dce4e9;
    --pa-white: #ffffff;

    /* Cassiopeia Extended überschreiben */
    --body-bg: var(--pa-white);
    --body-color: var(--pa-ink);
    --headerbg: var(--pa-white);
    --headercolor: var(--pa-ink);
    --link-color: var(--pa-blue);
    --link-hover-color: var(--pa-blue-dark);
    --footerbg: #f1f4f6;
    --footercolor: #38536b;
}

body {
    background: var(--pa-white);
    color: var(--pa-ink);
    font-family: "Source Sans 3", Arial, Helvetica, sans-serif;
    line-height: 1.65;
}

/* Überschriften – bis unsere lokalen Fonts eingebunden sind */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--pa-blue-dark);
    font-family: "Libre Baskerville", Georgia, "Times New Roman", serif;
    font-weight: 700;
    line-height: 1.18;
}

/* Cassiopeia-Kopfbereich entschärfen */
.container-header {
    background: var(--pa-white);
    background-image: none;
    color: var(--pa-ink);
    box-shadow: 0 1px 0 rgba(18, 63, 112, 0.12);
    padding-left: max(2rem, calc((100vw - 1500px) / 2));
    padding-right: max(2rem, calc((100vw - 1500px) / 2));
    gap: 2rem;
}

.container-header .navbar-brand,
.container-header .site-description {
    color: var(--pa-blue-dark);
}

.container-header .mod-menu {
    color: var(--pa-ink);
    flex-wrap: nowrap;
    gap: 1.05rem;
}

.container-header .mod-menu > li > a {
    color: var(--pa-ink);
    text-decoration: none;
    font-size: 0.9rem;
    white-space: nowrap;
}

.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li.active > a {
    color: var(--pa-blue);
}

/* Links */
a {
    color: var(--pa-blue);
}

a:hover,
a:focus {
    color: var(--pa-blue-dark);
}


/* =========================================================
   Akademie Header
   ========================================================= */

.container-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.5rem;
    padding: 0.7rem max(2rem, calc((100vw - 1320px) / 2));
}

/* Cassiopeia-Container im Header auflösen */
.container-header > .grid-child {
    width: auto;
    max-width: none;
    margin: 0;
}

/* Branding */
.container-header .container-below-top {
    flex: 0 0 auto;
}

.pa-brand {
    display: flex;
    align-items: center;
    gap: 1rem;
    white-space: nowrap;
}

.pa-brand__logo {
    display: block;
    flex: 0 0 auto;
}

.pa-brand__logo img {
    display: block;
    width: 82px;
    height: auto;
}

.pa-brand__text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.pa-brand__title {
    color: var(--pa-blue-dark);
    font-family: "Libre Baskerville", Georgia, "Times New Roman", serif;
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.1;
}

.pa-brand__claim {
    margin-top: 0.25rem;
    color: var(--pa-muted);
    font-size: 0.9rem;
    line-height: 1.25;
}

/* Navigation */
.container-header .container-nav {
    flex: 1 1 auto;
    justify-content: flex-end;
    padding: 0;
}

.container-header .mod-menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.65rem;
    margin: 0;
}

.container-header .mod-menu > li {
    margin: 0;
}

.container-header .mod-menu > li > a {
    padding: 0.8rem 0;
    font-size: 0.95rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Mobil zunächst sauber umbrechen */
@media (max-width: 1100px) {
    .container-header {
        flex-wrap: wrap;
    }

    .container-header .container-nav {
        flex-basis: 100%;
        justify-content: flex-start;
    }

    .container-header .mod-menu {
        justify-content: flex-start;
        gap: 1.2rem;
    }
}

/* Hauptnavigation immer einzeilig */
.container-header .mod-menu > li {
    flex: 0 0 auto;
}

.container-header .mod-menu > li > a,
.container-header .mod-menu > li > button,
.container-header .mod-menu > li > span {
    white-space: nowrap;
}

/* =========================================================
   Header kompakter ausbalancieren
   ========================================================= */

.pa-brand__logo img {
    width: 72px;
}

.pa-brand {
    gap: 0.8rem;
}

.pa-brand__title {
    font-size: 1.35rem;
}

.pa-brand__claim {
    font-size: 0.8rem;
}

.container-header {
    gap: 1.4rem;
}

.container-header .mod-menu {
    gap: 0.7rem;
}

.container-header .mod-menu > li > a,
.container-header .mod-menu > li > button,
.container-header .mod-menu > li > span {
    font-size: 0.84rem;
}



/* =========================================================
   Hero Startseite
   ========================================================= */

.container-banner {
    margin: 0;
    padding: 0;
}

.pa-hero {
    width: 100%;
    background: #f7f8f8;
    border-bottom: 1px solid var(--pa-border);
}

.pa-hero__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(460px, 1.05fr);
    align-items: stretch;
    max-width: 1500px;
    min-height: 390px;
    margin: 0 auto;
}

.pa-hero__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 4rem 3.5rem 3.5rem 2rem;
}

.pa-hero h1 {
    max-width: 720px;
    margin: 0 0 1.25rem;
    color: var(--pa-blue-dark);
    font-family: "Libre Baskerville", Georgia, serif;
    font-size: clamp(2.5rem, 4vw, 4.25rem);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.025em;
}

.pa-hero__lead {
    max-width: 650px;
    margin: 0;
    color: var(--pa-ink);
    font-size: 1.15rem;
    line-height: 1.55;
}

.pa-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1.8rem;
}

.pa-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0.7rem 1.5rem;
    border: 1px solid var(--pa-blue);
    border-radius: 4px;
    font-weight: 600;
    text-decoration: none;
    transition:
        background-color 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease;
}

.pa-button--primary {
    background: var(--pa-blue);
    color: #fff;
}

.pa-button--primary:hover,
.pa-button--primary:focus {
    background: var(--pa-blue-dark);
    border-color: var(--pa-blue-dark);
    color: #fff;
}

.pa-button--secondary {
    background: transparent;
    color: var(--pa-blue);
}

.pa-button--secondary:hover,
.pa-button--secondary:focus {
    background: #fff;
    color: var(--pa-blue-dark);
}

.pa-hero__since {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1.8rem;
    color: var(--pa-muted);
    font-family: "Libre Baskerville", Georgia, serif;
    font-size: 0.9rem;
}

.pa-hero__since span {
    width: 48px;
    height: 1px;
    background: #9cabb7;
}

.pa-hero__visual {
    min-height: 390px;
    background:
        linear-gradient(
            135deg,
            rgba(0, 96, 176, 0.08),
            rgba(18, 63, 112, 0.18)
        );
}

.pa-hero__visual-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 390px;
    color: var(--pa-muted);
    font-size: 0.9rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

@media (max-width: 900px) {
    .pa-hero__inner {
        grid-template-columns: 1fr;
    }

    .pa-hero__content {
        padding: 3rem 1.5rem;
    }

    .pa-hero__visual {
        min-height: 280px;
    }
}

/* Hero-Bild Philatelistische Akademie */
.pa-hero__visual {
    min-height: 390px;
    background:
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.04),
            rgba(18, 63, 112, 0.04)
        ),
        url("https://www.philatelistische-akademie.de/images/site/philatelistische-akademie-hero-briefmarken.webp");

    background-size: cover;
    background-position: 62% center;
    background-repeat: no-repeat;
}

.pa-hero__visual-placeholder {
    display: none;
}

.pa-hero__since::before,
.pa-hero__since::after {
    content: "";
    display: block;
    width: 48px;
    height: 1px;
    flex: 0 0 48px;
    background: #9cabb7;
}

.pa-hero__since span {
    display: none;
}


/* =========================================================
   Einstiege Startseite
   ========================================================= */

.pa-entry {
    width: 100%;
    padding: 1.25rem 2rem;
    background: #f7f8f8;
    border-bottom: 1px solid var(--pa-border);
}

.pa-entry__inner {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    max-width: 1500px;
    margin: 0 auto;
}

.pa-entry-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 1rem;
    min-height: 185px;
    padding: 1.4rem;
    background: var(--pa-white);
    border: 1px solid rgba(18, 63, 112, 0.08);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(18, 63, 112, 0.05);
}

.pa-entry-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #edf4f8;
    color: var(--pa-blue);
}

.pa-entry-card__icon .fas {
    color: var(--pa-blue);
    font-size: 1.65rem;
    line-height: 1;
}

.pa-entry-card h2 {
    margin: 0 0 0.55rem;
    font-size: 1.05rem;
    line-height: 1.3;
}

.pa-entry-card p {
    margin: 0 0 0.85rem;
    color: var(--pa-muted);
    font-size: 0.95rem;
    line-height: 1.45;
}

.pa-entry-card a {
    font-weight: 600;
    font-size: 0.92rem;
    text-decoration: none;
}

.pa-entry-card a span {
    display: inline-block;
    margin-left: 0.3rem;
    transition: transform 0.2s ease;
}

.pa-entry-card a:hover span {
    transform: translateX(4px);
}

@media (max-width: 1150px) {
    .pa-entry__inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 650px) {
    .pa-entry {
        padding: 1rem;
    }

    .pa-entry__inner {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Auftrag & Aktuelles
   ========================================================= */

.pa-home-content {
    width: 100%;
    padding: 3.5rem 2rem 4rem;
    background: var(--pa-white);
}

.pa-home-content__inner {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.25fr);
    gap: 4rem;
    max-width: 1500px;
    margin: 0 auto;
}

.pa-mission {
    padding-left: 1.5rem;
    border-left: 3px solid var(--pa-blue);
}

.pa-section-label {
    margin-bottom: 0.6rem;
    color: var(--pa-blue);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.pa-mission h2 {
    margin: 0 0 1.2rem;
    font-size: clamp(1.8rem, 2.5vw, 2.7rem);
}

.pa-mission p {
    max-width: 680px;
    margin: 0 0 1.5rem;
    color: var(--pa-muted);
    font-size: 1rem;
    line-height: 1.7;
}

.pa-news__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.pa-news__header .pa-section-label {
    margin: 0;
}

.pa-news__header > a {
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
}

.pa-news__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.pa-news-card {
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--pa-border);
    border-radius: 6px;
}

.pa-news-card__image {
    height: 105px;
    background-color: #e8eef2;
    background-position: center;
    background-size: cover;
}

.pa-news-card__image--one {
    background-image: url("https://www.philatelistische-akademie.de/images/site/aktuelles-angebote-termine.webp");
}

.pa-news-card__image--two {
    background-image: url("https://www.philatelistische-akademie.de/images/site/aktuelles-wissen-reader.webp");
}

.pa-news-card__image--three {
    background-image: url("https://www.philatelistische-akademie.de/images/site/aktuelles-akademie.webp");
}

.pa-news-card__body {
    padding: 1rem;
}

.pa-news-card__date {
    margin-bottom: 0.35rem;
    color: var(--pa-muted);
    font-size: 0.76rem;
}

.pa-news-card h3 {
    margin: 0 0 0.55rem;
    font-size: 1rem;
    line-height: 1.35;
}

.pa-news-card p {
    margin: 0 0 0.8rem;
    color: var(--pa-muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.pa-news-card a {
    font-size: 0.86rem;
    font-weight: 600;
    text-decoration: none;
}

@media (max-width: 1100px) {
    .pa-home-content__inner {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }
}

@media (max-width: 750px) {
    .pa-news__grid {
        grid-template-columns: 1fr;
    }

    .pa-home-content {
        padding: 2.5rem 1rem;
    }
}



.pa-footer {
    background: #f1f4f6;
    border-top: 1px solid var(--pa-border);
}

.pa-footer__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    max-width: 1500px;
    margin: 0 auto;
    padding: 1.15rem 2rem;
    color: #587082;
    font-size: 0.85rem;
}

.pa-footer__copy span {
    margin-left: 0.75rem;
}

.pa-footer__nav {
    display: flex;
    gap: 1.5rem;
}

.pa-footer__nav a {
    color: #38536b;
    text-decoration: none;
}

.pa-footer__nav a:hover,
.pa-footer__nav a:focus {
    color: var(--pa-blue);
}

@media (max-width: 700px) {
    .pa-footer__inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .pa-footer__copy span {
        display: block;
        margin: 0.25rem 0 0;
    }
}


/* =========================================================
   Cassiopeia Footer vollständig übernehmen
   ========================================================= */

.container-footer {
    margin-top: 0;
    padding: 0;
    background: #f1f4f6;
    background-image: none;
    color: #587082;
    border-top: 1px solid var(--pa-border);
}

/* Cassiopeias Footer-Container nicht mehr als schmalen Flexblock behandeln */
.container-footer .grid-child {
    display: block;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

/* Unser Footer übernimmt die gesamte Breite */
.pa-footer {
    width: 100%;
    background: #f1f4f6;
    border: 0;
}

.pa-footer__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
    padding: 1.15rem 2rem;
}

/* Footer-Links klar sichtbar halten */
.pa-footer__nav a {
    color: #38536b;
    text-decoration: none;
    transition: color 0.2s ease;
}

.pa-footer__nav a:hover,
.pa-footer__nav a:focus {
    color: var(--pa-blue-dark);
    text-decoration: underline;
    text-underline-offset: 0.18em;
}

.container-footer .pa-footer__nav a:hover,
.container-footer .pa-footer__nav a:focus {
    color: var(--pa-blue-dark);
}



/* =========================================================
   Icons Direkteinstiege
   ========================================================= */

.pa-entry-card__icon::before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-color: var(--pa-blue);

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: contain;
    mask-size: contain;
}

/* Fernkurse – Doktorhut */
.pa-entry-card__icon--courses::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 9l10-5 10 5-10 5L2 9zm4 3.2V17l6 3 6-3v-4.8l-6 3-6-3z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 9l10-5 10 5-10 5L2 9zm4 3.2V17l6 3 6-3v-4.8l-6 3-6-3z'/%3E%3C/svg%3E");
}

/* Seminare – Personengruppe */
.pa-entry-card__icon--seminars::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm8 0a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM1 20v-2c0-3.3 3.1-5 7-5s7 1.7 7 5v2H1zm15 0v-2c0-1.7-.6-3-1.6-4 4.6-.3 8.6 1.2 8.6 4v2h-7z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm8 0a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM1 20v-2c0-3.3 3.1-5 7-5s7 1.7 7 5v2H1zm15 0v-2c0-1.7-.6-3-1.6-4 4.6-.3 8.6 1.2 8.6 4v2h-7z'/%3E%3C/svg%3E");
}

/* Fachbeiträge – Dokument */
.pa-entry-card__icon--articles::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 2h10l4 4v16H5V2zm9 1.8V7h3.2L14 3.8zM8 11h8V9H8v2zm0 4h8v-2H8v2zm0 4h6v-2H8v2z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 2h10l4 4v16H5V2zm9 1.8V7h3.2L14 3.8zM8 11h8V9H8v2zm0 4h8v-2H8v2zm0 4h6v-2H8v2z'/%3E%3C/svg%3E");
}

/* Expertenvermittlung – Personen */
.pa-entry-card__icon--experts::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm7.5 1a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM2 21v-2c0-4 3.2-6 7-6 2 0 3.8.5 5.1 1.5A6.7 6.7 0 0 0 13 18v3H2zm13 0v-2c0-1.5-.4-2.8-1.1-3.9.8-.7 2-1.1 3.6-1.1 3.2 0 5.5 1.7 5.5 4.5V21h-8z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm7.5 1a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7zM2 21v-2c0-4 3.2-6 7-6 2 0 3.8.5 5.1 1.5A6.7 6.7 0 0 0 13 18v3H2zm13 0v-2c0-1.5-.4-2.8-1.1-3.9.8-.7 2-1.1 3.6-1.1 3.2 0 5.5 1.7 5.5 4.5V21h-8z'/%3E%3C/svg%3E");
}






/* =========================================================
   MOBILE NAVIGATION – AUTORITATIVE FINAL RULESET
   Portrait + Landscape + Tablet bis 1100px
   ========================================================= */

@media (max-width: 1100px) {

    /* -----------------------------------------------------
       Header: Branding links, Hamburger rechts
       ----------------------------------------------------- */

    .container-header {
        position: relative !important;

        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-rows: auto !important;
        align-items: center !important;

        gap: 0.75rem !important;

        min-height: 0 !important;
        padding: 0.75rem 1rem !important;
    }

    .container-header > .grid-child {
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    /* Branding */

    .container-header .container-below-top {
        grid-column: 1;
        grid-row: 1;

        min-width: 0;
        padding: 0 !important;
    }

    .pa-brand {
        display: flex;
        align-items: center;

        min-width: 0;
        gap: 0.6rem;

        white-space: normal;
    }

    .pa-brand__logo {
        flex: 0 0 auto;
    }

    .pa-brand__logo img {
        display: block;

        width: 52px;
        height: auto;
    }

    .pa-brand__text {
        min-width: 0;
    }

    .pa-brand__title {
        font-size: clamp(0.95rem, 2.2vw, 1.25rem);
        line-height: 1.15;

        white-space: nowrap;
    }

    .pa-brand__claim {
        margin-top: 0.12rem;

        font-size: clamp(0.56rem, 1.2vw, 0.72rem);
        line-height: 1.2;

        white-space: nowrap;
    }


    /* -----------------------------------------------------
       Navigation / Hamburger
       ----------------------------------------------------- */

    .container-header .container-nav {
        position: static !important;

        grid-column: 2;
        grid-row: 1;

        display: block !important;

        width: auto !important;
        min-width: 44px !important;
        max-width: none !important;

        flex: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /*
     * Wichtig:
     * .navbar darf NICHT Bezugspunkt des absoluten Menüs sein.
     */
    .container-header .navbar {
        position: static !important;

        display: block !important;

        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .container-header .navbar-toggler {
        display: flex !important;

        align-items: center;
        justify-content: center;

        width: 44px;
        height: 44px;

        margin: 0 !important;
        padding: 0 !important;

        color: var(--pa-blue-dark);

        background: #fff;
        border: 1px solid var(--pa-border);
        border-radius: 6px;

        box-shadow: none;
    }

    .container-header .navbar-toggler:hover,
    .container-header .navbar-toggler:focus {
        color: var(--pa-blue);

        background: #f5f8fa;
        border-color: var(--pa-blue);
    }

    .container-header .navbar-toggler [class^="icon-"],
    .container-header .navbar-toggler [class*=" icon-"] {
        color: inherit;
        font-size: 1.35rem;
    }


    /* -----------------------------------------------------
       Hauptmenü geschlossen / geöffnet
       ----------------------------------------------------- */

    /*
     * Bootstrap navbar-expand-md würde ab 768px sonst
     * automatisch wieder Desktop-Modus erzwingen.
     */
    .container-header .navbar-collapse {
        position: absolute !important;
        z-index: 1000;

        top: 100% !important;
        left: 0 !important;
        right: 0 !important;

        display: none !important;

        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        background: #fff;

        border-top: 1px solid var(--pa-border);
        border-bottom: 1px solid var(--pa-border);

        box-shadow: 0 16px 32px rgba(18, 63, 112, 0.14);
    }

    .container-header .navbar-collapse.show,
    .container-header .navbar-collapse.collapsing {
        display: block !important;
    }

    /*
     * Gerade im Querformat wichtig:
     * Menü darf scrollen statt aus dem Viewport zu laufen.
     */
    .container-header .navbar-collapse.show {
        max-height: calc(100vh - 70px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }


    /* -----------------------------------------------------
       Hauptmenüpunkte
       ----------------------------------------------------- */

    .container-header .navbar-collapse .mod-menu {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0.65rem 1.25rem 0.9rem !important;
    }

    .container-header .navbar-collapse .mod-menu > li {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;

        border-bottom: 1px solid #edf1f4;
    }

    .container-header .navbar-collapse .mod-menu > li:last-child {
        border-bottom: 0;
    }

    /*
     * Joomla erzeugt drei Varianten:
     * a = echter Link
     * button = Elternpunkt mit Untermenü
     * span = derzeitige Menüüberschrift
     */
    .container-header .navbar-collapse .mod-menu > li > a,
    .container-header .navbar-collapse .mod-menu > li > button,
    .container-header .navbar-collapse .mod-menu > li > span {
        display: flex !important;

        align-items: center;
        justify-content: space-between;

        width: 100% !important;

        margin: 0 !important;
        padding: 0.85rem 0 !important;

        color: var(--pa-ink) !important;

        font-family: "Source Sans 3", Arial, sans-serif;
        font-size: 1rem !important;
        font-weight: 600 !important;
        line-height: 1.3;

        text-align: left;
        white-space: normal;

        background: transparent !important;
        border: 0 !important;
    }


    /* -----------------------------------------------------
       Untermenüs
       ----------------------------------------------------- */

    /*
     * Joomla-Markup:
     *
     * button.mod-menu__toggle-sub
     * + ul.mod-menu__sub
     *
     * Wir steuern die Sichtbarkeit bewusst über aria-expanded.
     */

    .container-header .navbar-collapse .mod-menu__sub {
        position: static !important;

        display: none !important;

        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 0 0.65rem 1rem !important;

        background: transparent !important;

        border: 0 !important;
        box-shadow: none !important;
    }

    .container-header
    .navbar-collapse
    .mod-menu__toggle-sub[aria-expanded="true"]
    + .mod-menu__sub {
        display: block !important;
    }

    .container-header .navbar-collapse .mod-menu__sub > li {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        border: 0 !important;
    }

    /*
     * WICHTIG:
     * Deine derzeitigen Unterpunkte sind SPANs,
     * weil wir sie als Menüüberschriften angelegt haben.
     *
     * Später echte Seiten werden daraus <a>.
     * Deshalb stylen wir beide Varianten.
     */
    .container-header
    .navbar-collapse
    .mod-menu__sub
    > li
    > .mod-menu__heading,

    .container-header
    .navbar-collapse
    .mod-menu__sub
    > li
    > a {

        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0.5rem 0.25rem !important;

        color: var(--pa-muted) !important;

        font-family: "Source Sans 3", Arial, sans-serif;
        font-size: 0.92rem !important;
        font-weight: 400 !important;
        line-height: 1.4;

        white-space: normal !important;

        background: transparent !important;
    }

    .container-header
    .navbar-collapse
    .mod-menu__sub
    > li
    > a:hover,

    .container-header
    .navbar-collapse
    .mod-menu__sub
    > li
    > a:focus {

        color: var(--pa-blue) !important;
    }


    /* -----------------------------------------------------
       Chevron beim Öffnen drehen
       ----------------------------------------------------- */

    .container-header .mod-menu__toggle-sub .icon-chevron-down {
        transition: transform 0.2s ease;
    }

    .container-header
    .mod-menu__toggle-sub[aria-expanded="true"]
    .icon-chevron-down {

        transform: rotate(180deg);
    }
}


/* =========================================================
   Mobile Navigation – Animation & Hamburger → X
   ========================================================= */

@media (max-width: 1100px) {

    /* Eigenes Hamburger-Symbol */
    .container-header .navbar-toggler .icon-menu {
        position: relative;

        display: block;
        width: 20px;
        height: 14px;

        color: currentColor;

        background:
            linear-gradient(currentColor, currentColor)
            center / 100% 2px no-repeat;

        transition: background-size 0.2s ease;
    }

    /* Joomla-Iconfont überschreiben */
    .container-header .navbar-toggler .icon-menu::before,
    .container-header .navbar-toggler .icon-menu::after {
        content: "" !important;

        position: absolute;
        left: 0;

        width: 20px;
        height: 2px;

        background: currentColor;

        transition:
            top 0.22s ease,
            bottom 0.22s ease,
            transform 0.22s ease;
    }

    .container-header .navbar-toggler .icon-menu::before {
        top: 0;
    }

    .container-header .navbar-toggler .icon-menu::after {
        bottom: 0;
    }

    /* geöffnet: mittlere Linie verschwindet */
    .container-header
    .navbar-toggler[aria-expanded="true"]
    .icon-menu {
        background-size: 0 2px;
    }

    /* geöffnet: obere und untere Linie werden zum X */
    .container-header
    .navbar-toggler[aria-expanded="true"]
    .icon-menu::before {
        top: 6px;
        transform: rotate(45deg);
    }

    .container-header
    .navbar-toggler[aria-expanded="true"]
    .icon-menu::after {
        bottom: 6px;
        transform: rotate(-45deg);
    }


    /* Menü etwas weicher erscheinen lassen */
    .container-header .navbar-collapse {
        opacity: 0;
        transform: translateY(-8px);
    }

    .container-header .navbar-collapse.collapsing {
        opacity: 0.35;
        transform: translateY(-5px);

        transition:
            height 0.3s ease,
            opacity 0.22s ease,
            transform 0.22s ease;
    }

    .container-header .navbar-collapse.show {
        opacity: 1;
        transform: translateY(0);

        transition:
            opacity 0.25s ease,
            transform 0.25s ease;
    }
}


/* Bewegungsreduktion respektieren */
@media (prefers-reduced-motion: reduce) {

    .container-header .navbar-toggler .icon-menu,
    .container-header .navbar-toggler .icon-menu::before,
    .container-header .navbar-toggler .icon-menu::after,
    .container-header .navbar-collapse {
        transition: none !important;
    }
}



/* =========================================================
   Footer – Joomla-Menü integrieren
   ========================================================= */

.container-footer > .grid-child {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 2rem;

    width: 100%;
}

.container-footer > .grid-child > .mod-custom {
    flex: 1 1 auto;
    min-width: 0;
}

/* bestehende Footer-Innenstruktur darf keinen eigenen
   zweiten Flex-Bereich mehr erzeugen */
.container-footer .pa-footer,
.container-footer .pa-footer__inner {
    width: 100%;
}

/* Joomla-Footer-Menü */
.container-footer > .grid-child > .mod-menu {
    display: flex;
    flex: 0 0 auto;
    align-items: center;

    gap: 1.5rem;

    margin: 0;
    padding: 0;

    list-style: none;
}

.container-footer > .grid-child > ul.mod-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;

    width: auto !important;
    gap: 0 1.5rem;

    margin: 0 !important;
    padding: 0 !important;
}

.container-footer > .grid-child > ul.mod-menu > li {
    display: block !important;
    flex: 0 0 auto !important;

    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.container-footer > .grid-child > .mod-menu > li {
    margin: 0;
    padding: 0;
}

.container-footer > .grid-child > .mod-menu a {
    color: var(--pa-muted);
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 0.85rem;
    font-weight: 400;
    line-height: 1.4;

    text-decoration: none;

    transition: color 0.2s ease;
}

.container-footer > .grid-child > .mod-menu a:hover,
.container-footer > .grid-child > .mod-menu a:focus {
    color: var(--pa-blue-dark);
}


/* Mobile */
@media (max-width: 700px) {

    .container-footer > .grid-child {
        flex-direction: column;
        align-items: flex-start;

        gap: 0.8rem;
    }

    .container-footer > .grid-child > .mod-menu {
        flex-wrap: wrap;
        gap: 0.6rem 1.25rem;
    }
    .container-footer > .grid-child > ul.mod-menu {
        justify-content: flex-start;
        gap: 0.6rem 1.25rem;
    }
}

/* =========================================================
   Footer – Inhaltsbreite sauber begrenzen
   ========================================================= */

.container-footer > .grid-child {
    width: 100%;
    max-width: 1500px;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 2rem !important;
    padding-right: 2rem !important;

    box-sizing: border-box;
}

@media (max-width: 700px) {
    .container-footer > .grid-child {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
}

/* =========================================================
   Footer – mobile Ausrichtung
   ========================================================= */

@media (max-width: 700px) {

    .container-footer > .grid-child {
        align-items: center !important;
        text-align: center;

        gap: 1rem;
    }

    .container-footer .pa-footer,
    .container-footer .pa-footer__inner,
    .container-footer .pa-footer__copy {
        width: 100%;
        text-align: center;
    }

    .container-footer > .grid-child > ul.mod-menu {
        width: 100% !important;

        justify-content: center !important;
        align-items: center;

        gap: 0.5rem 1.25rem;
    }
}


/* =========================================================
   Startseite – dynamische Aktuelles-Karten
   Joomla 6 Modul "Beiträge"
   ========================================================= */

/* Der Joomla-Modulwrapper soll die komplette Breite
   unseres bisherigen News-Bereichs einnehmen */
.pa-news__grid > .pa-home-news-module {
    width: 100%;
    min-width: 0;
}

/* Joomla-eigenes Grid übernehmen wir selbst */
.pa-home-news-module .mod-articles-items {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;

    width: 100%;
    margin: 0;
    padding: 0;

    list-style: none;
}

/* Einzelne Joomla-Liste zurücksetzen */
.pa-home-news-module .mod-articles-items > li {
    min-width: 0;
    margin: 0;
    padding: 0;
}

/* Karte */
.pa-home-news-module .mod-articles-item {
    height: 100%;

    overflow: hidden;

    background: #fff;
    border: 1px solid var(--pa-border);
    border-radius: 6px;
}

/* Inhalt der Karte:
   Joomla liefert Titel vor Bild – per Flex ordnen wir um */
.pa-home-news-module .mod-articles-item-content {
    display: flex;
    flex-direction: column;

    height: 100%;
}

/* Bild nach ganz oben */
.pa-home-news-module .mod-articles-image {
    order: 1;

    width: 100%;
    margin: 0;
    padding: 0;

    overflow: hidden;
}

.pa-home-news-module .mod-articles-image img {
    display: block;

    width: 100%;
    aspect-ratio: 1200 / 650;
    height: auto;

    object-fit: cover;
}

/* Kleine Eyebrow wie bei unseren bisherigen Karten */
.pa-home-news-module .mod-articles-item-content::before {
    content: "Aktuelles aus der Akademie";

    order: 2;

    margin: 0.8rem 0.8rem 0.25rem;

    color: var(--pa-muted);
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 400;
    line-height: 1.3;
}

/* Titel */
.pa-home-news-module .mod-articles-title {
    order: 3;

    margin: 0 0.8rem 0.45rem;

    font-size: 1.05rem;
    line-height: 1.15;
}

.pa-home-news-module .mod-articles-title a {
    color: var(--pa-blue-dark);
    text-decoration: none;
}

.pa-home-news-module .mod-articles-title a:hover,
.pa-home-news-module .mod-articles-title a:focus {
    color: var(--pa-blue);
}

/* Teaser */
.pa-home-news-module
.mod-articles-item-content
> p:not(.readmore) {
    order: 4;

    margin: 0 0.8rem 0.8rem;

    color: var(--pa-muted);
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 0.88rem;
    line-height: 1.5;
}

/* Im Artikel ist der Introtext fett – auf der Karte nicht */
.pa-home-news-module
.mod-articles-item-content
> p:not(.readmore) strong {
    font-weight: 400;
}

/* Weiterlesen immer unten halten */
.pa-home-news-module .readmore {
    order: 5;

    margin: auto 0.8rem 0.9rem !important;
}

/* Joomla-Bootstrap-Button in unseren dezenten Textlink verwandeln */
.pa-home-news-module .readmore .btn {
    padding: 0 !important;

    color: var(--pa-blue) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 0 !important;
    font-weight: 600;

    text-decoration: none;
}

.pa-home-news-module .readmore .btn .icon-chevron-right {
    display: none;
}

.pa-home-news-module .readmore .btn::after {
    content: "Weiterlesen →";

    font-size: 0.82rem;
}

.pa-home-news-module .readmore .btn:hover::after,
.pa-home-news-module .readmore .btn:focus::after {
    color: var(--pa-blue-dark);
}


/* Tablet */
@media (max-width: 1150px) {
    .pa-home-news-module .mod-articles-items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* Mobil */
@media (max-width: 700px) {
    .pa-home-news-module .mod-articles-items {
        grid-template-columns: 1fr;
    }
}

/* Dynamisches Aktuelles-Modul über die komplette News-Breite spannen */
.pa-news__grid > .pa-home-news-module {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
}

/* =========================================================
   Einzelbeitrag – großes Beitragsbild
   ========================================================= */

.com-content-article > figure.pa-full-article-image {
    float: none !important;

    width: min(1500px, calc(100vw - 4rem)) !important;
    max-width: none !important;

    margin-top: 0 !important;
    margin-bottom: 2rem !important;

    /* aus dem schmaleren Artikelbereich heraus mittig verbreitern */
    margin-left: 50% !important;
    transform: translateX(-50%);
}

.com-content-article > figure.pa-full-article-image img {
    display: block;

    width: 100% !important;
    max-width: none !important;
    height: auto !important;

    margin: 0;
}


/* Mobil innerhalb des Viewports bleiben */
@media (max-width: 700px) {

    .com-content-article > figure.pa-full-article-image {
        width: calc(100vw - 2rem) !important;
        margin-bottom: 1.5rem !important;
    }
}

/* =========================================================
   Veranstaltungen – Terminbox
   ========================================================= */

.pa-event-facts {
    margin: 2.5rem 0;
    padding: 1.75rem 2rem;

    background: var(--pa-paper);
    border: 1px solid var(--pa-border);
    border-left: 4px solid var(--pa-blue);
    border-radius: 6px;
}

.pa-event-facts h2 {
    margin: 0.35rem 0 1.25rem;

    color: var(--pa-blue-dark);
    font-size: 1.4rem;
}

.pa-event-facts__list {
    margin: 0;
}

.pa-event-facts__list > div {
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: 1rem;

    padding: 0.6rem 0;

    border-bottom: 1px solid var(--pa-border);
}

.pa-event-facts__list > div:last-child {
    border-bottom: 0;
}

.pa-event-facts__list dt {
    color: var(--pa-muted);
    font-weight: 600;
}

.pa-event-facts__list dd {
    margin: 0;

    color: var(--pa-ink);
    font-weight: 400;
}

.pa-event-facts__note {
    margin: 1.25rem 0 0 !important;
    padding-top: 1rem;

    color: var(--pa-blue-dark);
    font-weight: 600;
}


/* Mobil */
@media (max-width: 600px) {

    .pa-event-facts {
        padding: 1.4rem 1.25rem;
    }

    .pa-event-facts__list > div {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }
}
