@charset "utf-8";
/* CSS Document */
/* 1. BASE / MOBILE HEIGHT (Applies when screen is < 768px) */
/* This rule has high specificity and wins immediately on small screens. */
.hero-pub {
  position: relative;
  width: 100%;
  max-width:1400px ;
  height: 200px;
  padding-left: 0rem;
  padding-right: 0rem;
	
  overflow: hidden;
}

/* 2. DESKTOP HEIGHT (Only applies when screen is >= 768px) */
@media (min-width: 768px) {
    
    /* Set the specific desktop height here */
    .hero-pub {
        height: 300px !important;
    }
    
    /* Ensure the slider wrapper and children also inherit the specific height */
    #hero-pub .hero-slider,
    #hero-pub .hero-static,
    #hero-pub .hero-static img {
        height: 300px !important;
    }
}






 #publications {
      padding: 2rem 0;
      background: #ffffff;
    }

    /* Hauptüberschrift */
    #publications .section-title {
      font-family: "ff-dax", "ff-dax-pro", sans-serif;
      color: #630922;
      font-size: 1.35rem;
      letter-spacing: 0.08rem;
      margin-bottom: 2rem;
      font-weight: 400;
      text-align: left;
    }

    /* Tabs */
    /* Tabs */
    #publications .tabs {
      display: flex;
      justify-content: flex-start;
      gap: 1.2rem;
      margin-bottom: 3rem;
      /* Remove existing flex-wrap: wrap; and add scroll properties */
      flex-wrap: nowrap; /* NEW: Keep tabs in a single row */
      overflow-x: auto; /* NEW: Enable horizontal scrolling */
      -webkit-overflow-scrolling: touch; /* NEW: Enable smooth scrolling on iOS */
      /* NEW: Hide scrollbar on Firefox (Standard CSS) */
    scrollbar-width: none;
		  border-bottom: 1px solid #EFEBEB;
    }

    /* Optional: Hide scrollbar for cleaner look on Webkit browsers (like mobile Safari/Chrome) */
    #publications .tabs::-webkit-scrollbar {
        display: none;
		
    }


    /* Tab-Buttons (now H3s) */
    #publications .tab-btn {
      font-family: "ff-dax", "ff-dax-pro", sans-serif;
      background: none;
      border: none;
      color: #4E7294;
      font-size: 1.07rem;
		font-weight: 400;
      letter-spacing: 0.04rem;
      cursor: pointer;
      padding-bottom: 0.4rem;
      border-bottom: 2px solid transparent;
      transition: all 0.2s ease;
      text-align: left;
    }

    /* Additional style for H3 tabs to reset default heading margins */
    #publications .tab-btn-h3 {
        margin: 0;
        /* Ensure the H3 tab buttons don't have excessive vertical space */
        display: block; /* To apply the styles consistently */
    }

    #publications .tab-btn:hover {
      color: #630922;
    }

    #publications .tab-btn.active {
      color: #630922;
      border-bottom: 2px solid #630922;
    }

    /* Tab-Content */
    #publications .tab-content {
      display: none;
    }

    #publications .tab-content.active {
      display: block;
    }

    /* Content-Spalte – ca. 45% Breite in voller Ansicht */
    #publications .news-section {
      max-width: 800px;
      margin: 0;
      text-align: left;
    }

    #publications .text-content {
      font-size: 1rem;
      line-height: 1.2;
      margin-bottom: 1.8rem;
    }

    /* Listen */
    #publications .press-items,
    #publications .event-items {
      display: grid;
      gap: 2rem;
    }

    /* UNIFIED LIST ITEM STYLING */
    #publications .press-item,
    #publications .event-item {
      padding-left: 1rem;
      text-align: left;
		transition: opacity 0.3s ease;
    }

    /* DELETED: Event-Header (was used for date/location layout) */
    /* DELETED: JAHRESZAHL / DATUM */
    /* DELETED: Blaue Unterüberschrift (Medium / Ort) - now only for publication name */
    
    /* Event-Header: Datum links, Location rechts */
    #publications .event-header {
      display: flex; /* Keeping this, though the content is gone, in case it is used elsewhere */
      justify-content: space-between;
      align-items: baseline;
      gap: 1rem;
    }
    
    /* JAHRESZAHL / DATUM – DAX, wie Fließtext, weight 400, schwarz */
    /* Removed: #publications .press-date, #publications .event-date */

    /* Blaue Unterüberschrift (Medium / Ort) */
    #publications .press-publication,
    /* Removed: #publications .event-location */
    #publications .event-location {
      font-family: "jost";
		
      font-size: 0.95rem;
      color: #4E7294;
      margin-bottom: 0.25rem;
    }
    /* Note: .press-publication is correctly kept as it contains the source medium in Fachaufsätze.
             .event-location is technically removed, but its selector is left empty to clean up */


    /* Titel */
    #publications h4 {
      font-family: "jost", sans-serif;
      color: #2B2728;
      font-size: 1rem;
      margin: 0.5rem 0;
      letter-spacing: 0rem;
      font-weight: 450;
		line-height:1.2;
		border-left: 3px solid #630922;
		padding-left: 6px;
		margin-left:-9px;
    }

    #publications p {
      font-size: 0.98rem;
      line-height: 1.2;
    }

    /* Info-Box */
    #publications .info-box {
      background: #f8f8f8;
      padding: 1.2rem 1.5rem;
      border-radius: 6px;
      margin-top: 2rem;
    }

    #publications .info-box h4 {
      font-family: "ff-dax", "ff-dax-pro", sans-serif;
      color: #630922;
      margin-bottom: 0.6rem;
      font-size: 1.1rem;
    }

    #publications .info-box a {
      color: #4E7294;
      text-decoration: none;
      font-weight: 500;
    }

    #publications .info-box a:hover {
      color: #630922;
      text-decoration: underline;
    }

    /* NEU: "Mehr"-Links in Signature Blau / Hover Rot in den Posts */
    #publications .press-item a,
    #publications .event-item a {
      color: #4E7294;
    }

    #publications .press-item a:hover,
    #publications .event-item a:hover {
      color: #630922;
    }

   /* In publications-styles.css ergänzen */

/* Der Container für die Liste */
#publications .press-items, 
#publications .event-items {
    position: relative;
    transition: max-height 0.5s ease-in-out;
}

/* Der Fading-Effekt: Greift nur, wenn NICHT expanded */
#publications .tab-content:not(.expanded) .press-items,
#publications .tab-content:not(.expanded) .event-items {
    /* Erzeugt einen transparenten Verlauf am unteren Ende (ca. 100px hoch) */
    -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}

/* Sobald expanded aktiv ist, wird die Maske entfernt */
#publications .tab-content.expanded .press-items,
#publications .tab-content.expanded .event-items {
    -webkit-mask-image: none;
    mask-image: none;
}

    /* "Mehr anzeigen" Button */
    #publications .show-more-btn {
      margin-top: 1.5rem;
      background: none;
      border: 1px solid #4E7294;
      color: #4E7294;
      font-family: "ff-dax", "ff-dax-pro", sans-serif;
      font-size: 0.95rem;
      letter-spacing: 0.06rem;
      padding: 0.3rem 0.7rem;
      cursor: pointer;
      border-radius: 4px;
      transition: all 0.2s ease;
    }

    #publications .show-more-btn:hover {
      border-color: #630922;
      color: #630922;
    }

    /* RESPONSIVE: Spalte auf voller Breite bei schmalen Screens */
    @media (max-width: 900px) {
      #publications .news-section {
        max-width: 100%;
      }
    }