/******************* 01. Font Implementation *******************/
/*
@font-face {
  font-family: 'open_sansregular';
  src: url('../../Fonts/OpenSans/OpenSans-Regular-webfont.eot');
  src: url('../../Fonts/OpenSans/OpenSans-Regular-webfont.eot?#iefix') format("embedded-opentype"),
  url('../../Fonts/OpenSans/OpenSans-Regular-webfont.woff') format('woff'),
  url('../../Fonts/OpenSans/OpenSans-Regular-webfont.ttf') format('truetype'),
  url('../../Fonts/OpenSans/OpenSans-Regular-webfont.svg##{$font-name-normal}') format('svg');
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'open_sansbold';
  src: url('../../Fonts/OpenSans/OpenSans-Bold-webfont.eot');
  src: url('../../Fonts/OpenSans/OpenSans-Bold-webfont.eot?#iefix') format("embedded-opentype"),
  url('../../Fonts/OpenSans/OpenSans-Bold-webfont.woff') format('woff'),
  url('../../Fonts/OpenSans/OpenSans-Bold-webfont.ttf') format('truetype'),
  url('../../Fonts/OpenSans/OpenSans-Bold-webfont.svg##{$font-name-bold}') format("svg");
  font-style: normal;
  font-display: swap;
}
*/

@font-face {
  font-family: 'Roboto Flex Regular';
  font-style: normal;
  font-weight: normal;
  src: local('Roboto Flex Regular'), url('../../Fonts/Roboto/RobotoFlex[GRAD,XOPQ,XTRA,YOPQ,YTAS,YTDE,YTFI,YTLC,YTUC,opsz,slnt,wdth,wght].woff') format('woff');
}

