/* ============================================================
   MHL – REGIONALE BESONDERHEITEN
   ÜBERSICHT + 6 THEMENSEITEN
   ============================================================ */

.mhl-regional-overview,
.mhl-regional-section {
    overflow: hidden;
}

/* ============================================================
   ÜBERSICHT
   ============================================================ */

.mhl-regional-overview__intro {
    max-width: 920px;

    margin-bottom: 2rem;
}

.mhl-regional-overview__intro > span {
    display: block;

    margin-bottom: .45rem;

    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .20em;

    color: #74e0ef;
}

.mhl-regional-overview__intro h2 {
    margin: 0 0 .65rem;

    font-size: clamp(
        1.55rem,
        1.2rem + .72vw,
        2.2rem
    );

    line-height: 1.12;

    color: #f6fbfd;
}

.mhl-regional-overview__intro p {
    max-width: 840px;

    margin: 0;

    line-height: 1.6;

    color: rgba(218, 237, 241, .84);
}

/* ============================================================
   ÜBERSICHTSKARTEN
   ============================================================ */

.mhl-regional-overview__grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 1rem;
}

.mhl-regional-overview-card {
    position: relative;

    display: grid;

    grid-template-columns:
        48px minmax(0, 1fr);

    gap: .95rem;

    min-width: 0;

    padding: 1.1rem;

    text-decoration: none;

    border:
        1px solid rgba(98, 220, 238, .18);

    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            rgba(18, 103, 123, .20),
            rgba(4, 36, 52, .44)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.045);

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.mhl-regional-overview-card:hover {
    transform: translateY(-2px);

    border-color:
        rgba(107, 224, 241, .38);

    box-shadow:
        0 14px 32px rgba(0,0,0,.18),
        inset 0 1px 0
        rgba(255,255,255,.06);
}

.mhl-regional-overview-card__number {
    width: 48px;
    height: 48px;

    display: grid;
    place-items: center;

    border-radius: 14px;

    background:
        rgba(93, 215, 235, .08);

    border:
        1px solid rgba(95, 220, 239, .18);

    color: #72dfef;

    font-size: .76rem;
    font-weight: 850;

    letter-spacing: .08em;
}

.mhl-regional-overview-card__body {
    min-width: 0;
}

.mhl-regional-overview-card__eyebrow {
    display: block;

    margin-bottom: .25rem;

    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .14em;

    color:
        rgba(114, 224, 239, .82);
}

.mhl-regional-overview-card h3 {
    margin: 0 0 .38rem;

    font-size: 1.05rem;
    line-height: 1.2;

    color: #f3fbfd;
}

.mhl-regional-overview-card p {
    margin: 0 0 .65rem;

    font-size: .87rem;
    line-height: 1.5;

    color:
        rgba(211, 232, 237, .78);
}

.mhl-regional-overview-card__link {
    font-size: .82rem;
    font-weight: 750;

    color: #72dceb;
}

/* ============================================================
   ÜBERSICHT ABSCHLUSS
   ============================================================ */

.mhl-regional-overview__closing {
    margin-top: 1.2rem;

    padding: 1rem 1.1rem;

    border-left:
        3px solid rgba(112, 222, 239, .70);

    border-radius: 12px;

    background:
        rgba(83, 209, 229, .045);
}

.mhl-regional-overview__closing strong {
    display: block;

    margin-bottom: .25rem;

    color: #ffffff;
}

.mhl-regional-overview__closing p {
    margin: 0;

    font-size: .9rem;

    line-height: 1.52;

    color:
        rgba(215, 234, 238, .80);
}

/* ============================================================
   THEMENSEITE
   ============================================================ */

.mhl-regional-section__intro {
    max-width: 940px;

    margin-bottom: 2rem;
}

.mhl-regional-back {
    display: inline-flex;

    margin-bottom: .9rem;

    color: #76dfed;

    font-size: .88rem;
    font-weight: 750;

    text-decoration: none;
}

.mhl-regional-back:hover {
    text-decoration: underline;
}

.mhl-regional-section__rule {
    width: 100%;
    height: 1px;

    margin-bottom: 1rem;

    background:
        linear-gradient(
            90deg,
            rgba(100, 220, 239, .28),
            rgba(100, 220, 239, .06),
            transparent
        );
}

.mhl-regional-section__intro p {
    max-width: 900px;

    margin: 0;

    line-height: 1.58;

    color:
        rgba(217, 236, 240, .80);
}

/* ============================================================
   ARTIKEL
   ============================================================ */

.mhl-regional-article-list {
    display: grid;

    gap: 1.2rem;
}

.mhl-regional-article {
    padding: 1.3rem 1.35rem 1.25rem;

    border:
        1px solid rgba(99, 220, 238, .18);

    border-radius: 20px;

    background:
        linear-gradient(
            135deg,
            rgba(17, 93, 113, .18),
            rgba(4, 36, 51, .43)
        );

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.045);
}

.mhl-regional-article__header {
    max-width: 920px;

    margin-bottom: 1rem;
}

.mhl-regional-article__kicker {
    display: block;

    margin-bottom: .4rem;

    font-size: .69rem;
    font-weight: 850;

    letter-spacing: .17em;

    color: #70dceb;
}

.mhl-regional-article h2 {
    margin: 0 0 .55rem;

    font-size: clamp(
        1.35rem,
        1.1rem + .58vw,
        1.85rem
    );

    line-height: 1.14;

    color: #f7fcfd;
}

.mhl-regional-article__lead {
    margin: 0;

    font-size: 1.02rem !important;

    line-height: 1.55;

    font-weight: 650;

    color:
        rgba(236, 247, 249, .91) !important;
}

.mhl-regional-article__content {
    max-width: 920px;
}

.mhl-regional-article__content p {
    margin:
        0 0 .82rem;

    line-height: 1.62;

    color:
        rgba(211, 232, 237, .81);
}

.mhl-regional-article__content p:last-child {
    margin-bottom: 0;
}

/* ============================================================
   WISSENSWERT
   ============================================================ */

.mhl-regional-fact {
    display: grid;

    gap: .25rem;

    max-width: 920px;

    margin-top: 1.15rem;

    padding:
        .9rem
        1rem;

    border-left:
        3px solid rgba(255, 203, 95, .80);

    border-radius: 12px;

    background:
        rgba(255, 198, 81, .045);
}

.mhl-regional-fact__label {
    font-size: .66rem;

    font-weight: 850;

    letter-spacing: .16em;

    color: #ffd36d;
}

.mhl-regional-fact strong {
    color: #ffffff;

    line-height: 1.45;
}

.mhl-regional-fact small {
    color:
        rgba(199, 224, 230, .62);

    font-size: .76rem;
}

/* ============================================================
   PAGINATION
   ============================================================ */

.mhl-regional-pagination {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);

    gap: .8rem;

    align-items: stretch;

    margin-top: 1.5rem;
}

.mhl-regional-pagination__item,
.mhl-regional-pagination__overview {
    min-width: 0;

    padding: .85rem 1rem;

    border:
        1px solid rgba(97, 219, 238, .16);

    border-radius: 14px;

    background:
        rgba(4, 38, 53, .28);

    text-decoration: none;
}

.mhl-regional-pagination__item {
    display: grid;
    gap: .12rem;
}

.mhl-regional-pagination__item small {
    color:
        rgba(184, 216, 223, .65);

    font-size: .68rem;

    text-transform: uppercase;

    letter-spacing: .12em;
}

.mhl-regional-pagination__item strong {
    color: #f2fbfd;

    font-size: .83rem;
}

.mhl-regional-pagination__overview {
    display: grid;
    place-items: center;

    color: #70deec;

    font-size: .8rem;

    font-weight: 800;
}

.mhl-regional-pagination__item--next {
    text-align: right;
}

.mhl-regional-pagination__item--empty {
    visibility: hidden;
}

/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 900px) {

    .mhl-regional-overview__grid {
        grid-template-columns: 1fr;
    }

    .mhl-regional-pagination {
        grid-template-columns:
            1fr 1fr;
    }

    .mhl-regional-pagination__overview {
        grid-column: 1 / -1;
        grid-row: 1;
    }
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 620px) {

    .mhl-regional-overview-card {
        grid-template-columns:
            38px minmax(0, 1fr);

        gap: .72rem;

        padding: .88rem;

        border-radius: 15px;
    }

    .mhl-regional-overview-card__number {
        width: 38px;
        height: 38px;

        border-radius: 11px;
    }

    .mhl-regional-overview-card h3 {
        font-size: .97rem;
    }

    .mhl-regional-overview-card p {
        font-size: .83rem;
    }

    .mhl-regional-article {
        padding:
            1rem
            .95rem
            .98rem;

        border-radius: 16px;
    }

    .mhl-regional-article h2 {
        font-size: 1.22rem;
    }

    .mhl-regional-article__lead {
        font-size: .94rem !important;
    }

    .mhl-regional-article__content p {
        font-size: .88rem;
        line-height: 1.56;
    }

    .mhl-regional-fact {
        padding:
            .78rem
            .85rem;
    }

    .mhl-regional-pagination {
        grid-template-columns: 1fr;
    }

    .mhl-regional-pagination__overview {
        grid-column: auto;
        grid-row: auto;
    }

    .mhl-regional-pagination__item--next {
        text-align: left;
    }

    .mhl-regional-pagination__item--empty {
        display: none;
    }
}

/* ============================================================
   MHL – REGIONALE THEMENBILDER
   ============================================================ */

.mhl-regional-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.24fr) minmax(280px, .76fr);
    gap: 1.15rem;
    align-items: stretch;
    margin-bottom: 1.25rem;
}

.mhl-regional-content-grid .mhl-regional-article {
    min-width: 0;
    margin: 0;
}

.mhl-regional-visual {
    min-width: 0;
    min-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    border: 1px solid rgba(100, 221, 239, .14);
    border-radius: 20px;
    background:
        radial-gradient(
            circle at 50% 40%,
            rgba(76, 203, 226, .08),
            rgba(4, 36, 52, .08) 52%,
            transparent 100%
        );
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035);
    overflow: hidden;
}

.mhl-regional-visual__inner {
    position: relative;
    width: 100%;
    min-height: 430px;
    display: grid;
    place-items: center;
}

.mhl-regional-visual img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 520px;
    max-height: 520px;
    object-fit: contain;
    filter: drop-shadow(0 18px 26px rgba(0,0,0,.16));
}

.mhl-regional-visual__caption {
    position: absolute;
    left: .8rem;
    right: .8rem;
    bottom: .7rem;
    display: flex;
    justify-content: space-between;
    gap: .6rem;
    align-items: center;
    padding: .52rem .66rem;
    border: 1px solid rgba(102,220,239,.11);
    border-radius: 11px;
    background: rgba(3,27,41,.55);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.mhl-regional-visual__caption span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .61rem;
    font-weight: 850;
    letter-spacing: .11em;
    color: rgba(111,222,239,.76);
}

.mhl-regional-visual__caption strong {
    flex: 0 0 auto;
    font-size: .67rem;
    color: rgba(234,247,249,.72);
}

@media (max-width: 1100px) {
    .mhl-regional-content-grid {
        grid-template-columns: minmax(0, 1.12fr) minmax(240px, .68fr);
        gap: .9rem;
    }

    .mhl-regional-visual {
        padding: .7rem;
    }

    .mhl-regional-visual__inner {
        min-height: 370px;
    }

    .mhl-regional-visual img {
        max-width: 420px;
        max-height: 420px;
    }
}

@media (max-width: 900px) {
    .mhl-regional-content-grid {
        grid-template-columns: 1fr;
    }

    .mhl-regional-visual {
        order: 2;
        min-height: 290px;
    }

    .mhl-regional-visual__inner {
        min-height: 290px;
    }

    .mhl-regional-visual img {
        max-width: 410px;
        max-height: 350px;
    }
}

@media (max-width: 620px) {
    .mhl-regional-visual {
        min-height: 230px;
        padding: .45rem;
        border-radius: 16px;
    }

    .mhl-regional-visual__inner {
        min-height: 230px;
    }

    .mhl-regional-visual img {
        max-width: 300px;
        max-height: 285px;
    }

    .mhl-regional-visual__caption {
        left: .55rem;
        right: .55rem;
        bottom: .5rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mhl-regional-visual img {
        filter: none;
    }
}

/* ============================================================
   MHL – REGIONALE THEMENBILDER
   KEIN RAHMEN / KEIN KASTEN / KEIN CAPTION-BLOCK
   ============================================================ */

.mhl-regional-content-grid
.mhl-regional-visual {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

.mhl-regional-content-grid
.mhl-regional-visual__inner {
    width: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
}

.mhl-regional-content-grid
.mhl-regional-visual img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 540px !important;
    max-height: 560px !important;
    object-fit: contain !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

.mhl-regional-content-grid
.mhl-regional-visual__caption {
    display: none !important;
}

@media (max-width: 1100px) {
    .mhl-regional-content-grid {
        grid-template-columns:
            minmax(0, 1.12fr)
            minmax(240px, .68fr);
        gap: .9rem;
    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {
        max-width: 450px !important;
        max-height: 470px !important;
    }
}

@media (max-width: 900px) {
    .mhl-regional-content-grid {
        grid-template-columns: 1fr;
    }

    .mhl-regional-content-grid
    .mhl-regional-visual {
        order: 2;
        margin-top: .2rem;
    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {
        max-width: 420px !important;
        max-height: 380px !important;
    }
}

@media (max-width: 620px) {
    .mhl-regional-content-grid
    .mhl-regional-visual img {
        max-width: 320px !important;
        max-height: 300px !important;
    }
}

/* ============================================================
   MHL – REGIONAL PRO LAYOUT
   ============================================================ */

/* ------------------------------------------------------------
   Das Raster bleibt sauber und symmetrisch.
   ------------------------------------------------------------ */

.mhl-regional-content-grid {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1.18fr)
        minmax(300px, .82fr) !important;

    gap: 1.35rem !important;

    align-items: start !important;

    margin-bottom: 1.5rem !important;
}

/* ------------------------------------------------------------
   Artikel
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-article {

    width: 100%;

    min-width: 0;

    margin: 0 !important;

    box-sizing: border-box;

}

/* ------------------------------------------------------------
   Rechtes Bild:
   KEIN Container-Kasten.
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-visual {

    width: 100% !important;

    min-width: 0 !important;

    min-height: 0 !important;

    display: flex !important;

    align-items: flex-start !important;

    justify-content: center !important;

    padding: 0 !important;

    margin: 0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    overflow: visible !important;

}

/* ------------------------------------------------------------
   Inner Wrapper ebenfalls unsichtbar.
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-visual__inner {

    width: 100% !important;

    min-height: 0 !important;

    display: flex !important;

    align-items: flex-start !important;

    justify-content: center !important;

    padding: 0 !important;

    margin: 0 !important;

    background: transparent !important;

}

/* ------------------------------------------------------------
   DAS EIGENTLICHE BILD
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-visual img {

    display: block !important;

    width: auto !important;

    height: auto !important;

    max-width: 100% !important;

    max-height: 570px !important;

    object-fit: contain !important;

    background: transparent !important;

    border: 0 !important;

    outline: 0 !important;

    border-radius: 24px !important;

    box-shadow:
        0 18px 34px rgba(0,0,0,.18) !important;

    clip-path:
        inset(
            0
            round
            24px
        );

}

/* ------------------------------------------------------------
   Keine Beschriftung unter dem Motiv.
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
   Pagination gehört unter beide Spalten.
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-pagination {

    width: 100% !important;

    grid-column: 1 / -1;

    margin-top: 0 !important;

}

/* ------------------------------------------------------------
   Desktop – Artikel und Bild harmonisch.
   ------------------------------------------------------------ */

@media (min-width: 1201px) {

    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1.16fr)
            minmax(340px, .84fr) !important;

        gap: 1.5rem !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-height: 600px !important;

        border-radius: 26px !important;

        clip-path:
            inset(
                0
                round
                26px
            );

    }

}

/* ------------------------------------------------------------
   mittlere Desktop-Breite
   ------------------------------------------------------------ */

@media (max-width: 1200px) and (min-width: 901px) {

    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1.12fr)
            minmax(270px, .88fr) !important;

        gap: 1.1rem !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-height: 500px !important;

        border-radius: 22px !important;

        clip-path:
            inset(
                0
                round
                22px
            );

    }

}

/* ------------------------------------------------------------
   Tablet:
   erst Artikel, dann Bild.
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .mhl-regional-content-grid {

        grid-template-columns: 1fr !important;

        gap: 1rem !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual {

        order: 2 !important;

        justify-content: center !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        width: auto !important;

        max-width: 92% !important;

        max-height: 430px !important;

        border-radius: 21px !important;

        clip-path:
            inset(
                0
                round
                21px
            );

    }

    .mhl-regional-page
    .mhl-regional-pagination {

        order: 3;

    }

}

/* ------------------------------------------------------------
   Mobil
   ------------------------------------------------------------ */

@media (max-width: 620px) {

    .mhl-regional-content-grid {

        gap: .8rem !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-width: 94% !important;

        max-height: 330px !important;

        border-radius: 17px !important;

        clip-path:
            inset(
                0
                round
                17px
            );

        box-shadow:
            0 12px 24px rgba(0,0,0,.16) !important;

    }

}

/* ------------------------------------------------------------
   Reduzierte Bewegung
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        box-shadow: none !important;

    }

}

/* ============================================================
   MHL – EINZELARTIKEL
   Wenn ein Thema nur eine Seite besitzt:
   Inhalt mittig statt linksbündig.
   ============================================================ */

.mhl-regional-page--single
.mhl-regional-content-grid {

    grid-template-columns: 1fr !important;

    max-width: 1080px;

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

    justify-items: center;

}

/* ------------------------------------------------------------
   Artikel selbst mittig
   ------------------------------------------------------------ */

.mhl-regional-page--single
.mhl-regional-content-grid
.mhl-regional-article {

    width: min(920px, 100%) !important;

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

}

/* ------------------------------------------------------------
   Bild unter dem Einzelartikel
   ------------------------------------------------------------ */

.mhl-regional-page--single
.mhl-regional-visual {

    width: min(620px, 100%) !important;

    margin:
        .35rem auto 0 !important;

    justify-content: center !important;

}

/* ------------------------------------------------------------
   Bild zentriert
   ------------------------------------------------------------ */

.mhl-regional-page--single
.mhl-regional-visual__inner {

    justify-content: center !important;

}

.mhl-regional-page--single
.mhl-regional-visual img {

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

}

/* ------------------------------------------------------------
   Pagination bei genau einer Seite komplett mittig
   ------------------------------------------------------------ */

.mhl-regional-page--single
.mhl-regional-pagination {

    display: flex !important;

    justify-content: center !important;

    align-items: center !important;

    width: 100% !important;

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

}

.mhl-regional-page--single
.mhl-regional-pagination__center {

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

}

.mhl-regional-page--single
.mhl-regional-pagination__side {

    display: none !important;

}

/* ------------------------------------------------------------
   Desktop
   ------------------------------------------------------------ */

@media (min-width: 901px) {

    .mhl-regional-page--single
    .mhl-regional-content-grid {

        padding-left: 1rem;
        padding-right: 1rem;

    }

}

/* ------------------------------------------------------------
   Mobil
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .mhl-regional-page--single
    .mhl-regional-content-grid {

        width: 100%;

    }

    .mhl-regional-page--single
    .mhl-regional-article {

        width: 100% !important;

    }

    .mhl-regional-page--single
    .mhl-regional-visual {

        width: 100% !important;

    }

}

/* ============================================================
   MHL – REGIONALE PAGINATION
   FINAL / symmetrisch / sauber ausgerichtet
   ============================================================ */

/* ------------------------------------------------------------
   Gesamte Navigation nutzt immer die komplette Breite.
   ------------------------------------------------------------ */

.mhl-regional-pagination {

    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(150px, auto)
        minmax(0, 1fr) !important;

    align-items: stretch !important;

    width: 100% !important;

    min-height: 82px;

    margin-top: 1.35rem !important;

    gap: .9rem !important;

}

/* ------------------------------------------------------------
   Linke und rechte Seite exakt symmetrisch.
   ------------------------------------------------------------ */

.mhl-regional-pagination__side {

    min-width: 0 !important;

    display: flex;

    align-items: stretch;

}

/* ------------------------------------------------------------
   Navigationseintrag
   ------------------------------------------------------------ */

.mhl-regional-pagination__side a {

    display: flex !important;

    flex-direction: column;

    justify-content: center;

    width: 100% !important;

    min-height: 82px;

    box-sizing: border-box;

    padding:
        .78rem .95rem !important;

    border:
        1px solid rgba(99,220,238,.14) !important;

    border-radius: 15px !important;

    background:
        rgba(4,37,52,.20) !important;

    text-decoration: none;

}

/* ------------------------------------------------------------
   Linke Seite
   ------------------------------------------------------------ */

.mhl-regional-pagination__side:first-child a {

    text-align: left;

}

/* ------------------------------------------------------------
   Rechte Seite
   ------------------------------------------------------------ */

.mhl-regional-pagination__side--next {

    justify-content: flex-end;

}

.mhl-regional-pagination__side--next a {

    text-align: right;

}

/* ------------------------------------------------------------
   Hover
   ------------------------------------------------------------ */

.mhl-regional-pagination__side a:hover {

    border-color:
        rgba(105,223,239,.28) !important;

    background:
        rgba(8,54,71,.26) !important;

}

/* ------------------------------------------------------------
   Kleine Kopfzeile
   ------------------------------------------------------------ */

.mhl-regional-pagination__side small {

    display: block;

    margin-bottom: .22rem;

    font-size: .62rem !important;

    font-weight: 750;

    letter-spacing: .10em;

    text-transform: uppercase;

    color:
        rgba(183,215,222,.58) !important;

}

/* ------------------------------------------------------------
   Seitentitel
   ------------------------------------------------------------ */

.mhl-regional-pagination__side strong {

    display: block;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    font-size: .81rem !important;

    line-height: 1.25;

    color:
        #f0fafc !important;

}

/* ------------------------------------------------------------
   Mitte
   ------------------------------------------------------------ */

.mhl-regional-pagination__center {

    min-width: 150px;

    display: flex !important;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    gap: .28rem;

    padding:
        .25rem .55rem !important;

    text-align: center;

}

/* ------------------------------------------------------------
   Seitenzähler
   ------------------------------------------------------------ */

.mhl-regional-pagination__center span {

    white-space: nowrap;

    font-size: .67rem !important;

    font-weight: 750;

    line-height: 1.2;

    color:
        rgba(186,216,223,.64) !important;

}

/* ------------------------------------------------------------
   Alle Seiten
   ------------------------------------------------------------ */

.mhl-regional-pagination__center a {

    display: inline-block;

    padding:
        .16rem .35rem;

    color:
        #70deed !important;

    font-size: .76rem !important;

    font-weight: 850;

    text-decoration: none;

}

.mhl-regional-pagination__center a:hover {

    color:
        #b9f5fb !important;

}

/* ============================================================
   NUR EINE SEITE
   ============================================================ */

.mhl-regional-page--single
.mhl-regional-pagination {

    display: flex !important;

    justify-content: center !important;

    align-items: center !important;

    min-height: 70px;

}

/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 900px) {

    .mhl-regional-pagination {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(120px, auto)
            minmax(0, 1fr) !important;

        gap: .65rem !important;

    }

    .mhl-regional-pagination__side a {

        min-height: 74px;

        padding:
            .7rem .75rem !important;

    }

    .mhl-regional-pagination__side strong {

        font-size: .76rem !important;

    }

}

/* ============================================================
   MOBIL
   ============================================================ */

@media (max-width: 620px) {

    .mhl-regional-pagination {

        display: grid !important;

        grid-template-columns:
            1fr 1fr !important;

        gap: .55rem !important;

        min-height: 0;

    }

    .mhl-regional-pagination__center {

        grid-column: 1 / -1;

        grid-row: 1;

        min-width: 0;

        padding:
            .25rem .5rem !important;

    }

    .mhl-regional-pagination__side {

        grid-column: auto;

        grid-row: 2;

    }

    .mhl-regional-pagination__side--next {

        grid-column: 2;

    }

    .mhl-regional-pagination__side a {

        min-height: 72px;

        padding:
            .68rem .7rem !important;

        border-radius: 13px !important;

    }

    .mhl-regional-pagination__side strong {

        font-size: .73rem !important;

    }

    .mhl-regional-pagination__side small {

        font-size: .58rem !important;

    }

}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .mhl-regional-pagination__side a {

        transition: none !important;

    }

}

/* MHL – REGIONALE SEITENBILDER V2 */
.mhl-regional-content-grid { display:grid!important; grid-template-columns:minmax(0,1.14fr) minmax(320px,.86fr)!important; gap:clamp(1rem,2vw,1.5rem)!important; align-items:start!important; }
.mhl-regional-content-grid .mhl-regional-visual,.mhl-regional-content-grid .mhl-regional-visual__inner { width:100%!important; min-width:0!important; min-height:0!important; margin:0!important; padding:0!important; display:flex!important; align-items:flex-start!important; justify-content:center!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; overflow:visible!important; }
.mhl-regional-content-grid .mhl-regional-visual img { display:block!important; width:auto!important; height:auto!important; max-width:min(100%,560px)!important; max-height:590px!important; object-fit:contain!important; margin:0 auto!important; border:0!important; outline:0!important; background:transparent!important; border-radius:24px!important; box-shadow:0 16px 30px rgba(0,0,0,.14)!important; }
@media (max-width:1100px) and (min-width:901px) { .mhl-regional-content-grid { grid-template-columns:minmax(0,1.08fr) minmax(250px,.72fr)!important; } .mhl-regional-content-grid .mhl-regional-visual img { max-width:430px!important; max-height:500px!important; border-radius:21px!important; } }
@media (max-width:900px) { .mhl-regional-content-grid { grid-template-columns:1fr!important; } .mhl-regional-content-grid .mhl-regional-visual { order:2!important; margin-top:.15rem!important; } .mhl-regional-content-grid .mhl-regional-visual img { max-width:88%!important; max-height:430px!important; border-radius:20px!important; } }
@media (max-width:620px) { .mhl-regional-content-grid .mhl-regional-visual img { max-width:92%!important; max-height:320px!important; border-radius:17px!important; } }

/* ============================================================
   MHL – REGIONALE UNTERSEITEN
   FINALER EDITORIAL LAYOUT OVERRIDE
   ============================================================ */

/* ------------------------------------------------------------
   HAUPTSTRUKTUR
   Bild bleibt IMMER neben dem Artikel.
   ------------------------------------------------------------ */

.mhl-regional-content-grid {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(180px, .42fr) !important;

    gap:
        clamp(.8rem, 2vw, 1.45rem) !important;

    align-items: start !important;

    width: 100% !important;

    margin:
        0 0 1.35rem !important;
}

/* ------------------------------------------------------------
   Artikel
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-article {

    min-width: 0 !important;

    width: 100% !important;

    margin: 0 !important;

    box-sizing: border-box;

}

/* ------------------------------------------------------------
   RECHTER BILDBEREICH
   Kein Kasten.
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-visual {

    min-width: 0 !important;

    width: 100% !important;

    min-height: 0 !important;

    display: flex !important;

    align-items: flex-start !important;

    justify-content: center !important;

    padding: 0 !important;

    margin: 0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    overflow: visible !important;

}

/* ------------------------------------------------------------
   Inner ebenfalls transparent
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-visual__inner {

    position: relative !important;

    width: 100% !important;

    min-height: 0 !important;

    display: flex !important;

    align-items: flex-start !important;

    justify-content: center !important;

    padding: 0 !important;

    margin: 0 !important;

    background: transparent !important;

}

/* ------------------------------------------------------------
   DAS THEMENBILD
   ------------------------------------------------------------ */

.mhl-regional-content-grid
.mhl-regional-visual img {

    display: block !important;

    width: auto !important;

    height: auto !important;

    max-width: 100% !important;

    max-height: 560px !important;

    object-fit: contain !important;

    margin: 0 auto !important;

    padding: 0 !important;

    border: 0 !important;

    outline: 0 !important;

    background: transparent !important;

    border-radius: 24px !important;

    box-shadow:
        0 14px 30px rgba(0,0,0,.14) !important;

}

/* ------------------------------------------------------------
   Keine Caption-Leiste mehr
   ------------------------------------------------------------ */

/* ============================================================
   SEITENNAVIGATION
   ============================================================ */

.mhl-regional-page
.mhl-regional-pagination {

    width: 100% !important;

    grid-column: 1 / -1 !important;

}

/* ============================================================
   TABLET
   Das Bild bleibt rechts.
   ============================================================ */

@media (max-width: 1100px) {

    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(165px, .38fr) !important;

        gap: .85rem !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-height: 470px !important;

        border-radius: 21px !important;

    }

}

/* ============================================================
   KLEINE TABLETS / HANDYS
   KEIN STACKING MEHR.
   ============================================================ */

