/* =========================================================
   KIBiS Celle
   Selbsthilfegruppen – Übersichtsseite
   BEREINIGTER FINALER STAND
   ========================================================= */


/* =========================================================
   1. SEITENINHALT
   ========================================================= */

.kibis-page-content {
    width: 100%;
    max-width: 1200px;
    margin-inline: auto;
}


/* Ollies Standard-Inhaltsbreite (800 px) nur auf dieser Seite für die
   verschachtelten Gutenberg-Blöcke auf die Seitenbreite anheben. */
.page-id-3141 .kibis-hero > .wp-block-columns,
.page-id-3141 .kibis-search > .wp-block-search,
.page-id-3141 .kibis-kategorien-wrapper {
    max-width: 1200px !important;
    margin-inline: auto !important;
}


/* =========================================================
   2. HERO
   ========================================================= */

@media (max-width: 767px) {

    .kibis-hero {
        margin-bottom: 16px !important;
        padding-bottom: 0 !important;
    }
}


/* =========================================================
   3. SUCHE
   ========================================================= */

.kibis-search {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;
}


/* =========================================================
   3.1 SUCHFORMULAR / GESAMTRAHMEN
   ========================================================= */

.kibis-search .wp-block-search,
.kibis-search form {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


.kibis-search .wp-block-search__inside-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;

    width: 100% !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #08075F !important;

    border: 1px solid #66C7E8 !important;
    border-radius: 10px !important;

    overflow: hidden !important;
}


/* =========================================================
   3.2 EINGABEFELD
   ========================================================= */

.kibis-search .wp-block-search__input {
    display: block !important;

    flex: 1 1 auto !important;

    width: auto !important;
    min-width: 0 !important;

    height: 60px !important;
    min-height: 60px !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 0 20px !important;

    background: #08075F !important;
    color: #FFFFFF !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-size: 1rem !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
}


.kibis-search .wp-block-search__input::placeholder {
    color: rgba(255, 255, 255, 0.72) !important;
    opacity: 1 !important;
}


.kibis-search .wp-block-search__input:focus,
.kibis-search .wp-block-search__input:focus-visible {
    background: #08075F !important;
    color: #FFFFFF !important;

    outline: 3px solid #66C7E8 !important;
    outline-offset: -3px !important;

    box-shadow: none !important;
}


/* =========================================================
   3.3 SUCHBUTTON
   ========================================================= */

.kibis-search .wp-block-search__button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 140px !important;

    height: 60px !important;
    min-height: 60px !important;

    box-sizing: border-box !important;

    margin: 0 !important;
    padding: 0 24px !important;

    background: #D31335 !important;
    background-image: none !important;

    color: #FFFFFF !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-size: 1rem !important;
    line-height: 1 !important;
    font-weight: 700 !important;

    white-space: nowrap !important;

    opacity: 1 !important;
}


.kibis-search .wp-block-search__button:hover {
    background: #B80F2D !important;
    color: #FFFFFF !important;
}


.kibis-search .wp-block-search__button:focus-visible {
    outline: 3px solid #FFFFFF !important;
    outline-offset: -4px !important;
}


/* =========================================================
   3.4 SMARTPHONE-SUCHE
   ========================================================= */

@media (max-width: 767px) {

    .kibis-search,
    .kibis-search .wp-block-search,
    .kibis-search .wp-block-search__inside-wrapper {
        width: 100% !important;
        max-width: 100% !important;
    }


    .kibis-search .wp-block-search__inside-wrapper {
        min-height: 56px !important;

        border-radius: 10px !important;
    }


    .kibis-search .wp-block-search__input {
        flex: 1 1 0 !important;

        width: 1% !important;
        min-width: 0 !important;

        height: 56px !important;
        min-height: 56px !important;

        padding: 0 14px !important;

        font-size: 16px !important;
    }


    .kibis-search .wp-block-search__button {
        position: relative !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        flex: 0 0 58px !important;

        width: 58px !important;
        min-width: 58px !important;
        max-width: 58px !important;

        height: 56px !important;
        min-height: 56px !important;

        padding: 0 !important;

        background: #D31335 !important;

        border: 0 !important;
        border-radius: 0 !important;

        font-size: 0 !important;

        color: transparent !important;
    }


    .kibis-search .wp-block-search__button::before {
        content: "⌕";

        display: block;

        color: #FFFFFF;

        font-size: 28px;
        line-height: 1;

        font-weight: 400;
    }
}