/******************* 02. Variable Declarations *******************/
:root {

  /*** Fonts,see also Font Implementation at to top of this file ***/
  --font-family-normal: 'Roboto Flex Regular', verdana, arial, helvetica, sans-serif;
  --font-weight-normal: 400;
  --font-variation-settings: 'wdth' 120, 'wght' 400;

  --font-family-bold: 'Roboto Flex Regular', verdana, arial, helvetica, sans-serif;
  --font-weight-bold: 550;
  --font-variation-settings-bold: 'wdth' 120, 'wght' 550;

  /*** Colors begin ***/

  /* Links/Menus/Buttons */
  --color1: #0026a8;
  --color2: #000F42;

  /* Decoration*/
  --color3: #ff9635;
  --color4: #9a031e;

  /* Rene */
  --color5: #cbd401;
  --color6: #016728;

  /* Gray Scale */
  --black: #000;
  --gray1: #222;
  --gray2: #666;
  --gray3: #999;
  --gray4: #ccc;
  --gray5: #eee;
  /* Rene Schriftfarbe */
  --gray6: #454545;
  --white: #fff;
  --white-opacity: rgba(255, 255, 255, 0.9);

  /* Rene Überschriften, Footer, Textboxen Green Scale */
  --black: #000;
  --green1: #cbd401;
  --green2: #016728;
  --green3: #0a5a0c;

   /* Rene Layout Background */
  --magenta: #ec008c; /* Magenta */
  --darkgreen: #006338; /* Dunkelgrün */
  --green4: #cbd400; /* Hellgrün */
  --gray7: #f1f1f1; /* Hellgrau */
  --darkgrey: #454545; /* Dunkelgrau */
  
  
  --white: #fff;
  --white-opacity: rgba(255, 255, 255, 0.9);

  /* Rene Icons, Suche Magenta Scale */
  --magenta1: #ec008c;

  /* Message Colors */
  --error: #ba0202;
  --error-light: #fff2f2;
  --valid: #5abc55;
  --valid-light: #e8f6e7;
  --warning: #ffc800;
  --warning-light: #fffae8;
  --information: #0080ff;
  --information-light: #ecf5fe;

  /*** Colors end ***/

  /*** Basic Sizes ***/

  /* Basic horizontal spaces */
  --base-html-size: 16px;
  --body-font-size: 1rem; /* 16px*/

  --base-size: 1.5rem;
  --base-size-double: 3rem;
  --base-size-triple: 4.5rem;
  --base-size-half: 0.75rem;
  --base-size-quarter: 0.375rem;
  --base-size-eighth: 0.1875rem;

  /* Basic vertical spaces */
  --gutter: 1.5rem;
  --gutter-double: 3rem;
  --gutter-triple: 4.5rem;
  --gutter-half: /*0.75rem*/ 0;
  --gutter-quarter: 0.375rem;
  --gutter-eighth: 0.1875rem;

  /* Borders */
  --border-width: 2px;
  --border-radius: 2px;

  --transition: .3s ease-in-out;


  /******************* 03. Property Declarations, Individual Layout *******************/

  /* Max. Height of Logo in Header (--logo-height) on Website
  Rendered File height is defined in TypoScript Constants on Root Page. Adjust value if necessary
  Example: --logo-height: 150px;
  */
  /* Rene */
  /*--logo-height: calc(var(--base-size, 16px) * 3); */
  --logo-height: calc(var(--base-size, 16px) * 5);

  /* Body */
  /* Rene Schriftfarbe */
  /* --font-color: var(--gray1); */
  --font-color: var(--gray6);
  --font-color-light: var(--gray2);
  --font-color-h1: var(--green1);
  --font-color-h2: var(--green2);
  --body-bg-color: var(--white);

  /* Body links */
  /* Rene */
  /* --body-link-color: var(--color1); */
  --body-link-color: var(--color5);
  --body-link-color2: var(--white);
  --body-link-color3: var(--color6);
  /* --body-link-hover-color: var(--color2); */
  --body-link-hover-color: var(--color6);
  --body-link-invers-color: var(--gray4);
  --body-link-invers-hover-color: var(--white);
  --body-link-text-decoration: underline;
  --body-link-text-decoration-color: var(--gray4);
  --body-link-text-decoration-thickness: 1px;
  --body-link-underline-offset: 3px;

  /* Page Header */
  --header-bg-color: var(--white);
  --header-bg-overlay: var(--white-opacity);
  --header-color: var(--font-color);
  --header-link-color: var(--body-link-color);
  --header-link-hover-color: var(--body-link-hover-color);
  --header-service-height: var(--logo-height, calc(var(--base-size, 16px) * 3));
  --mobile-logo-height: calc(var(--base-size, 16px) * 3);
  --nav-header-height: calc(var(--base-size, 16px) * 2);
  --header-height: calc(var(--header-service-height) + var(--nav-header-height));
  --header-height-fixed: calc(var(--base-size, 16px) * 2);

  --header-button-color: var(--white);
  --header-button-hover-color: var(--white);
  --header-button-bg: var(--body-link-color);
  --header-button-hover-bg: var(--body-link-hover-color);
  --header-button-border: var(--body-link-color);
  --header-button-hover-border: var(--body-link-hover-color);

  /* Page Footers */
  /* --footer-bg: var(--gray2); */
  --footer-bg: var(--gray3);
  --footer-color: var(--white);
  --footer-link-color: var(--gray5);
  --footer-link-hover-color: var(--body-link-invers-hover-color);

  --footer2-bg: var(--gray1);
  --footer2-color: var(--white);
  --footer2-link-color: var(--body-link-invers-color);
  --footer2-link-hover-color: var(--body-link-invers-hover-color);

  /* Fonts sizes depending on display size */
  --base-html-size-small: var(--base-html-size);
  --base-html-size-medium: calc(var(--base-html-size) * 1.125);
  --base-html-size-large: calc(var(--base-html-size) * 1.1875);

  /* Font sizes - https://type-scale.com/ Perfect Fourth, 1.333 */
  --font-size1: 2.369rem; /* h1 */
  --line-height1: var(--base-size-double);
  --font-size2: 1.777rem; /* h2 */
  --line-height2: calc(var(--base-size) * 1.5);
  --font-size3: 1.333rem; /* h3 */
  --line-height3: calc(var(--base-size) * 1.25);
  --font-size4: 1.125rem; /* h4 */
  --font-size5: var(--body-font-size); /* h5 */
  --font-size-small: calc(var(--body-font-size) * 0.8);
  --line-height-small: calc(var(--body-font-size) * 0.8);

  /* Headers h1-h5 */
  --header-font-family: var(--font-family-bold);
  --header-font-weight: var(--font-weight-bold);
  /* Rene Headers h1-h5 */
  /* --header-font-color: var(--font-color-light); */
  --header-font-color: var(--font-color-h1);
  : var(--font-color-h2);
  --header-font-variation-settings: var(--font-variation-settings-bold);

  /* Buttons primary */
  --button-color: var(--white);
  --button-hover-color: var(--white);
  --button-bg: var(--body-link-color);
  --button-hover-bg: var(--body-link-hover-color);
  --button-border: var(--body-link-color);
  --button-hover-border: var(--body-link-hover-color);

  /* Buttons secondary */
  --button2-color: var(--body-link-color);
  --button2-hover-color: var(--white);
  --button2-bg: var(--white);
  --button2-hover-bg: var(--body-link-hover-color);
  --button2-border: var(--body-link-color);
  --button2-hover-border: var(--body-link-hover-color);

  /* Tables: border color and cell borders.*/
  --table-border-color: var(--gray3);
  --table-hover-color: var(--font-color);
  --table-hover-bg: var(--gray5);
  --table-header-bg: var(--gray5);
  --table-header-color: var(--font-color);
  --stripedblock-bg: var(--gray5);

  /* Default Border */
  --border-color: var(--gray3);

  /* Image Border Option for Editors*/
  --image-border-color: var(--border-color);
  --image-border-width: var(--border-width);

  /* Layout Option for Editors*/
  /* --layout-100-bg: var(--gray5); */
  --layout-100-bg: var(--gray7);
  --layout-110-bg: var(--darkgreen);
  --layout-120-bg: var(--green4);
  --layout-130-bg: var(--magenta);
  --layout-140-bg: var(--darkgrey);

  /* Toggle Content Header Frame Option */
  --toggle-bg: var(--gray5);

  /* Paddíng for all boxes with background */
  --padding-boxes: var(--base-size) var(--gutter);

  --box-shadow: rgba(0, 0, 0, 0.2);


  /***** Content Element: Hero Text over image options *****/
  --hero-text-light: var(--white);
  --hero-text-dark: var(--black);
  --hero-text-bg-light: rgba(255, 255, 255, 0.9);
  --hero-text-bg-dark: rgba(0, 0, 0, 0.7);
  --hero-text-shadow-dark: 1px 1px 1px var(--black);
  --hero-text-shadow-light: 1px 1px 1px var(--white);

  /***** Navigation smartmenu *****/

  /* Navigation background over whole browser width */
  /* Rene Menü Hintergrund */
  /* --menu-bg-100vw: var(--gray5, #eee); */
  --menu-bg-100vw: var(--green1, #eee);


  --menu-font-family: var(--font-family-normal);

  /*Mobile Items separators*/
  --collapsible-separators-color: rgba(0, 0, 0, 0.05);
  /*Toggle button (sub menu indicators)*/
  --collapsible-toggle-bg: var(--white-opacity);
  --collapsible-submenu-bg: rgba(var(--gray4), 0.1);

  /* 1.level Menu */
  --menu-link-color: var(--white);
  --menu-link-hover-color: var(--green3);
  /* Rene Menü Hintergrund */
  /* --menu-bg: var(--gray5); */
  --menu-bg: var(--green1);
  --menu-hover-bg: var(--gray5);
  --menu-current-bg: var(--white);
  --menu-arrow-color: var(--gray6);

  /* 2.level Menu */
  /* Rene Untermenü Farbe */
  /* --submenu-link-color: var(--body-link-color); */
  --submenu-link-color: var(--gray6);
  /* --submenu-link-hover-color: var(--font-color); */
  --submenu-link-hover-color: var(--white);
  --submenu-current-color: var(--white);
  --submenu-bg: var(--white);
  /* --submenu-hover-bg: var(--white); */
  --submenu-hover-bg: var(--green1);
  --submenu-current-bg: var(--green1);
  --submenu-arrow-color: var(--gray6);
  --desktop-submenu-border-color: var(--border-color);

  /* Hamburger Icon for Mobile Menu */
  /* Rene */
  /* --menu-icon-button: var(--body-link-color); */
  --menu-icon-button: var(--white);
____________________________________________________________  
/* Luis Anpassungen  */ 
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
/*Text und Titel im Slider mittig stellen*/
.cb-swiper-lightbox__caption {
  display: flex;
  flex-direction: column;
  justify-content: center; /* vertikal */
  align-items: center;     /* horizontal */
  text-align: center;
  height: 100%;
}

.cb-swiper-lightbox,
.cb-swiper-lightbox__slide {
  height: 100%;
}

.cb-swiper-lightbox__caption {
    justify-content: center;
    align-items: center;
    text-align: center;
  }

.cb-swiper-lightbox__title {
  margin-bottom: 0.5em;
}

.cb-swiper-lightbox__text {
  max-width: 70%;
}

/* Slider Pfeilsymbole weiter in die Mitte rücken*/

.swiper-button-prev,
.swiper-button-next {
  top: 50%;
  transform: translateY(-50%);
}

.swiper-button-prev {
  left: 1em;   /* Wert erhöhen = weiter Richtung Mitte */
  color:
}

.swiper-button-next {
  right: 1em;
}

/*Abstand bei Boxen der Standorte unten aufheben*/

.ce-textpic img {
  display: block;
}

#c267 {
  border-bottom: 8px solid #ec008c;
  border-left: 8px solid #ec008c;
  border-right: 8px solid #ec008c;
}
  
#c268 {
  margin-bottom:30px !important;
  border-bottom: 8px solid #006338;
  border-left: 8px solid #006338;
  border-right: 8px solid #006338;
}
  