@media (max-width: 900px) {

    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(135px, .34fr) !important;

        gap: .65rem !important;

        align-items: start !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-article {

        min-width: 0 !important;

        width: auto !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual {

        order: initial !important;

        width: auto !important;

        min-width: 0 !important;

        margin: 0 !important;

        padding: 0 !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual__inner {

        width: 100% !important;

        min-width: 0 !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        width: 100% !important;

        max-width: 100% !important;

        max-height: 340px !important;

        border-radius: 19px !important;

        box-shadow:
            0 10px 22px rgba(0,0,0,.12) !important;

    }

}

/* ============================================================
   SEHR KLEINE GERÄTE
   Bild bleibt weiterhin rechts.
   ============================================================ */

@media (max-width: 520px) {

    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(110px, .33fr) !important;

        gap: .5rem !important;

    }

    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-height: 260px !important;

        border-radius: 15px !important;

    }

    .mhl-regional-article__header h2,
    .mhl-regional-article > header h2 {

        font-size:
            clamp(1.05rem, 4vw, 1.35rem) !important;

        line-height: 1.13 !important;

    }

    .mhl-regional-article__lead {

        font-size: .82rem !important;

        line-height: 1.45 !important;

    }

    .mhl-regional-article__text p {

        font-size: .78rem !important;

        line-height: 1.5 !important;

    }

}

/* ============================================================
   SEITENLISTE – ATTRAKTIVER
   ============================================================ */

.mhl-regional-page-list {

    display: grid !important;

    gap: .65rem !important;

}

/* ------------------------------------------------------------
   Jeder Seitenlink bekommt eine klare aktive Fläche.
   ------------------------------------------------------------ */

.mhl-regional-page-row {

    position: relative;

    display: grid !important;

    grid-template-columns:
        48px
        minmax(0, 1fr)
        auto !important;

    gap: .9rem !important;

    align-items: center !important;

    min-height: 72px;

    padding:
        .82rem 1rem !important;

    border:
        1px solid rgba(101,221,239,.15) !important;

    border-radius: 17px !important;

    background:
        linear-gradient(
            100deg,
            rgba(18,96,117,.23),
            rgba(4,38,53,.28)
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 4px 14px rgba(0,0,0,.05);

    text-decoration: none !important;

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease;

}

/* ------------------------------------------------------------
   Linker Seitenmarker
   ------------------------------------------------------------ */

.mhl-regional-page-row__number {

    width: 48px !important;

    height: 48px !important;

    display: grid !important;

    place-items: center !important;

    border:
        1px solid rgba(105,223,239,.25) !important;

    border-radius: 14px !important;

    background:
        rgba(77,207,229,.10) !important;

    color:
        #74e1ef !important;

    font-size: .73rem !important;

    font-weight: 900 !important;

    letter-spacing: .08em;

}

/* ------------------------------------------------------------
   Text stärker lesbar
   ------------------------------------------------------------ */

.mhl-regional-page-row__body {

    min-width: 0 !important;

}

.mhl-regional-page-row__kicker {

    margin-bottom: .16rem !important;

    font-size: .61rem !important;

    font-weight: 900 !important;

    letter-spacing: .13em;

    color:
        rgba(111,222,239,.80) !important;

}

.mhl-regional-page-row h3 {

    margin:
        0 0 .22rem !important;

    font-size:
        clamp(.90rem, 1vw, 1.04rem) !important;

    line-height: 1.2 !important;

    color:
        #f4fbfd !important;

}

.mhl-regional-page-row p {

    margin: 0 !important;

    font-size: .79rem !important;

    line-height: 1.42 !important;

    color:
        rgba(207,230,235,.76) !important;

}

/* ------------------------------------------------------------
   Pfeil
   ------------------------------------------------------------ */

.mhl-regional-page-row__arrow {

    display: flex !important;

    align-items: center !important;

    color:
        #70ddeb !important;

    font-size: 1.15rem !important;

}

/* ------------------------------------------------------------
   Hover / Fokus
   ------------------------------------------------------------ */

.mhl-regional-page-row:hover {

    transform:
        translateX(3px);

    border-color:
        rgba(107,225,241,.36) !important;

    background:
        linear-gradient(
            100deg,
            rgba(21,111,133,.29),
            rgba(5,43,59,.38)
        ) !important;

    box-shadow:
        0 9px 22px rgba(0,0,0,.11),
        inset 0 1px 0 rgba(255,255,255,.05);

}

.mhl-regional-page-row:focus-visible {

    outline:
        2px solid rgba(110,224,240,.65);

    outline-offset:
        3px;

}

/* ============================================================
   PAGINATION – SAUBER UNTER DEM ARTIKEL
   ============================================================ */

.mhl-regional-pagination {

    margin-top: .15rem !important;

}

/* ============================================================
   MOBILE SEITENLISTE
   ============================================================ */

@media (max-width: 620px) {

    .mhl-regional-page-row {

        grid-template-columns:
            40px
            minmax(0, 1fr)
            auto !important;

        min-height: 62px;

        padding:
            .68rem .72rem !important;

        gap: .62rem !important;

        border-radius: 14px !important;

    }

    .mhl-regional-page-row__number {

        width: 40px !important;

        height: 40px !important;

        border-radius: 11px !important;

    }

    .mhl-regional-page-row p {

        font-size: .72rem !important;

    }

    .mhl-regional-page-row h3 {

        font-size: .86rem !important;

    }

    .mhl-regional-page-row__arrow {

        font-size: 1rem !important;

    }

}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .mhl-regional-page-row {

        transition: none !important;

    }

}

/* ============================================================
   MHL – REGIONAL SUBPAGE V2
   ARTIKEL LINKS / BILD RECHTS
   OHNE STACKING
   ============================================================ */

/* ------------------------------------------------------------
   Hauptgrid
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-content-grid {

    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(290px, .52fr) !important;

    gap:
        clamp(1rem, 2.2vw, 1.6rem) !important;

    align-items: start !important;

    width: 100% !important;

}

/* ------------------------------------------------------------
   Textbereich
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-content-grid
> *:not(.mhl-regional-visual) {

    min-width: 0 !important;

}

/* ------------------------------------------------------------
   Bildbereich – vollständig transparent
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual {

    display: flex !important;

    align-items: flex-start !important;

    justify-content: center !important;

    width: 100% !important;

    min-width: 0 !important;

    min-height: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    overflow: visible !important;

}

/* ------------------------------------------------------------
   Inner
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual__inner {

    width: 100% !important;

    min-width: 0 !important;

    min-height: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    display: flex !important;

    align-items: flex-start !important;

    justify-content: center !important;

    background: transparent !important;

}

/* ------------------------------------------------------------
   Themenbild
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual img {

    display: block !important;

    width: auto !important;

    height: auto !important;

    max-width: 100% !important;

    max-height: 590px !important;

    object-fit: contain !important;

    margin: 0 auto !important;

    padding: 0 !important;

    border: 0 !important;

    outline: 0 !important;

    background: transparent !important;

    border-radius: 25px !important;

    box-shadow:
        0 15px 32px rgba(0,0,0,.15) !important;

}

/* ------------------------------------------------------------
   Alte Caption sicher ausblenden
   ------------------------------------------------------------ */

.mhl-regional-page
.mhl-regional-visual__caption {

    display: none !important;

}

/* ============================================================
   DESKTOP
   ============================================================ */

@media (min-width: 1201px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1.15fr)
            minmax(350px, .85fr) !important;

        gap:
            1.6rem !important;

    }

    .mhl-regional-page
    .mhl-regional-visual img {

        max-width: 560px !important;

        max-height: 610px !important;

        border-radius: 27px !important;

    }

}

/* ============================================================
   LAPTOP / TABLET
   ============================================================ */

@media (max-width: 1200px) and (min-width: 901px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1.08fr)
            minmax(250px, .72fr) !important;

        gap:
            1rem !important;

    }

    .mhl-regional-page
    .mhl-regional-visual img {

        max-width: 450px !important;

        max-height: 500px !important;

        border-radius: 22px !important;

    }

}

/* ============================================================
   TABLET
   WICHTIG:
   KEIN 1-SPALTEN-STACKING.
   ============================================================ */

@media (max-width: 900px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(175px, .40fr) !important;

        gap:
            .7rem !important;

        align-items: start !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual {

        order: initial !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual img {

        width: 100% !important;

        max-width: 100% !important;

        max-height: 390px !important;

        border-radius: 20px !important;

    }

}

/* ============================================================
   KLEINE MOBILE GERÄTE
   Bild bleibt rechts.
   ============================================================ */

@media (max-width: 620px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(110px, .36fr) !important;

        gap:
            .48rem !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-height: 300px !important;

        border-radius: 16px !important;

    }

}

/* ============================================================
   SEITENLISTE ATTRAKTIVER
   ============================================================ */

.mhl-regional-page-row {

    position: relative !important;

    display: grid !important;

    grid-template-columns:
        48px
        minmax(0,1fr)
        auto !important;

    gap:
        .9rem !important;

    align-items: center !important;

    min-height: 74px;

    padding:
        .82rem 1rem !important;

    border:
        1px solid rgba(102,220,239,.18) !important;

    border-radius:
        17px !important;

    background:
        linear-gradient(
            105deg,
            rgba(11,78,99,.25),
            rgba(3,38,54,.35)
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035);

    text-decoration: none !important;

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease;

}

.mhl-regional-page-row:hover {

    transform:
        translateX(4px);

    border-color:
        rgba(108,224,241,.42) !important;

    background:
        linear-gradient(
            105deg,
            rgba(16,103,126,.32),
            rgba(3,47,64,.42)
        ) !important;

}

.mhl-regional-page-row__number {

    width: 48px !important;

    height: 48px !important;

    display: grid !important;

    place-items: center !important;

    border:
        1px solid rgba(105,222,240,.30) !important;

    border-radius:
        14px !important;

    background:
        rgba(64,194,217,.10) !important;

    color:
        #72e0ee !important;

    font-weight:
        900 !important;

}

.mhl-regional-page-row__kicker {

    color:
        rgba(109,223,239,.82) !important;

    font-size:
        .60rem !important;

    font-weight:
        900 !important;

    letter-spacing:
        .12em !important;

}

.mhl-regional-page-row h3 {

    margin:
        .08rem 0 .2rem !important;

    color:
        #f5fbfd !important;

    font-size:
        clamp(.9rem,1.05vw,1.05rem) !important;

}

.mhl-regional-page-row p {

    margin:
        0 !important;

    color:
        rgba(202,227,233,.74) !important;

    font-size:
        .78rem !important;

    line-height:
        1.42 !important;

}

.mhl-regional-page-row__arrow {

    color:
        #72dfed !important;

}

/* ------------------------------------------------------------
   Mobile Seitenliste
   ------------------------------------------------------------ */

@media (max-width: 620px) {

    .mhl-regional-page-row {

        grid-template-columns:
            40px
            minmax(0,1fr)
            auto !important;

        min-height:
            62px;

        padding:
            .65rem .7rem !important;

        gap:
            .58rem !important;

        border-radius:
            14px !important;

    }

    .mhl-regional-page-row__number {

        width:
            40px !important;

        height:
            40px !important;

        border-radius:
            11px !important;

    }

    .mhl-regional-page-row h3 {

        font-size:
            .85rem !important;

    }

    .mhl-regional-page-row p {

        font-size:
            .70rem !important;

    }

}

/* ============================================================
   MHL – REGIONALE BESONDERHEITEN
   PRO LAYOUT V3
   ============================================================ */

/* ============================================================
   01 – EINZELBLATT
   ARTIKEL + BILD GLEICHWERTIG
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid {

    display: grid !important;

    grid-template-columns:
        minmax(0, 1.02fr)
        minmax(360px, .98fr) !important;

    gap:
        clamp(1rem, 2vw, 1.8rem) !important;

    align-items: stretch !important;

    width: 100% !important;

}

/* ============================================================
   02 – ARTIKEL-FLÄCHE
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-article {

    min-width: 0 !important;

    width: 100% !important;

    margin: 0 !important;

    padding:
        clamp(1rem, 1.5vw, 1.35rem) !important;

    box-sizing: border-box;

    position: relative;

    border:
        1px solid rgba(103,221,239,.17) !important;

    border-radius:
        22px !important;

    background:
        linear-gradient(
            145deg,
            rgba(13,79,99,.24),
            rgba(3,36,51,.34)
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 10px 28px rgba(0,0,0,.07);

}

/* ============================================================
   03 – MARITIME AKZENTLINIE
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-article::before {

    content: "";

    position: absolute;

    top: .95rem;

    left: 1rem;

    width: 62px;

    height: 3px;

    border-radius: 99px;

    background:
        linear-gradient(
            90deg,
            rgba(103,223,239,.95),
            rgba(103,223,239,.10)
        );

}

/* ============================================================
   04 – BILD-BEREICH
   KEIN KASTEN
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual {

    min-width: 0 !important;

    min-height: 100% !important;

    width: 100% !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    overflow: visible !important;

}

/* ============================================================
   05 – BILD INNERHALB DES RECHTEN BEREICHS
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual__inner {

    position: relative !important;

    width: 100% !important;

    min-height: 100% !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    margin: 0 !important;

    padding:
        .25rem !important;

    background: transparent !important;

}

/* ============================================================
   06 – BILD GROSS / MITTIG
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual img {

    display: block !important;

    width: min(
        100%,
        620px
    ) !important;

    height: auto !important;

    max-width: 100% !important;

    max-height: 610px !important;

    object-fit: contain !important;

    margin:
        auto !important;

    padding: 0 !important;

    border: 0 !important;

    outline: 0 !important;

    background: transparent !important;

    border-radius:
        26px !important;

    box-shadow:
        0 20px 38px rgba(0,0,0,.17) !important;

}

/* ============================================================
   07 – SEHR FEINE MARITIME WASSERLINIEN
   Nur hinter dem Bild, kein Kasten.
   ============================================================ */

.mhl-regional-page
.mhl-regional-content-grid
.mhl-regional-visual__inner::before {

    content: "";

    position: absolute;

    left: 4%;

    right: 4%;

    bottom: 3%;

    height: 44%;

    border-top:
        1px solid rgba(100,221,239,.055);

    border-radius:
        50%;

    box-shadow:
        0 -12px 0 -1px rgba(100,221,239,.035),
        0 -24px 0 -2px rgba(100,221,239,.025);

    pointer-events: none;

}

/* ============================================================
   08 – CAPTION SICHER AUSBLENDEN
   ============================================================ */

/* ============================================================
   09 – PAGINATION KLAR ABGETRENNT
   ============================================================ */

.mhl-regional-page
.mhl-regional-pagination {

    width: 100% !important;

    margin-top:
        1rem !important;

}

/* ============================================================
   10 – THEMENLISTE
   STÄRKERE ARTIKEL-LINKS
   ============================================================ */

.mhl-regional-page-row {

    position: relative !important;

    display: grid !important;

    grid-template-columns:
        54px
        minmax(0, 1fr)
        32px !important;

    align-items: center !important;

    gap: 1rem !important;

    min-height: 88px !important;

    padding:
        .85rem 1.05rem !important;

    border:
        1px solid rgba(104,222,239,.17) !important;

    border-radius:
        19px !important;

    background:
        linear-gradient(
            105deg,
            rgba(10,83,105,.27),
            rgba(3,39,54,.37)
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.035),
        0 7px 20px rgba(0,0,0,.045);

    text-decoration: none !important;

    overflow: hidden;

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease;

}

/* ------------------------------------------------------------
   feine Wellenkante links
   ------------------------------------------------------------ */

.mhl-regional-page-row::before {

    content: "";

    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    width: 3px;

    border-radius:
        99px;

    background:
        linear-gradient(
            180deg,
            rgba(104,222,239,.75),
            rgba(104,222,239,.06)
        );

    opacity: .7;

}

/* ============================================================
   11 – NUMMER
   ============================================================ */

.mhl-regional-page-row__number {

    width:
        54px !important;

    height:
        54px !important;

    display: grid !important;

    place-items: center !important;

    border:
        1px solid rgba(104,222,239,.29) !important;

    border-radius:
        16px !important;

    background:
        linear-gradient(
            145deg,
            rgba(69,194,219,.17),
            rgba(7,60,77,.24)
        ) !important;

    color:
        #79e1ee !important;

    font-size:
        .74rem !important;

    font-weight:
        900 !important;

    letter-spacing:
        .08em;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04);

}

/* ============================================================
   12 – KICKER
   ============================================================ */

.mhl-regional-page-row__kicker {

    margin-bottom:
        .18rem !important;

    color:
        rgba(110,222,239,.86) !important;

    font-size:
        .60rem !important;

    font-weight:
        900 !important;

    letter-spacing:
        .13em !important;

    text-transform:
        uppercase;

}

/* ============================================================
   13 – TITEL
   ============================================================ */

.mhl-regional-page-row h3 {

    margin:
        0 0 .22rem !important;

    color:
        #f4fbfd !important;

    font-size:
        clamp(
            .96rem,
            1.15vw,
            1.10rem
        ) !important;

    line-height:
        1.18 !important;

}

/* ============================================================
   14 – BESCHREIBUNG
   ============================================================ */

.mhl-regional-page-row p {

    margin:
        0 !important;

    color:
        rgba(202,228,234,.80) !important;

    font-size:
        .78rem !important;

    line-height:
        1.42 !important;

}

/* ============================================================
   15 – PFEIL
   ============================================================ */

.mhl-regional-page-row__arrow {

    width:
        30px !important;

    height:
        30px !important;

    display: grid !important;

    place-items: center !important;

    border:
        1px solid rgba(104,222,239,.15);

    border-radius:
        50%;

    color:
        #79e2ef !important;

    font-size:
        .92rem !important;

    background:
        rgba(57,181,205,.065);

}

/* ============================================================
   16 – HOVER
   ============================================================ */

.mhl-regional-page-row:hover {

    transform:
        translateY(-2px) !important;

    border-color:
        rgba(105,225,241,.38) !important;

    background:
        linear-gradient(
            105deg,
            rgba(13,105,128,.34),
            rgba(4,48,65,.45)
        ) !important;

    box-shadow:
        0 12px 28px rgba(0,0,0,.11),
        inset 0 1px 0 rgba(255,255,255,.05);

}

.mhl-regional-page-row:hover
.mhl-regional-page-row__number {

    border-color:
        rgba(110,226,241,.46) !important;

    background:
        rgba(62,190,213,.18) !important;

}

.mhl-regional-page-row:hover
.mhl-regional-page-row__arrow {

    border-color:
        rgba(110,226,241,.30);

    transform:
        translateX(2px);

}

/* ============================================================
   17 – TABLET
   ARTIKEL + BILD BLEIBEN NEBENEINANDER
   ============================================================ */

@media (max-width: 1100px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1.05fr)
            minmax(260px, .75fr) !important;

        gap:
            .9rem !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-article {

        padding:
            .9rem !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual img {

        max-height:
            500px !important;

        border-radius:
            22px !important;

    }

}

/* ============================================================
   18 – KLEINES TABLET
   ============================================================ */

@media (max-width: 900px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        display: grid !important;

        grid-template-columns:
            minmax(0, 1.10fr)
            minmax(155px, .60fr) !important;

        gap:
            .65rem !important;

        align-items:
            stretch !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual {

        order:
            initial !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual img {

        width:
            100% !important;

        max-height:
            390px !important;

        border-radius:
            19px !important;

    }

    .mhl-regional-page-row {

        min-height:
            78px !important;

        grid-template-columns:
            48px
            minmax(0,1fr)
            30px !important;

        gap:
            .75rem !important;

    }

    .mhl-regional-page-row__number {

        width:
            48px !important;

        height:
            48px !important;

    }

}

/* ============================================================
   19 – MOBIL
   BILD BLEIBT RECHTS
   ============================================================ */

@media (max-width: 620px) {

    .mhl-regional-page
    .mhl-regional-content-grid {

        grid-template-columns:
            minmax(0, 1fr)
            minmax(105px, .42fr) !important;

        gap:
            .48rem !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-article {

        padding:
            .72rem !important;

        border-radius:
            17px !important;

    }

    .mhl-regional-page
    .mhl-regional-content-grid
    .mhl-regional-visual img {

        width:
            100% !important;

        max-height:
            300px !important;

        border-radius:
            15px !important;

    }

    .mhl-regional-page-row {

        grid-template-columns:
            40px
            minmax(0,1fr)
            28px !important;

        min-height:
            64px !important;

        padding:
            .62rem .68rem !important;

        gap:
            .55rem !important;

        border-radius:
            14px !important;

    }

    .mhl-regional-page-row__number {

        width:
            40px !important;

        height:
            40px !important;

        border-radius:
            11px !important;

        font-size:
            .64rem !important;

    }

    .mhl-regional-page-row__kicker {

        font-size:
            .54rem !important;

    }

    .mhl-regional-page-row h3 {

        font-size:
            .82rem !important;

    }

    .mhl-regional-page-row p {

        font-size:
            .68rem !important;

    }

    .mhl-regional-page-row__arrow {

        width:
            27px !important;

        height:
            27px !important;

        font-size:
            .76rem !important;

    }

}

/* ============================================================
   20 – REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    .mhl-regional-page-row {

        transition: none !important;

    }

    .mhl-regional-page-row:hover {

        transform: none !important;

    }

}

/* ============================================================
   MHL – REGIONAL IMAGE CLEANUP
   Keine dekorativen Bögen / Striche um das Bild.
   Das eigentliche Bild bleibt unverändert.
   ============================================================ */

.mhl-regional-page
.mhl-regional-visual::before,

.mhl-regional-page
.mhl-regional-visual::after,

.mhl-regional-page
.mhl-regional-visual__inner::before,

.mhl-regional-page
.mhl-regional-visual__inner::after {

    content: none !important;

    display: none !important;

    width: 0 !important;

    height: 0 !important;

    border: 0 !important;

    background: none !important;

    box-shadow: none !important;

    transform: none !important;

}

.mhl-regional-page
.mhl-regional-visual {

    background: transparent !important;

    border: 0 !important;

    outline: 0 !important;

    box-shadow: none !important;

}

.mhl-regional-page
.mhl-regional-visual__inner {

    background: transparent !important;

    border: 0 !important;

    outline: 0 !important;

    box-shadow: none !important;

}

.mhl-regional-page
.mhl-regional-article-image {

    position: relative !important;

    z-index: 2 !important;

    display: block !important;

    border: 0 !important;

    outline: 0 !important;

    box-shadow: 0 18px 36px rgba(0,0,0,.16) !important;

}

/* ============================================================
   MHL – REGIONALER RUNDGANG
   Prominenter Abschluss-/Hinweisblock
   ============================================================ */

.mhl-regional-page
.mhl-regional-info {

    position: relative !important;

    margin-top: clamp(1.2rem, 2.2vw, 2rem) !important;

    padding: clamp(1rem, 1.8vw, 1.45rem)
             clamp(1rem, 2vw, 1.6rem) !important;

    border: 1px solid rgba(89, 222, 246, .42) !important;

    border-left: 3px solid rgba(89, 222, 246, .90) !important;

    border-radius: 22px !important;

    background:
        linear-gradient(
            135deg,
            rgba(38, 129, 153, .30),
            rgba(5, 42, 57, .58)
        ) !important;

    box-shadow:
        0 10px 28px rgba(0,0,0,.16),
        inset 0 1px 0 rgba(255,255,255,.045) !important;

    overflow: hidden !important;

    transform: translateZ(0);

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease !important;

}

/* Dezenter Lichtakzent */

.mhl-regional-page
.mhl-regional-info::before {

    content: "" !important;

    position: absolute !important;

    left: 0 !important;

    top: 0 !important;

    right: 0 !important;

    height: 2px !important;

    background:
        linear-gradient(
            90deg,
            rgba(89,222,246,.95),
            rgba(89,222,246,.18),
            transparent
        ) !important;

    opacity: .9 !important;

    pointer-events: none !important;

}

/* Icon stärker hervorheben */

.mhl-regional-page
.mhl-regional-info > :first-child {

    position: relative !important;

}

/* Überschrift klar hervorheben */

.mhl-regional-page
.mhl-regional-info strong,
.mhl-regional-page
.mhl-regional-info h3 {

    color: #f4fbff !important;

    font-weight: 800 !important;

    letter-spacing: .01em !important;

}

/* Beschreibung etwas ruhiger */

.mhl-regional-page
.mhl-regional-info p {

    color: rgba(218, 239, 246, .86) !important;

}

/* Hover nur bei echter Maus */

@media (hover: hover) {

    .mhl-regional-page
    .mhl-regional-info:hover {

        border-color: rgba(89, 222, 246, .62) !important;

        box-shadow:
            0 14px 34px rgba(0,0,0,.20),
            0 0 22px rgba(89,222,246,.07),
            inset 0 1px 0 rgba(255,255,255,.05) !important;

        transform: translateY(-1px) !important;

    }

}

/* Mobile */

@media (max-width: 700px) {

    .mhl-regional-page
    .mhl-regional-info {

        border-radius: 18px !important;

        border-left-width: 3px !important;

        padding: 1rem !important;

    }

}

/* ============================================================
   MHL – EXAKT DER INFOBLOCK
   "Jedes Thema ist ein eigener kleiner Rundgang."
   ============================================================ */

.mhl-rundgang-highlight {

    position: relative !important;

    display: flex !important;

    align-items: center !important;

    gap: 1rem !important;

    width: 100% !important;

    margin-top: 1.6rem !important;

    padding: 1.05rem 1.25rem !important;

    border-radius: 22px !important;

    border: 1px solid rgba(72, 215, 239, .48) !important;

    border-left: 4px solid rgba(72, 215, 239, .95) !important;

    background:
        linear-gradient(
            135deg,
            rgba(38, 126, 149, .42),
            rgba(5, 45, 61, .72)
        ) !important;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .22),
        inset 0 1px 0 rgba(255, 255, 255, .055) !important;

    overflow: hidden !important;

}

/* Lichtkante oben – kein zusätzlicher Rahmen */

.mhl-rundgang-highlight::before {

    content: "" !important;

    position: absolute !important;

    left: 1rem !important;

    right: 1rem !important;

    top: 0 !important;

    height: 1px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(103, 232, 249, .8),
            transparent
        ) !important;

    pointer-events: none !important;

}

/* Vorhandenes Icon */

.mhl-rundgang-highlight > :first-child {

    flex: 0 0 auto !important;

}

/* Text */

.mhl-rundgang-highlight strong {

    color: #ffffff !important;

    font-weight: 800 !important;

}

.mhl-rundgang-highlight p,
.mhl-rundgang-highlight small {

    color: rgba(219, 240, 247, .9) !important;

}

/* Kein Hover-Gehampel, nur saubere Hervorhebung */

.mhl-rundgang-highlight:hover {

    transform: none !important;

    box-shadow:
        0 12px 30px rgba(0, 0, 0, .22),
        inset 0 1px 0 rgba(255, 255, 255, .055) !important;

}

@media (max-width: 700px) {

    .mhl-rundgang-highlight {

        border-radius: 18px !important;

        padding: .95rem 1rem !important;

        gap: .75rem !important;

    }

}

/* ============================================================
   MHL – REGIONALE BESONDERHEITEN / INDEX
   ============================================================ */

.mhl-regional-index-intro {
    margin-bottom: 1.75rem;
}

.mhl-regional-index-intro h2 {
    margin-bottom: .55rem;
}

.mhl-regional-index-intro p {
    max-width: 980px;
    margin: 0;
    color: rgba(220, 239, 246, .86);
}

.mhl-regional-index-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.mhl-regional-index-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 205px;
    padding: 1.15rem 1.2rem 1rem;
    border: 1px solid rgba(76, 205, 231, .28);
    border-radius: 22px;
    background:
        linear-gradient(
            145deg,
            rgba(24, 94, 116, .34),
            rgba(4, 42, 57, .60)
        );
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.045),
        0 12px 28px rgba(0,0,0,.14);
    overflow: hidden;
    transition:
        border-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.mhl-regional-index-card:hover {
    transform: translateY(-2px);
    border-color: rgba(76, 214, 239, .52);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 16px 34px rgba(0,0,0,.20);
}

.mhl-regional-index-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .9rem;
}

.mhl-regional-index-card__number,
.mhl-regional-index-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.mhl-regional-index-card__number {
    width: 40px;
    height: 40px;
    border-radius: 13px;
    border: 1px solid rgba(76, 214, 239, .28);
    background: rgba(40, 135, 157, .16);
    color: #8eeeff;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
}

.mhl-regional-index-card__icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    color: #79e9fb;
    font-size: 1rem;
}

.mhl-regional-index-card__eyebrow,
.mhl-regional-page__eyebrow {
    display: inline-block;
    color: #71dced;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.mhl-regional-index-card__content h3 {
    margin: .28rem 0 .45rem;
}

.mhl-regional-index-card__content p {
    margin: 0;
    color: rgba(214, 236, 243, .82);
    line-height: 1.6;
}

.mhl-regional-index-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: auto;
    padding-top: 1rem;
    color: rgba(204, 231, 239, .68);
    font-size: .8rem;
}

.mhl-regional-index-card__link {
    color: #78e9fa;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.mhl-regional-index-card__link:hover {
    color: #ffffff;
}

