/* Basis-Reset und Full-Width (mobile-first) */
/* ======================
   1. RESET & VARIABLEN
   ====================== */
:root {
    /* Farbpalette */
    --primary-color: #009BDC;
    --secondary-color: rgba(90,37,114, 1);
    --accent-color: #e74c3c;
    --dark-color: #009BDC;;
    --light-color: #ecf0f1;
    --primary-bgcolor: #eeeeee;
    --link-color: #009BDC;
    --link-color-hover: rgba(90,37,114, 1);
    --transition-speed: 0.4s;
    --primary: rgba(90,37,114, 1);

    /* Typografie */
    --base-font: 'Arial', system-ui, sans-serif;
    --heading-font: 'Arial', sans-serif;
    --nav-font-size:23em;
    --base-font-size: 12px;
    --line-height: 1.6;
    --bs-body-font-size: 1.2rem;

    /* Abstände */
    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1.2rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;

    /* Sonstiges */
    --border-radius: 4px;
    --box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    --transition: all 0.3s ease;
    --color-shadow: rgba(49, 30, 103, 0.19);
}

/* Modernes CSS-Reset */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: Arial, sans-serif; line-height: 1.6; color: rgba(57,61,57,1.00); background: #ffffff; }
/* ======================
   2. GRUNDLEGENDE ELEMENTE
   ====================== */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--heading-font);
    font-weight: 700;
    line-height: 1.2em;
    margin-bottom: var(--spacing-md);
}
h1{
    font-size: 2em;

}
h2{
    font-size: 1.6em;
    margin-bottom: 0.6em;
    margin-top: 1.2em;;

}

h3{
    font-size: 1.4em;
    margin-bottom: 0.6em;
    margin-top: 1.2em;;

}
h4{
    font-size: 1.1em;
    margin-bottom: 0.6em;
    margin-top: 1.2em;;

}

p {
    font-size: 16px;
    line-height: 2;
    margin-bottom: var(--spacing-md);
}
li {
    font-size: 16px;
    
}

a {
    color: var(--link-color);
    text-decoration: none;
    /*transition: var(--transition);*/
}

a:hover {
    color: var(--link-color-hover);

}

/* Fixierter Header (lila, sticky) - Basis für Mobile */
/* HEADER*/
.sticky-header {
    position: sticky;
    top: 0;
    background-color: rgba(90,37,114, 1);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    gap: 2em; /* Gutter zwischen Logo und Menü */
}
#header-left { /* Logo links */
    flex: 0 0 auto;
    width: 40%;
}
#header-left img { max-height: 40px; width: auto; }
.logo {
    flex: 1;
    max-width: 40em;
    margin-left: 1em; /* Gutter links vom Logo */
    padding-top: 1.5em;
    padding-bottom: 1em;
}
.logo_img {
    width: calc(20.275rem + 0.3%);
    height: auto;
}


/* Menü zentriert */

.dj-megamenu-clean li a.dj-up_a{

    font-size: 1.3em!important;
}

.menu{
    position: relative;
    right: -1em;
}
nav ul li{
    font-size: 1.3em;

}

.name {
    position: relative;
    text-decoration: none;
    color: white;
    transition: color 0.3s ease;
}

.name::after {
    content: '';
    position: absolute;
    left: 0;
    bottom:  -0.3em;
    width: 0%;
    height: 3px;
    background-color: white;
    transition: width 0.3s ease;
}

.name:hover::after {
    width: 100%;
}


/* Spacer für Header */
#header + #slider { margin-top: 60px; }

/* Slider (full width, angepasst) */
#slider {
    width: 100%;
    height: 400px; /* Kleiner für Mobile */
    overflow: hidden;
}
#slider .mod-slider {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.diakflag{
    position: absolute!important;
    /*left: 0!important;*/
    top: 15rem;!important;
    z-index: 9979;
}
.diakflag_img{
    height: auto;
    width: 20vw;
}
/* Inhaltsbereich (weiß, 10pt Margin angepasst) */
/* CONTENT*/
.uk_container {
    --bs-gutter-x: 0.3rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 0.3);
    padding-left: calc(var(--bs-gutter-x) * 0.3);
    margin-right: auto;
    margin-left: auto;
}
.uk-card-title  {
    font-size: calc(1.8rem + 0.2vw);
    text-align: center;
}
.eb-event-item-grid-default-layout {
    min-height: 35em;
    height: fit-content;
    box-shadow: 0 0 0 0 rgba(6,10,20,.08) !important;
    border-radius: 0em !important;
    background-color: #eeeeee;
}