#c272 {
  margin-bottom:0 !important;
}

#c273 {
  margin-bottom:0 !important;
}

#c297 {
  margin-bottom:0 !important;
}

#c296 {
  margin-bottom:30px !important;
  border-bottom: 8px solid #006338;
  border-left: 8px solid #006338;
  border-right: 8px solid #006338;
}

#c299 {
  border-bottom: 8px solid #ec008c;
  border-left: 8px solid #ec008c;
  border-right: 8px solid #ec008c;
}

#c300 {
  margin-bottom:0 !important;
}

.wrapper-logo img {
  padding:10px;
}

.cb-swiper-lightbox__caption {
background: none;/*linear-gradient( to bottom, rgba(0,0,0,0.45), rgba(0,0,0,0.25) );*/
}
*/
#cb-swiper-lightbox__title {
  color:#fff;
}
  
.cb-swiper-lightbox__title {
  /*font-size: calc(70px*.9) !important;*/
  text-shadow: black 2px 2px 10px !important;
  color: var(--white);
  /*line-height:65px;*/
}

.cb-swiper-lightbox__text {
  /*font-size: calc(35px*.9) !important;*/
  /*line-height:34px;*/
  text-shadow: black 1px 1px 7px !important;
}


  
_________________________________________________________________  
  /* Rene spezielle Definitionen */