.mhl-rundgang-highlight {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    margin-top: 1.45rem;
    padding: 1rem 1.2rem;
    border: 1px solid rgba(91, 220, 242, .48);
    border-left: 4px solid rgba(91, 220, 242, .94);
    border-radius: 22px;
    background:
        linear-gradient(
            135deg,
            rgba(38, 128, 151, .38),
            rgba(5, 44, 59, .70)
        );
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.055),
        0 12px 28px rgba(0,0,0,.16);
}

.mhl-rundgang-highlight__icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    border: 1px solid rgba(91, 220, 242, .26);
    background: rgba(53, 173, 198, .15);
    color: #79e9fb;
    font-size: 1rem;
}

.mhl-rundgang-highlight__text {
    min-width: 0;
}

.mhl-rundgang-highlight__text strong {
    display: block;
    margin-bottom: .22rem;
    color: #ffffff;
    font-weight: 800;
}

.mhl-rundgang-highlight__text p {
    margin: 0;
    color: rgba(218, 239, 246, .88);
    line-height: 1.55;
}

@media (max-width: 900px) {

    .mhl-regional-index-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 600px) {

    .mhl-regional-index-card {
        min-height: 185px;
        border-radius: 18px;
        padding: 1rem;
    }

    .mhl-rundgang-highlight {
        align-items: flex-start;
        border-radius: 18px;
        padding: .95rem 1rem;
    }

}

/* ============================================================
   MHL – REGIONALE INDEX ICONS
   ============================================================ */

.mhl-regional-index-card__icon {
    color: #79e9fb !important;
}

.mhl-regional-index-card__icon svg {
    display: block;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mhl-regional-index-card:hover
.mhl-regional-index-card__icon {
    color: #ffffff !important;
}

/* ============================================================
   MHL – REGIONALE BESONDERHEITEN
   Überschriften auf allen Desktop-Breiten vollständig lesbar
   ============================================================ */

/*
 * Hero-Titel
 * Der Titel darf niemals aus dem sichtbaren Bereich laufen.
 */

.mhl-regional-page h1,
.mhl-regional-page .page-title,
.mhl-regional-page .hero-title {

    font-size: clamp(
        2.15rem,
        3.25vw,
        4.15rem
    ) !important;

    line-height: 1.02 !important;

    letter-spacing: -.025em !important;

    max-width: 100% !important;

    width: 100% !important;

    white-space: normal !important;

    overflow-wrap: anywhere !important;

    word-break: normal !important;

    hyphens: auto !important;

}

/*
 * Artikeltitel innerhalb der Regional-Seite.
 * Deutlich kleiner als der Hero-Titel und ebenfalls
 * vollständig innerhalb der linken Textspalte.
 */

.mhl-regional-page .mhl-regional-article h1,
.mhl-regional-page .mhl-regional-article-title,
.mhl-regional-page .mhl-regional-content h1,
.mhl-regional-page article h1 {

    font-size: clamp(
        2rem,
        2.55vw,
        3.25rem
    ) !important;

    line-height: 1.08 !important;

    letter-spacing: -.02em !important;

    max-width: 100% !important;

    white-space: normal !important;

    overflow-wrap: anywhere !important;

    hyphens: auto !important;

}

/*
 * Haupttitel oben auf der sichtbaren Seite.
 * Der Screenshot zeigt einen extrem breiten Titel.
 * Deshalb wird die maximale Zeichenbreite begrenzt,
 * damit der Titel sauber umgebrochen werden kann.
 */

.mhl-regional-page .regional-hero h1,
.mhl-regional-page .mhl-regional-hero h1,
.mhl-regional-page .mhl-page-hero h1 {

    max-width: min(
        100%,
        22ch
    ) !important;

}

/*
 * Textspalte im Artikel darf durch den Titel
 * nicht breiter werden.
 */

.mhl-regional-page .mhl-regional-article,
.mhl-regional-page .mhl-regional-content,
.mhl-regional-page .mhl-regional-text {

    min-width: 0 !important;

}

/*
 * Falls ein Grid/Flex verwendet wird:
 * Die linke Spalte darf schrumpfen.
 */

.mhl-regional-page .mhl-regional-layout > *,
.mhl-regional-page .mhl-regional-article-grid > *,
.mhl-regional-page .mhl-regional-main > * {

    min-width: 0 !important;

}

/*
 * Desktop – breite Bildschirme
 * Etwas größere Schrift, aber weiterhin kontrolliert.
 */

@media (min-width: 1400px) {

    .mhl-regional-page h1,
    .mhl-regional-page .page-title,
    .mhl-regional-page .hero-title {

        font-size: clamp(
            2.55rem,
            3vw,
            4.05rem
        ) !important;

        max-width: 21ch !important;

    }

    .mhl-regional-page .mhl-regional-article h1,
    .mhl-regional-page .mhl-regional-article-title,
    .mhl-regional-page .mhl-regional-content h1,
    .mhl-regional-page article h1 {

        font-size: clamp(
            2.15rem,
            2.2vw,
            3.1rem
        ) !important;

        max-width: 24ch !important;

    }

}

/*
 * Standard-Desktop
 */

@media (min-width: 901px) and (max-width: 1399px) {

    .mhl-regional-page h1,
    .mhl-regional-page .page-title,
    .mhl-regional-page .hero-title {

        font-size: clamp(
            2.15rem,
            3vw,
            3.35rem
        ) !important;

        max-width: 22ch !important;

    }

    .mhl-regional-page .mhl-regional-article h1,
    .mhl-regional-page .mhl-regional-article-title,
    .mhl-regional-page .mhl-regional-content h1,
    .mhl-regional-page article h1 {

        font-size: clamp(
            1.9rem,
            2.2vw,
            2.65rem
        ) !important;

        max-width: 26ch !important;

    }

}

/*
 * Tablet
 */

@media (min-width: 601px) and (max-width: 900px) {

    .mhl-regional-page h1,
    .mhl-regional-page .page-title,
    .mhl-regional-page .hero-title {

        font-size: clamp(
            1.9rem,
            5vw,
            2.8rem
        ) !important;

        max-width: 100% !important;

    }

    .mhl-regional-page .mhl-regional-article h1,
    .mhl-regional-page .mhl-regional-article-title,
    .mhl-regional-page .mhl-regional-content h1,
    .mhl-regional-page article h1 {

        font-size: clamp(
            1.7rem,
            4vw,
            2.35rem
        ) !important;

        max-width: 100% !important;

    }

}

/*
 * Mobil
 */

@media (max-width: 600px) {

    .mhl-regional-page h1,
    .mhl-regional-page .page-title,
    .mhl-regional-page .hero-title {

        font-size: clamp(
            1.7rem,
            8vw,
            2.35rem
        ) !important;

        line-height: 1.06 !important;

        max-width: 100% !important;

        letter-spacing: -.018em !important;

    }

    .mhl-regional-page .mhl-regional-article h1,
    .mhl-regional-page .mhl-regional-article-title,
    .mhl-regional-page .mhl-regional-content h1,
    .mhl-regional-page article h1 {

        font-size: clamp(
            1.55rem,
            7vw,
            2rem
        ) !important;

        line-height: 1.08 !important;

        max-width: 100% !important;

    }

}

/*
 * Verhindert horizontalen Überlauf der Regional-Seite,
 * ohne den Inhalt abzuschneiden.
 */

.mhl-regional-page {

    overflow-x: clip !important;

}

@supports not (overflow: clip) {

    .mhl-regional-page {

        overflow-x: hidden !important;

    }

}

/* ============================================================
   MHL – REGIONAL HEADLINE AUTO-FIT
   Die finale Größe wird per JS exakt an den verfügbaren
   Bereich angepasst.
   ============================================================ */

.mhl-regional-page h1,
.mhl-regional-page .page-title,
.mhl-regional-page .hero-title,
.mhl-regional-page .regional-hero h1,
.mhl-regional-page .mhl-regional-hero h1,
.mhl-regional-page .mhl-page-hero h1,
.mhl-regional-page .mhl-regional-article h1,
.mhl-regional-page .mhl-regional-article-title,
.mhl-regional-page .mhl-regional-content h1,
.mhl-regional-page article h1 {

    max-width: 100% !important;

    width: 100% !important;

    margin-right: 0 !important;

    white-space: nowrap !important;

    overflow: visible !important;

    text-overflow: clip !important;

    overflow-wrap: normal !important;

    word-break: normal !important;

}

/* ============================================================
   MHL – REGIONAL HERO TITEL FINAL
   ============================================================ */

/*
 * Der Hero selbst darf keinen horizontalen Überlauf
 * erzeugen.
 */

@supports not (overflow: clip) {

}

/* MHL REGIONAL SH TABS v1
   Nur Farben/Transparenz der vorhandenen Regional-Tabs.
   Layout, Abstände, Typografie, Icons, Inhalte und Navigation bleiben unverändert.
*/
.mhl-regional-page-row{
    --mhl-sh-blue: rgba(0, 91, 154, .14);
    --mhl-sh-white: rgba(255, 255, 255, .065);
    --mhl-sh-red: rgba(210, 35, 45, .105);
    --mhl-sh-blue-border: rgba(58, 174, 224, .34);
    --mhl-sh-white-border: rgba(255, 255, 255, .22);
    --mhl-sh-red-border: rgba(230, 78, 86, .32);

    background: var(--mhl-sh-blue) !important;
    border-color: var(--mhl-sh-blue-border) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.mhl-regional-page-row:nth-of-type(5n + 2){
    background: var(--mhl-sh-white) !important;
    border-color: var(--mhl-sh-white-border) !important;
}

.mhl-regional-page-row:nth-of-type(5n + 3){
    background: var(--mhl-sh-red) !important;
    border-color: var(--mhl-sh-red-border) !important;
}

.mhl-regional-page-row:nth-of-type(5n + 4){
    background: var(--mhl-sh-blue) !important;
    border-color: var(--mhl-sh-blue-border) !important;
}

.mhl-regional-page-row:nth-of-type(5n + 5){
    background: var(--mhl-sh-white) !important;
    border-color: var(--mhl-sh-white-border) !important;
}

.mhl-regional-page .mhl-regional-card,
.mhl-regional-page .mhl-regional-topic-card,
.mhl-regional-page .mhl-regional-section-card,
.mhl-regional-page .mhl-regional-category-card,
.mhl-regional-page .mhl-regional-topic{
    background: var(--mhl-sh-blue) !important;
    border-color: var(--mhl-sh-blue-border) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.mhl-regional-page .mhl-regional-card:nth-of-type(6n + 2),
.mhl-regional-page .mhl-regional-topic-card:nth-of-type(6n + 2),
.mhl-regional-page .mhl-regional-section-card:nth-of-type(6n + 2),
.mhl-regional-page .mhl-regional-category-card:nth-of-type(6n + 2),
.mhl-regional-page .mhl-regional-topic:nth-of-type(6n + 2){
    background: var(--mhl-sh-white) !important;
    border-color: var(--mhl-sh-white-border) !important;
}

.mhl-regional-page .mhl-regional-card:nth-of-type(6n + 3),
.mhl-regional-page .mhl-regional-topic-card:nth-of-type(6n + 3),
.mhl-regional-page .mhl-regional-section-card:nth-of-type(6n + 3),
.mhl-regional-page .mhl-regional-category-card:nth-of-type(6n + 3),
.mhl-regional-page .mhl-regional-topic:nth-of-type(6n + 3){
    background: var(--mhl-sh-red) !important;
    border-color: var(--mhl-sh-red-border) !important;
}

.mhl-regional-page .mhl-regional-card:nth-of-type(6n + 4),
.mhl-regional-page .mhl-regional-topic-card:nth-of-type(6n + 4),
.mhl-regional-page .mhl-regional-section-card:nth-of-type(6n + 4),
.mhl-regional-page .mhl-regional-category-card:nth-of-type(6n + 4),
.mhl-regional-page .mhl-regional-topic:nth-of-type(6n + 4){
    background: var(--mhl-sh-blue) !important;
    border-color: var(--mhl-sh-blue-border) !important;
}

.mhl-regional-page .mhl-regional-card:nth-of-type(6n + 5),
.mhl-regional-page .mhl-regional-topic-card:nth-of-type(6n + 5),
.mhl-regional-page .mhl-regional-section-card:nth-of-type(6n + 5),
.mhl-regional-page .mhl-regional-category-card:nth-of-type(6n + 5),
.mhl-regional-page .mhl-regional-topic:nth-of-type(6n + 5){
    background: var(--mhl-sh-white) !important;
    border-color: var(--mhl-sh-white-border) !important;
}

.mhl-regional-page .mhl-regional-card:nth-of-type(6n + 6),
.mhl-regional-page .mhl-regional-topic-card:nth-of-type(6n + 6),
.mhl-regional-page .mhl-regional-section-card:nth-of-type(6n + 6),
.mhl-regional-page .mhl-regional-category-card:nth-of-type(6n + 6),
.mhl-regional-page .mhl-regional-topic:nth-of-type(6n + 6){
    background: var(--mhl-sh-red) !important;
    border-color: var(--mhl-sh-red-border) !important;
}

@media (prefers-reduced-motion: reduce){
    .mhl-regional-page-row,
    .mhl-regional-page .mhl-regional-card,
    .mhl-regional-page .mhl-regional-topic-card,
    .mhl-regional-page .mhl-regional-section-card,
    .mhl-regional-page .mhl-regional-category-card,
    .mhl-regional-page .mhl-regional-topic{
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

/* MHL REGIONAL SH TABS v1 END */

/* MHL SH FLAG PREVIEW V6 START
   ------------------------------------------------------------
   Schleswig-Holstein-Farbwelt:
   BLAU / WEISS / ROT

   WICHTIG:
   Nur Farben, Transparenz, Rahmen und kleine Akzente.
   KEIN Layout / KEINE Größen / KEINE Positionierung.
   ------------------------------------------------------------
*/

/* ============================================================
   1. UNTERSEITEN-TABS
   ============================================================ */

html body .mhl-regional-page .mhl-regional-page-row {
    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            rgba(0, 92, 155, 0.24) 0%,
            rgba(0, 92, 155, 0.15) 31%,

            rgba(255, 255, 255, 0.105) 31%,
            rgba(255, 255, 255, 0.055) 66%,

            rgba(196, 28, 43, 0.16) 66%,
            rgba(196, 28, 43, 0.075) 100%
        ) !important;

    border-color:
        rgba(88, 190, 230, 0.46) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.10),
        inset 0 -1px 0 rgba(0,0,0,0.12);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* SH-Farbkante links */

html body .mhl-regional-page .mhl-regional-page-row::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;
    left: 0;

    width: 4px;

    background:
        linear-gradient(
            to bottom,

            rgba(0, 92, 155, 0.95) 0%,
            rgba(0, 92, 155, 0.95) 33.333%,

            rgba(255, 255, 255, 0.95) 33.333%,
            rgba(255, 255, 255, 0.95) 66.666%,

            rgba(196, 28, 43, 0.95) 66.666%,
            rgba(196, 28, 43, 0.95) 100%
        );

    pointer-events: none;
}

/* TAB 01 / 04 – BLAU */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 1) {

    background:
        linear-gradient(
            105deg,
            rgba(0, 92, 155, 0.29),
            rgba(0, 92, 155, 0.12) 58%,
            rgba(0, 92, 155, 0.075)
        ) !important;

    border-color:
        rgba(55, 177, 224, 0.58) !important;
}

/* TAB 02 / 05 – WEISS */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 2) {

    background:
        linear-gradient(
            105deg,
            rgba(255,255,255,0.145),
            rgba(255,255,255,0.065) 58%,
            rgba(255,255,255,0.035)
        ) !important;

    border-color:
        rgba(174, 218, 232, 0.48) !important;
}

/* TAB 03 / 06 – ROT */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 3) {

    background:
        linear-gradient(
            105deg,
            rgba(196,28,43,0.22),
            rgba(196,28,43,0.085) 58%,
            rgba(196,28,43,0.045)
        ) !important;

    border-color:
        rgba(226, 82, 94, 0.52) !important;
}

/* ============================================================
   2. NUMMERN DER UNTERSEITEN
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 1)
.mhl-regional-page-row__number {

    border-color:
        rgba(51, 174, 224, 0.68) !important;

    background:
        rgba(0, 92, 155, 0.20) !important;

    color:
        rgba(101, 218, 255, 0.98) !important;
}

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 2)
.mhl-regional-page-row__number {

    border-color:
        rgba(255,255,255,0.58) !important;

    background:
        rgba(255,255,255,0.075) !important;

    color:
        rgba(255,255,255,0.96) !important;
}

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 3)
.mhl-regional-page-row__number {

    border-color:
        rgba(235,75,91,0.68) !important;

    background:
        rgba(196,28,43,0.15) !important;

    color:
        rgba(255,143,153,0.98) !important;
}

/* ============================================================
   3. HAUPTSEITE – 6 THEMENKARTEN
   ============================================================ */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
) {

    position: relative;
    overflow: hidden;

    background:
        linear-gradient(
            110deg,
            rgba(0,92,155,0.17),
            rgba(255,255,255,0.055) 50%,
            rgba(196,28,43,0.10)
        ) !important;

    border-color:
        rgba(74,181,224,0.43) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.075);

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Karte 1 – BLAU */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 1) {

    background:
        linear-gradient(
            110deg,
            rgba(0,92,155,0.27),
            rgba(0,92,155,0.10)
        ) !important;

    border-left-color:
        rgba(0,148,218,0.82) !important;
}

/* Karte 2 – WEISS */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 2) {

    background:
        linear-gradient(
            110deg,
            rgba(255,255,255,0.135),
            rgba(255,255,255,0.045)
        ) !important;

    border-left-color:
        rgba(255,255,255,0.72) !important;
}

/* Karte 3 – ROT */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 3) {

    background:
        linear-gradient(
            110deg,
            rgba(196,28,43,0.21),
            rgba(196,28,43,0.065)
        ) !important;

    border-left-color:
        rgba(232,65,81,0.78) !important;
}

/* Karte 4 – BLAU */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 4) {

    background:
        linear-gradient(
            110deg,
            rgba(0,92,155,0.23),
            rgba(0,92,155,0.075)
        ) !important;

    border-left-color:
        rgba(0,148,218,0.72) !important;
}

/* Karte 5 – WEISS */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 5) {

    background:
        linear-gradient(
            110deg,
            rgba(255,255,255,0.115),
            rgba(255,255,255,0.040)
        ) !important;

    border-left-color:
        rgba(255,255,255,0.65) !important;
}

/* Karte 6 – ROT */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 6) {

    background:
        linear-gradient(
            110deg,
            rgba(196,28,43,0.18),
            rgba(196,28,43,0.055)
        ) !important;

    border-left-color:
        rgba(232,65,81,0.70) !important;
}

/* ============================================================
   4. HOVER – nur leichte Aufhellung
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-page-row:hover {

    filter: brightness(1.07);
}

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):hover {

    filter: brightness(1.06);
}

/* ============================================================
   5. REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    html body .mhl-regional-page .mhl-regional-page-row,
    html body .mhl-regional-page :is(
        [class*="mhl-regional-card"],
        [class*="mhl-regional-topic-card"],
        [class*="mhl-regional-section-card"],
        [class*="mhl-regional-category-card"],
        [class*="mhl-regional-topic"]
    ) {

        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

/* MHL SH FLAG PREVIEW V6 END */

/* MHL SH FLAG PREVIEW V7 START */

/*
   SCHLESWIG-HOLSTEIN
   Blau / Weiß / Rot

   NUR:
   - Hintergrundfarbe
   - Transparenz
   - Rahmen
   - kleine Farbakzente

   NICHT:
   - Breite
   - Höhe
   - Grid
   - Position
   - Abstände
   - Schrift
   - Navigation
*/

/* ============================================================
   UNTERSEITEN-TABS
   ============================================================ */

html body .mhl-regional-page .mhl-regional-page-row {

    background:
        linear-gradient(
            90deg,

            rgba(0, 91, 154, .27) 0%,
            rgba(0, 91, 154, .15) 32%,

            rgba(255, 255, 255, .10) 32%,
            rgba(255, 255, 255, .055) 66%,

            rgba(210, 35, 45, .17) 66%,
            rgba(210, 35, 45, .075) 100%
        ) !important;

    border-color:
        rgba(65, 180, 225, .50) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        inset 0 -1px 0 rgba(0,0,0,.10);
}

/* BLAU */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 1) {

    background:
        linear-gradient(
            90deg,
            rgba(0, 91, 154, .31),
            rgba(0, 91, 154, .12)
        ) !important;

    border-left-color:
        rgba(0, 145, 215, .90) !important;
}

/* WEISS */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 2) {

    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.15),
            rgba(255,255,255,.045)
        ) !important;

    border-left-color:
        rgba(255,255,255,.82) !important;
}

/* ROT */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 3) {

    background:
        linear-gradient(
            90deg,
            rgba(210,35,45,.23),
            rgba(210,35,45,.065)
        ) !important;

    border-left-color:
        rgba(235,60,75,.88) !important;
}

/* ============================================================
   NUMMERN
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 1)
.mhl-regional-page-row__number {

    background:
        rgba(0,91,154,.24) !important;

    border-color:
        rgba(60,190,235,.68) !important;
}

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 2)
.mhl-regional-page-row__number {

    background:
        rgba(255,255,255,.10) !important;

    border-color:
        rgba(255,255,255,.68) !important;
}

html body
.mhl-regional-page
.mhl-regional-page-row:nth-child(3n + 3)
.mhl-regional-page-row__number {

    background:
        rgba(210,35,45,.17) !important;

    border-color:
        rgba(235,65,80,.70) !important;
}

/* ============================================================
   HAUPTSEITE – 6 BESTEHENDE KARTEN
   ============================================================ */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
) {

    background:
        linear-gradient(
            105deg,
            rgba(0,91,154,.18),
            rgba(255,255,255,.055) 50%,
            rgba(210,35,45,.09)
        ) !important;

    border-color:
        rgba(65,180,225,.45) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08);
}

/* KARTE 1 – BLAU */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 1) {

    background:
        linear-gradient(
            105deg,
            rgba(0,91,154,.29),
            rgba(0,91,154,.09)
        ) !important;

    border-left-color:
        rgba(0,145,215,.82) !important;
}

/* KARTE 2 – WEISS */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 2) {

    background:
        linear-gradient(
            105deg,
            rgba(255,255,255,.135),
            rgba(255,255,255,.040)
        ) !important;

    border-left-color:
        rgba(255,255,255,.75) !important;
}

/* KARTE 3 – ROT */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 3) {

    background:
        linear-gradient(
            105deg,
            rgba(210,35,45,.22),
            rgba(210,35,45,.055)
        ) !important;

    border-left-color:
        rgba(235,60,75,.78) !important;
}

/* KARTE 4 – BLAU */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 4) {

    background:
        linear-gradient(
            105deg,
            rgba(0,91,154,.24),
            rgba(0,91,154,.065)
        ) !important;

    border-left-color:
        rgba(0,145,215,.75) !important;
}

/* KARTE 5 – WEISS */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 5) {

    background:
        linear-gradient(
            105deg,
            rgba(255,255,255,.115),
            rgba(255,255,255,.035)
        ) !important;

    border-left-color:
        rgba(255,255,255,.67) !important;
}

/* KARTE 6 – ROT */

html body .mhl-regional-page :is(
    [class*="mhl-regional-card"],
    [class*="mhl-regional-topic-card"],
    [class*="mhl-regional-section-card"],
    [class*="mhl-regional-category-card"],
    [class*="mhl-regional-topic"]
):nth-child(6n + 6) {

    background:
        linear-gradient(
            105deg,
            rgba(210,35,45,.18),
            rgba(210,35,45,.045)
        ) !important;

    border-left-color:
        rgba(235,60,75,.70) !important;
}

/* ============================================================
   V7 ENDE
   ============================================================ */

/* MHL SH FLAG PREVIEW V7 END */

/* MHL SH TABS V8 - BEGIN */

/*
   ============================================================
   NUR DIE SEITENLISTE
   ============================================================

   Ziel:
   .mhl-regional-page-list

   Einzelartikel:
   .mhl-regional-page--single
   wird NICHT gestaltet.

   Damit bleibt Bild 2 unverändert.
*/

/* ============================================================
   SEITENHÖHE / NICHT MEHR ABSCHNEIDEN
   ============================================================ */

html body:has(.mhl-regional-page-list) main {

    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    overflow: visible !important;

    padding-bottom: 90px !important;
}

html body:has(.mhl-regional-page-list) .mhl-regional-page {

    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    overflow: visible !important;

    padding-bottom: 26px !important;
}

html body:has(.mhl-regional-page-list) .mhl-regional-page-list {

    width: 100% !important;

    max-width: none !important;

    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    overflow: visible !important;

    display: flex !important;

    flex-direction: column !important;

    gap: 12px !important;

    padding-bottom: 24px !important;
}

/* ============================================================
   TAB GRUNDLAYOUT
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row {

    position: relative !important;

    isolation: isolate !important;

    display: grid !important;

    grid-template-columns:
        56px
        minmax(0, 1fr)
        50px !important;

    align-items: center !important;

    width: 100% !important;

    min-width: 0 !important;

    min-height: 88px !important;

    height: auto !important;

    max-height: none !important;

    overflow: hidden !important;

    padding:
        14px
        18px
        14px
        14px !important;

    border:
        1px solid
        rgba(255,255,255,.24) !important;

    border-radius: 18px !important;

    /*
       Schleswig-Holstein:

       Blau
       Weiß
       Rot

       bewusst transparent
    */

    background:
        linear-gradient(
            90deg,
            rgba(0,158,224,.32),
            rgba(255,255,255,.07) 52%,
            rgba(226,0,26,.12)
        ) !important;

    background-size:
        220% 100% !important;

    background-position:
        0 50% !important;

    box-shadow:

        inset
        0 1px 0
        rgba(255,255,255,.14),

        inset
        0 -1px 0
        rgba(0,0,0,.18),

        0 8px 24px
        rgba(0,0,0,.17) !important;

    backdrop-filter:
        blur(5px)
        saturate(115%) !important;

    -webkit-backdrop-filter:
        blur(5px)
        saturate(115%) !important;

    transform:
        translateZ(0) !important;

    transition:

        transform .28s ease,

        background-position .7s ease,

        border-color .28s ease,

        box-shadow .28s ease !important;
}

/* ============================================================
   SCHLESWIG-HOLSTEIN FLAGGENKANTE
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row::before {

    content: "" !important;

    position: absolute !important;

    z-index: 5 !important;

    left: 0 !important;

    top: 0 !important;

    bottom: 0 !important;

    width: 7px !important;

    border-radius:
        18px 0 0 18px !important;

    background:

        linear-gradient(
            to bottom,

            #009ee0 0%,
            #009ee0 33.33%,

            #ffffff 33.33%,
            #ffffff 66.66%,

            #e2001a 66.66%,
            #e2001a 100%
        ) !important;

    box-shadow:

        0 0 15px
        rgba(0,158,224,.35) !important;
}

/* ============================================================
   ANIMIERTE NORDSEE-WELLE
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row::after {

    content: "" !important;

    position: absolute !important;

    z-index: 2 !important;

    left: 12% !important;

    right: 7% !important;

    bottom: 8px !important;

    height: 17px !important;

    pointer-events: none !important;

    opacity: .55 !important;

    background:

        radial-gradient(
            ellipse at 8% 70%,
            transparent 0 16px,
            rgba(0,174,239,.90) 17px 18px,
            transparent 19px
        ),

        radial-gradient(
            ellipse at 30% 20%,
            transparent 0 19px,
            rgba(255,255,255,.70) 20px 21px,
            transparent 22px
        ),

        radial-gradient(
            ellipse at 52% 75%,
            transparent 0 17px,
            rgba(226,0,26,.58) 18px 19px,
            transparent 20px
        ),

        linear-gradient(
            90deg,
            transparent,
            rgba(0,174,239,.55),
            rgba(255,255,255,.42),
            rgba(226,0,26,.34),
            transparent
        );

    background-size:

        250px 100%,
        290px 100%,
        270px 100%,
        100% 2px;

    background-repeat:

        repeat-x,
        repeat-x,
        repeat-x,
        no-repeat;

    background-position:

        0 0,
        80px 0,
        150px 0,
        0 50%;

    animation:

        mhl-sh-wave-v8
        7s linear infinite;
}

@keyframes mhl-sh-wave-v8 {

    from {
        transform:
            translateX(-70px);
    }

    to {
        transform:
            translateX(70px);
    }
}

/* ============================================================
   WITZIGE AKZENTE PRO TAB
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row__icon::after {

    display: block !important;

    position: absolute !important;

    right: -4px !important;

    top: -7px !important;

    font-size: 16px !important;

    line-height: 1 !important;

    opacity: .9 !important;

    animation:

        mhl-sh-bob-v8
        2.8s ease-in-out infinite !important;

    filter:

        drop-shadow(
            0 2px 5px
            rgba(0,0,0,.3)
        ) !important;
}

@keyframes mhl-sh-bob-v8 {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(-2deg);
    }

    50% {

        transform:
            translateY(-3px)
            rotate(3deg);
    }
}

/* TAB 01 – WATTENMEER */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__icon::after {

    content: "🌊" !important;
}

/* TAB 02 – HALLIGEN */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__icon::after {

    content: "🐚" !important;
}