#content {
    background: white;
    margin: 20px 10pt;
    padding: 20px;
    min-height: 400px;
}
/* KARTENHOMEPAGE NEU*/
.uk-row{
    max-width: 135vw !important;
    background-color: #eeeeee ;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 1.9);
    padding-left: calc(var(--bs-gutter-x) * 1.9);
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 0;
}
.uk-row-2{
    max-width: 135vw !important;
    background-color: white ;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * 1.9);
    padding-left: calc(var(--bs-gutter-x) * 1.9);
    --bs-gutter-x: 1rem;
    --bs-gutter-y: 0;
}
/* 
.uk-cards-container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;

    padding-top: 1.5rem;
}

.uk-card-wrapper {
    flex: 0 0 calc(33.333% - 3.5rem);
    max-width: calc(33.333% - 3.5rem);
    min-width: 300px;
    justify-content: center;
    padding-bottom: 1.5rem;
}
*/
  .ukh_container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 6rem;
    max-width:100%;
    margin: 0 auto;
    padding: 2rem 1rem;
  }
.jem-time-display {
  font-size: 0.01rem!important;}

  @media (min-width: 1024px) {
    .ukh_container {
      grid-template-columns: repeat(3, 1fr);
      padding: 3rem 6rem;
        }
      .ukh_card_title {
       font-size: calc(0.1rem + 0.7vw)!important;    
}  
  }

  .ukh_card {
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 1px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    /* Jede Card ist eigenständig */
    height: 100%;
  }

  .ukh_card_top {
    padding: 2rem 1.5rem 1rem;
    text-align: center;
    flex-shrink: 0;
  }

  .ukh_card_icon {
    width: 80px;
    height: 80px;
    margin-bottom: 1rem;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }

  .ukh_card_title {
    margin: 0;
    font-size: calc(0.5rem + 0.9vw);
    font-weight: 900;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: 0.02em;
  }

  .ukh_card_title a {
    text-decoration: none;
    transition: color 0.2s ease;
    font-size: 1.8em;
  }

  .ukh_card_title a:hover {
    text-decoration: none;
  }

  .ukh_card_middle {
    padding: 0.5rem 2.5rem;
    flex-grow: 1;
    font-size: 1.3rem;
    line-height: 1.6;

  }

  .ukh_card_middle p {
    margin: 0 0 0.5rem 0;
  }

  .ukh_card_middle p:last-child {
    margin-bottom: 0;
  }
.ukh_title {
    font-size: calc(1.4rem + 0.2vw);
    text-align: center;
  }
  .ukh_card_bottom {
    padding: 1rem 1.5rem 1.5rem;
    font-size: 1.3rem;
       flex-shrink: 0;
  }

  .ukh_card_bottom p {
    margin: 0 0 0.5rem 0;
  }

  .ukh_card_bottom p:last-child {
    margin-bottom: 0;
  }
















/* KontaktSeite ANFANG*/

/* Grundlegendes Box-Sizing für fehlerfreie Breitenberechnung */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
}

/* Der Hauptcontainer für die Cards */
.uvk_card-container {
    display: flex;
    flex-wrap: wrap;               /* Erlaubt das Umbrechen auf kleineren Bildschirmen */
    justify-content: space-between; /* Gleicher Abstand ZWISCHEN den Cards auf großen Screens */
    gap: 30px;                      /* Abstand zwischen den Cards (horizontal & vertikal beim Umbruch) */
    max-width: 100%;
    margin: 40px auto;
    padding: 0 20px;
}

/* Die einzelnen Cards */
.uvk_card {
    /* Basisbreite: Auf großen Bildschirmen teilen sich 3 Cards den Platz minus den Gap-Abstand */
    width: calc(33.333% - 50px);
    background-color: #ffffff;
    border-radius: 6px;            /* Abgerundete Ecken */
    overflow: hidden;               /* Schneidet das Bild oben passend zur Eckenrundung ab */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06); /* Sehr weicher, moderner Schatten ohne Rahmen */
    display: flex;
    flex-direction: column;         /* Richtet die vier Bereiche untereinander aus */
}

