/* =============================================================================
   custom.css -- Geosys Child Theme
   Site-specific additions and overrides.
   New rules always go here -- never in the other partials.
   ============================================================================= */

/* -- Blog-List: native Bild-Ratio (gesteuert ueber WP-Bildgroesse) ---------- */
.qodef-blog-list .qodef-post-image {
  overflow: hidden;
}
.qodef-blog-list .qodef-post-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* -- Blog-List: 16:9 Widescreen Format -------------------------------------- */
.qodef-blog-list.geosys-img-widescreen .qodef-post-image {
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.qodef-blog-list.geosys-img-widescreen .qodef-post-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

/* -- Blog Single: Featured Image auf 16:9 begrenzen ------------------------- */
.qodef-blog-single .qodef-post-heading .qodef-post-image {
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.qodef-blog-single .qodef-post-heading .qodef-post-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

/* -- Kompetenzen-Sektion: Bild flush (kein WPBakery-Gutter) ----------------- */

.geosys-flush-img .vc_column-inner {
  padding: 0 !important;
}

.geosys-flush-img .vc_column-inner .wpb_single_image {
  margin-bottom: 0 !important;
}

.geosys-flush-img .vc_column-inner .wpb_single_image img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 300px;
  object-fit: cover;
}

/* -- Kompetenzen-Sektion: Bulletliste buendig ------------------------------- */
.vc_col-has-fill ul,
.vc_col-has-fill ol {
  list-style-position: outside;
  padding-left: 1.4em;
  margin-left: 0;
}

.vc_col-has-fill ul li,
.vc_col-has-fill ol li {
  padding-left: 0.3em;
}

/* -- Kompetenzen-Sektion: Flush-Klassen ------------------------------------- */

.geosys-flush-section.qodef-parallax-row-holder,
.geosys-flush-section .qodef-parallax-row-holder {
  overflow: visible !important;
}

.geosys-flush-right {
  transform: translateX(33px) !important;
}

.geosys-flush-left {
  transform: translateX(-33px) !important;
}

.geosys-flush-img-left {
  transform: translateX(-33px) !important;
}

.geosys-flush-img-left .vc_column-inner {
  padding-left: 0 !important;
}

@media (max-width: 1024px) {
  .geosys-flush-right,
  .geosys-flush-left,
  .geosys-flush-img-left {
    transform: none !important;
  }
  .geosys-flush-img-left .vc_column-inner {
    padding-left: 15px !important;
  }
}

/* -- Portfolio Gallery: Volle Breite (Vollbild-Layout) ----------------------- */

.qodef-ps-gallery-layout {
  max-width: 100% !important;
}

.qodef-ps-gallery-layout .qodef-ps-image a {
  display: block;
  width: 100%;
}

.qodef-ps-gallery-layout .qodef-ps-image img {
  width: 100%;
  height: auto;
}

/* -- Portfolio Single: Button-Farbe in Info-Sidebar -------------------------- */

.qodef-portfolio-single-holder .qodef-ps-info-item .qodef-btn.qodef-btn-solid {
  color: #ffffff !important;
}

.qodef-portfolio-single-holder .qodef-ps-info-item .qodef-btn.qodef-btn-underlined::before,
.qodef-portfolio-single-holder .qodef-ps-info-item .qodef-btn.qodef-btn-underlined::after {
  content: none !important;
}

/* -- Portfolio Info: Label + Wert vertikal ausgerichtet ---------------------- */

.qodef-ps-info-item.qodef-ps-custom-field,
.qodef-ps-info-item.qodef-ps-date {
  display: grid !important;
  grid-template-columns: var(--ps-label-width, 90px) 1fr;
  align-items: baseline;
  column-gap: 24px;
}

.qodef-ps-info-item.qodef-ps-tags,
.qodef-ps-info-item.qodef-ps-categories {
  display: block !important;
  position: relative;
  padding-left: calc(var(--ps-label-width, 90px) + 24px) !important;
}

.qodef-ps-info-item.qodef-ps-tags > .qodef-ps-info-title,
.qodef-ps-info-item.qodef-ps-categories > .qodef-ps-info-title {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--ps-label-width, 90px);
  line-height: inherit;
  transform: translateY(0.22em);
}

.qodef-ps-info-item .qodef-ps-info-title {
  grid-column: 1;
  grid-row: 1;
}

.qodef-ps-info-item.qodef-ps-custom-field p,
.qodef-ps-info-item.qodef-ps-date p {
  grid-column: 2;
}