/* =========================================================
   4. KATEGORIEN / THEMENBROWSER
   ========================================================= */

.kibis-kategorien-wrapper {
    width: 100%;
    margin-top: 32px;
}


.kibis-kategorien {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 24px;

    width: 100%;
}


/* Große Hauptkarten */

.kibis-kategorie-hauptbereich {
    width: 100%;
    box-sizing: border-box;

    margin: 0;
    padding: 28px;

    background: #1A287A;
    color: #FFFFFF;

    border: 1px solid rgba(102, 199, 232, 0.18);
    border-radius: 14px;
}


/* =========================================================
   4.1 HAUPTÜBERSCHRIFT + ICON
   ========================================================= */

.kibis-kategorie-haupttitel {
    position: relative;

    display: flex;
    align-items: flex-start;

    gap: 16px;

    margin: 0 0 24px;
    padding: 0 0 17px;

    color: #FFFFFF !important;

    border: 0;

    font-size: 1.18rem;
    line-height: 1.3;
    font-weight: 700;
}


/* Rote Akzentlinie */

.kibis-kategorie-haupttitel::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 110px;
    height: 3px;

    background: #D31335;

    border-radius: 3px;
}


/* Icon */

.kibis-kategorie-haupticon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 45px;

    width: 45px;
    height: 45px;

    color: #D31335;

    overflow: visible;
}


.kibis-kategorie-haupticon svg {
    display: block !important;

    width: 28px !important;
    height: 28px !important;

    min-width: 28px !important;
    min-height: 28px !important;

    max-width: none !important;
    max-height: none !important;

    transform: scale(1.55) !important;
    transform-origin: center center !important;

    overflow: visible !important;
}


.kibis-kategorie-haupttitel-text {
    display: block;

    min-width: 0;

    padding-top: 1px;
}


/* =========================================================
   4.2 REIHENFOLGE DESKTOP
   Selbsthilfegruppen links
   ========================================================= */

@media (min-width: 901px) {

    .kibis-kategorie-hauptbereich:nth-child(1) {
        order: 2;
    }

    .kibis-kategorie-hauptbereich:nth-child(2) {
        order: 1;
    }
}


/* =========================================================
   4.3 KATEGORIENLISTE
   ========================================================= */

.kibis-kategorie-liste {
    display: flex;
    flex-direction: column;

    gap: 8px;

    list-style: none;

    margin: 0;
    padding: 0;
}


.kibis-kategorie-eintrag {
    width: 100%;
    box-sizing: border-box;

    margin: 0;
    padding: 0;

    background: rgba(8, 7, 95, 0.16);

    border: 1px solid rgba(102, 199, 232, 0.34);
    border-radius: 9px;

    overflow: hidden;
}


.kibis-kategorie-link {
    position: relative;

    display: block;

    width: 100%;
    box-sizing: border-box;

    padding: 13px 42px 13px 16px;

    color: #FFFFFF !important;

    font-size: 1rem;
    line-height: 1.4;
    font-weight: 600;

    text-decoration: none !important;

    transition:
        background-color 0.18s ease,
        color 0.18s ease;
}


/* Pfeil */

.kibis-kategorie-link::after {
    content: "›";

    position: absolute;

    right: 16px;
    top: 50%;

    transform: translateY(-52%);

    color: #66C7E8;

    font-size: 1.45rem;
    line-height: 1;
}


.kibis-kategorie-eintrag:hover {
    border-color: rgba(102, 199, 232, 0.75);
}


.kibis-kategorie-link:hover {
    color: #66C7E8 !important;

    background: rgba(102, 199, 232, 0.07);
}


.kibis-kategorie-link:focus-visible {
    color: #FFFFFF !important;

    outline: 3px solid #D31335;
    outline-offset: -3px;

    border-radius: 7px;
}


/* =========================================================
   4.4 UNTERKATEGORIEN
   ========================================================= */

.kibis-unterkategorie-liste {
    list-style: none;

    margin: 0;
    padding: 0 16px 12px 30px;

    border-top: 1px solid rgba(102, 199, 232, 0.16);
}


.kibis-unterkategorie-eintrag {
    position: relative;

    margin: 0;
    padding: 0 0 0 16px;
}


.kibis-unterkategorie-eintrag::before {
    content: "↳";

    position: absolute;

    left: 0;
    top: 10px;

    color: #66C7E8;

    font-size: 0.9rem;
}