/* Aufzählungspunke Abstände */
.tile-contents li {
    /* padding-bottom: var(--base-size-half); */
  padding-bottom: 0px;
}


/* Texte als Blocksatz */
xbody p {
x    text-align: justify;
x    hyphens: auto;
x    -webkit-hyphens: auto;
x    -ms-hyphens: auto;
x    text-align-last: center;
x}

/* Texte Kontakt u. Ordination Linksbündig */
.hero-text .ce-bodytext p{
    text-align: left;
    text-align-last: left;
}

/* Texte Footer Linksbündig */
#c24 p{
    text-align: left;
    text-align-last: left;
}




  /**
 * Google Opening Hours - Design Styles
 * Version: 2.0.0
 * 
 * Include this CSS in your site or copy the relevant parts to your own stylesheet.
 */

/* ============================================== */
/* DESIGN: COMPACT                                */
/* ============================================== */

.goh-design-compact {
    font-size: 0.95rem;
}

.goh-compact-line {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.25rem 0;
}

.goh-compact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.goh-compact-icon svg {
    display: block;
}

.goh-compact-icon--open {
    color: #1a7f37;
}

.goh-compact-icon--closed {
    color: #c2185b;
}

.goh-compact-line--open .goh-compact-text {
    color: #1a7f37;
}

.goh-compact-line--closed .goh-compact-text {
    color: #57606a;
}