/* Bereich 1: Das Bild (volle Breite) */
.uvk_card-image img {
    width: 100%;
    height: 220px;                  /* Feste Höhe für ein einheitliches Bildraster */
    object-fit: cover;              /* Schneidet das Bild ohne Verzerrung sauber zu */
    display: block;
}

/* Innerer Inhaltsbereich für Textabstände */
.uvk_card-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;                      /* Gleichmäßiger Abstand zwischen Titel, Adresse und Zeiten */
    flex-grow: 1;                   /* Sorgt dafür, dass alle Cards gleich lang sind, falls Text variiert */
}

/* Bereich 2: Der Titel */
.uvk_card-title {
    font-size: 1.35rem;
    font-weight: 600;
}

/* Bereich 3: Der Adressbereich */
.uvk_card-address {
    font-size: 0.95rem;
    line-height: 1.5;

}

/* Bereich 4: Die Öffnungszeiten */
.uvk_card-hours {
    font-size: 0.95rem;
    line-height: 1.5;
    border-top: 1px solid #eeeeee;  /* Diskrete Trennlinie nur innen über den Öffnungszeiten */
    padding-top: 14px;

}


/* --- RESPONSIVE BREAKPOINTS (MEDIA QUERIES) --- */

/* Für Tablets (unterhalb von 900px Breite): Wechsel auf 2 Cards nebeneinander */
@media (max-width: 900px) {
    .uvk_card {
        width: calc(50% - 15px);     /* Teilt die Zeile exakt auf 2 Cards auf */
    }
}

/* Für Smartphones (unterhalb von 600px Breite): Jede Card nutzt die volle Zeile */
@media (max-width: 600px) {
    .uvk_card {
        width: 100%;                  /* Alle 3 Cards stehen sauber untereinander */
    }
    .uvk_card-container {
        gap: 20px;                    /* Leicht reduzierter Abstand auf Mobilgeräten */
    }
}

/* KontaktSeite ENDE*/
.uk-custom-card {

    border: none;
    transition: all var(--transition-speed) ease;
    background: white;
    overflow: hidden;
    height: 100%;
    position: relative;
    justify-content: center;
    padding: 1.5rem;
}
.uk-img-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 1.5rem 0 0;

}


.uk-card-title {
    font-weight: 700;
    color: var(--secondary-color);
    margin-bottom: 1.2rem;
    font-size: clamp(2rem, 2vw, 2.5rem); /* Dynamisch zwischen 1rem und 1.5rem */
    transition: color var(--transition-speed) ease;
    text-align: center;
    white-space: nowrap; /* Verhindert Zeilenumbruch */
    overflow: hidden;
    text-overflow: ellipsis; /* Optional: zeigt "..." bei zu langem Text */
}


.uk-custom-card:hover .uk-card-title {
    color: var(--primary-cyan);
}

.uk-card-text {
    line-height: 1.7;
    margin-bottom: 1.8rem;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 1em;
    font-size: 1.2rem;
}

.uk_card_bottom{
    min-height: 15em;
}
.uk-custom-card a {
    text-decoration: none;
    transition: text-decoration 0.3s ease;
}

.uk-custom-card a:hover {
    text-decoration: underline;
}

/* KARTENHOMEPAGE NEU ENDE*/
/* NEWSHOMEPAGE NEU ENDE*/
.uk_containnews{
    margin: 3em;

}
    /* NEWSHOMEPAGE NEU ENDE*/
/* JEMKALENDER NEU */

#jem{
    margin-left: 3.5rem;
    margin-top: 2rem;
    width: 66%;
}
.uk_jem_card{

    margin: 3em;

}
.uk_jem_date_1{
    font-size: 0.01rem;
    color: #ffffff;
}
#jem .copyright {
    font-size: 0.1em !important;
    text-align: right;
    color: #00A0E3 !important;
}
/* JEMKALENDER NEU ENDE*/
.com-content-article__body{
    margin-left: 3.5em;
    margin-right: 4em;
    margin-top: 2em;
    width: 95vw;
}
.aktionapi{
    margin-left: 0em!important;
}