.kibis-unterkategorie-link {
    display: block;

    width: 100%;
    box-sizing: border-box;

    padding: 9px 6px;

    color: #FFFFFF !important;

    font-size: 0.95rem;
    line-height: 1.45;
    font-weight: 400;

    text-decoration: none !important;

    border-bottom: 1px solid rgba(102, 199, 232, 0.10);

    transition:
        color 0.18s ease,
        background-color 0.18s ease;
}


.kibis-unterkategorie-eintrag:last-child
.kibis-unterkategorie-link {
    border-bottom: 0;
}


.kibis-unterkategorie-link:hover {
    color: #66C7E8 !important;

    background: rgba(102, 199, 232, 0.05);
}


.kibis-unterkategorie-link:focus-visible {
    color: #FFFFFF !important;

    outline: 3px solid #D31335;
    outline-offset: 1px;

    border-radius: 4px;
}


/* =========================================================
   5. LISTINGS
   ========================================================= */

.kibis-listings {
    width: 100%;
    max-width: 1200px;

    margin-inline: auto;
}


/* =========================================================
   5.1 DIRECTORIST GRID
   ========================================================= */

.kibis-listings .directorist-container-fluid {
    width: 100% !important;
    max-width: 100% !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}


.kibis-listings .directorist-row {
    width: 100% !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}


.kibis-listings .directorist-col-4 {
    box-sizing: border-box;

    padding-left: 12px !important;
    padding-right: 12px !important;
}


.kibis-listings .directorist-col-4:nth-child(3n + 1) {
    padding-left: 0 !important;
}


.kibis-listings .directorist-col-4:nth-child(3n) {
    padding-right: 0 !important;
}


/* =========================================================
   5.2 GRUPPENZÄHLER
   ========================================================= */

.kibis-listings .directorist-listings-header__left {
    color: #FFFFFF !important;

    font-size: 20px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
}


.kibis-listings .directorist-listings-header__left * {
    color: #FFFFFF !important;

    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
}


/* =========================================================
   5.3 SORTIERBUTTON
   ========================================================= */

.kibis-listings
.directorist-sortby-dropdown
.directorist-dropdown__toggle {
    min-height: 46px;

    box-sizing: border-box;

    padding: 0 16px !important;

    background: #1A287A !important;
    color: #FFFFFF !important;

    border: 2px solid #66C7E8 !important;
    border-radius: 9px !important;

    font-size: 1rem !important;
    font-weight: 500;

    box-shadow: none !important;
}


.kibis-listings
.directorist-sortby-dropdown
.directorist-dropdown__toggle:hover {
    background: rgba(102, 199, 232, 0.10) !important;
    color: #FFFFFF !important;

    border-color: #FFFFFF !important;
}


/* =========================================================
   5.4 AUFGEKLAPPTES SORTIERMENÜ
   ========================================================= */

.kibis-listings .directorist-dropdown__links {
    padding: 8px !important;

    background: #1A287A !important;

    border: 1px solid #66C7E8 !important;
    border-radius: 10px !important;

    box-shadow: none !important;
}


.kibis-listings .directorist-dropdown__links__single {
    display: block !important;

    padding: 10px 12px !important;

    color: #FFFFFF !important;
    background: transparent !important;

    border: 0 !important;
    border-radius: 7px !important;

    text-decoration: none !important;
}


.kibis-listings .directorist-dropdown__links__single:hover {
    color: #FFFFFF !important;
    background: #111166 !important;

    text-decoration: none !important;
}


.kibis-listings .directorist-dropdown__links__single:focus-visible {
    color: #FFFFFF !important;
    background: #111166 !important;

    outline: 2px solid #66C7E8 !important;
    outline-offset: -2px;

    text-decoration: none !important;
}


/* =========================================================
   5.5 LISTING-KARTE
   ========================================================= */

.kibis-listings .directorist-listing-single {
    display: flex;
    flex-direction: column;

    width: 100%;

    height: 100%;
    min-height: 400px;

    background: #1A287A;

    border: 0;
    border-radius: 14px;

    overflow: hidden;

    box-shadow: none;
}


/* Vorschaubild ausblenden */

.kibis-listings .directorist-listing-single__thumb {
    display: none !important;
}


/* Inhalt */