/* ============================================== */
/* DESIGN: COMPACT WITH PHONE                     */
/* ============================================== */

.goh-design-compact-phone {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.5rem;
    font-size: 0.95rem;
}

.goh-cphone-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.goh-cphone-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.goh-cphone-icon svg {
    display: block;
}

.goh-cphone-item--open .goh-cphone-icon,
.goh-cphone-item--open .goh-cphone-text {
    color: #1a7f37;
}

.goh-cphone-item--closed .goh-cphone-icon {
    color: #c2185b;
}

.goh-cphone-item--closed .goh-cphone-text {
    color: #57606a;
}

.goh-cphone-item--phone .goh-cphone-icon {
    color: #1a7f37;
}

.goh-cphone-item--phone .goh-cphone-text {
    color: #57606a;
}

.goh-cphone-item--phone a {
    color: inherit;
    text-decoration: none;
}

.goh-cphone-item--phone a:hover {
    text-decoration: underline;
}

/* ============================================== */
/* DESIGN: MINIMAL (one-liner)                    */
/* ============================================== */

.goh-design-minimal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.5rem;
    font-size: 0.95rem;
}

.goh-minimal-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.goh-minimal-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.goh-minimal-icon svg {
    display: block;
}

.goh-minimal-item--open .goh-minimal-icon,
.goh-minimal-item--open .goh-minimal-text {
    color: #1a7f37;
}

.goh-minimal-item--closed .goh-minimal-icon {
    color: #c2185b;
}

.goh-minimal-item--closed .goh-minimal-text {
    color: #57606a;
}

.goh-minimal-item--phone .goh-minimal-icon {
    color: #1a7f37;
}

.goh-minimal-item--phone .goh-minimal-text {
    color: #57606a;
}

.goh-minimal-item--phone a {
    color: inherit;
    text-decoration: none;
}

.goh-minimal-item--phone a:hover {
    text-decoration: underline;
}


/* ============================================== */
/* DESIGN: GOOGLE STYLE                           */
/* ============================================== */

.goh-design-google {
    font-size: 0.9rem;
}

.goh-google-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    padding: 0.25rem 0;
}

.goh-google-label {
    color: #5f6368;
}

.goh-google-status {
    font-weight: 500;
}

.goh-google-status--open {
    color: #1a7f37;
}

.goh-google-status--closed {
    color: #cf222e;
}

.goh-google-separator {
    color: #9aa0a6;
}

.goh-google-next {
    color: #5f6368;
}

/* ============================================== */
/* DESIGN: STANDARD                               */
/* ============================================== */

.goh-design-standard {
    font-size: 1rem;
    color: #ffffff;
}

.goh-place {
    margin-bottom: 1rem;
}

.goh-place address {
    font-style: normal;
    margin-top: 0.25rem;
    color: #ffff;
}

.goh-contact {
    margin-bottom: 1rem;
}

.goh-contact__item {
    margin-bottom: 0.25rem;
}

.goh-status {
    margin-bottom: 0.5rem;
}

.goh-status--open {
    color: #cbd400;
    font-weight: 500;
}

.goh-status--closed {
    color: #cbd400;
    font-weight: 500;
}

.goh-next {
    color: #57606a;
    font-weight: normal;
}

.goh-today {
    margin-bottom: 0.5rem;
}

.goh-week {
    margin-top: 0.5rem;
}

.goh-week__row {
    display: flex;
    padding: 0.15rem 0;
    border-bottom: 1px solid #f0f0f0;
}

.goh-week__row:last-child {
    border-bottom: none;
}

.goh-week__day {
    min-width: 150px;
    font-weight: 500;
}

.goh-week__time {
    color: #ffffff;
}

/* ============================================== */
/* COMMON / FALLBACK                              */
/* ============================================== */

.goh-fallback,
.goh-error {
    color: #57606a;
    font-style: italic;
}