.qodef-ps-info-item .qodef-ps-info-tag,
.qodef-ps-info-item .qodef-ps-info-category {
  display: inline !important;
  margin-right: 0.5em !important;
}

/* -- Portfolio Single: Datum ausblenden -------------------------------------- */

.qodef-ps-info-item.qodef-ps-date {
  display: none !important;
}

/* -- PrettyPhoto Lightbox: Caption im Navigationsbalken ---------------------- */

body .pp_pic_holder .pp_details.geosys-pp-layout {
  display: flex !important;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
}

body .pp_pic_holder .pp_details.geosys-pp-layout .pp_nav {
  flex-shrink: 0;
  width: auto !important;
  display: inline-flex !important;
  gap: 8px;
}

body .pp_pic_holder .pp_details.geosys-pp-layout .pp_description {
  display: block !important;
  flex: 1;
  text-align: center;
  font-size: 13px;
  color: #898989;
  margin: 0;
  padding: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

body .pp_pic_holder .pp_details.geosys-pp-layout .currentTextHolder {
  flex-shrink: 0;
  text-align: right;
  margin: 0;
  white-space: nowrap;
}

/* -- Dropdown-Navigation: Weiss statt Schwarz ------------------------------- */

.qodef-drop-down .narrow .second .inner ul {
  background-color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  padding: 12px 0;
}

.qodef-drop-down .narrow .second .inner ul li ul {
  background-color: #f8f8f8 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.qodef-drop-down .second .inner ul li a {
  color: #878786 !important;
}

.qodef-drop-down .second .inner ul li a:hover,
.qodef-drop-down .second .inner ul li a:hover .item_outer {
  color: #005186 !important;
}

.qodef-drop-down .second .inner ul li.current-menu-item > a,
.qodef-drop-down .second .inner ul li.current-menu-ancestor > a,
.qodef-drop-down .second .inner ul li.current-menu-item > a .item_outer,
.qodef-drop-down .second .inner ul li.current-menu-ancestor > a .item_outer {
  color: #005186 !important;
}

.qodef-drop-down .second .inner ul li a .item_text::before {
  background-color: #005186 !important;
}

/* -- Formidable Forms: Focus-Farben an GeoSys CI anpassen ------------------- */
/* Formidable-Default: rgba(65,153,253,0.6) -- hier GeoSys-Blau #005186       */

.with_frm_style input[type="text"]:focus,
.with_frm_style input[type="email"]:focus,
.with_frm_style input[type="tel"]:focus,
.with_frm_style input[type="url"]:focus,
.with_frm_style input[type="number"]:focus,
.with_frm_style input[type="password"]:focus,
.with_frm_style select:focus,
.with_frm_style textarea:focus {
  border-color: #005186 !important;
  box-shadow: 0 0 0 3px rgba(0, 81, 134, 0.2) !important;
  outline: none !important;
}

/* File-Upload Dropzone Focus/Hover */
.with_frm_style .frm_dropzone:hover,
.with_frm_style .frm_dropzone.dz-drag-hover {
  border-color: #005186 !important;
}

/* Radio/Checkbox Focus */
.with_frm_style input[type="radio"]:focus,
.with_frm_style input[type="checkbox"]:focus {
  box-shadow: 0 0 0 3px rgba(0, 81, 134, 0.2) !important;
}

/* Pflichtfeld-Stern: wurde nach 17170-formidable-style ausgelagert
   (greift site-weit, mit hardcoded #f9af00 statt CSS-Var). */

/* -- Footer: Layout, Ausrichtung, Stripes ----------------------------------- */
/* Struktur (Text-Widget):                                                     */
/*   Column (flex-column)                                                      */
/*     widget.widget_text (flex:1, flex-column)                                */
/*       div.textwidget (flex:1, flex-column)                                  */
/*         div.block.address (flex:1, flex-column)                             */
/*           h3           -> bleibt oben                                       */
/*           p            -> margin-top:auto drueckt Adresse nach unten        */
/*     widget (Stripe)    -> folgt direkt unter der Adresse                    */

.qodef-footer-top-holder .qodef-grid-row {
  display: flex !important;
  flex-wrap: wrap;
}

.qodef-footer-top-holder .qodef-column-content {
  display: flex;
  flex-direction: column;
}

/* Erstes Widget (Adresse) nimmt den verfuegbaren Platz */
.qodef-footer-top-holder .qodef-column-content > .widget:first-child {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Flex-Kette durch textwidget und block.address */
.qodef-footer-top-holder .widget_text .textwidget {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.qodef-footer-top-holder .widget_text .textwidget > .block.address {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Erster Paragraph (Adresse) nach unten, H3 bleibt oben */
.qodef-footer-top-holder .widget_text .textwidget > .block.address > p:first-of-type {
  margin-top: auto;
}

/* Stripe-Divs auf halbe Hoehe */
.qodef-footer-top-holder .stripe {
  height: 12px !important;
}

/* -- Portfolio Single: Slider Split-Layout auf 4:3 -------------------------- */
/* Theme-Layout-Klassen mit "small-" Prefix = Split-Varianten.                 */
/* Ohne Prefix (z.B. qodef-ps-slider-layout) = Vollbild, nicht betroffen.      */
/* Owl-Carousel-Höhen werden explizit auf auto gesetzt, damit aspect-ratio    */
/* greift; img bekommt object-fit:cover -> zentriertes Beschneiden auf 4:3.   */

.qodef-ps-small-slider-layout .qodef-owl-slider,
.qodef-ps-small-slider-layout .owl-stage-outer,
.qodef-ps-small-slider-layout .owl-stage,
.qodef-ps-small-slider-layout .owl-item,
.qodef-ps-small-slider-layout .qodef-ps-image,
.qodef-ps-small-images-layout .qodef-ps-image,
.qodef-ps-small-gallery-layout .qodef-ps-image {
  aspect-ratio: 4 / 3;
  height: auto !important;
}

.qodef-ps-small-slider-layout .qodef-ps-image a,
.qodef-ps-small-slider-layout .qodef-ps-image img,
.qodef-ps-small-images-layout .qodef-ps-image a,
.qodef-ps-small-images-layout .qodef-ps-image img,
.qodef-ps-small-gallery-layout .qodef-ps-image a,
.qodef-ps-small-gallery-layout .qodef-ps-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block;
}

/* -- Portfolio Info: Theme-Farbe der Info-Texte aufheben -------------------- */
/* Theme setzt color:#898989 auf a + p in .qodef-ps-info-item.                */
/* a: Geosys-CI-Link-Farben (blau / hover orange)                            */
/* p: Theme-Grau aufheben, normale Body-Color erben                           */

.qodef-portfolio-single-holder .qodef-ps-info-holder .qodef-ps-info-item a {
  color: var(--gs-career-blue, #005187) !important;
  transition: color 0.2s ease;
}

.qodef-portfolio-single-holder .qodef-ps-info-holder .qodef-ps-info-item a:hover {
  color: var(--gs-career-orange, #f9af00) !important;
}

.qodef-portfolio-single-holder .qodef-ps-info-holder .qodef-ps-info-item p {
  color: unset !important;
}

/* Komma nach Excerpt-Absaetzen unterbinden.                                 */
/* Theme (modules.min.css) setzt .qodef-ps-info-item p::after{content:","} - */
/* gedacht fuer komma-getrennte Taxonomie-LINKS (a), trifft aber den mehr-   */
/* zeiligen Excerpt: jeder Absatz (= jedes Enter via wpautop) bekommt ein    */
/* Komma. Nur fuer <p> aufheben, die a-Trennung bleibt unangetastet.         */
.qodef-portfolio-single-holder .qodef-ps-info-holder .qodef-ps-info-item p::after {
  content: none !important;
}

/* Strich (::before/::after) tiefer setzen — analog der anderen Theme-Links */
.qodef-portfolio-single-holder .qodef-ps-info-holder .qodef-ps-info-item a::before,
.qodef-portfolio-single-holder .qodef-ps-info-holder .qodef-ps-info-item a::after {
  bottom: 0 !important;
}

/* -- Animierte Theme-Link-Linie gezielt ausnehmen --------------------------- */
/* Das Theme (link-styles.php) belegt fast alle <a> mit einer per             */
/* background-image animierten Unterstreichung. Komponenten, in denen der    */
/* Link den ganzen Teaser/das ganze Bild umschliesst, sehen damit falsch aus  */
/* (lange Linie unten am Element). Hier saubere Ausschluesse:                 */
/*   - Modula Gallery Items (z.B. Stellenausschreibung-Galerie)              */
/*   - Career Card Wrapper (Karriere-Uebersicht: ganzer Teaser ist ein <a>)  */

a.modula-item-link,
.modula-item a,
a.geosys-career-card__link {
  background-image: none !important;
  background-size: 0 !important;
}

a.modula-item-link:hover,
.modula-item a:hover,
a.geosys-career-card__link:hover {
  background-image: none !important;
  background-size: 0 !important;
}