.kibis-listings .directorist-listing-single__content {
    display: flex;
    flex-direction: column;

    flex: 1 1 auto;

    width: 100%;
    min-height: 400px;

    box-sizing: border-box;

    padding: 26px 28px;

    background: #1A287A;
    color: #FFFFFF;
}


.kibis-listings .directorist-listing-single__info {
    display: flex;
    flex-direction: column;

    flex: 1 1 auto;

    width: 100%;

    padding: 0;

    background: transparent;
    color: #FFFFFF;

    border: 0;
}


/* =========================================================
   5.6 TITELBEREICH
   ========================================================= */

.kibis-listings .directorist-listing-single__info__top {
    flex: 0 0 8.4em;

    width: 100%;

    height: 8.4em;
    min-height: 8.4em;
    max-height: 8.4em;

    box-sizing: border-box;

    overflow: hidden;

    margin: 0 0 18px;
    padding: 0 0 18px;

    border-bottom: 1px solid rgba(102, 199, 232, 0.16);
}


/* Titel grundsätzlich weiß */

.kibis-listings .directorist-listing-title,
.kibis-listings .directorist-listing-title a,
.kibis-listings .directorist-listing-title a:link,
.kibis-listings .directorist-listing-title a:visited,
.kibis-listings .directorist-listing-single__content h2,
.kibis-listings .directorist-listing-single__content h3 {
    color: #FFFFFF !important;
}


/* Titel-Link */

.kibis-listings .directorist-listing-title,
.kibis-listings .directorist-listing-title a {
    display: -webkit-box;

    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;

    overflow: hidden;

    margin: 0;

    font-size: 1.25rem;
    line-height: 1.35;
    font-weight: 700;

    text-decoration: none !important;
}


/* Hover */

.kibis-listings .directorist-listing-title a:hover {
    color: #66C7E8 !important;

    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 3px !important;
}


/* Tastatur-Fokus */

.kibis-listings .directorist-listing-title a:focus-visible {
    color: #FFFFFF !important;

    outline: 3px solid #D31335;
    outline-offset: 4px;

    border-radius: 3px;
}


/* =========================================================
   5.7 TITEL NUR DESKTOP = 18 PX
   ========================================================= */

@media (min-width: 1025px) {

    .kibis-listings .directorist-listing-title,
    .kibis-listings .directorist-listing-title a {
        font-size: 18px !important;
        line-height: 1.35 !important;
    }
}

/* =========================================================
   5.8 AUSZUG / TREFFEN
   ========================================================= */

.kibis-listings .directorist-listing-single__info > p,
.kibis-listings .directorist-listing-excerpt,
.kibis-listings .directorist-listing-single__excerpt {
    flex: 0 0 6.4em;

    width: 100%;

    height: 6.4em;
    min-height: 6.4em;
    max-height: 6.4em;

    overflow: hidden;

    margin: 0;

    color: #FFFFFF;

    font-size: 1.02rem;
    line-height: 1.55;
}


/* =========================================================
   5.9 META-BEREICH
   ========================================================= */

.kibis-listings .directorist-listing-single__meta {
    display: block !important;

    width: 100%;
    box-sizing: border-box;

    margin-top: auto !important;
    padding: 18px 0 0;

    background: transparent;

    border-top: 1px solid rgba(102, 199, 232, 0.14);
}


.kibis-listings .directorist-listing-single__meta__left,
.kibis-listings .directorist-listing-single__meta_left {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;
}


.kibis-listings .directorist-listing-single__meta__right,
.kibis-listings .directorist-listing-single__meta_right {
    display: none !important;
}


/* =========================================================
   5.10 KATEGORIE-LABEL
   ========================================================= */

.kibis-listings .directorist-listing-category {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box;

    margin: 0;
    padding: 10px 14px;

    color: #66C7E8;

    background: rgba(8, 7, 95, 0.24);

    border: 0;
    border-left: 4px solid #66C7E8;
    border-radius: 7px;

    font-size: 0.95rem;
    line-height: 1.4;
    font-weight: 500;

    white-space: nowrap;

    overflow: hidden;
}


/* Directorist Kategorie-Icons ausblenden */

.kibis-listings
.directorist-listing-category
.directorist-icon-mask,

.kibis-listings
.directorist-listing-category i {
    display: none !important;
}


/* =========================================================
   5.11 ERSTE KATEGORIE
   ========================================================= */

.kibis-listings
.directorist-listing-category > a {
    display: inline-block !important;

    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #66C7E8 !important;

    position: relative !important;
    z-index: 2 !important;

    pointer-events: auto !important;

    text-decoration: none !important;

    white-space: nowrap !important;
}