.uk_linkbt {

    padding: 1rem 24px; /* Flexibel: Größe passt sich Textlänge an */
    font-size: 18px;
    font-weight: bold;
    color: white;
    background-color: rgba(90,37,114, 1);
        cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    white-space: nowrap; /* Verhindert Textumbruch */
    display: inline-block; /* Passt perfekt zum Text */
    margin-left: 45%;
    margin-right: auto;
    margin-top: 2rem;
}

.uk_linkbt:hover {
    background-color:rgba(90,37,114, .75); /* Cyan */
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(90,37,114,0.3);
}
.uk_linkbt  a {color: white;}
/* CONTENT ENDE*/
/* Breadcrumb */

.breadcrumbs {padding-left: 2.4rem;}

/* Footer (full width, lila) */
.footer {
    background-color: rgba(90,37,114, 1);
    color: white;
    padding: 20px;
    text-align: left;
    width: 100%;
    margin-top: 20px;
}

.footertxt {
    padding-top: 1.5em;
    font-size: 1.1rem;
}
.footertxt a{
    color: white;
}

.fbox-1 {

}
.fbox-2 {
    margin-left: 0.5em;
}
.fbox-3 {

    margin-left: 0.5em;

}
.fbox-4 {
    margin-left: 0.5em;
}

.fbox-5 {
    margin-left: 0.5em;
}
.imglogo{
    padding-left: 1.5em;
    padding-top: 1.5em;
    width: 80%;
}
    .copyright{
        padding-top: 1em;
        text-align: center;

    }

    .copyright a {
        color: white;
        font-size: 1.4rem;
    }

    /* FOOTER ENDE*/
/*SPONSOREN*/

.sponsoren{
    display: grid;
    grid-template-columns: 1fr; /* 1 Box pro Zeile auf Mobile */
    gap: 20px;
    margin: 0 auto;
    padding-top: 1em;
    background-color: rgb(255,255,255);
    color: rgb(0, 0, 0);
    margin-left: 3rem;

}
.sponsortxt{
    margin-left: 0.4rem;
}
.       .sponsor {
    width: 100%;
           /* hier steuerst du die Gesamtbreite */
    margin-inline: auto;
    padding-inline: var(--space-md);
    box-sizing: border-box;
}

/* ==========================
   6 Boxen – CSS Grid Layout
   ========================== */
.boxes-grid {
    display: grid;
    gap: var(--space-lg);            /* Abstand zwischen den Karten */
    grid-template-columns: repeat(6, 1fr); /* Desktop: 6 Spalten */
    align-items: stretch;            /* gleiche Höhe durch Stretching */
    padding-block: var(--space-xl);
}

/* Breakpoints: 3/2/1 Spalte */
@media (max-width: 1199.98px) {
    .boxes-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 991.98px) {
    .boxes-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767.98px) {
    .boxes-grid { grid-template-columns: 1fr; }
    .box {

        /* NEU: Inhalt in der Box zentrieren */
        align-items: center;    /* horizontale Zentrierung für Flex-Items */
        text-align: center;     /* Textmittig */
    }

    .box .actions {
             /* NEU: Buttons/Links zentrieren */
        justify-content: center;

    }
    .fbox {
        justify-content: center;
        align-items: center;    /* horizontale Zentrierung für Flex-Items */
        text-align: center;     /* Textmittig */
    }
    

}

/* =====================
   Card/Box Gestaltung
   ===================== */
.box {
    display: flex;
    flex-direction: column;
    gap: var(--space-sm);
    background: var(--color-bg);
       padding: var(--space-lg);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    min-height: 160px;              /* optional: Grundhöhe */
}

.box:focus-within {
    outline: 2px solid transparent; /* für High-Contrast-Modi */
    box-shadow: var(--color-shadow);
    border-color: rgba(0,0,0,.18);
}

.box:hover {
    transform: translateY(-3px);
    box-shadow: var(--color-shadow);
    border-color: rgba(0,0,0,.18);
}

.box h3 {
    margin: 0;
    font-size: clamp(1rem, 1.8vw, 1.125rem);
    line-height: 1.2;
    color: var(--color-primary);
}

