.elementor-kit-6{--e-global-color-primary:#195EC6;--e-global-color-secondary:#FF8223;--e-global-color-text:#000000;--e-global-color-accent:#00BDAA;--e-global-color-6211ef7:#FFF0B5;--e-global-color-ac3f4f7:#E6F7F1;--e-global-color-053eacc:#D6FCE5;--e-global-color-9719b15:#648BC6;--e-global-color-be8c0b7:#FFFFFF;--e-global-color-0681933:#E0FFB5;--e-global-color-62eb6ed:#D4F0FC;--e-global-typography-primary-font-family:"Host Grotesk";--e-global-typography-primary-font-size:3em;--e-global-typography-primary-font-weight:400;--e-global-typography-primary-text-transform:none;--e-global-typography-primary-font-style:normal;--e-global-typography-primary-line-height:1.05em;--e-global-typography-secondary-font-family:"Host Grotesk";--e-global-typography-secondary-font-size:1.6em;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-font-style:normal;--e-global-typography-secondary-line-height:1.25em;--e-global-typography-text-font-family:"Host Grotesk";--e-global-typography-text-font-size:1em;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Host Grotesk";--e-global-typography-accent-font-size:0.92em;--e-global-typography-accent-font-weight:500;--e-global-typography-accent-line-height:1em;--e-global-typography-856f313-font-family:"Host Grotesk";--e-global-typography-856f313-font-size:1em;--e-global-typography-856f313-font-weight:600;--e-global-typography-856f313-font-style:normal;--e-global-typography-856f313-line-height:1.25em;--e-global-typography-139c5f6-font-size:0.71em;--e-global-typography-139c5f6-font-weight:400;--e-global-typography-139c5f6-font-style:normal;--e-global-typography-139c5f6-line-height:1.25em;--e-global-typography-ae81838-font-family:"Host Grotesk";--e-global-typography-ae81838-font-size:1.6em;--e-global-typography-ae81838-line-height:1.25em;color:var( --e-global-color-text );font-family:"Host Grotesk", Sans-serif;font-size:28px;font-weight:400;text-transform:none;font-style:normal;text-decoration:none;line-height:1.25em;word-spacing:-1px;}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{background-color:var( --e-global-color-be8c0b7 );color:var( --e-global-color-text );}.elementor-kit-6 button:hover,.elementor-kit-6 button:focus,.elementor-kit-6 input[type="button"]:hover,.elementor-kit-6 input[type="button"]:focus,.elementor-kit-6 input[type="submit"]:hover,.elementor-kit-6 input[type="submit"]:focus,.elementor-kit-6 .elementor-button:hover,.elementor-kit-6 .elementor-button:focus{background-color:#FFFFFF00;color:var( --e-global-color-text );}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 h1{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );font-style:var( --e-global-typography-primary-font-style );line-height:var( --e-global-typography-primary-line-height );}.elementor-kit-6 h2{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );font-style:var( --e-global-typography-secondary-font-style );line-height:var( --e-global-typography-secondary-line-height );}.elementor-kit-6 h3{font-family:var( --e-global-typography-856f313-font-family ), Sans-serif;font-size:var( --e-global-typography-856f313-font-size );font-weight:var( --e-global-typography-856f313-font-weight );font-style:var( --e-global-typography-856f313-font-style );line-height:var( --e-global-typography-856f313-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1920px;}.e-con{--container-max-width:1920px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.elementor-widget:not(:last-child){--kit-widget-spacing:0px;}.elementor-element{--widgets-spacing:0px 0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1520px){.elementor-kit-6{--e-global-typography-primary-font-size:2.6em;--e-global-typography-ae81838-font-size:1.16em;font-size:26px;}.elementor-kit-6 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-kit-6 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}.elementor-kit-6 h3{font-size:var( --e-global-typography-856f313-font-size );line-height:var( --e-global-typography-856f313-line-height );}}@media(max-width:1280px){.elementor-kit-6{--e-global-typography-ae81838-font-size:1em;font-size:24px;}}@media(max-width:920px){.elementor-kit-6{--e-global-typography-primary-font-size:2.5em;--e-global-typography-ae81838-font-size:1.4em;}.elementor-kit-6 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-kit-6 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}.elementor-kit-6 h3{font-size:var( --e-global-typography-856f313-font-size );line-height:var( --e-global-typography-856f313-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{--e-global-typography-primary-font-size:2.3em;--e-global-typography-secondary-font-size:1.5em;--e-global-typography-ae81838-font-size:1.1em;font-size:22px;}.elementor-kit-6 h1{font-size:var( --e-global-typography-primary-font-size );line-height:var( --e-global-typography-primary-line-height );}.elementor-kit-6 h2{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );}.elementor-kit-6 h3{font-size:var( --e-global-typography-856f313-font-size );line-height:var( --e-global-typography-856f313-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.verlauf .elementor-button:hover{
    background-color: transparent;
    background-image: linear-gradient(155deg, #FF8223 0%, #00BDAA 40%, #195EC6 90%);
}
.button-verlauf .elementor-button{
    background-color: transparent;
    background-image: linear-gradient(155deg, #FF8223 0%, #00BDAA 40%, #195EC6 90%);
}
#kontakt .text-link a{
    color:black;
}

/************ Buttons Navigation ****************************/

#mobileMenu .elementor-button {
    text-align: left;
}