/* =========================================================
   5.12 ZWEITE KATEGORIE STATT +1
   ========================================================= */

/* +1 ausblenden */

.kibis-listings
.directorist-listing-category__extran-count {
    display: none !important;
}


/* Popup-Wrapper in normale Zeile verwandeln */

.kibis-listings
.directorist-listing-category__popup {
    display: inline-flex !important;
    align-items: center !important;

    flex: 0 0 auto !important;

    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    position: static !important;

    pointer-events: none !important;
}


/* Popup-Inhalt sichtbar in der normalen Zeile */

.kibis-listings
.directorist-listing-category__popup__content {
    display: inline-flex !important;
    align-items: center !important;

    position: static !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;

    pointer-events: none !important;
}


/* Alle zusätzlichen Kategorien zunächst ausblenden */

.kibis-listings
.directorist-listing-category__popup__content > a {
    display: none !important;
}


/* Nur die zweite Kategorie anzeigen */

.kibis-listings
.directorist-listing-category__popup__content > a:first-child {
    display: inline-block !important;

    width: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #66C7E8 !important;

    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;

    position: relative !important;
    z-index: 2 !important;

    pointer-events: auto !important;

    text-decoration: none !important;

    white-space: nowrap !important;
}


/* Komma zwischen beiden Kategorien */

.kibis-listings
.directorist-listing-category__popup__content > a:first-child::before {
    content: ", " !important;
}


/* Directorist Popup-Pfeile vollständig entfernen */

.kibis-listings
.directorist-listing-category__popup::before,

.kibis-listings
.directorist-listing-category__popup::after,

.kibis-listings
.directorist-listing-category__popup__content::before,

.kibis-listings
.directorist-listing-category__popup__content::after {
    content: none !important;

    display: none !important;
}


/* =========================================================
   5.13 KATEGORIE-LINKS NORMAL / HOVER
   ========================================================= */

/* Beide Kategorien normal */

.kibis-listings
.directorist-listing-category a,

.kibis-listings
.directorist-listing-category a:link,

.kibis-listings
.directorist-listing-category a:visited {
    color: #66C7E8 !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    text-decoration: none !important;
}


/* Beide Kategorien Hover */

.kibis-listings
.directorist-listing-category a:hover {
    color: #FFFFFF !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    outline: 0 !important;

    text-decoration: none !important;
}


/* Tastaturfokus */

.kibis-listings
.directorist-listing-category a:focus-visible {
    color: #FFFFFF !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    outline: 2px solid #D31335 !important;
    outline-offset: 3px;

    border-radius: 2px;

    text-decoration: none !important;
}


/* =========================================================
   6. PAGINATION
   ========================================================= */

.kibis-listings .directorist-pagination {
    margin-top: 32px;
}


.kibis-listings
.directorist-pagination
.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 44px;
    min-height: 44px;

    background: #1A287A;
    color: #FFFFFF;

    border-radius: 8px;

    text-decoration: none;
}


.kibis-listings
.directorist-pagination
.page-numbers:hover,

.kibis-listings
.directorist-pagination
.page-numbers.current {
    background: #D31335;
    color: #FFFFFF;
}


/* =========================================================
   7. TABLET
   bis 900 px = 1 Listing-Karte pro Zeile
   ========================================================= */