/* ============================================== */
/* GOOH im Header                           */
/* ============================================== */
/* Google Opening Hours – Header 1:1 */
.goh-header-inline{
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin-right: 1rem;
  white-space: nowrap;
  font-size: .95rem;
  color: #3a8b2c;
}
.goh-header-inline__item{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}
.goh-header-inline__icon{
  font-size: .95em;
}
.goh-header-inline__sep{
  opacity: .35;
  margin: 0 .1rem;
}
.goh-header-inline__link{
  color: inherit;
  text-decoration: none;
}
.goh-header-inline__link:hover{
  text-decoration: underline;
}

/* GOH Header – Feinpositionierung wie Screenshot */
.header-service .goh-header-inline{
  position: relative;
  left: -330px;   /* weiter nach links */
  top: 60px;      /* etwas nach unten */
}

/* Bezugspunkt */
.header-service{
  position: relative;
}

/* Standard: ausgeblendet (alles < 1150px) */
.header-service .goh-header-inline{
  display: none;
}

  
/* GOH Heute geöffnet ausgeblendet nur am Handy anzeigen */
#c275 {
     display: none !important;
}


/* Aufzählung UL zentrieren, Text korrekt links am Bullet ausgerichtet */
xul{
x  display: inline-block;     /* gesamte Liste zentrierbar */
x  text-align: left;          /* Text linksbündig */
x  margin: 0 auto;
x  padding-left: 1.4em;       /* Abstand Bullet → Text */
x  list-style-position: outside;
x}

/* LI-Feintuning */
xul li{
x  margin: .35em 0;           /* vertikaler Abstand */
x}

/* Optional: Bullet-Abstand minimal anpassen */
xul li::marker{
x  font-size: 1em;
x}

/* Nummerierte Liste zentrieren */
/* Nummerierte Liste zentrieren */
xol{
x  display: inline-block;     /* Liste selbst zentrierbar */
x  margin: 0 auto;
x  text-align: left;          /* Text linksbündig */
x  padding-left: 2.2em;       /* Abstand Zahl → Text */
x  list-style-position: outside;
x}

/* LI-Abstand */
xol li{
x  margin: .35em 0;
x}

/* Optional: Feintuning der Nummer */
xol li::marker{
x  font-weight: normal;
x}



  
h2 {
   color: var(--green2);
   }

  /* Suche */  
.search-hide-btn {
color: var(--header-link-color);
color: var(--header-link-hovder-color);
}

  /* Schnellmenü */  
.contact-toolbar {
  position: fixed;
  right: 0;
  top: 40%;
  z-index: 9999;
}

.contact-item {
  display: flex;
  align-items: center;
  background: #005faa;
  color: #fff;
  padding: 12px;
  margin-bottom: 6px;
  text-decoration: none;
  border-radius: 4px 0 0 4px;
  transition: transform 0.3s;
}

.contact-item:hover {
  transform: translateX(-10px);
}

.contact-item i {
  margin-right: 8px;
}

/* Inhalt zentrieren */  
x.content-main {
text-align: center;
}

/* Überschriften */  
h1 {
text-transform: uppercase;
}

/* Überschriften Karten */  
h3 {
text-transform: uppercase; 
}

.card h4 {
    color: #0a5a0c; 
}

.header-image img {
height: auto;
}


/* Bild Karten hover Effekt*/  
.cb-card-group .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    xborder: solid var(--border-width) var(--gray3);
    border: solid 1px var(--gray3);
    border-radius: 0;
    color: var(--gray1);
    background: var(--white);
    width: 100%;
    height: 100%;
}


.card {
  position: relative;
}

.card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(186, 213, 43, 0.45);
  opacity: 0;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.card:hover::after {
  opacity: 1;
}

.card::after {
  inset: 0 0 auto 0;
  height: 195px; /* Bildhöhe */
}

/* Layout */  
.frame-layout-110 h2 {
  color: #ffffff;
}

.frame-layout-110 p:last-child {
  margin-bottom: -10;
}

.frame-layout-110 p {
  color: #ffffff;
}




/* Andere Ausgabegeräte (Tablet, Mobiltelefon) */
@media screen and (min-width:2000px) {

}

@media screen and (min-device-width: 2560px) and (min-width: 1700px) {

}

/* Social Media Icons im Footer: Abstand zwischen Icons */
#c186 .flex-container > div {
    margin-right: 12px;
}