.box p {
    margin: 0;
    color: var(--color-muted);
    flex: 1;                         /* drückt den Link nach unten */
}

.box .actions {
    display: flex;
    gap: var(--space-sm);
    flex-wrap: wrap;
    margin-top: var(--space-sm);
}
/* =====================
   SPONSOREN ANFANG
   ===================== */
.uvk_grid-container {
    display: grid;
    /* Erstellt 4 Spalten, die sich den Platz zu gleichen Teilen (1fr) aufteilen */
    grid-template-columns: repeat(4, 1fr);
    /* Gleicher Abstand zwischen allen Boxen (horizontal und vertikal) */
    gap: 24px;
    max-width: 95%;
    margin: 40px auto;
    padding: 0 20px;
}

/* Die einzelnen Boxen */
.uvk_box {
    background-color: #ffffff;
    padding: 30px 20px;
    text-align: center;
    border-radius: 8px;
    /* Eleganter, leichter Schatten anstelle eines Rahmens
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);*/
    color: #333333;
    font-weight: bold;
}

/* --- RESPONSIVE BREAKPOINTS --- */

/* Für Tablets (unter 992px Breite): Wechsel auf 2 Spalten (2 Boxen pro Zeile) */
@media (max-width: 992px) {
    .uvk_grid-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px; /* Leicht reduzierter Abstand */
    }
}

/* Für Smartphones (unter 576px Breite): Wechsel auf 1 Spalte (alle untereinander) */
@media (max-width: 576px) {
    .uvk_grid-container {
        grid-template-columns: repeat(1, 1fr);
        gap: 16px;
    }
}

/*SPONSOREN ENDE*/
/* ======================
   6. MEDIA QUERIES
   ====================== */

/* Tablet: 600px - 1024px */
@media (min-width: 600px) and (max-width: 1399px) {
    #header {
        height: 70px;
        padding: 0 15px;
    }
    #header-left img { max-height: 50px; }
    #header-right a { font-size: 16px; }
    #header-right li { margin-left: 15px; }
    #slider { height: 500px; }
    #header + #slider { margin-top: 70px; }
    #content, #breadcrumb { margin: 20px 15pt; }
    .diakflag_img{
        height: auto;
        width: 20vw;
    }
    .uk-cards-container {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 3.5rem;
        padding: 3.5rem;
    }
}

/* Desktop: ab 1025px */
@media (min-width: 1025px) {
    #header {
        height: 80px;
        padding: 0 30px;
    }
  /*  .diakflag_img{
        height: auto;
        width: 13vw;
    }*/
    #header-left img { max-height: 60px; }
    #header-right a { font-size: 18px; }
    #header-right li { margin-left: 25px; }
    #slider { height: 600px; }
    #header + #slider { margin-top: 80px; }
    #content, #breadcrumb { margin: 20px 10pt; max-width: 1200px; margin-left: auto; margin-right: auto; }
    #content { padding: 40px; }
}