@media (max-width: 900px) {

    .kibis-page-content {
        width: calc(100% - 40px);
    }


    /* Kategorien untereinander */

    .kibis-kategorien {
        grid-template-columns: 1fr;

        gap: 24px;
    }


    .kibis-kategorie-hauptbereich {
        padding: 24px;
    }


    /* Listings */

    .kibis-listings .directorist-container-fluid {
        width: 100% !important;
        max-width: 100% !important;

        padding-left: 0 !important;
        padding-right: 0 !important;
    }


    .kibis-listings .directorist-row {
        width: 100% !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    .kibis-listings .directorist-col-4 {
        width: 100% !important;
        max-width: 100% !important;

        flex: 0 0 100% !important;

        padding-left: 0 !important;
        padding-right: 0 !important;
    }


    .kibis-listings .directorist-listing-single {
        width: 100% !important;
        max-width: 100% !important;

        min-height: 360px;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    .kibis-listings
    .directorist-listing-single__content {
        min-height: 360px;

        padding: 24px;
    }


    .kibis-listings
    .directorist-listing-single__info__top {
        flex-basis: 7.4em;

        height: 7.4em;
        min-height: 7.4em;
        max-height: 7.4em;

        margin-bottom: 18px;
        padding-bottom: 18px;
    }


    .kibis-listings .directorist-listing-title,
    .kibis-listings .directorist-listing-title a {
        font-size: 1.2rem;
        line-height: 1.4;
    }


    .kibis-listings
    .directorist-listings-header__left {
        font-size: 18px !important;
    }


    .kibis-listings
    .directorist-sortby-dropdown
    .directorist-dropdown__toggle {
        min-height: 44px;

        padding: 0 14px !important;

        font-size: 0.95rem !important;
    }
}


/* =========================================================
   8. SMARTPHONE
   ========================================================= */

@media (max-width: 767px) {

    .kibis-page-content {
        width: calc(100% - 40px);

        margin-inline: auto;
    }


    /* -----------------------------------------------------
       Kategorien
       ----------------------------------------------------- */

    .kibis-kategorien-wrapper {
        margin-top: 24px;
    }


    .kibis-kategorien {
        display: flex;
        flex-direction: column;

        gap: 20px;
    }


    /* Selbsthilfegruppen zuerst */

    .kibis-kategorie-hauptbereich:nth-child(1) {
        order: 2;
    }


    .kibis-kategorie-hauptbereich:nth-child(2) {
        order: 1;
    }


    .kibis-kategorie-hauptbereich {
        padding: 20px 18px;
    }


    .kibis-kategorie-haupttitel {
        gap: 13px;

        margin-bottom: 20px;
        padding-bottom: 15px;

        font-size: 1.08rem;
    }


    .kibis-kategorie-haupttitel::after {
        width: 90px;
    }


    .kibis-kategorie-haupticon {
        flex-basis: 40px;

        width: 40px;
        height: 40px;
    }


    .kibis-kategorie-haupticon svg {
        transform: scale(1.4) !important;
    }


    .kibis-kategorie-liste {
        gap: 7px;
    }


    .kibis-kategorie-link {
        padding: 13px 40px 13px 14px;
    }


    .kibis-unterkategorie-liste {
        padding-left: 24px;
        padding-right: 12px;
        padding-bottom: 10px;
    }


    /* -----------------------------------------------------
       Listings
       ----------------------------------------------------- */

    .kibis-listings .directorist-container-fluid {
        width: 100% !important;
        max-width: 100% !important;

        padding-left: 0 !important;
        padding-right: 0 !important;
    }


    .kibis-listings .directorist-row {
        width: 100% !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    .kibis-listings .directorist-col-4 {
        width: 100% !important;
        max-width: 100% !important;

        flex: 0 0 100% !important;

        padding-left: 0 !important;
        padding-right: 0 !important;
    }


    .kibis-listings
    .directorist-listings-header__left {
        font-size: 18px !important;
    }


    .kibis-listings
    .directorist-sortby-dropdown
    .directorist-dropdown__toggle {
        min-height: 44px;

        padding: 0 14px !important;

        font-size: 0.95rem !important;
    }


    .kibis-listings .directorist-listing-single {
        width: 100% !important;
        max-width: 100% !important;

        min-height: 380px;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }


    .kibis-listings
    .directorist-listing-single__content {
        min-height: 380px;

        padding: 22px 18px;
    }


    .kibis-listings
    .directorist-listing-single__info__top {
        flex-basis: 8.3em;

        height: 8.3em;
        min-height: 8.3em;
        max-height: 8.3em;

        margin-bottom: 17px;
        padding-bottom: 17px;
    }


    .kibis-listings .directorist-listing-title,
    .kibis-listings .directorist-listing-title a {
        font-size: 1.15rem;
        line-height: 1.4;
    }


    .kibis-listings
    .directorist-listing-single__meta {
        padding-top: 17px;
    }


    .kibis-listings
    .directorist-listing-category {
        width: 100% !important;
        max-width: 100% !important;

        padding: 10px 12px;

        font-size: 0.95rem;
    }


    .kibis-listings
    .directorist-pagination {
        flex-wrap: nowrap !important;
    }
}


/* =========================================================
   9. REDUZIERTE BEWEGUNG
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .kibis-kategorie-link,
    .kibis-unterkategorie-link,
    .kibis-listings a {
        transition: none;
    }
}