#mobileMenu .elementor-button-content-wrapper {
    justify-content: flex-start; 
}

#mobileMenu .elementor-button-text {
    text-align: left;
}

.elementor-element-694b29f .elementor-button-text {
    text-align: right;
}
/************ hover Logo ****************************/

/* Basis-Styling für den Hover-Effekt */
.elementor-element-7d04711 a, .chatbudy a {
    display: inline-block;
    position: relative;
}

.elementor-element-7d04711 img, .chatbudy img {
    transition: opacity 0.3s ease;
}

/* Hover-Effekt mit neuem Bild */
.elementor-element-7d04711 a:hover img {
    content: url('/wp-content/uploads/2026/01/OS_Logo_Verlauf.png');
}
.chatbudy a:hover img {
    content: url('/wp-content/uploads/2026/01/ooohmbuddy.png');
}
/************ Inhalt ****************************/
.inhalt p a, .inhalt li a{
    color: black;
    text-decoration: underline;
    text-underline-offset: 5px;
    text-decoration-thickness: 2px;
}
 ul, ol{
    padding-left: 1em;
}
.inhalt li{
    margin-block-end: 15px; 
}

.inhalt li:first-child{
    margin-block-start: 15pxx;
}
/************ Menu ****************************/

 #mobileMenu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 20;
    transform: translateY(-100vh);
    opacity: 0.9;
    transition: transform 0.8s ease-out, opacity 0.8s ease-out;
    overflow: hidden;
  }

  /* Button Basis */
  .button-menu-open, .button-menu-open:focus, .button-menu-open:hover .button-menu-open:visited, .button-menu-open.active{
      border-radius: 7px !important;
    font-family: var(--e-global-typography-accent-font-family), Sans-serif;
    font-size: var(--e-global-typography-accent-font-size);
    font-weight: var(--e-global-typography-accent-font-weight);
    line-height: var(--e-global-typography-accent-line-height);
    border-radius: 7px 7px 7px 7px;
    padding: 7px 10px 7px 10px;
  }
   .button-menu-open, .button-menu-open:focus, .button-menu-open:visited{
    background: #fff;
    color:black;
          border: solid 2px black;
  }
  .button-menu-open {
    width: auto;
    height: auto;
    position: relative;
    cursor: pointer;
  }
  .button-menu-open.active,  .button-menu-open:hover{
    background-color: transparent;
    background-image: linear-gradient(155deg, #FF8223 0%, #00BDAA 40%, #195EC6 90%);
    color: white!important;
    border: solid 2px white
}
/* ================================================
   OMBUDSSTELLE BS – NAVIGATION CSS 
   ================================================ */
/* ------------------------------------------------
   PANELS: Positionierung & Animation
   ------------------------------------------------ */
.ombuds-nav__submenu {
    position: relative; /* Anker für absolute Panels */
}

.ombuds-nav__panel {
    display: none !important;
    opacity: 0;
}

/* Der äußere Container ohne Padding */
#ombudsNav {
    position: relative !important;
}
/* DESKTOP: Wir lassen Elementor die Arbeit machen */
@media (min-width: 921px) {
    .ombuds-nav__panel.is-open {
        display: flex !important;
        opacity: 1 !important;
    }
}

@media (max-width: 920px) {
    /* Der Container, der alle Untermenüs hält */
    .ombuds-nav__submenu {
        position: static !important; /* Deaktiviert die relative Positionierung hier */
    }

    /* Das eigentliche Panel */
    .ombuds-nav__panel {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important; /* Nimmt die volle Höhe des Menüs ein */
        min-height: 100vh; /* Sicherheitshalber für mobile */
        background: #ffffff !important; 
        z-index: 9999 !important; /* Ganz nach oben */
        display: none !important;
        padding: 20px;
    }

    .ombuds-nav__panel.is-open {
        display: flex !important;
        opacity: 1 !important;
    }
}

/* Slide Out Animation */
.slideOutRight {
    animation: slideOutRightCustom 0.4s forwards ease-in;
}