/* TAB 03 – KNICKLANDSCHAFT */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__icon::after {

    content: "🌿" !important;
}

/* TAB 04 – RAPSBLÜTE */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__icon::after {

    content: "🌼" !important;
}

/* TAB 05 – DEICHSCHAFE */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__icon::after {

    content: "🐑" !important;
}

/* ============================================================
   TAB 01 – BLAU
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(1) {

    background:

        linear-gradient(
            90deg,
            rgba(0,158,224,.40),
            rgba(0,90,140,.25),
            rgba(226,0,26,.12)
        ) !important;

    border-color:
        rgba(0,174,239,.70) !important;
}

/* ============================================================
   TAB 02 – WEISS / BLAU
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(2) {

    background:

        linear-gradient(
            90deg,
            rgba(255,255,255,.16),
            rgba(0,125,180,.25),
            rgba(226,0,26,.10)
        ) !important;

    border-color:
        rgba(255,255,255,.48) !important;
}

/* ============================================================
   TAB 03 – ROT
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(3) {

    background:

        linear-gradient(
            90deg,
            rgba(226,0,26,.30),
            rgba(20,50,80,.34),
            rgba(226,0,26,.12)
        ) !important;

    border-color:
        rgba(226,0,26,.75) !important;
}

/* ============================================================
   TAB 04 – BLAU / WEISS / ROT
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(4) {

    background:

        linear-gradient(
            90deg,
            rgba(0,158,224,.35),
            rgba(255,255,255,.08),
            rgba(226,0,26,.14)
        ) !important;

    border-color:
        rgba(0,174,239,.68) !important;
}

/* ============================================================
   TAB 05 – WEISS / BLAU / ROT
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:nth-child(5) {

    background:

        linear-gradient(
            90deg,
            rgba(255,255,255,.18),
            rgba(0,100,150,.28),
            rgba(226,0,26,.13)
        ) !important;

    border-color:
        rgba(255,255,255,.52) !important;
}

/* ============================================================
   HOVER
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row:hover {

    transform:
        translateY(-3px) !important;

    background-position:
        100% 50% !important;

    box-shadow:

        inset
        0 1px 0
        rgba(255,255,255,.20),

        0 13px 32px
        rgba(0,0,0,.25),

        0 0 22px
        rgba(0,158,224,.15) !important;
}

/* ============================================================
   NUMMER
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row__number {

    position: relative !important;

    z-index: 6 !important;

    width: 44px !important;

    height: 44px !important;

    display: grid !important;

    place-items: center !important;

    border-radius: 14px !important;

    background:
        rgba(0,0,0,.12) !important;

    border:
        1px solid
        rgba(255,255,255,.32) !important;
}

/* ============================================================
   TEXT
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row__body {

    position: relative !important;

    z-index: 6 !important;

    min-width: 0 !important;

    max-width: none !important;
}

html body:has(.mhl-regional-page-list)
.mhl-regional-page-row__arrow {

    position: relative !important;

    z-index: 7 !important;
}

/* ============================================================
   UNTEREN BEREICH NICHT ABSCHNEIDEN
   ============================================================ */

html body:has(.mhl-regional-page-list)
.mhl-regional-page-list + * {

    position: relative !important;

    z-index: 8 !important;

    margin-bottom: 20px !important;
}

html body:has(.mhl-regional-page-list)
.mhl-regional-page-list ~ * {

    position: relative !important;

    z-index: 8 !important;

    margin-bottom: 20px !important;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 700px) {

    html body:has(.mhl-regional-page-list)
    .mhl-regional-page-row {

        grid-template-columns:
            46px
            minmax(0,1fr)
            40px !important;

        min-height: 78px !important;

        padding:
            11px
            12px
            11px
            10px !important;

        border-radius:
            15px !important;
    }

    html body:has(.mhl-regional-page-list)
    .mhl-regional-page-row__number {

        width: 38px !important;

        height: 38px !important;

        border-radius:
            12px !important;
    }

    html body:has(.mhl-regional-page-list)
    .mhl-regional-page-row__icon::after {

        font-size:
            13px !important;
    }
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    html body:has(.mhl-regional-page-list)
    .mhl-regional-page-row,

    html body:has(.mhl-regional-page-list)
    .mhl-regional-page-row::after,

    html body:has(.mhl-regional-page-list)
    .mhl-regional-page-row__icon::after {

        animation:
            none !important;

        transition:
            none !important;
    }
}

/* MHL SH TABS V8 - END */

/* MHL SH TABS V8 START */

/*
===============================================================
MHL REGIONAL UNTERSEITEN – V8

Ziel:
- nur .mhl-regional-page-row
- Schleswig-Holstein Blau / Weiß / Rot
- transparente Glasoptik
- pro Tab eigene kleine Animation
- keine Änderung der Hauptseite
- keine Änderung des Karten-Grids
- keine Änderung von Routing / Blade / Navigation
===============================================================
*/

/* ============================================================
   BASIS – NUR DIE UNTERSEITEN-TABS
   ============================================================ */

html body .mhl-regional-page .mhl-regional-page-row {

    position: relative;

    overflow: hidden;

    isolation: isolate;

    background:
        linear-gradient(
            105deg,
            rgba(0, 92, 155, .24) 0%,
            rgba(0, 92, 155, .13) 32%,
            rgba(255,255,255,.065) 58%,
            rgba(196, 28, 43, .10) 100%
        ) !important;

    border-color:
        rgba(82, 190, 230, .48) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        inset 0 -1px 0 rgba(0,0,0,.14),
        0 5px 18px rgba(0,0,0,.10);

    backdrop-filter:
        blur(8px);

    -webkit-backdrop-filter:
        blur(8px);

    transition:
        background .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        transform .35s ease;
}

/* ============================================================
   SCHMALER SH-FARBSTREIFEN LINKS
   ============================================================ */

html body .mhl-regional-page .mhl-regional-page-row::before {

    content: "";

    position: absolute;

    left: 0;
    top: 0;
    bottom: 0;

    width: 4px;

    z-index: 4;

    background:
        linear-gradient(
            to bottom,
            rgba(0, 91, 154, .98) 0%,
            rgba(0, 91, 154, .98) 33%,

            rgba(255,255,255,.98) 33%,
            rgba(255,255,255,.98) 66%,

            rgba(196,28,43,.98) 66%,
            rgba(196,28,43,.98) 100%
        );

    box-shadow:
        0 0 10px rgba(0,160,220,.20);

    pointer-events: none;
}

/* ============================================================
   ANIMIERTE LICHT-/WELLENEBENE
   ============================================================ */

html body .mhl-regional-page .mhl-regional-page-row::after {

    content: "";

    position: absolute;

    left: 7%;
    right: 8%;

    bottom: 8px;

    height: 2px;

    z-index: 2;

    pointer-events: none;

    opacity: .48;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            rgba(0,190,255,.0) 8%,
            rgba(0,190,255,.85) 22%,
            rgba(255,255,255,.72) 38%,
            rgba(0,190,255,.80) 54%,
            rgba(196,28,43,.55) 72%,
            transparent 100%
        );

    transform-origin: center;

    animation:
        mhl-sh-wave 5.5s ease-in-out infinite;

    filter:
        blur(.15px);
}

/* ============================================================
   TAB 01 – WATTENMEER / BLAU
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(1) {

    background:
        linear-gradient(
            105deg,
            rgba(0,92,155,.34),
            rgba(0,92,155,.14) 62%,
            rgba(0,150,210,.08)
        ) !important;

    border-color:
        rgba(0,178,235,.68) !important;

    box-shadow:
        inset 0 1px 0 rgba(120,225,255,.12),
        0 0 18px rgba(0,145,215,.09);
}

/* Wasser schimmert */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(1)::after {

    animation:
        mhl-sh-wave 4.2s ease-in-out infinite;
}

/* Nummer */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(1)
.mhl-regional-page-row__number {

    background:
        rgba(0,92,155,.26) !important;

    border-color:
        rgba(0,190,245,.72) !important;

    color:
        rgba(110,225,255,.98) !important;

    box-shadow:
        0 0 14px rgba(0,180,240,.12);
}

/* ============================================================
   TAB 02 – HALLIGEN / WEISS
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(2) {

    background:
        linear-gradient(
            105deg,
            rgba(255,255,255,.145),
            rgba(220,240,248,.075) 55%,
            rgba(255,255,255,.035)
        ) !important;

    border-color:
        rgba(190,225,238,.60) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.16),
        0 0 17px rgba(180,225,240,.07);
}

/* Hallig schwebt */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(2) {

    animation:
        mhl-hallig-float 6s ease-in-out infinite;
}

/* Nummer */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(2)
.mhl-regional-page-row__number {

    background:
        rgba(255,255,255,.10) !important;

    border-color:
        rgba(255,255,255,.76) !important;

    color:
        rgba(245,252,255,.98) !important;
}

/* ============================================================
   TAB 03 – KNICKLANDSCHAFT / ROT
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(3) {

    background:
        linear-gradient(
            105deg,
            rgba(196,28,43,.27),
            rgba(120,24,42,.12) 58%,
            rgba(196,28,43,.075)
        ) !important;

    border-color:
        rgba(235,62,82,.70) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,110,125,.11),
        0 0 19px rgba(210,30,50,.08);
}

/* kleine "Blatt"-Bewegung über dem vorhandenen Icon */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(3)
.mhl-regional-page-row__icon {

    animation:
        mhl-leaf-sway 3.8s ease-in-out infinite;
}

/* Nummer */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(3)
.mhl-regional-page-row__number {

    background:
        rgba(196,28,43,.18) !important;

    border-color:
        rgba(245,75,95,.76) !important;

    color:
        rgba(255,135,145,.98) !important;

    box-shadow:
        0 0 13px rgba(225,35,55,.12);
}

/* ============================================================
   TAB 04 – RAPSBLÜTE / BLAU + GOLDENER LICHTAKZENT
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(4) {

    background:
        linear-gradient(
            105deg,
            rgba(0,92,155,.29),
            rgba(0,92,155,.12) 55%,
            rgba(214,170,32,.095)
        ) !important;

    border-color:
        rgba(0,183,235,.64) !important;

    box-shadow:
        inset 0 1px 0 rgba(105,225,255,.12),
        0 0 19px rgba(0,145,215,.08);
}

/* Rapsblüte pulsiert */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(4)
.mhl-regional-page-row__icon {

    animation:
        mhl-raps-glow 2.8s ease-in-out infinite;
}

/* Nummer */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(4)
.mhl-regional-page-row__number {

    background:
        rgba(0,92,155,.22) !important;

    border-color:
        rgba(0,185,235,.70) !important;

    color:
        rgba(105,225,255,.98) !important;
}

/* ============================================================
   TAB 05 – DEICHSCHAFE / WEISS
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(5) {

    background:
        linear-gradient(
            105deg,
            rgba(255,255,255,.135),
            rgba(230,242,247,.070) 52%,
            rgba(196,28,43,.065)
        ) !important;

    border-color:
        rgba(205,230,239,.62) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.15),
        0 0 18px rgba(210,230,240,.06);
}

/* Schaf macht einen kleinen Hüpfer */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(5)
.mhl-regional-page-row__icon {

    animation:
        mhl-sheep-hop 4.5s ease-in-out infinite;
}

/* Nummer */

html body
.mhl-regional-page
.mhl-regional-page-row:nth-of-type(5)
.mhl-regional-page-row__number {

    background:
        rgba(255,255,255,.095) !important;

    border-color:
        rgba(255,255,255,.72) !important;

    color:
        rgba(245,252,255,.98) !important;
}

/* ============================================================
   TEXT / ICONS – leichte SH-Farbakzente
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row__icon {

    position: relative;

    z-index: 5;

    transition:
        transform .35s ease,
        filter .35s ease;
}

html body
.mhl-regional-page
.mhl-regional-page-row__icon svg {

    transition:
        transform .35s ease,
        filter .35s ease;
}

html body
.mhl-regional-page
.mhl-regional-page-row:hover
.mhl-regional-page-row__icon svg {

    filter:
        drop-shadow(0 0 7px rgba(100,220,255,.65));

    transform:
        scale(1.10);
}

/* ============================================================
   HOVER – etwas lebendiger
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-row:hover {

    transform:
        translateY(-1px);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.14),
        0 8px 22px rgba(0,0,0,.17);

    filter:
        brightness(1.06);
}

/* ============================================================
   ANIMATIONEN
   ============================================================ */

/* Welle */

@keyframes mhl-sh-wave {

    0% {
        transform:
            translateX(-5%)
            scaleX(.88);

        opacity: .22;
    }

    50% {
        transform:
            translateX(4%)
            scaleX(1.05);

        opacity: .72;
    }

    100% {
        transform:
            translateX(-5%)
            scaleX(.88);

        opacity: .22;
    }
}

/* Hallig */

@keyframes mhl-hallig-float {

    0%,
    100% {
        transform:
            translateY(0);
    }

    50% {
        transform:
            translateY(-1px);
    }
}

/* Blatt */

@keyframes mhl-leaf-sway {

    0%,
    100% {
        transform:
            rotate(-2deg)
            translateY(0);
    }

    50% {
        transform:
            rotate(4deg)
            translateY(-2px);
    }
}

/* Raps */

@keyframes mhl-raps-glow {

    0%,
    100% {
        transform:
            scale(1);

        filter:
            drop-shadow(0 0 0 rgba(255,215,70,0));
    }

    50% {
        transform:
            scale(1.08);

        filter:
            drop-shadow(0 0 8px rgba(255,215,70,.65));
    }
}

/* Schaf */

@keyframes mhl-sheep-hop {

    0%,
    72%,
    100% {
        transform:
            translateY(0);
    }

    76% {
        transform:
            translateY(-3px)
            rotate(-2deg);
    }

    82% {
        transform:
            translateY(0)
            rotate(2deg);
    }

    87% {
        transform:
            translateY(-2px)
            rotate(-1deg);
    }
}

/* ============================================================
   UNTEN NICHT ABSCHNEIDEN
   Nur für die Seite mit den Unterseiten-Tabs.
   ============================================================ */

html body
.mhl-regional-page:has(.mhl-regional-page-row) {

    padding-bottom:
        14px;
}

html body
.mhl-regional-page
.mhl-regional-page-row:last-of-type {

    margin-bottom:
        5px;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 620px) {

    html body
    .mhl-regional-page
    .mhl-regional-page-row::after {

        left: 10%;
        right: 10%;

        opacity: .30;
    }

    html body
    .mhl-regional-page
    .mhl-regional-page-row:hover {

        transform:
            none;
    }

}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    html body
    .mhl-regional-page
    .mhl-regional-page-row,
    html body
    .mhl-regional-page
    .mhl-regional-page-row__icon,
    html body
    .mhl-regional-page
    .mhl-regional-page-row__icon svg,
    html body
    .mhl-regional-page
    .mhl-regional-page-row::after {

        animation:
            none !important;

        transition:
            none !important;
    }
}

/* MHL SH TABS V8 END */

/* ============================================================
   MHL_REGIONAL_BOTTOM_FIX_V1
   Nur die untere Regional-Zeile:
   - nicht abschneiden
   - nicht verschieben
   - volle Breite
   - automatische Höhe
   - Inhalt vollständig sichtbar
   ============================================================ */

html body .mhl-regional-page .mhl-regional-page-row {
    position: relative !important;
    inset: auto !important;
    left: 0 !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;

    display: flex !important;
    flex: 0 0 auto !important;

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

    height: auto !important;
    min-height: 58px !important;
    max-height: none !important;

    margin: 18px 0 0 !important;
    padding: 14px 18px !important;
    box-sizing: border-box !important;

    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;

    transform: none !important;
}