@media (max-width: 1116px) {
    .uk-card-wrapper {
        flex: 0 0 100%;
        max-width: 100%;
    }
}
/* Extra Large Desktop: ab 1400px (optional) */
@media (min-width: 1400px) {
    #content, #breadcrumb { max-width: 1400px; }
    .diakflag_img{
        height: auto;
        width: 12vw;
    }
    .uk_overlay {
        mask: radial-gradient(55% var(--c) at top,#0000 calc(100% - 1px),#000);
        top: 33em;

    }
    .uk-cards-container {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 3.5rem;
        padding: 3.5rem;
    }
}
/* ===========================================
   Komplettes Custom CSS für Tabs & Accordions
   Regular Labs - Joomla | Lila-Cyan Gradient
   Keine Borders/Icons | Hover-Effekte | Responsive
   =========================================== */

.customcss {
    background-image: linear-gradient(to right, rgba(90,37,114,1) 0%, #00FFFF 100%) !important;
    background-size: 100% 100% !important;
    border: none !important;
    box-shadow: none !important;
}
.uk-customcss{
    border: none !important;
    box-shadow: none !important;
    background-image: linear-gradient(to right, rgba(255,255,255,0.65) 0%,  rgba(0,0,0,0.25) 100%) !important;
}
#rlta-customcss{
    background-image: linear-gradient(to right, rgba(90,37,114,1) 0%, #00FFFF 100%) !important;
    background-size: 100% 100% !important;
    border: none !important;
    box-shadow: none !important;
}

/* Haupt-Container: Horizontaler Gradient Lila zu Cyan */
.rlta-container,
.rlta-tabs,
.rlta-accordions {
    background-image: linear-gradient(to right, rgba(90,37,114,1) 0%, #00FFFF 100%) !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 8px !important; /* Leichte Rundung */
}

/* Tabs/Accordions-Panels */
.rlta-tab,
.rlta-accordion,
.rlta-panel {
    border: none !important;
    box-shadow: none !important;
}
.jem-card-footer{
    font-size: 1.3rem !important;
}
.jem-card-title a {
    color:var(--link-color)!important;
}

.jem-card-title a:hover {
    color:var(--link-color-hover)!important;
}
.jem-venue a {
    color:var(--link-color)!important;
}

.jem-venue a:hover {
    color:var(--link-color-hover)!important;
}
.jem-category a {
    color:var(--link-color)!important;
}

.jem-category a:hover {
    color:var(--link-color-hover)!important;
}

.rlta-panel {
    background-color: rgba(255,255,255,0.95) !important;
    color: #333333 !important;
    border-radius: 0 0 8px 8px !important;
}


/* Titel-Styling: Textfarben & Gradient-Overlay */
.rlta-tab-title,
.rlta-accordion-title {
    background-image: linear-gradient(to right, rgba(90,37,114,0.9), rgba(0,255,255,0.9)) !important;
    color: #ffffff !important; /* Weiß normal */
    border: none !important;
    box-shadow: none !important;
    border-radius: 8px 8px 0 0 !important;
    padding: 15px 20px !important;
    margin: 2px !important;
}

/* Aktiver Zustand */
.rlta-tab-title.rlta-active,
.rlta-accordion-title.rlta-active {
    color: #ffff00 !important; /* Gelb aktiv */
    background-image: linear-gradient(to right, rgba(255,255,0,0.3), rgba(90,37,114,1)) !important;
}

/* Hover-Effekte */
.rlta-tab-title:hover,
.rlta-accordion-title:hover {
   /* color: #00ffff !important; /* Cyan Hover */
    background-image: linear-gradient(to right, rgba(0,255,255,0.4), rgba(90,37,114,1)) !important;
    transform: translateX(5px); /* Leichter Shift */
    transition: all 0.3s ease !important; /* Smooth */
}

/* Icons vollständig entfernen */
.rlta-tab-title::before,
.rlta-tab-title::after,
.rlta-accordion-title::before,
.rlta-accordion-title::after,
.rlta-icon,
[class*="icon-"],
[class^="rlta-icon"] {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* Responsive Mobile-Anpassungen */
@media (max-width: 768px) {
    .rlta-tab-title,
    .rlta-accordion-title {
        margin: 1px !important;
        padding: 12px 15px !important;
        transform: none; /* Kein Shift auf Mobile */
        font-size: 16px !important; /* Größer für Touch */
    }

    .rlta-panel {
        margin: 0 !important;
    }
}

/* Zusätzliche Übergänge für Panimations */
/* Smooth Scroll + Header-Offset (passend zu deinem lila Design [cite:5]) */
html {
    scroll-behavior: smooth;
    scroll-padding-top: 120px; /* Header-Höhe + Puffer [web:8][web:18] */
}



.page-nav ul { list-style: none; padding: 0; }
.page-nav li { margin-bottom: 0.8rem; }
.page-nav a {

    text-decoration: none;
    display: block;
    padding: 0.5rem;
    border-radius: 5px;
    transition: all 0.3s;
}
.page-nav a:hover {
    /* color: #00FFFF; /* Cyan-Hover [cite:5] */
}

.back-to-top {
    display: inline-block;
    margin-top: 1rem;
      font-weight: bold;
    text-decoration: none;
}

/* Responsive Mobile [cite:2] */
@media (max-width: 768px) {
    .page-nav {
        position: static;
        float: none;
        width: auto;
        margin: 1rem 0;
    }
    html { scroll-padding-top: 115px; }
}
/* ===========================================
   Card Besuchs- und Begleitdienst Anfang
   =========================================== */
    :root {
      --ukbbd_bg: #f5f7fb;
      --ukbbd_card: #ffffff;
      --ukbbd_text: #1f2937;
      --ukbbd_muted: #6b7280;
      --ukbbd_primary: #009BDC;
      --ukbbd_primary_hover: rgba(90,37,114, 1);
      --ukbbd_border: #dbe3ef;
      --ukbbd_shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
      --ukbbd_radius: 0;
      --ukbbd_gap: 5%;
    }

    .ukbbd_section {
      max-width: 100%;
      margin: 0 auto;
      padding: 2rem 2rem;
    }

    .ukbbd_grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--ukbbd_gap);
    }

    .ukbbd_card {
      background: var(--ukbbd_card);
      border: 1px solid var(--ukbbd_border);
      border-radius: var(--ukbbd_radius);
      box-shadow: var(--ukbbd_shadow);
      padding: 24px;
      display: flex;
      flex-direction: column;
    }
    .ukbbd_card_icon_wrap {
      display: flex;
      justify-content: center;
      margin-bottom: 16px;
    }

    .ukbbd_card_icon {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      background: var(--ukbbd_icon_bg);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--ukbbd_primary);
    }
    .ukbbd_card_title {
      margin: 0 0 12px;
      font-size: 1.35rem;
    }

    .ukbbd_card_intro {
      margin: 0 0 10px;
      color: var(--ukbbd_muted);
    }

    .ukbbd_accordion_content {
      max-height: 0;

      overflow: hidden;
      transition: max-height 0.35s ease;
    }

    .ukbbd_accordion_content.ukbbd_open {
      max-height: fit-content;
    }

    .ukbbd_accordion_content p {
      margin: 8px 0 0;
    }

    .ukbbd_toggle {
      width: 100%;
      margin-top: 16px;
      padding: 14px 18px;
      border: 1px solid var(--ukbbd_button_border);
      border-radius: 10px;
      background: var(--ukbbd_button_bg);
      color: var(--ukbbd_text);
      font-weight: 700;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      transition: background 0.2s ease, border-color 0.2s ease;
    }
    .ukbbd_toggle_text:hover {
      color: var(--ukbbd_primary_hover);
      text-decoration: none;
    }
        .ukbbd_toggle_text {
      text-align: left;
      color: var(--ukbbd_primary);
                font-size:1rem;
    }




    .ukbbd_toggle::after {
      content: "";
      width: 0;
      height: 0;
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      border-top: 1em solid #009BDC;
      transition: transform 0.2s ease;
      font-size:1rem;
    }
    .ukbbd_toggle::after:hover {
          border-top: 1em solid rgba(90,37,114, 1);
 }
    .ukbbd_toggle.ukbbd_active::after {
      transform: rotate(180deg);
    }
    .ukbbd_contact{
        margin-left: 1%;
        margin-top: 3em;
        font-weight: 700;
    }
    @media (max-width: 900px) {
      .ukbbd_grid {
        grid-template-columns: repeat(2, 1fr);
      }
          .ukbbd_contact{
        margin-left: 1em;
        margin-top: 7em;
    }
    }

    @media (max-width: 600px) {
      .ukbbd_grid {
        grid-template-columns: 1fr;
      }
          .ukbbd_section {
      max-width: 100%;
      margin: 0 auto;
      padding: 1rem 1rem;
    }
    .com-content-article__body{
    margin-left: .5em;
    margin-right:auto;
    margin-top: 2em;
    width: 95vw;
}
    .ukbbd_contact{
        margin-left: 1em;
        margin-top: 7em;
    }
    }
    /* ===========================================
   Card Besuchs- und Begleitdienst ENDE
   =========================================== */
       /* ===========================================
   KISS CARDS 
   =========================================== */
.kisslinksname{

    font-weight: 700;
}
.kisslinkstxt{
 
    font-weight: 500;
}

.kisslinkstxt a{
 
    padding: 0!important;
}

.kissfaq{
    margin-top: 15em;
}
.EngPaten{
    margin-top: 10em;
}
/* ===========================================
   KISS CARDS ENDE
   =========================================== */
/* ===========================================
   Termine
   =========================================== */
   .monthteaser {
    font-size: 0.8em!important;
   }