/* Lupensymbol (Suche) in Magenta + Hover Dunkelgrün */
.search-hide-btn .fa {
    color: #ec008c !important;
    transition: color 0.2s;
}

.search-hide-btn:hover .fa {
    color: #0a5a0c !important;
}

@media screen and (max-width: 1920px) {
  
}

@media screen and (max-width: 1506px) {

}

/* Ab 1150px anzeigen und exakt platzieren */
@media (min-width: 1150px) {
  .header-service .goh-header-inline {
    display: inline-flex;
    position: absolute;
    right: 0;
    top: 0;
    transform: translate(-180px, 60px); /* deine ermittelten Werte */
    z-index: 5;
    white-space: nowrap;
  }
}  

@media screen and (max-width: 960px) {

}

/* Galaxy S7+ Hochformat */
@media screen and (max-width: 850px) {

    /* Mobile Menü: Schrift größer */
    .sm-clean a {
        font-size: 1.2rem !important;
    }

    .sm-clean ul a {
        font-size: 1.1rem !important;
    }

    /* Burger-Icon (3 Striche + X) in Magenta */
    .main-menu-btn-icon,
    .main-menu-btn-icon:before,
    .main-menu-btn-icon:after {
        background: #ec008c !important;
    }

    /* Mobile Menü: Schriftfarbe Dunkelgrün */
    .sm-clean a {
        color: #0a5a0c !important;
    }

    /* Mobile Menü: Aktiv/Current = Magenta */
    .sm-clean a.current,
    .sm-clean a.active,
    .sm-clean a.highlighted,
    .sm-clean a:hover,
    .sm-clean a:focus {
        color: #ec008c !important;
    }
}

@media screen and (min-width: 769px) {
  #main-menu > li:first-child > a {
    padding-left: 15px;
  }
}

/* Beratungstool (gj_booking) - Schrift mobil größer */
@media screen and (max-width: 768px) {
    /* Schritt-Überschriften */
    .gj-booking-step h3 {
        font-size: 1.65rem;
    }

    .gj-booking-step h4 {
        font-size: 1.25rem;
    }

    /* Auswahlkarten (Beratungsgrund) */
    .gj-booking-reason-title {
        font-size: 18px;
    }

    .gj-booking-reason-desc {
        font-size: 15px;
    }

    /* Progress-Labels */
    .gj-booking-progress-label {
        font-size: 13px;
    }

    /* Formularfelder */
    .gj-booking-field label {
        font-size: 16px;
    }

    .gj-booking-field input[type="text"],
    .gj-booking-field input[type="email"],
    .gj-booking-field input[type="tel"],
    .gj-booking-field textarea {
        font-size: 17px;
    }

    /* Zeitslots */
    .gj-booking-timeslot {
        font-size: 17px;
    }

    /* Kalender-Wochentage */
    .gj-booking-calendar-weekday {
        font-size: 15px;
    }

    /* Kalender-Tage */
    .gj-booking-calendar-day {
        font-size: 16px;
    }

    /* Checkboxen / Datenschutz */
    .gj-booking-checkbox-label,
    .gj-booking-toggle-label {
        font-size: 16px;
    }

    /* Buttons */
    .gj-booking-btn {
        font-size: 17px;
    }

    /* Zusammenfassung */
    .gj-booking-summary dt,
    .gj-booking-summary dd {
        font-size: 16px;
    }

    .gj-booking-summary-section h4 {
        font-size: 16px;
    }

    /* Fehlermeldungen */
    .gj-booking-error {
        font-size: 16px;
    }

    /* Erfolgs-Info */
    .gj-booking-success-info {
        font-size: 16px;
    }
}

/* Galaxy S25 Hochformat */
@media screen and (max-width: 480px) {
    #c275 {
    display: block !important;
    background: var(--layout-100-bg);
    padding: var(--padding-boxes);
    margin-bottom: var(--base-size);
    display: flex;
    align-items: center;     /* vertikal */
    justify-content: center; /* horizontal */
        display: inline-block;
  text-align: center;
    } 




  
  
    /* Burger-Menü etwas von links einrücken */
    .main-menu-btn {
        left: var(--gutter) !important;
    }
}

/* Dunkles Design  */
@media (prefers-color-scheme: dark) {
  
}



  

  
}