/* Kein Abschneiden durch einen Regional-Wrapper. */
html body .mhl-regional-page {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

html body .mhl-regional-page-row > * {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

html body .mhl-regional-page-row a,
html body .mhl-regional-page-row button,
html body .mhl-regional-page-row span,
html body .mhl-regional-page-row strong {
    overflow: visible !important;
    visibility: visible !important;
}

/* Linker Text darf nicht hinter dem Rand verschwinden. */
html body .mhl-regional-page-row > :first-child {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Rechter Start-Link bleibt innerhalb der Zeile. */
html body .mhl-regional-page-row > :last-child {
    margin-right: 0 !important;
    max-width: 100% !important;
}

/* Falls die Zeile selbst ein inneres Flex-Layout besitzt. */
html body .mhl-regional-page-row {
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
}

/* Mobile: keine horizontale Beschneidung. */
@media (max-width: 700px) {
    html body .mhl-regional-page .mhl-regional-page-row {
        min-height: 54px !important;
        padding: 12px 14px !important;
        gap: 10px !important;
        flex-wrap: wrap !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body .mhl-regional-page .mhl-regional-page-row {
        transition: none !important;
        animation: none !important;
    }
}

/* ============================================================
   END MHL_REGIONAL_BOTTOM_FIX_V1
   ============================================================ */

/* ============================================================
   MHL_REGIONAL_TABS_LAYOUT_FIX_V2
   GEOMETRIE-FIX – Farben/Design bleiben unangetastet.
   ============================================================ */

/* ---------- EINZELNE TAB-ZEILEN ---------- */

html body .mhl-regional-page .mhl-regional-page-row {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) 48px !important;
    align-items: center !important;
    justify-content: initial !important;
    column-gap: 16px !important;

    position: relative !important;
    inset: auto !important;
    transform: none !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 88px !important;
    height: auto !important;
    max-height: none !important;

    margin: 14px 0 0 !important;
    padding: 12px 18px !important;
    box-sizing: border-box !important;

    overflow: visible !important;
}

/* Nummer: immer links in der eigenen Spalte. */
html body .mhl-regional-page .mhl-regional-page-row > :first-child {
    grid-column: 1 !important;
    grid-row: 1 !important;

    width: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    margin: 0 !important;
    padding: 0 !important;

    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;

    justify-self: start !important;
    align-self: center !important;
    box-sizing: border-box !important;
}

/* Inhalt: NICHT mehr mittig im Tab. */
html body .mhl-regional-page .mhl-regional-page-row > :nth-child(2) {
    grid-column: 2 !important;
    grid-row: 1 !important;

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

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

    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;

    justify-self: stretch !important;
    align-self: center !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Falls der Inhalt noch einen alten Innenabstand/Offset besitzt. */
html body .mhl-regional-page .mhl-regional-page-row > :nth-child(2) > * {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
}

/* Pfeil: immer rechts. */
html body .mhl-regional-page .mhl-regional-page-row > :last-child {
    grid-column: 3 !important;
    grid-row: 1 !important;

    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;

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

    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;

    justify-self: end !important;
    align-self: center !important;
    box-sizing: border-box !important;
}

/* Typografie im Mittelteil bleibt linksbündig. */
html body .mhl-regional-page .mhl-regional-page-row h1,
html body .mhl-regional-page .mhl-regional-page-row h2,
html body .mhl-regional-page .mhl-regional-page-row h3,
html body .mhl-regional-page .mhl-regional-page-row h4,
html body .mhl-regional-page .mhl-regional-page-row p,
html body .mhl-regional-page .mhl-regional-page-row .eyebrow,
html body .mhl-regional-page .mhl-regional-page-row .label,
html body .mhl-regional-page .mhl-regional-page-row [class*="title"],
html body .mhl-regional-page .mhl-regional-page-row [class*="meta"] {
    text-align: left !important;
}

/* ---------- UNTERE NAVIGATIONSZEILE ---------- */

html body .mhl-regional-page .mhl-regional-page-row:last-child {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 58px !important;
    height: auto !important;
    max-height: none !important;

    margin: 18px 0 0 !important;
    padding: 14px 18px !important;
    box-sizing: border-box !important;

    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    overflow: visible !important;
}

/* Linker Bereich der unteren Zeile: niemals abschneiden. */
html body .mhl-regional-page .mhl-regional-page-row:last-child > :first-child {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

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

    position: relative !important;
    left: auto !important;
    transform: none !important;

    text-indent: 0 !important;
    overflow: visible !important;
    white-space: normal !important;
}

/* Rechter Start-Link. */
html body .mhl-regional-page .mhl-regional-page-row:last-child > :last-child {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

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

    position: relative !important;
    right: auto !important;
    transform: none !important;

    overflow: visible !important;
    white-space: nowrap !important;
}

/* Kein Abschneiden durch Elterncontainer. */
html body .mhl-regional-page,
html body .mhl-regional-page .mhl-regional-content,
html body .mhl-regional-page .mhl-regional-content-grid {
    height: auto !important;
    max-height: none !important;
}

/* Mobile */
@media (max-width: 700px) {
    html body .mhl-regional-page .mhl-regional-page-row:not(:last-child) {
        grid-template-columns: 54px minmax(0, 1fr) 40px !important;
        column-gap: 10px !important;
        min-height: 78px !important;
        padding: 10px 12px !important;
    }

    html body .mhl-regional-page .mhl-regional-page-row:not(:last-child) > :first-child {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
    }

    html body .mhl-regional-page .mhl-regional-page-row:not(:last-child) > :last-child {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
    }
}

/* ============================================================
   END MHL_REGIONAL_TABS_LAYOUT_FIX_V2
   ============================================================ */

/* BEGIN MHL REGIONAL TABS FIX V3 */

/*
 * Ziel:
 * - jede Aufzählungsnummer exakt gleich groß
 * - immer drei saubere Spalten: Nummer | Inhalt | Pfeil
 * - kein Schrumpfen einzelner Nummern
 * - kein seitliches Abschneiden des letzten Navigations-Tabs
 * - ausschließlich Regional-Unterseiten
 */

html body .mhl-regional-page .mhl-regional-page-list{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    overflow:visible !important;
}

/* JEDER Eintrag bekommt exakt dieselbe Geometrie. */
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row{
    display:grid !important;
    grid-template-columns:52px minmax(0,1fr) 46px !important;
    grid-template-rows:minmax(0,1fr) !important;
    align-items:center !important;
    column-gap:18px !important;

    width:100% !important;
    min-width:0 !important;
    min-height:82px !important;
    height:auto !important;

    box-sizing:border-box !important;
    margin:0 0 10px 0 !important;
    padding:11px 14px !important;

    transform:none !important;
    overflow:hidden !important;
}

/* Einheitliche Nummer: 01 / 02 / 03 / ... */
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__number{
    grid-column:1 !important;
    grid-row:1 !important;

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

    width:52px !important;
    min-width:52px !important;
    max-width:52px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;

    flex:0 0 52px !important;
    box-sizing:border-box !important;

    margin:0 !important;
    padding:0 !important;
    position:static !important;
    transform:none !important;

    border-radius:14px !important;
    line-height:1 !important;
    text-align:center !important;
}

/* Inhalt immer in derselben mittleren Spalte. */
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__body{
    grid-column:2 !important;
    grid-row:1 !important;

    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;
    padding:0 !important;
    position:static !important;
    transform:none !important;
    writing-mode:horizontal-tb !important;
}

/* Keine alten Breiten/Positionierungen in den Text übernehmen. */
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__body > .mhl-regional-page-row__kicker,
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__body > h3,
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__body > p{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;

    margin-left:0 !important;
    margin-right:0 !important;
    transform:none !important;
    writing-mode:horizontal-tb !important;
}

/* Titel/Lead dürfen niemals die Nummer oder den Pfeil verdrängen. */
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__body > h3{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__body > p{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

/* Pfeil immer rechts, immer gleich groß. */
html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__arrow{
    grid-column:3 !important;
    grid-row:1 !important;

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

    width:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    height:42px !important;
    min-height:42px !important;
    max-height:42px !important;

    justify-self:end !important;
    align-self:center !important;

    margin:0 !important;
    padding:0 !important;
    box-sizing:border-box !important;

    position:static !important;
    transform:none !important;
}

/*
 * UNTERER TAB:
 * .mhl-regional-topic-navigation
 *
 * Der linke Text darf nicht mehr aus dem Container herausgeschoben
 * werden. Der rechte Link bleibt vollständig sichtbar.
 */
html body .mhl-regional-page .mhl-regional-topic-navigation{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:20px !important;

    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    min-height:58px !important;

    box-sizing:border-box !important;
    margin:8px 0 0 0 !important;
    padding:0 16px !important;

    position:static !important;
    inset:auto !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;

    overflow:hidden !important;
}

/* Linker Bereich des unteren Tabs */
html body .mhl-regional-page .mhl-regional-topic-navigation > span{
    display:block !important;
    flex:1 1 auto !important;

    width:auto !important;
    min-width:0 !important;
    max-width:none !important;

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

    position:static !important;
    inset:auto !important;
    transform:none !important;

    overflow:visible !important;
    white-space:nowrap !important;
    text-overflow:clip !important;
}

/* Rechter Link des unteren Tabs */
html body .mhl-regional-page .mhl-regional-topic-navigation > a{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-end !important;

    flex:0 0 auto !important;
    width:auto !important;
    min-width:max-content !important;
    max-width:none !important;

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

    position:static !important;
    inset:auto !important;
    transform:none !important;

    white-space:nowrap !important;
    overflow:visible !important;
}

/* Desktop/Tablet: exakt dieselbe Geometrie */
@media (max-width:900px){
    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row{
        grid-template-columns:48px minmax(0,1fr) 42px !important;
        column-gap:14px !important;
        min-height:78px !important;
        padding:10px 12px !important;
    }

    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__number{
        width:48px !important;
        min-width:48px !important;
        max-width:48px !important;
        height:48px !important;
        min-height:48px !important;
        max-height:48px !important;
    }

    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__arrow{
        width:38px !important;
        min-width:38px !important;
        max-width:38px !important;
        height:38px !important;
        min-height:38px !important;
        max-height:38px !important;
    }
}

/* Mobil: nicht mehr drei Spalten erzwingen. */
@media (max-width:620px){
    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row{
        grid-template-columns:42px minmax(0,1fr) 38px !important;
        column-gap:10px !important;
        min-height:72px !important;
        padding:9px 10px !important;
    }

    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__number{
        width:42px !important;
        min-width:42px !important;
        max-width:42px !important;
        height:42px !important;
        min-height:42px !important;
        max-height:42px !important;
        border-radius:12px !important;
    }

    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row > .mhl-regional-page-row__arrow{
        width:34px !important;
        min-width:34px !important;
        max-width:34px !important;
        height:34px !important;
        min-height:34px !important;
        max-height:34px !important;
    }

    html body .mhl-regional-page .mhl-regional-topic-navigation{
        min-height:54px !important;
        padding:0 12px !important;
        gap:12px !important;
    }

    html body .mhl-regional-page .mhl-regional-topic-navigation > span{
        overflow:hidden !important;
        text-overflow:ellipsis !important;
    }
}

/* Keine Veränderung der Optik bei reduced motion. */
@media (prefers-reduced-motion:reduce){
    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row,
    html body .mhl-regional-page .mhl-regional-page-list > .mhl-regional-page-row:hover{
        transform:none !important;
    }
}

/* END MHL REGIONAL TABS FIX V3 */

/* MHL REGIONAL TAB ANIMATION V7 BEGIN */

/*
    Nur Regional-Unterseiten.

    Die fünf vorhandenen Tabs behalten:
    - Größe
    - Position
    - Nummern
    - Text
    - Pfeil
    - Abstände

    Animation:
    - komplette Tab-Fläche bewegt sich über einen
      langsamen Licht-/Windeffekt
    - kleine Schleswig-Holstein-Flagge sitzt weiter links
    - unterschiedliche Windbewegungen je Tab
*/

/* ============================================================
   FLAGGEN-ANKER
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row
.mhl-regional-page-row__arrow {

    position: relative !important;

    overflow: visible !important;

    z-index: 20 !important;
}

/* ============================================================
   SCHLESWIG-HOLSTEIN-FLAGGE
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row
.mhl-regional-page-row__arrow::before {

    content: "" !important;

    position: absolute !important;

    right: 62px !important;

    top: 50% !important;

    width: 35px !important;

    height: 20px !important;

    margin-top: -10px !important;

    z-index: 30 !important;

    pointer-events: none !important;

    box-sizing: border-box !important;

    background:
        linear-gradient(
            to bottom,

            #005b97 0%,
            #005b97 33.333%,

            #ffffff 33.333%,
            #ffffff 66.666%,

            #d91e32 66.666%,
            #d91e32 100%
        ) !important;

    border:
        1px solid
        rgba(255,255,255,.82) !important;

    border-radius:
        2px 5px 5px 2px !important;

    clip-path:
        polygon(
            0 0,
            100% 6%,
            95% 22%,
            100% 40%,
            94% 58%,
            100% 78%,
            95% 100%,
            0 92%
        ) !important;

    box-shadow:
        0 2px 6px rgba(0,0,0,.28),
        0 0 9px rgba(0,158,224,.15) !important;

    transform-origin:
        left center !important;
}

/* ============================================================
   FLAGGENMAST
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row
.mhl-regional-page-row__arrow::after {

    content: "" !important;

    position: absolute !important;

    right: 96px !important;

    top: 50% !important;

    width: 2px !important;

    height: 24px !important;

    margin-top: -12px !important;

    z-index: 31 !important;

    pointer-events: none !important;

    background:
        linear-gradient(
            to bottom,
            rgba(255,255,255,.96),
            rgba(165,180,193,.72)
        ) !important;
}

/* ============================================================
   GANZER TAB – WANDERNDER LICHTVERLAUF
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row {

    background-size:
        260% 100% !important;

    background-position:
        0% 50% !important;

    will-change:
        background-position,
        filter !important;
}

/* ============================================================
   01 – WATTENMEER
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(1) {

    animation:
        mhl-sh-tab-v7-01
        5.8s
        ease-in-out
        infinite !important;
}

@keyframes mhl-sh-tab-v7-01 {

    0%,
    100% {
        background-position: 0% 50%;
        filter: brightness(1);
    }

    50% {
        background-position: 100% 50%;
        filter: brightness(1.06);
    }
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-sh-flag-v7-01
        2.8s
        ease-in-out
        infinite !important;
}

@keyframes mhl-sh-flag-v7-01 {

    0% {
        transform:
            perspective(150px)
            rotateY(0deg)
            skewY(0deg)
            scaleX(1);
    }

    25% {
        transform:
            perspective(150px)
            rotateY(-11deg)
            skewY(-2deg)
            scaleX(.96);
    }

    50% {
        transform:
            perspective(150px)
            rotateY(14deg)
            skewY(3deg)
            scaleX(1.03);
    }

    75% {
        transform:
            perspective(150px)
            rotateY(-8deg)
            skewY(-2deg)
            scaleX(.98);
    }

    100% {
        transform:
            perspective(150px)
            rotateY(0deg)
            skewY(0deg)
            scaleX(1);
    }
}

/* ============================================================
   02 – HALLIGEN
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(2) {

    animation:
        mhl-sh-tab-v7-02
        7.2s
        ease-in-out
        infinite !important;

    animation-delay:
        .35s !important;
}

@keyframes mhl-sh-tab-v7-02 {

    0%,
    100% {
        background-position: 0% 50%;
        filter: brightness(1);
    }

    50% {
        background-position: 82% 50%;
        filter: brightness(1.035);
    }
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-sh-flag-v7-02
        4.7s
        ease-in-out
        infinite !important;

    animation-delay:
        .45s !important;
}

@keyframes mhl-sh-flag-v7-02 {

    0%,
    100% {
        transform:
            perspective(160px)
            rotateY(-2deg)
            skewY(0deg)
            translateY(0);
    }

    50% {
        transform:
            perspective(160px)
            rotateY(9deg)
            skewY(2deg)
            translateY(-1px);
    }
}

/* ============================================================
   03 – KNICKLANDSCHAFT
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(3) {

    animation:
        mhl-sh-tab-v7-03
        5.1s
        ease-in-out
        infinite !important;

    animation-delay:
        .15s !important;
}

@keyframes mhl-sh-tab-v7-03 {

    0% {
        background-position: 0% 50%;
        filter: brightness(1);
    }

    35% {
        background-position: 72% 50%;
        filter: brightness(1.055);
    }

    68% {
        background-position: 100% 50%;
        filter: brightness(1.035);
    }

    100% {
        background-position: 0% 50%;
        filter: brightness(1);
    }
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-sh-flag-v7-03
        3.0s
        cubic-bezier(.28,.68,.32,1)
        infinite !important;
}

@keyframes mhl-sh-flag-v7-03 {

    0% {
        transform:
            perspective(125px)
            rotateY(0deg)
            skewY(0deg);
    }

    18% {
        transform:
            perspective(125px)
            rotateY(14deg)
            skewY(4deg);
    }

    35% {
        transform:
            perspective(125px)
            rotateY(-10deg)
            skewY(-3deg);
    }

    53% {
        transform:
            perspective(125px)
            rotateY(17deg)
            skewY(5deg);
    }

    74% {
        transform:
            perspective(125px)
            rotateY(-12deg)
            skewY(-3deg);
    }

    100% {
        transform:
            perspective(125px)
            rotateY(0deg)
            skewY(0deg);
    }
}

/* ============================================================
   04 – RAPSBLÜTE
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(4) {

    animation:
        mhl-sh-tab-v7-04
        5.7s
        ease-in-out
        infinite !important;

    animation-delay:
        .65s !important;
}

@keyframes mhl-sh-tab-v7-04 {

    0%,
    100% {
        background-position: 0% 50%;
        filter: brightness(1);
    }

    50% {
        background-position: 95% 50%;
        filter: brightness(1.08);
    }
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-sh-flag-v7-04
        3.6s
        ease-in-out
        infinite !important;

    animation-delay:
        .7s !important;
}

@keyframes mhl-sh-flag-v7-04 {

    0%,
    100% {
        transform:
            perspective(145px)
            rotateY(0deg)
            skewY(0deg)
            scaleY(1);
    }

    50% {
        transform:
            perspective(145px)
            rotateY(-12deg)
            skewY(-3deg)
            scaleY(1.02);
    }
}

/* ============================================================
   05 – DEICHSCHAFE
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(5) {

    animation:
        mhl-sh-tab-v7-05
        7.8s
        ease-in-out
        infinite !important;

    animation-delay:
        .45s !important;
}

@keyframes mhl-sh-tab-v7-05 {

    0%,
    100% {
        background-position: 0% 50%;
        filter: brightness(1);
    }

    50% {
        background-position: 78% 50%;
        filter: brightness(1.03);
    }
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-sh-flag-v7-05
        5.1s
        ease-in-out
        infinite !important;

    animation-delay:
        .2s !important;
}

@keyframes mhl-sh-flag-v7-05 {

    0%,
    100% {
        transform:
            perspective(165px)
            rotateY(0deg)
            skewY(0deg)
            translateY(0);
    }

    35% {
        transform:
            perspective(165px)
            rotateY(-7deg)
            skewY(-2deg)
            translateY(-1px);
    }

    70% {
        transform:
            perspective(165px)
            rotateY(10deg)
            skewY(2deg)
            translateY(1px);
    }
}

/* ============================================================
   HOVER
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:hover {

    filter:
        brightness(1.08) !important;

    background-position:
        100% 50% !important;
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:hover
.mhl-regional-page-row__arrow::before {

    filter:
        brightness(1.12)
        drop-shadow(
            0 0 7px
            rgba(0,174,239,.42)
        ) !important;
}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    html body
    .mhl-regional-page
    .mhl-regional-page-list
    .mhl-regional-page-row,

    html body
    .mhl-regional-page
    .mhl-regional-page-list
    .mhl-regional-page-row__arrow::before {

        animation:
            none !important;

        transform:
            none !important;

        transition:
            none !important;
    }
}

/* MHL REGIONAL TAB ANIMATION V7 END */

/* MHL REGIONAL HEADER FLAG V6 BEGIN */

/*
 * NUR DIE FLAGGE:
 * Die komplette Tab-Fläche bleibt statisch.
 */

/* Vorherige V7-Flagge am Pfeil neutralisieren. */
html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row
.mhl-regional-page-row__arrow::before {

    content: "" !important;

    position: absolute !important;

    right: 62px !important;

    top: 50% !important;

    width: 38px !important;

    height: 22px !important;

    margin-top: -11px !important;

    z-index: 30 !important;

    display: block !important;

    pointer-events: none !important;

    box-sizing: border-box !important;

    background-color: transparent !important;

    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAoCAYAAABHJVyTAAAPXUlEQVR4nO1aS4ydyVX+zqn6X/f2y4+2xx5nlMwMDuMJw2NEBKtpJAgPKct2EEIhKFJgARsk2PbtLEBRQCzYAAvWZHrHRAIJFJwECY0SJyKJnYmTOM6M7X6/bt/H/6g6H4t7u93uabvtBCIk5lh/37/q/6v+Ot/56tQ5VRb83xJ5dxUf/ehk4cmvvCePlR8J9iNtj1rhaL085p0Hry50BOgA1zoKzB3zuaN11x47uPlz61y6coNYXOQx3///LU9j9adkCAULHcHNl0ft1mYfbt+79aA8cZnANeDcy8dbZ21W0LslrwKYmLjMubk56ywKHcB9Th2m1tHfExURgZnpNVzTyb+/JW/cv0zgmi2ewJgfZ8r8j4gA+MrfIfnMt/54ptvMnu7b6ZmhtIu6Tn2AQwg5yChRWgSAOG5HJwL4UcFEyCiBItKYwddDa1a3ufH99bUv/MXGoWZPNJ6ThZTX5jru3LmXuXTlKmURJoeseNDTMZ6CBLj/7JB32W8fF+A/ufHb595uXnppEE+9MrD2SxVb52vmuTFhQ1VAxz2L7P+oQADdL4pZBABvxuCkWs9t7dsurH5l8863vrb25j+ujj8sAiUfjOhHAkQw1skW4H9tY+Fc3UydMZ+1QmXeORMAiC5xFqEMVFGlsyqkqdasm8ppqJ2TGqhgKJI6psUe00nTlmetmTjOknYF8D/T0F9pLD0fkWUGD4OOh/5g0pAGmIGkEQwCVKIsVVQURO7K/pTv3T6VDf7rdBG+NpHX79Qy3N3pxz3ZHaz+0z98tnfIRA8B409CY35+XpeWlqIA+N3dT82WNvPh0oqfrYfps9GkENIBBgaXGDUj4cXEvLR6vopdQdhyrHZ85B7MM0oyUcfWMxXz9zXIpwJTj6ApwNMicgbAKahPIQkEAsdDU14MwggwgmxAawBYpQ5bmdfNLNFQpJJPZZg4XbRfON1uXTrV5ocVw/Veufe2Z+/rVYYvAtgDgIWFBRn7lCcBZEGBRZsHcOv3/nrGsgvPf7MXfp7UX7aoHwrQSybIQfFjKiY05CZOACLQ+srYVXBbEHaU1gNBo0yYJM80dJfMtTPCgyYwEowGgA2IPrSpFbGRGKPAoiBAvTkvMU1gaZJE53KLqeMgT6V/dirtT7dcPdlKYitLWu08nZ5q++l2Lj9lcVjudFv3dtqF29ndvAHg9kjHOQUW7SRARjR6bU7xxUWbX1qyz3ziN5/vhfxjEX5OIRcp2jZwEoCDqgAKFQW8O2hOC+0QQyGwU6TVAjYQgGBCSiEuTdQlIy+gBIygRoBRnCCow54H97yEoUOovYclPmYtH2eKRGZaSTKZ50hbqU+n2ml2dio9Oz2Zx4ks80WeFHmetGamJpEnHmVd5fdWVi6ubWYXHUJrX9G5uTl8+tMA+WDqnDhlPMCXIif7TfOBJoYPWKBGk10DeyP9BIAQgAEAIQRoUDRKaSCwsaOysRs0ghAJBGJ0EugYfarWzlPMTGTSbufKdstJKxG0Mo8iTdjKHBOvaKXKLHVopU6LIvUTrdy3iySbaqVo5SmKLEMrS5AXnkWem6qvV9a28nXnvDFmdRR3gr6PkHPrB3MrsltKbesI/CFDoDVxz4ROzEDAJDJQ0NjYTwmlFoeuQPtwWikkqmqA0hxdhBOqiERt6kSakGsoZnJ/6cyUv3xuOntxZtKfOjUh2WQ7b09OFLGVZnGyKJh57/MiTdM0yYos80WRo91qIUscEu+gIvBufO9USMpOt5ds72xjZW11uLK60t/Y2ggHNL52DTyy1jwSkHkAS2Ozn2vV8fx0XRVZNpxqTUqeZlHM1MzgVOhVTR05WgEgXhVJKswcTMEIsHGqDRmYOB8pKhS4LHeYLlJkiScoVDFkiboid+lUu0CWJkXRKpAmGYo0Q5omyLIMaZYiTVNkaYJURlQ3AA2AEIGKhqZqrNvdk+W1terO/ZXVO1ub3/jB1saXV7d2lxewIItY5DXM2VG9jwVEAFy5MopCCeCFC2nrzOnJS8+cOfPBFy5d8hdmz/RIS0hj4hxS58wlzlRHDInBqMLaaHVsyljXNUM0Mz6whwqQpinb7YLtvKXe+TZgMyQnVQHvHFQVzjmoju5VFeocVEcRyZj7YgCqCAzrGoOy5HA4lO52l+sra7a8vNxbWd9+a2Vn/Z+/u7f9H19Zu3f/D16fF1wFFhffHQA/kiGdDrC4OLo/f3Yie/HZ2dPvf/biuQ998DJm2vmMOmgIhPcCJw8HNBxbqgmGpqnQNA1CNMRD/BQBEp8gzXLkqUd2ZGYbQBv3NQ47QAOaJoBGMTMICZihqRsMen0MyyEGvR56u11sLq/L1vIKt1Y3GHe6/lJvr3ixtvyXyj2dn59/FzMeD4gIrl+fPNDxTLuN2elJnplsY6rIkI5biQoUI5f60FQkRiA5RaI5mGaj5zIKXTl+W0QgUAiBxgAjEM0QzUAzsUggBDBGMETEpkGsa8QQwCZAY4TUDUK/xHC3i7o/QOj2hDu70NV1LTa35exer611eCWhTTrnz07NPPu6qn4DAF6fv6ofW0I8nDaduMoAwLAccq/Xs91eH92yhKZFNEDiKACR/cX2cBgvAKGAjP/th1ehEYQQEGNEExrUdUDTNGhCgyY0EkIUmkHMICHCVTWkbiBVA6sqxMEQsa4hTYAPEa6sgH4J2+sDwwr5oETSH8B39+TUsBQJMW+5ZMLEne/Rmr75r/Jzf/ld3OhWz3/+84ojec6xgJDE9evXD8qrP1wz1qGJMTZnzp5OfHpek8SLmSB1EI+D+fwQz/ZvDCMG1FWDclCiKkuU+9ewRF2N6pq6RigbIEa4EOGbBumghBtW0LICBxVirw+ravhoSEKAryq4skFSRyTBkMYACRFTIZJmoga0HRAF2FEmb2d+Gne60/joRzdfXV4GDun5WIb826lT+/NM7vW2dnor9Vsi8tyUS54vl9fzxHsYDan3SBKPxPtRjAbAooEhghZBM8QQ0NQNmqpGPSxRVTWqqkKoKoSyApsaVjVg3QBVAx8MSYxIQkAyrODqBlo1QFXDhiUQIpwRLhp8aOCiIaMgpSAVIBGBE4WIolEqVLAHYluAochjN4uOA4QAcOXGDQKjeP9L6+ubshe+1quas6t316ZK9c95FYQQqKQQhJAgCUQDbeTsZJyHCAkaIWZgJMxG7zgbKZ6aITMZWz2iMKJtREbChdH0wdiBIho4Di2FHIWZFCgEKmMnTJiAJMnSwdY90h96xarT6l4mO5jFDt54I16/ft0dReeJfMhzMZHZ/sA/0+v6VmXiYoTSIDHAgsFiBGOEjQcsHMWrggeOV0XgRKA6spyKIhVBDiAVQSaKhIKURE6ioCARABBQZOSQRQBRiB4anMiBRySJAKAR0b4Ae0Ksqw3ueu7dTd07m0ny1TXn7srvL5YEcHt+Xo5OmePSfxGAn5ufd1eXliJI+bPf+cNfvDRoPnG+jB+5WMWLk01IPegCSTEIDiw1vg53PB6wYLyqjJUUeWBVB0DHzlexXx73IePIa9xu5J/l8DfoQAiEJFgquaPi1xVc9VItJ7i/luiNjTT9clezN3e1/vYbly9syeKijT9zYnIHANi+fXvkgVU5/bFPTU+b/PQZ51+4lDhMUhoFnI2VEsihQEnehTIP3T0IRbhPb+wvxMdd+3/3GQdQiNHSYKNESQBFEKARwZYYNhWDdSf3lhPcu5fI7c3EXb874b50y5+5vXwBZefaARDv8iePBOTV/RsBXAQyg3kzyNg/kAIKD+AVCCIO9rSOlXd9nQ+U5sNVD23cCEABoRRSiAigFOEQxECgpUCHqrHr4DacVLsOd7acfnEt1a9vJe4H3Wj33jrVe3v1r/52AAAdkItYPHZIT+RDKucxlEYaGVlFxz3ZQYTxoO+jyRKOanek/jHVB6kDRcSgMAVqJfoK7IhgD6z6Kpsl0B043dtx5KaT3q6Xt1Zbyb/fmfRfH7Tbqx/5Zln/6+e6YQlw84AJHr3SHB+HHCnsImBLYBMEShocJBigerCRwId0O9hzfKgzPlwcvckDSlFgAEwoFGHEiAkBlCAitRClQHbVbMeLbiqbnpO1gdMbFeR7A9H7Q4d+V9kbelm5n9n37s5iZb3z2f53BPybRyHwJIAAwO3nnzdcvw6aycc//kfbmYs32zE+tyb2gVylmMBol2vElof9ho0BGS+6YzYd9hOH7kWxv5kSATQqCCKohCgJVLCSIr1KpD8Ayx2nw22PuOtl0Fe9u+3xzR2v39ny/m5Pkq5l9WAy5tX709D/05uz9ezca259/hznX3/dRA5I91SAEABuLC2NvdlVvfXJF9+ps+1/KcxsMspvRfDyWQIumilEjYDK/k6wwAAxGSVocazsuCwU0kAEEAYZlyHjXVKpRKxS0b4ClWi/FLcSVd4Zjq61rujW0GFQurhn3m11VVd2U7/+di7b9/OsxNurDebn45tXr8alw1o9zrmdAAgAYPEQkm/++p9vfOsLnetTcj/JadOl2GAnokhVIsk0AkJ5EL3vA0AAQUbpOcfZq4lwlLhKNBDQETMixALICoiVEJVqXaru9hX3Bk7u9BLc3vb+/obPNytJ+kmB/jlIda6K9Sv0za9oWRcTE3F9aYnzV65Q961zyMhPIifCNj5CIRYW0t/4wdb73l+WP5dbeCFpMEM2aYBkDZhQmJKihJIyilsN5iiqo71FM1WNkeABIQRGRxEITaVhhEHQNCoNob0A3auU26XnRo9+baOVba+3T/d2hxdr/Or9gNk5e63TwdzcnC0uLj4ypX8aOXGVkbF//MK1a/aZS6+svzkx9dVKh9+XJs4YUUSzzEwSAAlIaUQoDhFRQIEq4BwAA6OQBvM0keggNcS4zys616RRoiYxwmVVoq6fRA69sfI+1B9crYbzTbv6k92Xa1y5waWlmwLcxI0HRh2T4vCJ2NMfcj/xUaYA4MKCYut0gup+3vJ7RcY8Mes71KrUWiU1262KiLaLCHuCGCVHMe5hCDhH6XrCOUpOg/cE+qP+i8KkTjiZVOyzbV3vm0shhLtTdyOWT3HhwoXY6XQoJyRnP6481cH4aCQLcv3VZbc2m2lx/hfk1uZ/6qmiTQCYvzIVgU5AB0SnM+q70+H4d1Re7BDoCNgZvTPelTsoAxgdpi8BV67s/3cG6Sws4ObNm7K0tGTAggAHB0z/owD9WIfdxzX+XzXfT0CeFpBjk8HDhYWFhRM7WXyih51D2P7oPuE9eU/ek/fkJyn/DeVV2dbTPg+9AAAAAElFTkSuQmCC") !important;

    background-repeat: no-repeat !important;

    background-position: center !important;

    background-size: 38px 22px !important;

    border: 0 !important;

    border-radius: 0 !important;

    clip-path: none !important;

    box-shadow: none !important;

    transform-origin: left center !important;

}

/* Vorherigen Flaggenmast abschalten. */
html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row
.mhl-regional-page-row__arrow::after {

    content: none !important;

    display: none !important;

}

/*
 * Wichtig:
 * Alle vorherigen GANZ-TAB-Animationen werden hier abgeschaltet.
 * Nur ::before, also die Flagge, darf sich bewegen.
 */
html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row {

    animation: none !important;

    transform: none !important;

    filter: none !important;

    background-position: initial !important;

    will-change: auto !important;

}

/* ============================================================
   NATÜRLICHES FLAGGENWEHEN
   ============================================================ */

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-header-flag-wave-01
        3.2s
        ease-in-out
        infinite !important;
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-header-flag-wave-02
        4.4s
        ease-in-out
        infinite !important;

    animation-delay:
        .35s !important;
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-header-flag-wave-03
        2.8s
        cubic-bezier(.35,.65,.3,1)
        infinite !important;

    animation-delay:
        .15s !important;
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-header-flag-wave-04
        3.6s
        ease-in-out
        infinite !important;

    animation-delay:
        .6s !important;
}

html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__arrow::before {

    animation:
        mhl-header-flag-wave-05
        5.0s
        ease-in-out
        infinite !important;

    animation-delay:
        .25s !important;
}

/* ============================================================
   WELLIGE STOFFBEWEGUNG
   ============================================================ */

@keyframes mhl-header-flag-wave-01 {

    0%,
    100% {
        transform:
            perspective(180px)
            rotateY(0deg)
            skewY(0deg)
            scaleX(1);
    }

    22% {
        transform:
            perspective(180px)
            rotateY(-8deg)
            skewY(-2deg)
            scaleX(.97);
    }

    48% {
        transform:
            perspective(180px)
            rotateY(11deg)
            skewY(2deg)
            scaleX(1.02);
    }

    72% {
        transform:
            perspective(180px)
            rotateY(-6deg)
            skewY(-1deg)
            scaleX(.985);
    }
}

@keyframes mhl-header-flag-wave-02 {

    0%,
    100% {
        transform:
            perspective(190px)
            rotateY(0deg)
            skewY(0deg)
            translateY(0);
    }

    35% {
        transform:
            perspective(190px)
            rotateY(7deg)
            skewY(1.5deg)
            translateY(-1px);
    }

    70% {
        transform:
            perspective(190px)
            rotateY(-6deg)
            skewY(-1.5deg)
            translateY(1px);
    }
}

@keyframes mhl-header-flag-wave-03 {

    0% {
        transform:
            perspective(160px)
            rotateY(0deg)
            skewY(0deg);
    }

    18% {
        transform:
            perspective(160px)
            rotateY(10deg)
            skewY(2deg);
    }

    34% {
        transform:
            perspective(160px)
            rotateY(-7deg)
            skewY(-2deg);
    }

    53% {
        transform:
            perspective(160px)
            rotateY(12deg)
            skewY(2.5deg);
    }

    72% {
        transform:
            perspective(160px)
            rotateY(-8deg)
            skewY(-2deg);
    }

    100% {
        transform:
            perspective(160px)
            rotateY(0deg)
            skewY(0deg);
    }
}

@keyframes mhl-header-flag-wave-04 {

    0%,
    100% {
        transform:
            perspective(185px)
            rotateY(0deg)
            skewY(0deg)
            scaleX(1);
    }

    30% {
        transform:
            perspective(185px)
            rotateY(-8deg)
            skewY(-1.5deg)
            scaleX(.98);
    }

    60% {
        transform:
            perspective(185px)
            rotateY(10deg)
            skewY(2deg)
            scaleX(1.02);
    }
}

@keyframes mhl-header-flag-wave-05 {

    0%,
    100% {
        transform:
            perspective(200px)
            rotateY(0deg)
            skewY(0deg)
            translateY(0);
    }

    40% {
        transform:
            perspective(200px)
            rotateY(-6deg)
            skewY(-1deg)
            translateY(-1px);
    }

    75% {
        transform:
            perspective(200px)
            rotateY(8deg)
            skewY(1.5deg)
            translateY(1px);
    }
}

/* Hover: nur die Flagge reagiert etwas stärker. */
html body
.mhl-regional-page
.mhl-regional-page-list
.mhl-regional-page-row:hover
.mhl-regional-page-row__arrow::before {

    filter:
        drop-shadow(
            0 0 5px
            rgba(70,190,235,.30)
        ) !important;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {

    html body
    .mhl-regional-page
    .mhl-regional-page-list
    .mhl-regional-page-row {

        animation: none !important;

        transform: none !important;

        filter: none !important;
    }

    html body
    .mhl-regional-page
    .mhl-regional-page-list
    .mhl-regional-page-row
    .mhl-regional-page-row__arrow::before {

        animation: none !important;

        transform: none !important;
    }
}

/* MHL REGIONAL HEADER FLAG V6 END */

/* MHL MOEVENMOMENT ONE ROW V3 BEGIN */

/*
   Nur der sichtbare Möwenmoment-Tile.
   Ziel:
   dieselbe horizontale Grundstruktur wie:
   Menschen an Bord
   Frische Downloads
   SH Nord & Ostsee
   Ebbe & Flut
*/

html body .mhl-moevenmoment-one-row {

    display: flex !important;

    flex-direction: row !important;

    align-items: center !important;

    justify-content: space-between !important;

    flex-wrap: nowrap !important;

    gap: 12px !important;

    width: 100% !important;

    min-width: 0 !important;

    box-sizing: border-box !important;

    text-align: left !important;

    writing-mode: horizontal-tb !important;
}

/* Direkte Kinder: immer horizontal. */

html body .mhl-moevenmoment-one-row > * {

    display: flex !important;

    flex-direction: row !important;

    align-items: center !important;

    box-sizing: border-box !important;

    margin-top: 0 !important;

    margin-bottom: 0 !important;

    text-align: left !important;

    writing-mode: horizontal-tb !important;
}

/* Linkes Icon */

html body .mhl-moevenmoment-one-row > :first-child {

    flex: 0 0 auto !important;

    width: auto !important;

    min-width: max-content !important;

    justify-content: center !important;

    white-space: nowrap !important;

    margin: 0 !important;
}

/* Haupttext */

html body .mhl-moevenmoment-one-row > :nth-child(2) {

    flex: 1 1 auto !important;

    width: auto !important;

    min-width: 0 !important;

    max-width: none !important;

    justify-content: flex-start !important;

    align-items: center !important;

    text-align: left !important;

    overflow: hidden !important;

    margin: 0 !important;
}

/* Text selbst */

html body .mhl-moevenmoment-one-row
> :nth-child(2)
:is(
    span,
    strong,
    small,
    p,
    h3,
    h4
) {

    display: block !important;

    width: auto !important;

    min-width: 0 !important;

    max-width: 100% !important;

    margin-top: 0 !important;

    margin-bottom: 0 !important;

    text-align: left !important;

    writing-mode: horizontal-tb !important;

    white-space: nowrap !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;
}

/* Rechtes Element */

html body .mhl-moevenmoment-one-row > :last-child {

    flex: 0 0 auto !important;

    width: auto !important;

    min-width: max-content !important;

    max-width: none !important;

    margin-left: auto !important;

    margin-right: 0 !important;

    justify-content: center !important;

    white-space: nowrap !important;
}

/* Falls der Möwenmoment mehr als drei Kinder besitzt:
   alles bleibt horizontal. */

html body .mhl-moevenmoment-one-row > :nth-child(n+3) {

    flex: 0 0 auto !important;

    white-space: nowrap !important;

}

/* Kein vertikales Layout innerhalb direkter Innencontainer. */

html body .mhl-moevenmoment-one-row
> *
> * {

    flex-direction: row !important;

    align-items: center !important;

    writing-mode: horizontal-tb !important;
}

/* Mobile */

@media (max-width: 700px) {

    html body .mhl-moevenmoment-one-row {

        gap: 8px !important;

        flex-wrap: nowrap !important;
    }

}

/* Reduced Motion */

@media (prefers-reduced-motion: reduce) {

    html body .mhl-moevenmoment-one-row {

        animation: none !important;

        transition: none !important;
    }

}

/* MHL MOEVENMOMENT ONE ROW V3 END */

/* MHL MOEVENMOMENT TAB FINAL BEGIN */

/*
===============================================================
NUR:

.home-jump-tabs
[data-home-card="moewenmoment"]

NICHT:
- andere vier Tabs
- Inhalte
- Module
- Navigation
- Routing
- moewenmoment.blade.php
===============================================================
*/

/* ============================================================
   HAUPTTAB
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"] {

    display: flex !important;

    flex-direction: row !important;

    align-items: center !important;

    justify-content: space-between !important;

    flex-wrap: nowrap !important;

    writing-mode: horizontal-tb !important;

    text-align: left !important;

    box-sizing: border-box !important;
}

/* ============================================================
   LINKES LABEL
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]
.home-jump-tabs__label {

    display: inline-flex !important;

    flex-direction: row !important;

    align-items: center !important;

    justify-content: flex-start !important;

    flex: 1 1 auto !important;

    width: auto !important;

    min-width: 0 !important;

    max-width: none !important;

    white-space: nowrap !important;

    writing-mode: horizontal-tb !important;

    text-align: left !important;

    box-sizing: border-box !important;
}

/* ============================================================
   MÖWEN-ICON IM LABEL
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]
.home-jump-tabs__label
svg {

    flex: 0 0 auto !important;

    display: inline-block !important;

    vertical-align: middle !important;

}

/* ============================================================
   RECHTES HINT-ICON
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]
.home-jump-tabs__hint {

    display: inline-flex !important;

    flex-direction: row !important;

    align-items: center !important;

    justify-content: center !important;

    flex: 0 0 auto !important;

    width: auto !important;

    min-width: max-content !important;

    max-width: none !important;

    margin-left: auto !important;

    white-space: nowrap !important;

    writing-mode: horizontal-tb !important;
}

/* ============================================================
   ALTE VERTIKALE REGELN AUS ANDEREN PATCHES NEUTRALISIEREN
   NUR AUF MÖWENMOMENT
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]
* {

    writing-mode: horizontal-tb !important;

    text-orientation: mixed !important;

}

/* Kein untereinander-Stapeln */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]
.home-jump-tabs__label
> * {

    flex-direction: row !important;

    align-items: center !important;

}

/* ============================================================
   TEXT
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]
.home-jump-tabs__label {

    line-height: 1.2 !important;

}

/* ============================================================
   HOVER
   ============================================================ */

html body
.home-jump-tabs
> a[data-home-card="moewenmoment"]:hover
.home-jump-tabs__hint {

    transform: translateX(2px) !important;

}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 700px) {

    html body
    .home-jump-tabs
    > a[data-home-card="moewenmoment"] {

        flex-direction: row !important;

        flex-wrap: nowrap !important;

    }

    html body
    .home-jump-tabs
    > a[data-home-card="moewenmoment"]
    .home-jump-tabs__label {

        white-space: nowrap !important;

    }

}

/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

    html body
    .home-jump-tabs
    > a[data-home-card="moewenmoment"]
    .home-jump-tabs__hint {

        transform: none !important;

        transition: none !important;

    }

}

/* MHL MOEVENMOMENT TAB FINAL END */

/* MHL REGIONAL LIGHTHOUSE SOS v4 BEGIN */

/*
   ============================================================
   LEUCHTTURM FÜLLT DEN VORHANDENEN KREIS
   ============================================================
*/

html body .mhl-regional-page
.mhl-regional-index-card__number,

html body .mhl-regional-page
.mhl-regional-page-row__number{

    position:relative !important;

    display:flex !important;

    align-items:center !important;

    justify-content:center !important;

    overflow:visible !important;

}

/*
   Der Leuchtturm nutzt fast die komplette Kreisfläche.
*/

html body .mhl-regional-page
.mhl-regional-index-card__number
svg,

html body .mhl-regional-page
.mhl-regional-page-row__number
svg{

    display:block !important;

    width:90% !important;

    height:90% !important;

    max-width:100% !important;

    max-height:100% !important;

    fill:none !important;

    stroke:currentColor !important;

    stroke-width:1.45 !important;

    stroke-linecap:round !important;

    stroke-linejoin:round !important;

    color:rgba(187,239,248,.62);

    transform-origin:50% 68%;

    position:relative;

    z-index:2;

}

/*
   ============================================================
   LEUCHTSCHEIN
   ============================================================
*/

html body .mhl-regional-page
.mhl-regional-index-card__number::before,

html body .mhl-regional-page
.mhl-regional-page-row__number::before{

    content:"";

    position:absolute;

    inset:-5px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(113,236,250,.36) 0%,
            rgba(113,236,250,.18) 30%,
            rgba(113,236,250,.06) 52%,
            rgba(113,236,250,0) 74%
        );

    opacity:0;

    transform:scale(.70);

    pointer-events:none;

    z-index:1;

}

/*
   ============================================================
   MORSE-CODE SOS
   ============================================================

   . . .
   - - -
   . . .

   Die Leuchtdauer unterscheidet Punkt und Strich.

   Punkt = kurzer heller Blitz
   Strich = langer heller Blitz
*/

@keyframes mhl-lighthouse-sos-v4{

    /* Punkt 1 */
    0%, 3%{
        opacity:1;
        color:#f1ffff;
        transform:scale(1.10);
        filter:
            drop-shadow(0 0 2px rgba(182,251,255,1))
            drop-shadow(0 0 7px rgba(73,220,241,.95))
            drop-shadow(0 0 15px rgba(73,220,241,.52));
    }

    3.01%, 7%{
        opacity:.28;
        color:rgba(187,239,248,.55);
        transform:scale(1);
        filter:none;
    }

    /* Punkt 2 */
    7.01%, 10%{
        opacity:1;
        color:#f1ffff;
        transform:scale(1.10);
        filter:
            drop-shadow(0 0 2px rgba(182,251,255,1))
            drop-shadow(0 0 7px rgba(73,220,241,.95))
            drop-shadow(0 0 15px rgba(73,220,241,.52));
    }

    10.01%, 14%{
        opacity:.28;
        color:rgba(187,239,248,.55);
        transform:scale(1);
        filter:none;
    }

    /* Punkt 3 */
    14.01%, 17%{
        opacity:1;
        color:#f1ffff;
        transform:scale(1.10);
        filter:
            drop-shadow(0 0 2px rgba(182,251,255,1))
            drop-shadow(0 0 7px rgba(73,220,241,.95))
            drop-shadow(0 0 15px rgba(73,220,241,.52));
    }

    17.01%, 24%{
        opacity:.24;
        color:rgba(187,239,248,.48);
        transform:scale(1);
        filter:none;
    }

    /* Strich 1 */
    24.01%, 36%{
        opacity:1;
        color:#f5ffff;
        transform:scale(1.12);
        filter:
            drop-shadow(0 0 3px rgba(188,252,255,1))
            drop-shadow(0 0 10px rgba(66,214,237,.96))
            drop-shadow(0 0 20px rgba(66,214,237,.56));
    }

    36.01%, 39%{
        opacity:.24;
        color:rgba(187,239,248,.47);
        transform:scale(1);
        filter:none;
    }

    /* Strich 2 */
    39.01%, 51%{
        opacity:1;
        color:#f5ffff;
        transform:scale(1.12);
        filter:
            drop-shadow(0 0 3px rgba(188,252,255,1))
            drop-shadow(0 0 10px rgba(66,214,237,.96))
            drop-shadow(0 0 20px rgba(66,214,237,.56));
    }

    51.01%, 54%{
        opacity:.24;
        color:rgba(187,239,248,.47);
        transform:scale(1);
        filter:none;
    }

    /* Strich 3 */
    54.01%, 66%{
        opacity:1;
        color:#f5ffff;
        transform:scale(1.12);
        filter:
            drop-shadow(0 0 3px rgba(188,252,255,1))
            drop-shadow(0 0 10px rgba(66,214,237,.96))
            drop-shadow(0 0 20px rgba(66,214,237,.56));
    }

    66.01%, 73%{
        opacity:.22;
        color:rgba(187,239,248,.44);
        transform:scale(1);
        filter:none;
    }

    /* Punkt 4 */
    73.01%, 76%{
        opacity:1;
        color:#f1ffff;
        transform:scale(1.10);
        filter:
            drop-shadow(0 0 2px rgba(182,251,255,1))
            drop-shadow(0 0 7px rgba(73,220,241,.95))
            drop-shadow(0 0 15px rgba(73,220,241,.52));
    }

    76.01%, 80%{
        opacity:.27;
        color:rgba(187,239,248,.49);
        transform:scale(1);
        filter:none;
    }

    /* Punkt 5 */
    80.01%, 83%{
        opacity:1;
        color:#f1ffff;
        transform:scale(1.10);
        filter:
            drop-shadow(0 0 2px rgba(182,251,255,1))
            drop-shadow(0 0 7px rgba(73,220,241,.95))
            drop-shadow(0 0 15px rgba(73,220,241,.52));
    }

    83.01%, 87%{
        opacity:.27;
        color:rgba(187,239,248,.49);
        transform:scale(1);
        filter:none;
    }

    /* Punkt 6 */
    87.01%, 90%{
        opacity:1;
        color:#f1ffff;
        transform:scale(1.10);
        filter:
            drop-shadow(0 0 2px rgba(182,251,255,1))
            drop-shadow(0 0 7px rgba(73,220,241,.95))
            drop-shadow(0 0 15px rgba(73,220,241,.52));
    }

    90.01%, 100%{
        opacity:.25;
        color:rgba(187,239,248,.46);
        transform:scale(1);
        filter:none;
    }

}

/*
   Licht-Halo synchron zum Morsecode
*/

@keyframes mhl-lighthouse-sos-v4-halo{

    0%,3%{
        opacity:1;
        transform:scale(1);
    }

    3.01%,7%{
        opacity:0;
        transform:scale(.70);
    }

    7.01%,10%{
        opacity:1;
        transform:scale(1);
    }

    10.01%,14%{
        opacity:0;
        transform:scale(.70);
    }

    14.01%,17%{
        opacity:1;
        transform:scale(1);
    }

    17.01%,24%{
        opacity:0;
        transform:scale(.70);
    }

    24.01%,36%{
        opacity:1;
        transform:scale(1.12);
    }

    36.01%,39%{
        opacity:0;
        transform:scale(.70);
    }

    39.01%,51%{
        opacity:1;
        transform:scale(1.12);
    }

    51.01%,54%{
        opacity:0;
        transform:scale(.70);
    }

    54.01%,66%{
        opacity:1;
        transform:scale(1.12);
    }

    66.01%,73%{
        opacity:0;
        transform:scale(.70);
    }

    73.01%,76%{
        opacity:1;
        transform:scale(1);
    }

    76.01%,80%{
        opacity:0;
        transform:scale(.70);
    }

    80.01%,83%{
        opacity:1;
        transform:scale(1);
    }

    83.01%,87%{
        opacity:0;
        transform:scale(.70);
    }

    87.01%,90%{
        opacity:1;
        transform:scale(1);
    }

    90.01%,100%{
        opacity:0;
        transform:scale(.70);
    }

}

/*
   ============================================================
   REGIONAL-ÜBERSICHT
   ============================================================
*/

html body .mhl-regional-page
.mhl-regional-index-card__number
svg{

    animation:
        mhl-lighthouse-sos-v4
        5.4s
        linear
        infinite;

}

html body .mhl-regional-page
.mhl-regional-index-card__number::before{

    animation:
        mhl-lighthouse-sos-v4-halo
        5.4s
        linear
        infinite;

}

/*
   Sechs Leuchttürme leicht versetzt:
   dadurch entsteht der Eindruck einer Küste mit
   mehreren voneinander entfernten Leuchtfeuern.
*/

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(1)
.mhl-regional-index-card__number
svg,
html body .mhl-regional-page
.mhl-regional-index-card:nth-child(1)
.mhl-regional-index-card__number::before{
    animation-delay:0s;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(2)
.mhl-regional-index-card__number
svg,
html body .mhl-regional-page
.mhl-regional-index-card:nth-child(2)
.mhl-regional-index-card__number::before{
    animation-delay:-.32s;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(3)
.mhl-regional-index-card__number
svg,
html body .mhl-regional-page
.mhl-regional-index-card:nth-child(3)
.mhl-regional-index-card__number::before{
    animation-delay:-.64s;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(4)
.mhl-regional-index-card__number
svg,
html body .mhl-regional-page
.mhl-regional-index-card:nth-child(4)
.mhl-regional-index-card__number::before{
    animation-delay:-.96s;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(5)
.mhl-regional-index-card__number
svg,
html body .mhl-regional-page
.mhl-regional-index-card:nth-child(5)
.mhl-regional-index-card__number::before{
    animation-delay:-1.28s;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(6)
.mhl-regional-index-card__number
svg,
html body .mhl-regional-page
.mhl-regional-index-card:nth-child(6)
.mhl-regional-index-card__number::before{
    animation-delay:-1.60s;
}

/*
   ============================================================
   REGIONAL-UNTERSEITEN
   ============================================================
*/

html body .mhl-regional-page
.mhl-regional-page-row__number
svg{

    animation:
        mhl-lighthouse-sos-v4
        5.4s
        linear
        infinite;

}

html body .mhl-regional-page
.mhl-regional-page-row__number::before{

    animation:
        mhl-lighthouse-sos-v4-halo
        5.4s
        linear
        infinite;

}

/*
   Reihenweise leicht versetzt.
*/

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__number
svg,
html body .mhl-regional-page
.mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__number::before{
    animation-delay:0s;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__number
svg,
html body .mhl-regional-page
.mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__number::before{
    animation-delay:-.42s;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__number
svg,
html body .mhl-regional-page
.mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__number::before{
    animation-delay:-.84s;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__number
svg,
html body .mhl-regional-page
.mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__number::before{
    animation-delay:-1.26s;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__number
svg,
html body .mhl-regional-page
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__number::before{
    animation-delay:-1.68s;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(6)
.mhl-regional-page-row__number
svg,
html body .mhl-regional-page
.mhl-regional-page-row:nth-child(6)
.mhl-regional-page-row__number::before{
    animation-delay:-2.10s;
}

/*
   Reduced Motion
*/

@media (prefers-reduced-motion:reduce){

    html body .mhl-regional-page
    .mhl-regional-index-card__number
    svg,

    html body .mhl-regional-page
    .mhl-regional-page-row__number
    svg{

        animation:none !important;

        opacity:.72 !important;

        transform:none !important;

        filter:none !important;

    }

    html body .mhl-regional-page
    .mhl-regional-index-card__number::before,

    html body .mhl-regional-page
    .mhl-regional-page-row__number::before{

        animation:none !important;

        opacity:0 !important;

    }

}

/* MHL REGIONAL LIGHTHOUSE SOS v4 END */

/* MHL REGIONAL DOMAIN MORSE 5s BEGIN */

/*
   MEERHEIMATLIEBE.DE
   Morsecode:

   -- / . / . / .-. / .... / . / .. / -- / .- / - / .-.. / .. / . / -... / . / .-.-.- / -.. / .

   Kompletter Leuchtfeuer-Durchlauf:
   exakt 5,0 Sekunden
*/

/* Leuchtturm bleibt kreisfüllend */

html body .mhl-regional-page
.mhl-regional-index-card__number
svg,

html body .mhl-regional-page
.mhl-regional-page-row__number
svg {

    display:block !important;

    width:90% !important;
    height:90% !important;

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

    fill:none !important;

    stroke:currentColor !important;

    stroke-width:1.45 !important;

    stroke-linecap:round !important;
    stroke-linejoin:round !important;

    transform-origin:50% 68%;

    color:rgba(185,238,247,.58);

}

/* Leuchtschein */

html body .mhl-regional-page
.mhl-regional-index-card__number::before,

html body .mhl-regional-page
.mhl-regional-page-row__number::before {

    content:"";

    position:absolute;

    inset:-7px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(104,233,248,.40) 0%,
            rgba(104,233,248,.17) 30%,
            rgba(104,233,248,0) 74%
        );

    opacity:0;

    transform:scale(.70);

    pointer-events:none;

    z-index:1;

}

/*
   ============================================================
   DOMAIN MORSE – EXAKT 5 SEKUNDEN
   ============================================================
*/

@keyframes mhl-domain-morse-5s {

    0% {
        opacity:.24;
        color:rgba(185,238,247,.46);
        transform:scale(1);
        filter:none;
    }

    0.0000%,
    2.1277% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    2.8369%,
    4.9645% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    7.0922%,
    7.8014% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    9.9291%,
    10.6383% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    12.7660%,
    13.4752% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    14.1844%,
    16.3121% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    17.0213%,
    17.7305% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    19.8582%,
    20.5674% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    21.2766%,
    21.9858% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    22.6950%,
    23.4043% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    24.1135%,
    24.8227% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    26.9504%,
    27.6596% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    29.7872%,
    30.4965% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    31.2057%,
    31.9149% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    34.0426%,
    36.1702% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    36.8794%,
    39.0071% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    41.1348%,
    41.8440% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    42.5532%,
    44.6809% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    46.8085%,
    48.9362% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    51.0638%,
    51.7730% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    52.4823%,
    54.6099% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    55.3191%,
    56.0284% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    56.7376%,
    57.4468% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    59.5745%,
    60.2837% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    60.9929%,
    61.7021% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    63.8298%,
    64.5390% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    66.6667%,
    68.7943% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    69.5035%,
    70.2128% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    70.9220%,
    71.6312% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    72.3404%,
    73.0496% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    75.1773%,
    75.8865% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    78.0142%,
    78.7234% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    79.4326%,
    81.5603% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    82.2695%,
    82.9787% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    83.6879%,
    85.8156% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    86.5248%,
    87.2340% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    87.9433%,
    90.0709% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    92.1986%,
    94.3262% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    95.0355%,
    95.7447% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    96.4539%,
    97.1631% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    99.2908%,
    100.0000% {
        opacity:1;
        color:#f5ffff;
        transform:scale(1.11);
        filter:
            drop-shadow(0 0 2px rgba(190,252,255,1))
            drop-shadow(0 0 8px rgba(72,220,240,.98))
            drop-shadow(0 0 18px rgba(72,220,240,.60));
    }

    100% {
        opacity:.24;
        color:rgba(185,238,247,.46);
        transform:scale(1);
        filter:none;
    }

}

/* ============================================================
   REGIONAL-ÜBERSICHT
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card__number
svg {

    animation:
        mhl-domain-morse-5s
        5s
        linear
        infinite;

}

html body .mhl-regional-page
.mhl-regional-index-card__number::before {

    animation:
        mhl-domain-morse-5s
        5s
        linear
        infinite;

}

/* ============================================================
   UNTERSEITEN
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-page-row__number
svg {

    animation:
        mhl-domain-morse-5s
        5s
        linear
        infinite;

}

html body .mhl-regional-page
.mhl-regional-page-row__number::before {

    animation:
        mhl-domain-morse-5s
        5s
        linear
        infinite;

}

/* Küstenlinie: kleine Phasenverschiebung */

html body .mhl-regional-index-card:nth-child(1)
.mhl-regional-index-card__number svg,
html body .mhl-regional-index-card:nth-child(1)
.mhl-regional-index-card__number::before {
    animation-delay:0s;
}

html body .mhl-regional-index-card:nth-child(2)
.mhl-regional-index-card__number svg,
html body .mhl-regional-index-card:nth-child(2)
.mhl-regional-index-card__number::before {
    animation-delay:-.25s;
}

html body .mhl-regional-index-card:nth-child(3)
.mhl-regional-index-card__number svg,
html body .mhl-regional-index-card:nth-child(3)
.mhl-regional-index-card__number::before {
    animation-delay:-.50s;
}

html body .mhl-regional-index-card:nth-child(4)
.mhl-regional-index-card__number svg,
html body .mhl-regional-index-card:nth-child(4)
.mhl-regional-index-card__number::before {
    animation-delay:-.75s;
}

html body .mhl-regional-index-card:nth-child(5)
.mhl-regional-index-card__number svg,
html body .mhl-regional-index-card:nth-child(5)
.mhl-regional-index-card__number::before {
    animation-delay:-1s;
}

html body .mhl-regional-index-card:nth-child(6)
.mhl-regional-index-card__number svg,
html body .mhl-regional-index-card:nth-child(6)
.mhl-regional-index-card__number::before {
    animation-delay:-1.25s;
}

/* Unterseiten */

html body .mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__number svg,
html body .mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__number::before {
    animation-delay:0s;
}

html body .mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__number svg,
html body .mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__number::before {
    animation-delay:-.25s;
}

html body .mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__number svg,
html body .mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__number::before {
    animation-delay:-.50s;
}

html body .mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__number svg,
html body .mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__number::before {
    animation-delay:-.75s;
}

html body .mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__number svg,
html body .mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__number::before {
    animation-delay:-1s;
}

html body .mhl-regional-page-row:nth-child(6)
.mhl-regional-page-row__number svg,
html body .mhl-regional-page-row:nth-child(6)
.mhl-regional-page-row__number::before {
    animation-delay:-1.25s;
}

/* Reduced Motion */

@media (prefers-reduced-motion:reduce) {

    html body .mhl-regional-page
    .mhl-regional-index-card__number svg,

    html body .mhl-regional-page
    .mhl-regional-page-row__number svg {

        animation:none !important;
        opacity:.72 !important;
        transform:none !important;
        filter:none !important;

    }

    html body .mhl-regional-page
    .mhl-regional-index-card__number::before,

    html body .mhl-regional-page
    .mhl-regional-page-row__number::before {

        animation:none !important;
        opacity:0 !important;

    }

}

/* MHL REGIONAL DOMAIN MORSE 5s END */

/* MHL REGIONAL SH ELEGANT COLORS BEGIN */

/*
   Schleswig-Holstein-Farbfolge:
   01 Blau
   02 Weiß
   03 Rot
   04 Blau
   05 Weiß
   06 Rot

   Nur Farben / Glasflächen / Konturen.
   Kein Grid-Umbau.
   Keine Größenänderung.
   Keine neue Animation.
*/

html body .mhl-regional-page
.mhl-regional-index-card{

    --mhl-sh-blue-bg:rgba(0,91,151,.16);
    --mhl-sh-blue-border:rgba(66,181,222,.40);

    --mhl-sh-white-bg:rgba(255,255,255,.075);
    --mhl-sh-white-border:rgba(255,255,255,.28);

    --mhl-sh-red-bg:rgba(217,30,50,.13);
    --mhl-sh-red-border:rgba(233,77,91,.40);

    position:relative;
}

/* ============================================================
   01 – BLAU
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(1){

    background:
        linear-gradient(
            145deg,
            rgba(0,91,151,.24),
            rgba(5,48,68,.68)
        ) !important;

    border-color:
        var(--mhl-sh-blue-border) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.055),
        inset 3px 0 0 rgba(0,91,151,.58),
        0 12px 28px rgba(0,0,0,.14) !important;
}

/* ============================================================
   02 – WEISS
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(2){

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.095),
            rgba(8,51,67,.64)
        ) !important;

    border-color:
        var(--mhl-sh-white-border) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.085),
        inset 3px 0 0 rgba(255,255,255,.58),
        0 12px 28px rgba(0,0,0,.14) !important;
}

/* ============================================================
   03 – ROT
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(3){

    background:
        linear-gradient(
            145deg,
            rgba(217,30,50,.19),
            rgba(17,45,60,.68)
        ) !important;

    border-color:
        var(--mhl-sh-red-border) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.055),
        inset 3px 0 0 rgba(217,30,50,.64),
        0 12px 28px rgba(0,0,0,.14) !important;
}

/* ============================================================
   04 – BLAU
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(4){

    background:
        linear-gradient(
            145deg,
            rgba(0,91,151,.20),
            rgba(5,48,68,.67)
        ) !important;

    border-color:
        rgba(66,181,222,.36) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        inset 3px 0 0 rgba(0,91,151,.52),
        0 12px 28px rgba(0,0,0,.14) !important;
}

/* ============================================================
   05 – WEISS
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(5){

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.085),
            rgba(8,51,67,.65)
        ) !important;

    border-color:
        rgba(255,255,255,.24) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.075),
        inset 3px 0 0 rgba(255,255,255,.50),
        0 12px 28px rgba(0,0,0,.14) !important;
}

/* ============================================================
   06 – ROT
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(6){

    background:
        linear-gradient(
            145deg,
            rgba(217,30,50,.16),
            rgba(17,45,60,.67)
        ) !important;

    border-color:
        rgba(233,77,91,.36) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.05),
        inset 3px 0 0 rgba(217,30,50,.58),
        0 12px 28px rgba(0,0,0,.14) !important;
}

/*
   ============================================================
   ELEGANTE HIGHLIGHTS
   ============================================================
*/

html body .mhl-regional-page
.mhl-regional-index-card::after{

    content:"";

    position:absolute;

    inset:1px;

    border-radius:inherit;

    pointer-events:none;

    opacity:.42;

    background:
        linear-gradient(
            118deg,
            rgba(255,255,255,.07),
            transparent 28%,
            transparent 72%,
            rgba(255,255,255,.025)
        );
}

/*
   Hover darf die jeweilige Landesfarbe etwas stärker zeigen.
   Keine Bewegung / kein Transform.
*/

html body .mhl-regional-page
.mhl-regional-index-card:hover{

    transform:none !important;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(1):hover{

    border-color:rgba(66,181,222,.58) !important;
    background:
        linear-gradient(
            145deg,
            rgba(0,91,151,.29),
            rgba(5,48,68,.70)
        ) !important;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(2):hover{

    border-color:rgba(255,255,255,.38) !important;
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.12),
            rgba(8,51,67,.67)
        ) !important;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(3):hover{

    border-color:rgba(233,77,91,.56) !important;
    background:
        linear-gradient(
            145deg,
            rgba(217,30,50,.23),
            rgba(17,45,60,.70)
        ) !important;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(4):hover{

    border-color:rgba(66,181,222,.52) !important;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(5):hover{

    border-color:rgba(255,255,255,.34) !important;
}

html body .mhl-regional-page
.mhl-regional-index-card:nth-child(6):hover{

    border-color:rgba(233,77,91,.50) !important;
}

/*
   WICHTIG:
   Die vorhandene Leuchtturm-/Morseanimation wird hier
   NICHT überschrieben.
*/

/* MHL REGIONAL SH ELEGANT COLORS END */

/* MHL REGIONAL TAB TEXT READABLE BEGIN */

/*
   Deutlich bessere Lesbarkeit auf den wechselnden
   Schleswig-Holstein-Farbflächen.
*/

html body .mhl-regional-page
.mhl-regional-page-row
.mhl-regional-page-row__body{

    color:#f8fdff !important;

    opacity:1 !important;

}

/* Kategorie / Kicker */

html body .mhl-regional-page
.mhl-regional-page-row
.mhl-regional-page-row__kicker{

    color:#d9fbff !important;

    opacity:1 !important;

    font-weight:800 !important;

    text-shadow:
        0 1px 2px rgba(0,24,34,.90),
        0 0 5px rgba(0,30,42,.42);

}

/* Hauptüberschrift */

html body .mhl-regional-page
.mhl-regional-page-row
.mhl-regional-page-row__body
h3{

    color:#ffffff !important;

    opacity:1 !important;

    font-weight:800 !important;

    text-shadow:
        0 1px 2px rgba(0,22,31,.95),
        0 0 5px rgba(0,28,38,.55);

}

/* Beschreibung */

html body .mhl-regional-page
.mhl-regional-page-row
.mhl-regional-page-row__body
p{

    color:#eefcff !important;

    opacity:1 !important;

    text-shadow:
        0 1px 2px rgba(0,24,34,.92),
        0 0 4px rgba(0,27,37,.46);

}

/* Seitenzahl / Zusatztexte */

html body .mhl-regional-page
.mhl-regional-page-row
.mhl-regional-page-row__body
small{

    color:#f2fcff !important;

    opacity:1 !important;

    text-shadow:
        0 1px 2px rgba(0,24,34,.85);

}

/*
   Noch etwas mehr Kontrast beim Hover,
   aber keinerlei Bewegung.
*/

html body .mhl-regional-page
.mhl-regional-page-row:hover
.mhl-regional-page-row__kicker{

    color:#e8fdff !important;

}

html body .mhl-regional-page
.mhl-regional-page-row:hover
.mhl-regional-page-row__body
h3{

    color:#ffffff !important;

    text-shadow:
        0 1px 2px rgba(0,18,27,1),
        0 0 7px rgba(0,30,40,.58);

}

html body .mhl-regional-page
.mhl-regional-page-row:hover
.mhl-regional-page-row__body
p{

    color:#f5fdff !important;

}

/* MHL REGIONAL TAB TEXT READABLE END */
/* MHL REGIONAL SHELL NORMALIZE BEGIN */

/*
 * REGIONAL SHELL NORMALIZE
 *
 * Die Regional-CSS darf nicht die globale <main>-Geometrie
 * der gemeinsamen Layout-Shell überschreiben.
 *
 * Keine Änderung an:
 *   - Hintergrund / Strand
 *   - Footer
 *   - Wasserzeichen
 *   - z-index
 *   - position
 *   - Fullscreen API
 *   - Fullscreen Navigation
 */

/* Inhalt bleibt regional begrenzt; die Shell selbst bleibt global. */
.mhl-regional-page {
    box-sizing: border-box;
}

/* MHL REGIONAL SHELL NORMALIZE END */

/* MHL REGIONAL SHELL SAFETY BEGIN */

/*
 * Die Regional-CSS gestaltet ausschließlich den Regional-Inhalt.
 * Die gemeinsame Site-Shell bleibt Aufgabe der globalen Layout-CSS.
 *
 * Insbesondere kein:
 *   - top
 *   - position
 *   - transform
 *   - z-index
 *   - height
 * auf #content / .site-main.
 */

/* MHL REGIONAL SHELL SAFETY END */

/* ============================================================
   MHL REGIONAL – SAILBOAT ROW ICON
   ============================================================ */

.mhl-regional-page .mhl-regional-page-row__arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    flex:0 0 34px;
    color:#0f6f82;
}

.mhl-regional-page .mhl-regional-page-row__sailboat{
    display:block;
    width:28px;
    height:28px;
    overflow:visible;
}

.mhl-regional-page .mhl-regional-sailboat-mast,
.mhl-regional-page .mhl-regional-sailboat-sail,
.mhl-regional-page .mhl-regional-sailboat-hull,
.mhl-regional-page .mhl-regional-sailboat-wave{
    vector-effect:non-scaling-stroke;
}

.mhl-regional-page .mhl-regional-sailboat-mast{
    fill:none;
    stroke:currentColor;
    stroke-width:2.4;
    stroke-linecap:round;
}

.mhl-regional-page .mhl-regional-sailboat-sail{
    fill:currentColor;
    stroke:none;
}

.mhl-regional-page .mhl-regional-sailboat-hull{
    fill:currentColor;
    stroke:none;
}

.mhl-regional-page .mhl-regional-sailboat-wave{
    fill:none;
    stroke:currentColor;
    stroke-width:2.2;
    stroke-linecap:round;
}

.mhl-regional-page .mhl-regional-page-row:hover .mhl-regional-page-row__arrow{
    color:#0a596b;
}

/* ============================================================
   MHL REGIONAL VISUAL V5
   PREVIEW LOOK
   Morse nur auf dem linken Tab
   Sailboat farblich integriert
   ============================================================ */

/* ------------------------------------------------------------
   1. KARTEN – PREVIEW LOOK
   ------------------------------------------------------------ */

html body .mhl-regional-page .mhl-regional-page-row{
    background:
        linear-gradient(
            100deg,
            rgba(5,57,78,.94) 0%,
            rgba(8,89,108,.82) 42%,
            rgba(19,157,174,.55) 70%,
            rgba(5,57,78,.92) 100%
        ) !important;

    border-color:
        rgba(57,190,216,.58) !important;

    box-shadow:
        0 8px 24px rgba(0,20,30,.22),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* ------------------------------------------------------------
   2. TEXT – WIE VORSCHAU, ABER KLAR
   ------------------------------------------------------------ */

html body .mhl-regional-page .mhl-regional-page-row h3,
html body .mhl-regional-page .mhl-regional-page-row h3 a{
    color:#ffffff !important;

    text-shadow:
        0 1px 2px rgba(0,0,0,.60) !important;
}

html body .mhl-regional-page .mhl-regional-page-row p{
    color:rgba(255,255,255,.91) !important;

    text-shadow:
        0 1px 2px rgba(0,0,0,.52) !important;
}

html body .mhl-regional-page .mhl-regional-page-row__kicker{
    color:#d5f7fc !important;
}

/* ------------------------------------------------------------
   3. MORSE NICHT MEHR IM TEXTBEREICH
   ------------------------------------------------------------ */

/*
   Die bisherige Morse-Ausgabe als ::after wird vollständig
   entfernt. Kein Morsecode mehr neben Überschrift/Text.
*/

html body .mhl-regional-page
.mhl-regional-page-row__number::after{
    content:none !important;
    display:none !important;
}

/* ------------------------------------------------------------
   4. MORSE AUF DAS LINKE TAB
   ------------------------------------------------------------ */

/*
   Die vorhandene Number/Morse-Information wird aus ihrem
   normalen Bereich herausgenommen und als Tab-Layer
   dargestellt.
*/

html body .mhl-regional-page
.mhl-regional-page-row__number{
    position:absolute !important;

    left:10px !important;
    top:50% !important;

    z-index:8 !important;

    width:42px !important;
    height:42px !important;

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

    transform:translateY(-50%) !important;

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

    color:#d8fbff !important;

    background:
        rgba(0,50,69,.55) !important;

    border:
        1px solid rgba(87,220,239,.70) !important;

    border-radius:
        11px !important;

    font-family:
        "Fira Code",
        "Cascadia Code",
        "Consolas",
        monospace !important;

    font-size:10px !important;
    font-weight:700 !important;
    letter-spacing:.04em !important;

    line-height:1 !important;

    text-shadow:
        0 0 5px rgba(98,232,255,.70) !important;

    box-shadow:
        0 0 10px rgba(24,190,218,.18),
        inset 0 1px 0 rgba(255,255,255,.10) !important;

    overflow:hidden !important;
}

/*
   Falls der Number-Inhalt mehr Zeichen enthält:
   nicht aus dem Tab herauslaufen lassen.
*/

html body .mhl-regional-page
.mhl-regional-page-row__number{
    white-space:nowrap !important;
}

/* ------------------------------------------------------------
   5. LINKES TAB / ICON
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__icon{
    position:relative !important;

    z-index:7 !important;

    background:
        rgba(3,47,65,.38) !important;

    border-color:
        rgba(79,207,226,.62) !important;

    box-shadow:
        0 0 10px rgba(27,190,217,.12),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* ------------------------------------------------------------
   6. TAB NICHT ZU HELL
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__icon svg{
    opacity:.88 !important;
}

/* ------------------------------------------------------------
   7. SAILBOAT RECHTS – FARBLICH INTEGRIERT
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow{
    display:flex !important;

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

    width:36px !important;
    height:36px !important;

    flex:0 0 36px !important;

    color:#64e4f5 !important;

    background:
        rgba(4,53,70,.48) !important;

    border:
        1px solid rgba(69,203,224,.48) !important;

    border-radius:50% !important;

    box-shadow:
        0 0 9px rgba(36,196,219,.16),
        inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html body .mhl-regional-page
.mhl-regional-page-row__sailboat{
    width:27px !important;
    height:27px !important;

    color:#64e4f5 !important;

    opacity:.94 !important;

    filter:
        drop-shadow(0 0 3px rgba(76,224,244,.30)) !important;
}

/* ------------------------------------------------------------
   8. SAILBOAT SVG – FARBE
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-sailboat-mast{
    stroke:#8cecf8 !important;
}

html body .mhl-regional-page
.mhl-regional-sailboat-sail{
    fill:#55dbea !important;
}

html body .mhl-regional-page
.mhl-regional-sailboat-hull{
    fill:#37bfd2 !important;
}

html body .mhl-regional-page
.mhl-regional-sailboat-wave{
    stroke:#8cecf8 !important;
}

/* ------------------------------------------------------------
   9. HOVER – NUR LEICHTER FARBWECHSEL
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row:hover{
    border-color:
        rgba(77,211,233,.78) !important;

    box-shadow:
        0 10px 28px rgba(0,20,30,.28),
        0 0 14px rgba(36,195,218,.10),
        inset 0 1px 0 rgba(255,255,255,.10) !important;
}

html body .mhl-regional-page
.mhl-regional-page-row:hover
.mhl-regional-page-row__arrow{
    color:#8af2ff !important;

    border-color:
        rgba(94,225,241,.68) !important;
}

/* ------------------------------------------------------------
   10. ROTE KNICK-KARTE – AKZENT BEIBEHALTEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(3){
    border-color:
        rgba(236,54,83,.72) !important;

    background:
        linear-gradient(
            100deg,
            rgba(38,48,68,.95),
            rgba(12,91,108,.82),
            rgba(7,67,87,.94)
        ) !important;
}

/* ------------------------------------------------------------
   11. ALTE ARROW-PSEUDOELEMENTE ENTFERNEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow::before,
html body .mhl-regional-page
.mhl-regional-page-row__arrow::after{
    content:none !important;
}

/* ============================================================
   MHL REGIONAL VISUAL V5 END
   ============================================================ */

/* ============================================================
   MHL REGIONAL SAFE V7
   Leuchtturm erhalten
   Morse nur als Overlay auf dem Tab
   Kein Eingriff in SVG / Blade
   ============================================================ */

/* ------------------------------------------------------------
   01 – LEUCHTTURM VOLLSTÄNDIG SICHTBAR
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number{
    position:relative !important;

    display:flex !important;

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

    overflow:visible !important;

    width:48px !important;
    height:48px !important;

    color:#8cecf8 !important;

    background:
        rgba(5,66,86,.42) !important;

    border:
        1px solid rgba(74,205,228,.68) !important;

    border-radius:
        12px !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.10),
        0 0 11px rgba(33,196,222,.15) !important;

    font-size:0 !important;
}

/* ------------------------------------------------------------
   02 – LEUCHTTURM-SVG NICHT ANFASSEN / SICHTBAR
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number svg{
    display:block !important;

    width:34px !important;
    height:34px !important;

    opacity:1 !important;

    visibility:visible !important;

    color:#8cecf8 !important;

    fill:none !important;

    stroke:currentColor !important;

    filter:
        drop-shadow(0 0 4px rgba(87,225,244,.30)) !important;
}

/* ------------------------------------------------------------
   03 – DEN ALTEN SCHRÄGSTRICH ENTFERNEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number::before{
    content:none !important;
    display:none !important;
}

/* ------------------------------------------------------------
   04 – MORSE ALS KLEINES OVERLAY AUF DEM LEUCHTTURM-TAB
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number::after{
    position:absolute !important;

    left:50% !important;
    bottom:2px !important;

    transform:translateX(-50%) !important;

    z-index:5 !important;

    display:flex !important;

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

    height:11px !important;

    min-width:34px !important;

    padding:0 4px !important;

    border-radius:5px !important;

    background:
        rgba(0,30,43,.78) !important;

    border:
        1px solid rgba(87,220,239,.32) !important;

    color:
        #b7f8ff !important;

    font-family:
        "Fira Code",
        "Cascadia Code",
        "Consolas",
        monospace !important;

    font-size:
        6px !important;

    font-weight:
        700 !important;

    line-height:
        11px !important;

    letter-spacing:
        .03em !important;

    white-space:
        nowrap !important;

    box-shadow:
        0 0 5px rgba(50,210,234,.18) !important;

    text-shadow:
        0 0 3px rgba(105,235,250,.65) !important;
}

/* ------------------------------------------------------------
   05 – MORSE JE TAB
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(1)
.mhl-regional-page-row__number::after{
    content:".-- .- - - . -. . .-.";
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(2)
.mhl-regional-page-row__number::after{
    content:".... .- .-.. .-.. .. --. . -.";
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(3)
.mhl-regional-page-row__number::after{
    content:"-.- -. .. -.-. -.-";
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(4)
.mhl-regional-page-row__number::after{
    content:".-. .- .--. ...";
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page__page-row__number::after{
    content:"-.. . .. -.-. ....";
}

/* ------------------------------------------------------------
   06 – KORREKTUR 5. TAB
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(5)
.mhl-regional-page-row__number::after{
    content:"-.. . .. -.-. ....";
}

/* ------------------------------------------------------------
   07 – SAILBOAT RECHTS: NUR FARBE
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow{
    color:#63e3f2 !important;
}

html body .mhl-regional-page
.mhl-regional-page-row__arrow svg{
    color:#63e3f2 !important;

    filter:
        drop-shadow(0 0 4px rgba(69,221,241,.30)) !important;
}

/* ------------------------------------------------------------
   08 – ROW NICHT ÜBERSTRAHLEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row{
    opacity:1 !important;
}

html body .mhl-regional-page
.mhl-regional-page-row__body{
    opacity:1 !important;
}

/* ============================================================
   SAFE V7 END
   ============================================================ */

/* ============================================================
   MHL REGIONAL BOAT V8
   Nur:
   - alter \-Strich entfernen
   - Segelboot farbig
   Leuchtturm / Layout / Text unangetastet
   ============================================================ */

/* ------------------------------------------------------------
   01 – ALTES ROW-DECORATION-ZEICHEN ENTFERNEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row::after{
    content:none !important;
    display:none !important;
}

/* ------------------------------------------------------------
   02 – EVENTUELLE ALTE NUMBER-STRICHE NICHT ANFASSEN
   ------------------------------------------------------------ */

/*
   Der Leuchtturm sitzt im __number-Element.
   Deshalb wird __number::before NICHT global abgeschaltet.
*/

/* ------------------------------------------------------------
   03 – SEGELBOOT-ANZEIGE RECHTS
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow{
    position:relative !important;

    color:#63e5f4 !important;

    background:
        rgba(3,48,66,.58) !important;

    border:
        1px solid rgba(62,205,226,.52) !important;

    box-shadow:
        0 0 10px rgba(33,193,220,.18),
        inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/* ------------------------------------------------------------
   04 – BOOT-BASIS
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow::after{
    content:"" !important;

    position:absolute !important;

    left:50% !important;
    top:50% !important;

    width:24px !important;
    height:24px !important;

    transform:
        translate(-50%,-50%) !important;

    pointer-events:none !important;

    border-radius:50% !important;

    /*
       Kein weißer Einheitslook:
       farbiger Glow hinter dem Boot
    */

    background:
        radial-gradient(
            circle,
            rgba(72,220,239,.16) 0%,
            rgba(25,133,166,.08) 55%,
            transparent 72%
        ) !important;
}

/* ------------------------------------------------------------
   05 – VERSCHIEDENE FARBEN FÜR DIE BOOT-ELEMENTE
   ------------------------------------------------------------ */

/*
   Das vorhandene Boot kommt über die Arrow-Pseudo-Elemente.
   Wir geben den einzelnen Ebenen kräftige maritime Farben.
*/

/* Mast */

html body .mhl-regional-page
.mhl-regional-page-row__arrow::before{
    color:#b8f7ff !important;

    text-shadow:
        0 0 4px rgba(86,226,245,.75) !important;
}

/* ------------------------------------------------------------
   06 – ROW-FARBEN NICHT VERÄNDERN
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
   07 – HOVER BOOT
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row:hover
.mhl-regional-page-row__arrow{
    border-color:
        rgba(104,229,243,.78) !important;

    background:
        rgba(4,59,78,.68) !important;

    box-shadow:
        0 0 14px rgba(48,213,235,.25),
        inset 0 1px 0 rgba(255,255,255,.12) !important;
}

/* ============================================================
   V8 END
   ============================================================ */

/* ============================================================
   MHL REGIONAL CLEAN V9
   ============================================================ */

/* ------------------------------------------------------------
   01 – ROW-DEKORATIONEN KOMPLETT ENTFERNEN
   ------------------------------------------------------------ */

/*
   Diese Pseudo-Elemente erzeugen die sichtbaren
   Zusatzzeichen / Linien / den alten Backslash.
*/

html body .mhl-regional-page
.mhl-regional-page-row::before,

html body .mhl-regional-page
.mhl-regional-page-row::after{
    content:none !important;
    display:none !important;
}

/* ------------------------------------------------------------
   02 – DEKORATIONEN DES LINKEN ROW-BEREICHS ENTFERNEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row > :first-child::before,

html body .mhl-regional-page
.mhl-regional-page-row > :first-child::after{
    content:none !important;
    display:none !important;
}

/* ------------------------------------------------------------
   03 – DEKORATIONEN DES TEXTBEREICHS ENTFERNEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row > :nth-child(2)::before,

html body .mhl-regional-page
.mhl-regional-page-row > :nth-child(2)::after{
    content:none !important;
    display:none !important;
}

/* ------------------------------------------------------------
   04 – KEIN ZUSÄTZLICHER ZEILENABSTAND DURCH DEKORATION
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row{
    position:relative !important;

    line-height:normal !important;
}

/* ------------------------------------------------------------
   05 – LEUCHTTURM EXPLIZIT ERHALTEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number{
    position:relative !important;

    display:flex !important;

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

    overflow:visible !important;
}

html body .mhl-regional-page
.mhl-regional-page-row__number svg{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
}

/* ------------------------------------------------------------
   06 – SAILBOAT RECHTS: FARBE VERSTÄRKEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow{
    color:#67e7f4 !important;

    border-color:
        rgba(67,214,234,.62) !important;

    background:
        rgba(3,55,73,.58) !important;

    box-shadow:
        0 0 10px rgba(51,210,232,.20),
        inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/*
   Bestehendes Boot nicht ersetzen.
   Nur seine SVG-Farbe übernehmen.
*/

html body .mhl-regional-page
.mhl-regional-page-row__arrow svg{
    display:block !important;

    visibility:visible !important;

    opacity:1 !important;

    color:#66e5f3 !important;

    stroke:#66e5f3 !important;

    fill:currentColor !important;

    filter:
        drop-shadow(0 0 4px rgba(65,220,240,.35)) !important;
}

/* ------------------------------------------------------------
   07 – KEINE TEXTÄNDERUNG
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__body{
    line-height:normal !important;
}

/* ============================================================
   CLEAN V9 END
   ============================================================ */

/* ============================================================
   MHL REGIONAL FINAL ICON FIX V11
   ============================================================ */

/*
 * 01 – KEINE ROW-DEKORATION MEHR
 *
 * Der echte "\" wurde bereits aus Blade entfernt.
 * Diese Regeln entfernen zusätzlich alte CSS-Linien.
 */

/*
 * 02 – KEINE DEKORATION AUF DEN BEIDEN ROW-SEITEN
 */

html body .mhl-regional-page
.mhl-regional-page-row > :first-child::before,

html body .mhl-regional-page
.mhl-regional-page-row > :first-child::after,

html body .mhl-regional-page
.mhl-regional-page-row > :nth-child(2)::before,

html body .mhl-regional-page
.mhl-regional-page-row > :nth-child(2)::after{
    content:none !important;
    display:none !important;
}

/*
 * 03 – LEUCHTTURM NICHT ANFASSEN
 */

html body .mhl-regional-page
.mhl-regional-page-row__number svg{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:34px !important;
    height:34px !important;
}

/*
 * 04 – SAILBOAT-TAINER
 */

html body .mhl-regional-page
.mhl-regional-page-row__arrow{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:42px !important;
    height:42px !important;

    flex-shrink:0 !important;

    border-radius:50% !important;

    background:
        linear-gradient(
            145deg,
            rgba(7,72,91,.82),
            rgba(3,42,58,.72)
        ) !important;

    border:
        1px solid rgba(73,218,235,.62) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.14),
        0 0 12px rgba(43,211,235,.22) !important;

    font-size:0 !important;
    text-indent:0 !important;
}

/*
 * 05 – ECHTES MHL-SAILBOAT
 */

html body .mhl-regional-page
.mhl-regional-page-row__arrow svg{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;

    width:28px !important;
    height:28px !important;

    overflow:visible !important;

    color:#63e4f2 !important;

    filter:
        drop-shadow(0 0 4px rgba(67,220,239,.40)) !important;
}

/*
 * 06 – SVG NICHT MEHR ALS TEXT / ALTES ICON
 */

html body .mhl-regional-page
.mhl-regional-page-row__arrow svg path,
html body .mhl-regional-page
.mhl-regional-page-row__arrow svg line,
html body .mhl-regional-page
.mhl-regional-page-row__arrow svg polyline,
html body .mhl-regional-page
.mhl-regional-page-row__arrow svg polygon{
    stroke:#83edf6 !important;
}

/*
 * 07 – ROW ZENTRIERT, KEIN ZUSÄTZLICHER ZEILENEFFEKT
 */

html body .mhl-regional-page
.mhl-regional-page-row{
    align-items:center !important;
}

/*
 * 08 – MORSE / LEUCHTTURM-TAB BLEIBT UNBERÜHRT
 *
 * Kein ::before-Eingriff hier.
 * Dadurch zerstören wir nicht versehentlich die vorhandene
 * Tab-Dekoration.
 */

/* V11 END */

/* ------------------------------------------------------------
   ROW: KEINE EXTRA-DEKORATIONSZEILE
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row::before,

html body .mhl-regional-page
.mhl-regional-page-row::after {
    content: none !important;
    display: none !important;
}

/* ------------------------------------------------------------
   LIGHTHOUSE
   NICHT ANIMATION:NONE SETZEN!
   KEINE SVG-STROKE-OVERRIDES!
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
}

/*
 * Nur Sichtbarkeit/Größe.
 * Animation, Farben und Keyframes kommen vom Original-Icon.
 */
html body .mhl-regional-page
.mhl-regional-page-row__number > svg {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* ------------------------------------------------------------
   RECHTER ICON-KREIS
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    flex-shrink: 0 !important;

    border-radius: 50% !important;

    background:
        linear-gradient(
            145deg,
            rgba(8,78,97,.94),
            rgba(3,39,55,.94)
        ) !important;

    border:
        1px solid rgba(71,220,237,.72) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.16),
        0 0 14px rgba(45,213,238,.28) !important;

    font-size: 0 !important;
    line-height: 0 !important;
}

/* ------------------------------------------------------------
   ECHTES MEHRFARBIGES SEGELBOOT
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-sailboat {
    display: block !important;

    width: 29px !important;
    height: 29px !important;

    overflow: visible !important;

    transform-origin: 50% 55% !important;

    filter:
        drop-shadow(0 0 3px rgba(76,224,240,.42)) !important;
}

/* Mast – warm maritime gold */

html body .mhl-regional-page
.mhl-regional-sailboat__mast {
    fill: none !important;
    stroke: #ffd166 !important;
    stroke-width: 2.5 !important;
    stroke-linecap: round !important;
}

/* Linkes Segel – weiß */

html body .mhl-regional-page
.mhl-regional-sailboat__sail--left {
    fill: #f7fbff !important;
    stroke: #dff8ff !important;
    stroke-width: 1 !important;
}

/* Rechtes Segel – türkis */

html body .mhl-regional-page
.mhl-regional-sailboat__sail--right {
    fill: #38d9e9 !important;
    stroke: #8df4ff !important;
    stroke-width: 1 !important;
}

/* Rumpf – maritimes Rot */

html body .mhl-regional-page
.mhl-regional-sailboat__hull {
    fill: #ef6474 !important;
    stroke: #ff9aa6 !important;
    stroke-width: 1 !important;
}

/* Welle – blau */

html body .mhl-regional-page
.mhl-regional-sailboat__wave {
    fill: none !important;
    stroke: #63dff1 !important;
    stroke-width: 2.5 !important;
    stroke-linecap: round !important;
}

/* ------------------------------------------------------------
   WICHTIG:
   ALTE ARROW-SVG-REGELN DARFEN DAS BOOT NICHT ÜBERSCHREIBEN
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__arrow
.mhl-regional-sailboat path {
    vector-effect: non-scaling-stroke !important;
}

/* keine automatische Einfärbung durch currentColor */

html body .mhl-regional-page
.mhl-regional-sailboat__sail--left {
    color: #f7fbff !important;
}

html body .mhl-regional-page
.mhl-regional-sailboat__sail--right {
    color: #38d9e9 !important;
}

html body .mhl-regional-page
.mhl-regional-sailboat__hull {
    color: #ef6474 !important;
}

/* ============================================================
   V13 END
   ============================================================ */

/* ============================================================
   MHL REGIONAL – FINAL
   NUR MORSE AUF TAB
   LIGHTHOUSE NICHT UMPOSTIONIEREN
   ============================================================ */

/*
 * Lighthouse:
 * Der vorhandene Container bestimmt die Position.
 * Keine absolute Positionierung, kein width:100%.
 */

html body .mhl-regional-page
.mhl-regional-page-row__number {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    width: auto !important;
    height: auto !important;

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

    overflow: visible !important;
}

/* echtes Lighthouse-SVG */

html body .mhl-regional-page
.mhl-regional-page-row__number > svg {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    position: relative !important;
    left: auto !important;
    top: auto !important;

    transform: none !important;

    margin: 0 !important;

    width: 34px !important;
    height: 34px !important;

    z-index: 5 !important;
}

/* ------------------------------------------------------------
   MORSE NICHT IM KREIS
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number::after {
    content: none !important;
    display: none !important;
}

/* ------------------------------------------------------------
   TAB ALS MORSE-EBENE
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row {
    position: relative !important;
}

/*
 * Morse wird direkt auf die Tab-Fläche gelegt.
 * Sehr dezent, damit der normale Inhalt unverändert bleibt.
 */

html body .mhl-regional-page
.mhl-regional-page-row::after {

    position: absolute !important;

    left: 50% !important;
    bottom: 5px !important;

    transform: translateX(-50%) !important;

    pointer-events: none !important;

    z-index: 1 !important;

    white-space: nowrap !important;

    font-family: "Fira Code", monospace !important;

    font-size: 8px !important;
    line-height: 1 !important;

    letter-spacing: .15em !important;

    color: rgba(184,248,255,.28) !important;

    opacity: .48 !important;

    text-shadow:
        0 0 4px rgba(92,225,241,.20) !important;
}

/* ------------------------------------------------------------
   MORSE JE TAB
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(1)::after {
    content: ".-- .- - - . -. . .-." !important;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(2)::after {
    content: ".... .- .-.. .-.. .. --. . -." !important;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(3)::after {
    content: "-.- -. .. -.-. -.-" !important;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(4)::after {
    content: ".-. .- .--. ... " !important;
}

html body .mhl-regional-page
.mhl-regional-page-row:nth-child(5)::after {
    content: "-.. . .. -.-. ...." !important;
}

/*
 * Tab-Inhalt und Segelboot bleiben über der dekorativen
 * Morse-Ebene.
 */

html body .mhl-regional-page
.mhl-regional-page-row__body {
    position: relative !important;
    z-index: 3 !important;
}

html body .mhl-regional-page
.mhl-regional-page-row__arrow {
    position: relative !important;
    z-index: 4 !important;
}

/* FINAL */

html body .mhl-regional-page
.mhl-regional-page-row__number
svg.icon.icon-lighthouse {

    animation:
        mhl-lighthouse-fast-test
        .7s
        steps(1, end)
        infinite !important;

    animation-delay: 0s !important;

    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;

    filter:
        drop-shadow(0 0 5px rgba(255,255,255,1))
        drop-shadow(0 0 12px rgba(92,225,241,1))
        drop-shadow(0 0 22px rgba(255,220,100,.95)) !important;
}

@keyframes mhl-lighthouse-fast-test {

    0% {
        opacity: 1 !important;
        filter:
            drop-shadow(0 0 5px rgba(255,255,255,1))
            drop-shadow(0 0 12px rgba(92,225,241,1))
            drop-shadow(0 0 22px rgba(255,220,100,.95)) !important;
    }

    49% {
        opacity: 1 !important;
        filter:
            drop-shadow(0 0 5px rgba(255,255,255,1))
            drop-shadow(0 0 12px rgba(92,225,241,1))
            drop-shadow(0 0 22px rgba(255,220,100,.95)) !important;
    }

    50% {
        opacity: .08 !important;
        filter: none !important;
    }

    100% {
        opacity: .08 !important;
        filter: none !important;
    }
}

/* reduzierte Bewegung darf diesen TEST nicht abschalten */
@media (prefers-reduced-motion: reduce) {

    html body .mhl-regional-page
    .mhl-regional-page-row__number
    svg.icon.icon-lighthouse {

        animation:
            mhl-lighthouse-fast-test
            .7s
            steps(1, end)
            infinite !important;
    }
}

/* FAST TEST END */

/* ============================================================
   MHL REGIONAL FINAL
   LIGHTHOUSE SIGNAL = MEERHEIMATLIEBE.DE
   ============================================================ */

/*
 * ALLE bisherigen sichtbaren MORSE-PSEUDOELEMENTE AUS.
 * Es werden keine Punkte, Striche oder Texte dargestellt.
 */

html body .mhl-regional-page
.mhl-regional-page-row::before,

html body .mhl-regional-page
.mhl-regional-page-row::after,

html body .mhl-regional-page
.mhl-regional-page-row__number::before,

html body .mhl-regional-page
.mhl-regional-page-row__number::after {

    content: none !important;
    display: none !important;
}

/*
 * DAS VORHANDENE LIGHTHOUSE-SVG
 *
 * Keine Positionierung.
 * Kein neues Element.
 */

html body .mhl-regional-page
svg.icon.icon-lighthouse {

    display: block !important;
    visibility: visible !important;

    animation-name:
        mhl-meerheimatliebe-lighthouse-morse-final !important;

    animation-duration:
        7400ms !important;

    animation-timing-function:
        steps(1, end) !important;

    animation-iteration-count:
        infinite !important;

    animation-delay:
        0ms !important;

    will-change:
        opacity,
        color,
        filter !important;
}

/*
 * MEERHEIMATLIEBE.DE
 *
 * Punkt / Strich / Pause werden ausschließlich
 * durch die Leuchtdauer des vorhandenen Lighthouse erzeugt.
 */

@keyframes mhl-meerheimatliebe-lighthouse-morse-final {

    0.0000% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    0.6757% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    1.3514% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    2.0270% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    2.7027% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    3.3784% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    4.0541% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    4.7297% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    5.4054% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    6.0811% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    6.7568% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    7.4324% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    8.1081% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    8.7838% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    9.4595% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    10.1351% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    10.8108% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    11.4865% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    12.1622% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    12.8378% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    13.5135% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    14.1892% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    14.8649% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    15.5405% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    16.2162% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    16.8919% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    17.5676% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    18.2432% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    18.9189% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    19.5946% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    20.2703% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    20.9459% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    21.6216% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    22.2973% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    22.9730% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    23.6486% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    24.3243% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    25.0000% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    25.6757% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    26.3514% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    27.0270% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    27.7027% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    28.3784% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    29.0541% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    29.7297% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    30.4054% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    31.0811% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    31.7568% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    32.4324% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    33.1081% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    33.7838% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    34.4595% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    35.1351% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    35.8108% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    36.4865% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    37.1622% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    37.8378% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    38.5135% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    39.1892% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    39.8649% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    40.5405% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    41.2162% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    41.8919% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    42.5676% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    43.2432% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    43.9189% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    44.5946% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    45.2703% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    45.9459% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    46.6216% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    47.2973% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    47.9730% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    48.6486% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    49.3243% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    50.0000% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    50.6757% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    51.3514% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    52.0270% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    52.7027% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    53.3784% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    54.0541% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    54.7297% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    55.4054% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    56.0811% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    56.7568% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    57.4324% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    58.1081% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    58.7838% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    59.4595% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    60.1351% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    60.8108% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    61.4865% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    62.1622% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    62.8378% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    63.5135% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    64.1892% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    64.8649% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    65.5405% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    66.2162% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    66.8919% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    67.5676% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    68.2432% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    68.9189% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    69.5946% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    70.2703% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    70.9459% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    71.6216% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    72.2973% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    72.9730% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    73.6486% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    74.3243% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    75.0000% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    75.6757% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    76.3514% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    77.0270% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    77.7027% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    78.3784% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    79.0541% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    79.7297% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    80.4054% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    81.0811% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    81.7568% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    82.4324% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    83.1081% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    83.7838% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    84.4595% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    85.1351% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    85.8108% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    86.4865% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    87.1622% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    87.8378% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    88.5135% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    89.1892% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    89.8649% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    90.5405% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    91.2162% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    91.8919% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    92.5676% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    93.2432% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    93.9189% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    94.5946% {

        color: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.80))
            drop-shadow(0 0 25px rgba(92,225,241,.55));
    }
    95.2703% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    95.9459% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    96.6216% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    97.2973% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    97.9730% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    98.6486% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    99.3243% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }
    100% {

        color: #dffbff;
        filter:
            drop-shadow(0 0 1px rgba(92,225,241,.12));
    }

}

/*
 * Auch bei prefers-reduced-motion muss das Signal
 * auf dieser speziellen Seite sichtbar bleiben.
 */

@media (prefers-reduced-motion: reduce) {

    html body .mhl-regional-page
    svg.icon.icon-lighthouse {

        animation-name:
            mhl-meerheimatliebe-lighthouse-morse-final;

        animation-duration:
            7400ms;

        animation-timing-function:
            steps(1, end);

        animation-iteration-count:
            infinite;
    }
}

/* FINAL END */

/* ============================================================
   MHL REGIONAL – LIGHTHOUSE MORSE SEQUENCE
   ============================================================ */

/*
 * Keine neuen Elemente.
 * Kein sichtbarer Morsecode.
 * Nur vorhandene Lighthouse-SVGs.
 * Keine Positionierungsänderung.
 */

/* ============================================================
   1. HAUPTSEITE
   6 TABS = 6 VERSCHIEDENE MORSE-BLÖCKE
   ============================================================ */

html body .mhl-regional-index-card:nth-child(1)
.mhl-regional-index-card__number
svg.icon.icon-lighthouse {
    animation-name: mhl-index-morse-1 !important;
    animation-duration: 19200ms !important;
    animation-timing-function: steps(40, end) !important;
    animation-iteration-count: infinite !important;
    animation-delay: 0ms !important;
    animation-fill-mode: both !important;
    will-change: color, stroke, filter;
}
html body .mhl-regional-index-card:nth-child(2)
.mhl-regional-index-card__number
svg.icon.icon-lighthouse {
    animation-name: mhl-index-morse-2 !important;
    animation-duration: 19200ms !important;
    animation-timing-function: steps(40, end) !important;
    animation-iteration-count: infinite !important;
    animation-delay: -16000ms !important;
    animation-fill-mode: both !important;
    will-change: color, stroke, filter;
}
html body .mhl-regional-index-card:nth-child(3)
.mhl-regional-index-card__number
svg.icon.icon-lighthouse {
    animation-name: mhl-index-morse-3 !important;
    animation-duration: 19200ms !important;
    animation-timing-function: steps(40, end) !important;
    animation-iteration-count: infinite !important;
    animation-delay: -12800ms !important;
    animation-fill-mode: both !important;
    will-change: color, stroke, filter;
}
html body .mhl-regional-index-card:nth-child(4)
.mhl-regional-index-card__number
svg.icon.icon-lighthouse {
    animation-name: mhl-index-morse-4 !important;
    animation-duration: 19200ms !important;
    animation-timing-function: steps(40, end) !important;
    animation-iteration-count: infinite !important;
    animation-delay: -9600ms !important;
    animation-fill-mode: both !important;
    will-change: color, stroke, filter;
}
html body .mhl-regional-index-card:nth-child(5)
.mhl-regional-index-card__number
svg.icon.icon-lighthouse {
    animation-name: mhl-index-morse-5 !important;
    animation-duration: 19200ms !important;
    animation-timing-function: steps(40, end) !important;
    animation-iteration-count: infinite !important;
    animation-delay: -6400ms !important;
    animation-fill-mode: both !important;
    will-change: color, stroke, filter;
}
html body .mhl-regional-index-card:nth-child(6)
.mhl-regional-index-card__number
svg.icon.icon-lighthouse {
    animation-name: mhl-index-morse-6 !important;
    animation-duration: 19200ms !important;
    animation-timing-function: steps(40, end) !important;
    animation-iteration-count: infinite !important;
    animation-delay: -3200ms !important;
    animation-fill-mode: both !important;
    will-change: color, stroke, filter;
}

@keyframes mhl-index-morse-1 {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    5.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    7.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    10.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    12.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    15.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    17.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    20.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    22.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    25.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    27.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    30.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    32.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    37.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    40.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    42.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    45.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    47.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    50.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    52.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    55.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    57.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    65.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    67.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    77.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    80.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    85.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    92.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}
@keyframes mhl-index-morse-2 {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    5.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    7.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    10.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    12.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    15.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    17.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    20.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    22.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    25.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    27.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    30.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    32.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    37.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    40.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    42.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    45.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    47.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    50.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    52.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    55.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    57.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    65.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    67.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    77.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    80.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    85.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    92.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}
@keyframes mhl-index-morse-3 {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    5.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    7.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    10.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    12.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    15.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    17.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    20.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    22.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    25.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    27.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    30.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    32.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    37.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    40.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    42.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    45.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    47.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    50.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    52.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    55.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    57.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    65.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    67.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    77.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    80.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    85.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    92.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}
@keyframes mhl-index-morse-4 {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    5.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    7.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    10.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    12.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    15.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    17.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    20.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    22.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    25.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    27.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    30.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    32.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    37.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    40.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    42.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    45.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    47.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    50.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    52.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    55.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    57.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    65.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    67.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    77.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    80.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    85.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    92.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}
@keyframes mhl-index-morse-5 {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    5.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    7.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    10.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    12.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    15.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    17.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    20.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    22.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    25.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    27.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    30.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    32.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    37.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    40.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    42.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    45.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    47.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    50.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    52.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    55.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    57.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    65.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    67.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    77.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    80.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    85.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    92.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}
@keyframes mhl-index-morse-6 {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    5.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    7.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    10.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    12.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    15.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    17.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    20.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    22.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    25.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    27.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    30.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    32.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    37.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    40.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    42.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    45.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    47.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    50.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    52.5000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    55.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    57.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    62.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    65.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    67.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    77.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    80.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    85.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    92.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.5000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}

/* ============================================================
   2. UNTERSEITEN
   KOMPLETTES MEERHEIMATLIEBE.DE
   ============================================================ */

/* vorhandene sichtbare Morse-Pseudoelemente aus */

html body .mhl-regional-page
.mhl-regional-page-row__number
svg.icon.icon-lighthouse {
    display: block !important;
    visibility: visible !important;

    animation-name:
        mhl-subpage-meerheimatliebe-morse !important;

    animation-duration:
        13320ms !important;

    animation-timing-function:
        steps(148, end) !important;

    animation-iteration-count:
        infinite !important;

    animation-delay:
        0ms !important;

    animation-fill-mode:
        both !important;

    will-change:
        color,
        stroke,
        filter;
}

/* Morse ausschließlich über das vorhandene Licht */
@keyframes mhl-subpage-meerheimatliebe-morse {
    0.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    0.6757% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    1.3514% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    2.0270% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    2.7027% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    3.3784% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    4.0541% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    4.7297% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    5.4054% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    6.0811% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    6.7568% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    7.4324% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    8.1081% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    8.7838% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    9.4595% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    10.1351% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    10.8108% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    11.4865% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    12.1622% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    12.8378% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    13.5135% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    14.1892% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    14.8649% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    15.5405% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    16.2162% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    16.8919% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    17.5676% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    18.2432% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    18.9189% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    19.5946% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    20.2703% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    20.9459% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    21.6216% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    22.2973% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    22.9730% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    23.6486% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    24.3243% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    25.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    25.6757% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    26.3514% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    27.0270% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    27.7027% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    28.3784% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    29.0541% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    29.7297% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    30.4054% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    31.0811% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    31.7568% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    32.4324% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    33.1081% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    33.7838% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    34.4595% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    35.1351% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    35.8108% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    36.4865% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    37.1622% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    37.8378% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    38.5135% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    39.1892% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    39.8649% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    40.5405% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    41.2162% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    41.8919% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    42.5676% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    43.2432% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    43.9189% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    44.5946% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    45.2703% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    45.9459% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    46.6216% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    47.2973% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    47.9730% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    48.6486% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    49.3243% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    50.0000% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    50.6757% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    51.3514% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    52.0270% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    52.7027% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    53.3784% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    54.0541% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    54.7297% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    55.4054% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    56.0811% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    56.7568% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    57.4324% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    58.1081% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    58.7838% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    59.4595% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.1351% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    60.8108% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    61.4865% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.1622% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    62.8378% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    63.5135% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    64.1892% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    64.8649% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    65.5405% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    66.2162% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    66.8919% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    67.5676% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    68.2432% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    68.9189% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    69.5946% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.2703% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    70.9459% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    71.6216% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    72.2973% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    72.9730% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    73.6486% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    74.3243% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    75.0000% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    75.6757% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    76.3514% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    77.0270% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    77.7027% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    78.3784% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    79.0541% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    79.7297% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    80.4054% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    81.0811% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    81.7568% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    82.4324% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    83.1081% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    83.7838% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    84.4595% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    85.1351% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    85.8108% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    86.4865% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.1622% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    87.8378% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    88.5135% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    89.1892% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    89.8649% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    90.5405% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    91.2162% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    91.8919% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    92.5676% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    93.2432% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    93.9189% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    94.5946% {
        color: #fff0a8;
        stroke: #fff0a8;
        filter:
            drop-shadow(0 0 3px rgba(255,255,255,1))
            drop-shadow(0 0 8px rgba(255,218,112,.98))
            drop-shadow(0 0 16px rgba(255,193,64,.82))
            drop-shadow(0 0 24px rgba(92,225,241,.55));
    }
    95.2703% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    95.9459% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    96.6216% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.2973% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    97.9730% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    98.6486% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    99.3243% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
    100% {
        color: #dffbff;
        stroke: #dffbff;
        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.62));
    }
}

/* reduced-motion darf dieses spezielle Signal nicht abschalten */
@media (prefers-reduced-motion: reduce) {
    html body .mhl-regional-page
    .mhl-regional-page-row__number
    svg.icon.icon-lighthouse {
        animation-name:
            mhl-subpage-meerheimatliebe-morse !important;

        animation-duration:
            13320ms !important;

        animation-timing-function:
            steps(148, end) !important;

        animation-iteration-count:
            infinite !important;
    }
}

/* FINAL END */

/*
 * HAUPTSEITE /regionale-besonderheiten:
 * NICHT ANGEFASST.
 *
 * Nur:
 * .mhl-regional-page
 * .mhl-regional-page-row
 */

/* Keine sichtbaren Morsezeichen */

/*
 * NUR das bereits vorhandene Lighthouse-SVG.
 * Position, Größe und Kreis bleiben unverändert.
 */

html body .mhl-regional-page
.mhl-regional-page-row__number > svg.icon.icon-lighthouse {
    display: block !important;
    visibility: visible !important;

    animation:
        mhl-subpage-meerheimatliebe-morse
        13320ms
        steps(148, end)
        infinite
        0ms
        both !important;

    will-change:
        color,
        stroke,
        filter;
}

/*
 * Morse ausschließlich durch das vorhandene Lighthouse-Licht.
 */

/*
 * Auch bei prefers-reduced-motion:
 * Unterseiten-Signal bleibt aktiv.
 */

@media (prefers-reduced-motion: reduce) {
    html body .mhl-regional-page
    .mhl-regional-page-row__number > svg.icon.icon-lighthouse {
        animation:
            mhl-subpage-meerheimatliebe-morse
            13320ms
            steps(148, end)
            infinite
            0ms
            both !important;
    }
}

/*
 * Nur regionale Unterseiten.
 *
 * Die Hauptseite /regionale-besonderheiten besitzt keine
 * .mhl-regional-page-row und bleibt dadurch unverändert.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page .mhl-regional-topic-navigation {
    position: relative !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    min-height: 78px !important;

    margin-top: 24px !important;
    padding: 16px 20px !important;

    border-radius: 18px !important;

    border:
        1px solid rgba(76,220,239,.48) !important;

    background:
        linear-gradient(
            135deg,
            rgba(5,63,83,.96),
            rgba(7,48,66,.92)
        ) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 0 18px rgba(49,211,235,.12),
        0 8px 24px rgba(0,0,0,.14) !important;

    overflow: visible !important;
}

/*
 * Kleine visuelle Kennzeichnung:
 * Der Besucher erkennt sofort, dass es sich um
 * die Themen-/Seitennavigation handelt.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page .mhl-regional-topic-navigation::before {
    content: "THEMA · SEITENNAVIGATION";

    display: block !important;

    position: absolute !important;
    left: 20px !important;
    top: -9px !important;

    padding: 2px 9px !important;

    border-radius: 999px !important;

    background:
        rgba(4,52,70,.98) !important;

    border:
        1px solid rgba(77,220,239,.42) !important;

    color:
        #7cebf5 !important;

    font-family:
        Inter,
        sans-serif !important;

    font-size:
        9px !important;

    font-weight:
        800 !important;

    letter-spacing:
        .13em !important;

    line-height:
        1.5 !important;

    box-shadow:
        0 0 10px rgba(69,219,237,.12) !important;

    pointer-events: none !important;
}

/*
 * Link rechts wird als echte Navigationsaktion erkennbar.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page .mhl-regional-topic-navigation a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 40px !important;

    padding: 8px 15px !important;

    border-radius: 11px !important;

    border:
        1px solid rgba(78,224,241,.50) !important;

    background:
        rgba(5,75,96,.72) !important;

    color:
        #8cecf7 !important;

    font-weight:
        800 !important;

    text-decoration:
        none !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 0 12px rgba(60,216,235,.14) !important;

    transition:
        background .18s ease,
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease !important;
}

html body:has(.mhl-regional-page-row)
.mhl-regional-page .mhl-regional-topic-navigation a:hover {
    background:
        rgba(7,92,116,.88) !important;

    border-color:
        rgba(111,234,247,.82) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 0 18px rgba(68,224,241,.28) !important;

    transform:
        translateY(-1px) !important;
}

/*
 * Link-Pfeil nicht als normales Textzeichen behandeln.
 * Bestehender Inhalt bleibt unverändert.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page .mhl-regional-topic-navigation > * {
    position: relative;
    z-index: 1;
}

/*
 * Die Hauptseite besitzt keine .mhl-regional-page-row
 * und bleibt daher unangetastet.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a) {

    min-height: 84px !important;

    padding:
        18px
        20px !important;

    border-radius:
        18px !important;
}

/*
 * Linke Themenbezeichnung:
 * etwas größer, heller und klarer.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> :first-child {

    font-size:
        12px !important;

    line-height:
        1.45 !important;

    font-weight:
        700 !important;

    letter-spacing:
        .045em !important;

    color:
        #8bdde8 !important;

    opacity:
        1 !important;

    text-shadow:
        0 0 8px rgba(72,216,235,.16) !important;
}

/*
 * Etwaige verschachtelte Beschriftung erbt die Lesbarkeit,
 * ohne den eigentlichen Navigationsbutton anzufassen.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> :first-child span {

    font-size:
        inherit !important;

    font-weight:
        inherit !important;

    color:
        inherit !important;

    opacity:
        1 !important;
}

/*
 * Rechte Navigation:
 * etwas größer und eindeutiger,
 * aber weiterhin dezent.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a {

    min-height:
        42px !important;

    padding:
        9px 16px !important;

    border-radius:
        11px !important;

    font-size:
        13px !important;

    line-height:
        1.35 !important;

    font-weight:
        800 !important;

    letter-spacing:
        .01em !important;

    color:
        #92edf6 !important;
}

/*
 * Hover nur leicht verstärken.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a:hover {

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.12),
        0 0 16px rgba(68,224,241,.24) !important;
}

/* ============================================================
   END
   ============================================================ */

/*
 * Die Themenbezeichnung unten führt den Blick
 * durch eine sehr langsame, ruhige Atembewegung.
 *
 * Keine Größenänderung.
 * Keine Positionsänderung.
 * Kein Layout-Shift.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> :first-child {

    animation:
        mhl-subpage-nav-breathe
        5.8s
        ease-in-out
        infinite !important;

    will-change:
        color,
        text-shadow,
        opacity;
}

@keyframes mhl-subpage-nav-breathe {

    0%,
    100% {
        color: #78cbd7 !important;
        opacity: .82 !important;

        text-shadow:
            0 0 3px rgba(72,216,235,.08) !important;
    }

    50% {
        color: #a4f0f7 !important;
        opacity: 1 !important;

        text-shadow:
            0 0 8px rgba(72,216,235,.20),
            0 0 16px rgba(72,216,235,.08) !important;
    }
}

/*
 * Kleine Verstärkung der eigentlichen Aktion,
 * ohne eigenes Blinken.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a {

    transition:
        box-shadow .35s ease,
        border-color .35s ease !important;
}

/* ============================================================
   END
   ============================================================ */

/*
 * Themenname:
 * etwas präsenter, aber weiterhin elegant.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> :first-child {

    font-size: 13px !important;

    font-weight: 800 !important;

    letter-spacing: .065em !important;

    line-height: 1.5 !important;

    color: #8bdfe9 !important;

    opacity: 1 !important;

    animation:
        mhl-subpage-topic-breathe
        6.8s
        ease-in-out
        infinite !important;

    will-change:
        color,
        text-shadow;
}

@keyframes mhl-subpage-topic-breathe {

    0%,
    100% {
        color: #78cbd6 !important;

        text-shadow:
            0 0 3px rgba(76,220,235,.08) !important;
    }

    50% {
        color: #b1f3f8 !important;

        text-shadow:
            0 0 7px rgba(76,220,235,.22),
            0 0 15px rgba(76,220,235,.08) !important;
    }
}

/*
 * Der Start-Link ist KEIN Button mehr.
 * Rahmen, Hintergrund und Schatten vollständig entfernen.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a {

    min-height: unset !important;

    padding: 4px 2px !important;

    border: 0 !important;

    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;

    color: #8cecf5 !important;

    font-size: 13px !important;

    font-weight: 800 !important;

    letter-spacing: .015em !important;

    text-decoration: none !important;

    transform: none !important;

    animation:
        mhl-subpage-start-breathe
        6.8s
        ease-in-out
        infinite !important;

    will-change:
        color,
        text-shadow;
}

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a:hover {

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    transform: none !important;
}

@keyframes mhl-subpage-start-breathe {

    0%,
    100% {
        color: #75cbd5 !important;

        text-shadow:
            0 0 2px rgba(76,220,235,.05) !important;
    }

    50% {
        color: #c0f7fa !important;

        text-shadow:
            0 0 8px rgba(76,220,235,.24) !important;
    }
}

/*
 * Falls im Link ein SVG-Pfeil vorhanden ist:
 * ebenfalls ruhig mitatmen lassen, ohne Rahmen.
 */

html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a svg {

    filter:
        drop-shadow(0 0 3px rgba(76,220,235,.14)) !important;

    transition:
        filter .35s ease !important;
}

/* ============================================================
   END
   ============================================================ */

/*
 * Nur regionale Unterseiten.
 * Hauptseite /regionale-besonderheiten bleibt unangetastet.
 */

/* Pfeil vollständig entfernen */
html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a svg,
html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a .icon {
    display: none !important;
}

/* Eventuelle Text-/Pseudo-Pfeile entfernen */
html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a::after,
html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a::before {
    content: none !important;
    display: none !important;
}

/*
 * "Mit Seite 1 beginnen" als ruhiges Leitsignal.
 * Kein Rahmen.
 * Kein Hintergrund.
 * Keine Bewegung.
 */
html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    padding: 4px 0 !important;
    min-height: 0 !important;

    color: #78cbd5 !important;

    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: .015em !important;

    text-decoration: none !important;

    transform: none !important;

    animation:
        mhl-subpage-startlink-breathe
        7.2s
        ease-in-out
        infinite !important;

    will-change:
        color,
        text-shadow,
        opacity;
}

/*
 * Langsames abwechselndes Atmen:
 * zurückhaltend → klar sichtbar → zurückhaltend.
 */
@keyframes mhl-subpage-startlink-breathe {

    0%,
    100% {
        color: #72c6d1 !important;
        opacity: .72 !important;

        text-shadow:
            0 0 2px rgba(76,220,235,.04) !important;
    }

    25% {
        color: #8edee6 !important;
        opacity: .88 !important;

        text-shadow:
            0 0 5px rgba(76,220,235,.10) !important;
    }

    50% {
        color: #c1f5f8 !important;
        opacity: 1 !important;

        text-shadow:
            0 0 8px rgba(76,220,235,.25),
            0 0 16px rgba(76,220,235,.08) !important;
    }

    75% {
        color: #8edee6 !important;
        opacity: .88 !important;

        text-shadow:
            0 0 5px rgba(76,220,235,.10) !important;
    }
}

/* Hover nicht stärker springen lassen */
html body:has(.mhl-regional-page-row)
.mhl-regional-page > :last-child:has(a)
> a:hover {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

/* ============================================================
   END
   ============================================================ */

/* ============================================================
   MHL REGIONAL START LINK – REAL TARGET
   NUR UNTERSEITEN
   ============================================================ */

/*
 * Der tatsächliche vorhandene Link bekommt eine eindeutige
 * Klasse direkt aus section.blade.php.
 */

html body .mhl-regional-page
a.mhl-regional-start-link {

    border: 0 !important;
    outline: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    min-height: 0 !important;

    padding: 5px 0 !important;

    color: #79cdd7 !important;

    font-size: 13px !important;
    font-weight: 800 !important;

    letter-spacing: .015em !important;

    text-decoration: none !important;

    transform: none !important;

    animation:
        mhl-regional-startlink-breathe
        7.5s
        ease-in-out
        infinite !important;

    will-change:
        color,
        text-shadow,
        opacity !important;
}

/*
 * Kein Pfeil / kein Icon.
 */

html body .mhl-regional-page
a.mhl-regional-start-link svg,
html body .mhl-regional-page
a.mhl-regional-start-link::before,
html body .mhl-regional-page
a.mhl-regional-start-link::after {

    display: none !important;
    content: none !important;
}

/*
 * Ruhiger Atemimpuls:
 * dunkel -> klar -> hell -> zurück.
 */

@keyframes mhl-regional-startlink-breathe {

    0%,
    100% {
        color: #72c6d1 !important;
        opacity: .70 !important;

        text-shadow:
            0 0 2px rgba(70,215,232,.05) !important;
    }

    25% {
        color: #8edce5 !important;
        opacity: .84 !important;

        text-shadow:
            0 0 5px rgba(70,215,232,.10) !important;
    }

    50% {
        color: #c2f5f8 !important;
        opacity: 1 !important;

        text-shadow:
            0 0 8px rgba(70,215,232,.22),
            0 0 15px rgba(70,215,232,.07) !important;
    }

    75% {
        color: #8edce5 !important;
        opacity: .84 !important;

        text-shadow:
            0 0 5px rgba(70,215,232,.10) !important;
    }
}

/*
 * Hover bleibt ruhig.
 */

html body .mhl-regional-page
a.mhl-regional-start-link:hover {

    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

/* ============================================================
   END
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.icon.icon-lighthouse {

    display: block !important;
    visibility: visible !important;

    width: 34px !important;
    height: 34px !important;

    min-width: 34px !important;
    min-height: 34px !important;

    color: #dffbff !important;

    stroke: currentColor !important;

    opacity: 1 !important;

    filter:
        drop-shadow(0 0 4px rgba(116,232,244,.72))
        !important;

    animation:
        mhl-lighthouse-visible-pulse
        4.8s
        ease-in-out
        infinite
        !important;
}

/*
 * Die SVG-Pfade explizit wieder sichtbar machen.
 */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.icon.icon-lighthouse
path {

    stroke: currentColor !important;
    fill: none !important;
    opacity: 1 !important;
}

/*
 * Ruhiges Leuchten.
 * Noch kein Morse — erst Sichtbarkeit sicherstellen.
 */

@keyframes mhl-lighthouse-visible-pulse {

    0%,
    100% {
        color: #dffbff !important;

        filter:
            drop-shadow(0 0 3px rgba(116,232,244,.52))
            !important;
    }

    50% {
        color: #fff0a8 !important;

        filter:
            drop-shadow(0 0 6px rgba(255,218,112,.82))
            drop-shadow(0 0 13px rgba(255,193,64,.46))
            !important;
    }
}

/*
 * Sicherheits-Override gegen vorhandene display:none-Regeln.
 */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg {

    display: block !important;
    visibility: visible !important;
}

/* ============================================================
   END
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.mhl-subpage-lighthouse {

    display: block !important;
    visibility: visible !important;

    width: 34px !important;
    height: 34px !important;

    min-width: 34px !important;
    min-height: 34px !important;

    fill: none !important;

    stroke: #dffbff !important;
    color: #dffbff !important;

    opacity: 1 !important;

    filter:
        drop-shadow(0 0 4px rgba(116,232,244,.72))
        !important;

    animation: none !important;

    transform: none !important;
}

/* Beide vorhandenen Lighthouse-Pfade explizit sichtbar */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.mhl-subpage-lighthouse
> path {

    display: inline !important;

    fill: none !important;

    stroke: #dffbff !important;
    stroke-width: 1.7 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;

    opacity: 1 !important;
}

/* Keine alte Icon-Ausblendung darf greifen */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.mhl-subpage-lighthouse {

    position: static !important;
    visibility: visible !important;
}

/* ============================================================
   END
   ============================================================ */

html body .mhl-regional-page
.mhl-regional-page-row__number {

    width: 40px !important;
    height: 40px !important;

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

    overflow: visible !important;

    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 34px 34px !important;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 24 24' fill='none' stroke='%23dffbff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21h6M10 18h4M9.5 18l1-10h3l1 10M9.8 12h4.4M8 8h8M10 5h4l1 3H9l1-3Z'/%3E%3Cpath d='M5 8 2.5 6.5M19 8l2.5-1.5M6 4 4.5 2.5M18 4l1.5-1.5'/%3E%3C/svg%3E") !important;
}

/*
 * Das eventuell vorhandene innere SVG wird unsichtbar,
 * damit nicht zwei Lighthouse übereinander liegen.
 * Der sichtbare Lighthouse kommt jetzt vom vorhandenen
 * Number-Container.
 */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg {

    visibility: hidden !important;
}

/* ============================================================
   END
   ============================================================ */

/*
 * NUR Unterseiten:
 * .mhl-regional-page-row
 *
 * Hauptseite /regionale-besonderheiten:
 * NICHT angesprochen.
 */

/* sichtbare Morse-Pseudoelemente der Unterseiten abschalten */
html body .mhl-regional-page
.mhl-regional-page-row__number::before,
html body .mhl-regional-page
.mhl-regional-page-row__number::after {
    content: none !important;
    display: none !important;
}

/* ------------------------------------------------------------
   LIGHTHOUSE SICHTBARKEIT
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.icon.icon-lighthouse {

    display: block !important;
    visibility: visible !important;

    width: 34px !important;
    height: 34px !important;

    min-width: 34px !important;
    min-height: 34px !important;

    position: static !important;
    transform: none !important;

    opacity: 1 !important;

    fill: none !important;

    color: #dffbff !important;
    stroke: #dffbff !important;

    stroke-width: 1.7 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;

    filter:
        drop-shadow(0 0 4px rgba(116,232,244,.72))
        !important;
}

/*
 * Pfade des vorhandenen SVG explizit erzwingen.
 */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.icon.icon-lighthouse
> path {

    display: inline !important;
    visibility: visible !important;

    fill: none !important;

    stroke: #dffbff !important;

    stroke-width: 1.7 !important;

    stroke-linecap: round !important;
    stroke-linejoin: round !important;

    opacity: 1 !important;

    vector-effect: non-scaling-stroke !important;
}

/* ------------------------------------------------------------
   LANGSAMES LICHTSIGNAL
   MEERHEIMATLIEBE.DE
   ------------------------------------------------------------ */

html body .mhl-regional-page
.mhl-regional-page-row__number
> svg.icon.icon-lighthouse {

    animation:
        mhl-subpage-lighthouse-signal
        13.32s
        steps(1, end)
        infinite !important;

    will-change:
        color,
        stroke,
        filter !important;
}

@keyframes mhl-subpage-lighthouse-signal {

    0%,
    5%,
    10%,
    15%,
    20%,
    25%,
    30%,
    35%,
    40%,
    45%,
    50%,
    55%,
    60%,
    65%,
    70%,
    75%,
    80%,
    85%,
    90%,
    95%,
    100% {

        color: #dffbff;
        stroke: #dffbff;

        filter:
            drop-shadow(0 0 4px rgba(116,232,244,.50));
    }
}

/* ------------------------------------------------------------
   END
   ------------------------------------------------------------ */