@keyframes slideOutRightCustom {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(100%); opacity: 0; }
}


/* Farben & Hover Effekte */
#mobileMenu .ombuds-nav__item.is-active .elementor-button,
#mobileMenu .ombuds-nav__item.is-active .elementor-button-icon svg path {
    color: #00BDAA !important;
    fill: #00BDAA !important;
}
/************ Formular ****************************/

#kontaktformular .klein{
    font-size: 16px;
    line-height: 1em;
}
.e-form__indicators{
    width: 120px;
}
 .elementor-16 .elementor-element.elementor-element-a31b7b0 .e-form__buttons__wrapper__button-previous:hover{
    color: black!important;
}
.elementor-field-type-textarea.elementor-field-group.elementor-column.elementor-field-group-feld_anliegen.elementor-col-100.elementor-field-required{
    margin-bottom: 40px!important;
}

@media (max-width: 767px) {
#kontaktformular .elementor-field-group-field_7c2cdb6{
    display: none;
}
}
.elementor-field-group.elementor-column.elementor-field-type-submit.elementor-col-100.e-form__buttons{
    margin-top: 30px;
}

/* Radio Button Feld - Abstand unten */
.elementor-field-type-radio {
    margin-bottom: 50px !important;
}

/* Radio Button Container Styling */
.elementor-field-type-radio .elementor-field-subgroup {
    display: flex;
    gap: 40px;
    align-items: center;
}

/* Radio Button Option Wrapper */
.elementor-field-type-radio .elementor-field-option {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Radio Button Label */
.elementor-field-type-radio .elementor-field-option label {
    cursor: pointer;
    font-size: 16px;
    color: #000;
    margin: 0;
}

/* Verstecke den Standard Radio Button */
.elementor-field-type-radio input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 30px;
    height: 30px;
    border: 2px solid #333;
    border-radius: 50%;
    background-color: #E6F7F1;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: all 0.2s ease;
    margin: 0;
}

/* Radio Button Hover */
.elementor-field-type-radio input[type="radio"]:hover {
    border-color: #00a0d2;
}

/* Radio Button Selected State */
.elementor-field-type-radio input[type="radio"]:checked {
    border-color: #00a0d2;
    background-color: #E6F7F1;
}

/* Inner Circle when selected */
.elementor-field-type-radio input[type="radio"]:checked::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 14px;
    height: 14px;
    background-color: #00a0d2;
    border-radius: 50%;
}

/* Focus State für Accessibility */
.elementor-field-type-radio input[type="radio"]:focus {
    outline: 2px solid #00a0d2;
    outline-offset: 2px;
}

/* Placeholder Text Farbe */
.elementor-field-group input::placeholder,
.elementor-field-group textarea::placeholder {
    color: #648BC6 !important;
    opacity: 1 !important;
}

/* Firefox Placeholder */
.elementor-field-group input::-moz-placeholder,
.elementor-field-group textarea::-moz-placeholder {
    color: #648BC6 !important;
    opacity: 1 !important;
}

/* Eingegebener Text - Schwarz */
.elementor-field-group input,
.elementor-field-group textarea,
.elementor-field-group select {
    color: #000 !important;
}

/************ Fallbeispiele Akkordeon ****************************/

/* Inhalt standardmäßig ausblenden */
.fallbeispiel-inhalt {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease-in-out, opacity 0.3s ease;
  opacity: 0;
}

/* Inhalt wenn aufgeklappt */
.fallbeispiel-inhalt.active {
  max-height: 5000px; /* Großzügiger Wert für lange Inhalte */
  opacity: 1;
  transition: max-height 0.5s ease-in-out, opacity 0.3s ease 0.1s;
}

/* Icon-Rotation */
.elementor-element-ebc980a .elementor-icon {
  transition: transform 0.3s ease;
  cursor: pointer;
}

.accordion-open .elementor-element-ebc980a .elementor-icon {
  transform: rotate(180deg);
}

/* Hover-Effekt für bessere UX */
.elementor-element-23958c8:hover {
  cursor: pointer;
}

.elementor-element-ebc980a .elementor-icon-wrapper:hover .elementor-icon {
  opacity: 0.7;
}
/************ Fallbeispiele  ****************************/
.fallbeispiel-inhalt h3, .fallbeispiel h3{
    margin-top: 50px;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Host Grotesk';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://ombudsstelle-bs.ch/wp-content/uploads/2026/01/HostGrotesk-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Host Grotesk';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://ombudsstelle-bs.ch/wp-content/uploads/2026/01/HostGrotesk-SemiBold.ttf') format('truetype');
}
/* End Custom Fonts CSS */