.latest-post-section {
    background-color: #fff;
    position: relative;
    /* Use CSS Grid (auto-fit) for responsive columns */
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
  }
  
  .latest-post {height: 24.5rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    /* Provide padding for text, images, etc. */
    padding-bottom: 1rem;
    position: relative;
    /* Allow the button to “stick” to the bottom while the excerpt grows */
    display: flex;
    flex-direction: column;color:#343e5f;
  }
.thumbnail-outer{height: 8rem;}
.latestPostContent{height:16.5rem;bottom:0;width: 100%}

  .latest-post h2{background-color: white; border-top-left-radius: 4px;
    border-top-right-radius: 4px;position: relative;top: -4px ;padding: .5rem;}
  /* Force the image to be 100% wide, 


     and crop overflow if taller than 8rem */

 .latest-post h2 a {color: #343e5f;}    
  .latest-post img {
    width: 100%;
    height:auto;
    max-height: 8rem;      /* Fixed height of 8rem */
    object-fit: cover;      /* Crop/cover the container */
    display: block;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
  }
  
  .thumbnail-outer img{width:100%}
  /* Fade-out effect on the excerpt text */
  .latest-post .entry-excerpt {
    position: relative;
    /* Fill available vertical space so the button can sit at the bottom */
    flex: 1; 
    max-height: 6em;        /* Adjust as needed for lines of text */
    line-height: 1.6;
    overflow: hidden;
    margin-bottom: 10px;
  }
  
  /* Gradient overlay at the bottom of the excerpt */
  .latest-post .entry-excerpt::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2em;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 100%);
  }
  
  .read-more-btn-container{display: flex;justify-content: center;position: absolute;bottom:0;width: 100%;}
  /* Center the Read More button at the bottom */
  .read-more-btn {
    padding: 10px 20px;
  background-color: #343e5f;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s ease;
  position: relative;
  margin: 1rem 1.5rem ;
  border: 2px solid #343e5f;
  }
  
  .read-more-btn:hover {
    background-color: white;
    color: #343e5f;
  }


/* 
// ----------------------------
// 3.1. "standart single styling" SETUP
// ----------------------------
*/




/* Content styling */



#singlePost{background-color: white;padding-top: 2rem;min-height: 100vh;position: relative;margin-top:50vh}

#singlePost .button {background-color: #343e5f;border: 3px solid #343e5f;transition: background-color 0.3s ease;}

#singlePost .button:hover {
  background-color: white;
  color: #343e5f;
}


.postContent {
  
  margin-top: 2.5rem;
  font-size: 16px;
  line-height: 1.6;
  color: #666;
}

.postDate{position: relative; width: 100%; display: flex;justify-content:right; margin: 5rem 0 2rem 0;color:#343e5f }


.button {
  display: inline-block;
  padding: 10px 20px;
  margin-top: 20px;
  background-color: #007BFF;
  color: #ffffff;
  text-decoration: none;
  border-radius: 5px;
}

/* Responsive Media Queries */
@media (max-width: 768px) {
 

 /* MOBILE CONTENT ALIGNMENT */

.BODY .sectionInnerContent {
    width: 100%;
    max-width: 100%;
    padding: 0 1rem;
    margin: 0 auto;
    box-sizing: border-box;
}

  .postContent {
      font-size: 14px;
  }

  .button {
      padding: 8px 16px;
  }
}

@media (max-width: 480px) {
 
  .button {
      width: 100%;
      text-align: center;
      box-sizing: border-box;
  }
}
/* 
// ----------------------------
// 4. "Achtung" CPT SETUP
// ----------------------------
*/



.achtung-post  {position:absolute; bottom:9rem;border: 3px solid #de3730;border-radius: 4px;background-color: white;overflow: hidden;
  width: calc(100% - 4rem );
  
 
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.achtung-thumbnail{position: relative;height: 40vh;display: flex;justify-content: left;width:100%}

.achtung-thumbnail img {
  height: 100%;
  
}

.achtung-content {
  position: relative;
  z-index: 1;
  background-color: white;
  width: calc(100% - 1rem);
  padding: 1rem;
  
}

.achtung-title {position: relative;
  margin-top: 0;
  color: #343e5f;
  width: fit-content;
}
.achtung-title h2 {display: block;width: fit-content;}
.achtung-title r {color:#de3730 }
.r {color:#de3730}
.achtung-underline{border-color: #de3730 }
.achtung-excerpt {
  color: #666;
  font-size: 16px;
  text-align: left;
  width: 100%;
  height: auto;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-top: 1.8rem
}

.achtung-button {
  margin-top: 1.5rem;z-index: 1; position: relative;display: flex;justify-content: right;
}

.achtung-button a {
  padding: 10px 20px;
  background-color: #343e5f;
  color: white;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s ease;
  position: relative;
  margin: .5rem 1.5rem ;
  border: 2px solid #343e5f;
  
}

.achtung-button a:hover {
  background-color: white;
  color:#343e5f;
}

.custom-button {
  background-color: #28a745; /* Green background for custom buttons */
}

.default-button {
  background-color: #17a2b8; /* Blue background for default Mehr Info button */
}


/* 
// ----------------------------
// 5. "Event" CPT SETUP
// ----------------------------
*/
#events{background-color: white;}
#archive{background-color: white;}
.moreEvents {display: flex;justify-content: center;align-items: center;}
.moreEvents a{ height:8rem;aspect-ratio:1/1;border-radius:  50%;background-color: #343e5f;border: 3px solid #343e5f;color: white;display: flex;justify-content: center;align-items: center;font-weight: bold;margin: 1.5rem;transition: background-color 0.3s ease;}
.moreEvents a:hover{background-color: white;color:#343e5f}
/* General styles for the events container */
.events-excerpts {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 20px 0;
  padding: 0;
  list-style: none;
  justify-content: left; /* Centers items horizontally */
}

/* Individual event styling */
.event {
  background-color: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  width: 100%;
  max-width: 19.0625rem; /* Max width of 305px */
  max-height: 32.5rem;
  flex: 1 1 auto; /* Allows flexibility for responsiveness */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Post thumbnail */
.event .post-thumbnail {
  max-height: 200px;
  overflow: hidden;
}

.event .post-thumbnail img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Event content */
.event h3 {
  font-size: 1.25rem;
  margin: 15px 10px 5px;
  color: #333;
}

.event p {
  font-size: 1rem;
  margin: 10px;
  color: #666;
}

.event a.button {
  display: flex;
  justify-content: center;
  margin: 10px;
  padding: 10px 15px;
  font-size: 1rem;
  color: #fff;
  background-color: #343e5f;
  border: none;
  border-radius: 4px;
  text-decoration: none;
  text-align: center;
  border: 2px solid #343e5f;
  transition: background-color 0.3s ease;
}

.event a.button:hover {
  background-color: white;
  color: #343e5f;
}

/* Responsive styles */
@media (max-width: 768px) {
  .events-excerpts {
      gap: 15px; /* Reduce gap on smaller screens */
  }
}

@media (max-width: 480px) {
  .event {
      max-width: 100%; /* Full width for smaller screens */
  }
}


/* 
// ----------------------------
// BOOKING SECTION
// ----------------------------
*/

#bookings {
    background-color: white;
}


/*
Booking cards use the existing
.event styling from the Events section.
*/

.booking-card {
    max-height: none;
}


/*
Allows longer seasonal booking
information without cutting the card off.
*/

.booking-excerpts {
    align-items: stretch;
}


/*
Keep the excerpt readable.
*/

.booking-excerpt {
    line-height: 1.5;
}


/*
Booking archive / homepage button
uses the existing .moreEvents styles.
*/

.moreBookings {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ----------------------------
   MOBILE MORE BUTTON CENTERING
---------------------------- */

@media (max-width: 600px) {

    .events-excerpts > .moreEvents {
        flex: 0 0 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0;
    }

    .events-excerpts > .moreEvents a {
        margin: 1.5rem auto;
    }

}



/* ============================================
   SINGLE POST PAGE LAYOUT
   Achtung + Standart
============================================ */


/* MAIN SECTION */

#singlePost.lts-single-section {
    background-color: #ffffff;
    margin-top: 0;
    padding: 7rem 0 4rem;
    min-height: 0;
    position: relative;
}

#singlePost .sectionInner {
    width: 100%;
    max-width: 1366px;
    margin: 0 auto;
}

#singlePost .sectionInnerContent {
    overflow: visible;
}


/* POST CONTAINER */

#singlePost .lts-single-article {
    width: 100%;
    max-width: 950px;
    margin: 0 auto;

    padding: clamp(1.5rem, 4vw, 3rem);
    box-sizing: border-box;

    background: #ffffff;

    border-radius: 8px;
    border-top: 5px solid #f18619;

    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);

    color: #343e5f;
}


/* ACHTUNG COLOR */

#singlePost .lts-single--achtung {
    border-top-color: #de3730;
}


/* HEADER */

#singlePost .lts-post-header {
    width: 100%;
    margin-bottom: 2rem;
}


/* POST TYPE LABEL */

#singlePost .lts-post-label {
    display: inline-block;

    background-color: #f18619;
    color: white;

    padding: 0.5rem 1rem;
    margin-bottom: 1.5rem;

    font-size: 0.9rem;
    font-weight: 700;

    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

#singlePost .lts-single--achtung .lts-post-label {
    background-color: #de3730;
}


/* TITLE */

#singlePost .lts-post-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.2;

    color: #343e5f;

    margin: 0 0 1.5rem;

    overflow-wrap: anywhere;
}


/* TITLE UNDERLINE */

#singlePost .lts-post-divider {
    width: 100px;
    height: 4px;

    background-color: #f18619;

    border-radius: 2px;
    margin-bottom: 1.5rem;
}

#singlePost .lts-single--achtung .lts-post-divider {
    background-color: #de3730;
}


/* DATE */

#singlePost .lts-post-date {
    font-size: 0.95rem;
    color: #777;
    margin: 0;
}


/* FEATURED IMAGE */

#singlePost .lts-post-featured-image {
    width: 100%;
    margin: 0 0 2rem;

    border-radius: 6px;
    overflow: hidden;
}

#singlePost .lts-post-featured-image img {
    display: block;

    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 480px;

    object-fit: cover;
}


/* CONTENT */

#singlePost .lts-post-content {
    font-size: 1.1rem;
    line-height: 1.8;

    color: #343e5f;

    margin-top: 1.5rem;

    overflow-wrap: anywhere;
}

#singlePost .lts-post-content p {
    margin: 0 0 1.25rem;
}

#singlePost .lts-post-content h2 {
    font-size: 1.75rem;
    line-height: 1.3;

    margin: 2rem 0 1rem;
}

#singlePost .lts-post-content h3 {
    font-size: 1.35rem;

    margin: 1.5rem 0 0.75rem;
}

#singlePost .lts-post-content ul,
#singlePost .lts-post-content ol {
    padding-left: 1.5rem;
    margin: 1rem 0;
}

#singlePost .lts-post-content li {
    margin-bottom: 0.5rem;
}


/* IMAGES INSIDE CONTENT */

#singlePost .lts-post-content img {
    max-width: 100%;
    height: auto;
}

#singlePost .lts-post-content iframe {
    max-width: 100%;
}


/* BOTTOM BUTTONS */

#singlePost .lts-post-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;

    gap: 1rem;
    margin-top: 3rem;
    padding-top: 2rem;

    border-top: 1px solid #ddd;
}


/* BACK BUTTON */

#singlePost .lts-post-back {
    display: inline-block;

    padding: 0.85rem 1.5rem;

    background-color: white;
    border: 2px solid #343e5f;

    color: #343e5f;

    border-radius: 5px;

    font-weight: 700;
    text-decoration: none;

    transition: all 0.3s ease;
}

#singlePost .lts-post-back:hover {
    background-color: #343e5f;
    color: white;
}


/* CUSTOM ACTION BUTTON */

#singlePost .lts-post-action {
    display: inline-block;

    padding: 0.85rem 1.5rem;

    background-color: #343e5f;
    border: 2px solid #343e5f;

    color: white;

    border-radius: 5px;

    font-weight: 700;
    text-decoration: none;

    transition: all 0.3s ease;
}

#singlePost .lts-post-action:hover {
    background-color: white;
    color: #343e5f;
}


/* COMMENTS */

#singlePost .lts-post-comments {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid #ddd;
}


/* ============================================
   TABLET
============================================ */

@media (max-width: 768px) {

    #singlePost.lts-single-section {
        padding-top: 6.5rem;
        padding-bottom: 3rem;
    }

    #singlePost .lts-single-article {
        padding: 1.5rem;
    }

    #singlePost .lts-post-title {
        font-size: 2rem;
    }

    #singlePost .lts-post-content {
        font-size: 1rem;
        line-height: 1.7;
    }

    #singlePost .lts-post-featured-image img {
        max-height: 350px;
    }

}


/* ============================================
   MOBILE
============================================ */

@media (max-width: 480px) {

    #singlePost.lts-single-section {
        padding-top: 6rem;
        padding-bottom: 2rem;
    }

    #singlePost .lts-single-article {
        padding: 1.25rem;
        border-radius: 5px;
    }

    #singlePost .lts-post-title {
        font-size: 1.75rem;
    }

    #singlePost .lts-post-content {
        font-size: 1rem;
    }

    #singlePost .lts-post-bottom {
        flex-direction: column;
        align-items: stretch;
    }

    #singlePost .lts-post-back,
    #singlePost .lts-post-action {
        display: block;
        width: 100%;
        box-sizing: border-box;

        text-align: center;
    }

}

/* ==========================================
   AKTUELLES - LANDING PAGE
========================================== */

#aktuelles {
    background-color: #ffffff;
    padding: 2rem 0 4rem;
}


/* Äußeren Container beibehalten */

#aktuelles .latest-post-section {
    display: block;
    width: 100%;
    margin-top: 1.5rem;
}


/* ==========================================
   CARD GRID
========================================== */

#aktuelles .lts-news-grid {
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 1.5rem;

    width: 100%;
    align-items: stretch;
}


/* ==========================================
   SINGLE CARD
========================================== */

#aktuelles .lts-news-card {
    display: flex;
    flex-direction: column;

    background-color: white;

    border: 1px solid #e5e5e5;
    border-top: 3px solid #f18619;

    border-radius: 8px;

    overflow: hidden;
    min-width: 0;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


/* CARD HOVER */

#aktuelles .lts-news-card:hover {
    transform: translateY(-5px);

    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}


/* ==========================================
   CARD IMAGE
========================================== */

#aktuelles .lts-news-image {
    display: block;

    width: 100%;
    height: 190px;

    overflow: hidden;

    background-color: #f5f5f5;
}

#aktuelles .lts-news-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.3s ease;
}

#aktuelles .lts-news-card:hover .lts-news-image img {
    transform: scale(1.05);
}


/* FALLBACK LOGO */

#aktuelles .lts-news-placeholder {
    object-fit: contain !important;
    padding: 1.5rem;
    box-sizing: border-box;
}


/* ==========================================
   CARD CONTENT
========================================== */

#aktuelles .lts-news-content {
    display: flex;
    flex-direction: column;

    flex: 1;

    padding: 1.5rem;
}


/* DATE */

#aktuelles .lts-news-date {
    font-size: 0.85rem;
    color: #888888;

    margin-bottom: 0.75rem;
}


/* TITLE */

#aktuelles .lts-news-title {
    font-size: 1.4rem;
    line-height: 1.3;

    font-weight: 700;

    margin: 0 0 1rem;

    color: #343e5f;
}

#aktuelles .lts-news-title a {
    color: #343e5f;
    text-decoration: none;
}

#aktuelles .lts-news-title a:hover {
    color: #f18619;
}


/* DESCRIPTION */

#aktuelles .lts-news-excerpt {
    font-size: 1rem;

    line-height: 1.6;

    color: #555555;

    margin: 0 0 1.5rem;

    overflow-wrap: anywhere;
}


/* ==========================================
   MEHR INFO BUTTON
========================================== */

#aktuelles .lts-news-button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 0.5rem;

    align-self: flex-start;

    margin-top: auto;

    padding: 0.75rem 1.5rem;

    background-color: #343e5f;
    color: white;

    border: 2px solid #343e5f;
    border-radius: 5px;

    font-weight: 700;
    font-size: 0.95rem;

    text-decoration: none;

    transition: all 0.3s ease;
}


/* BUTTON HOVER */

#aktuelles .lts-news-button:hover {
    background-color: white;
    color: #343e5f;
}


/* ==========================================
   MEHR ANZEIGEN
========================================== */

#aktuelles .lts-news-more {
    margin-top: 2.5rem;
}


/* SHOW MORE BUTTON */

#aktuelles .lts-news-more-button {
    display: table;

    margin: 0 auto;

    padding: 0.85rem 2rem;

    background-color: #f18619;

    color: white;

    border: 2px solid #f18619;
    border-radius: 5px;

    font-size: 1rem;
    font-weight: 700;

    cursor: pointer;
    list-style: none;

    transition: all 0.3s ease;
}

#aktuelles .lts-news-more-button::-webkit-details-marker {
    display: none;
}


/* BUTTON HOVER */

#aktuelles .lts-news-more-button:hover {
    background-color: white;
    color: #f18619;
}


/* HIDE COLLAPSE TEXT */

#aktuelles .lts-more-close {
    display: none;
}


/* WHEN OPEN */

#aktuelles .lts-news-more[open] .lts-more-open {
    display: none;
}

#aktuelles .lts-news-more[open] .lts-more-close {
    display: inline;
}


/* ADDITIONAL CARDS */

#aktuelles .lts-news-grid-extra {
    margin-top: 2rem;
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 1000px) {

    #aktuelles .lts-news-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 650px) {

    #aktuelles {
        padding: 1.5rem 0 3rem;
    }

    #aktuelles .lts-news-grid {
        grid-template-columns: 1fr;
    }

    #aktuelles .lts-news-card {
        width: 100%;
    }

    #aktuelles .lts-news-image {
        height: 200px;
    }

    #aktuelles .lts-news-content {
        padding: 1.25rem;
    }

    #aktuelles .lts-news-title {
        font-size: 1.25rem;
    }

    #aktuelles .lts-news-button {
        width: 100%;
        box-sizing: border-box;
    }

}


/* REDUCED MOTION */

@media (prefers-reduced-motion: reduce) {

    #aktuelles .lts-news-card,
    #aktuelles .lts-news-image img,
    #aktuelles .lts-news-button {
        transition: none;
    }

}

/* ============================================
   AKTUELLES - CLEAN CARD INTERACTIONS
============================================ */


/* REMOVE CARD HOVER MOVEMENT */

#aktuelles .lts-news-card,
#aktuelles .lts-news-card:hover {
    transform: none;
    transition: none;

    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}


/* REMOVE IMAGE ZOOM */

#aktuelles .lts-news-image img,
#aktuelles .lts-news-card:hover .lts-news-image img {
    transform: none;
    transition: none;
}


/* REMOVE TITLE COLOR CHANGE */

#aktuelles .lts-news-title a:hover {
    color: #343e5f;
}





/* ============================================
   ALL POSTS BUTTON
   SAME DESIGN AS FAQ / BOOKINGS
============================================ */


/* Make sure the card grid and button stack vertically */

#aktuelles .latest-post-section {
    display: block;
    width: 100%;
}


/* CENTER ALL POSTS BUTTON */

#aktuelles .lts-news-all {

    display: flex;

    justify-content: center;
    align-items: center;

    width: 100%;

    margin-top: 2rem;
}


/* CIRCULAR BUTTON */

#aktuelles .lts-news-all a {

    display: flex;

    justify-content: center;
    align-items: center;

    text-align: center;

    line-height: 1.3;

   
}


/* ARCHIVE PAGE SPACING */

#aktuelles.lts-news-archive-section {
    padding-top: 8rem;
    padding-bottom: 5rem;
}


/* MOBILE */

@media (max-width: 600px) {

    #aktuelles .lts-news-all {
        margin-top: 1.5rem;
    }

    #aktuelles.lts-news-archive-section {
        padding-top: 6rem;
        padding-bottom: 3rem;
    }

}

/* ============================================
   ACHTUNG - LANDING PAGE REDESIGN
============================================ */


/* OUTER SECTION */

.achtung-excerpter {
    width: 100%;
    box-sizing: border-box;

    display: flex;
    justify-content: center;

    padding: 2rem 1rem;

    background-color: #ffffff;

    position: relative;
    z-index: 2;
}


/* ============================================
   ACHTUNG CARD
============================================ */

.achtung-excerpter .achtung-post {

    /* Reset old absolute positioning */
    position: relative;
    bottom: auto;

    display: grid;

    grid-template-columns:
        44px
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 1.5rem;

    width: 100%;
    max-width: 1100px;

    box-sizing: border-box;

    margin: 0;
    padding: 1.5rem 2rem;

    background-color: #ffffff;

    border: 1px solid #efd4d4;
    border-left: 5px solid #de3730;

    border-radius: 10px;

    box-shadow:
        0 4px 18px rgba(52, 62, 95, 0.09);

    overflow: hidden;
}


/* ============================================
   WARNING SYMBOL
============================================ */

.achtung-excerpter .achtung-symbol {

    display: flex;

    align-items: center;
    justify-content: center;

    width: 44px;
    height: 44px;

    border-radius: 50%;

    background-color: #de3730;
    color: #ffffff;

    font-size: 1.6rem;
    font-weight: 800;
    line-height: 1;

    flex-shrink: 0;
}


/* ============================================
   CONTENT
============================================ */

.achtung-excerpter .achtung-content {

    position: relative;

    width: auto;
    min-width: 0;

    padding: 0;
    margin: 0;

    background: transparent;

    box-sizing: border-box;

    color: #343e5f;
}


/* SMALL RED LABEL */

.achtung-excerpter .achtung-label {

    display: block;

    margin-bottom: 0.4rem;

    color: #de3730;

    font-size: 0.8rem;
    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: 1px;
}


/* ============================================
   TITLE
============================================ */

.achtung-excerpter .achtung-heading {

    color: #343e5f;

    font-size: clamp(1.25rem, 2vw, 1.65rem);
    font-weight: 700;

    line-height: 1.3;

    margin: 0 0 0.5rem;

    overflow-wrap: anywhere;
}


/* ============================================
   DESCRIPTION
============================================ */

.achtung-excerpter .achtung-excerpt {

    font-size: 1rem;

    line-height: 1.6;

    color: #536079;

    text-align: left;

    width: 100%;
    height: auto;

    margin: 0;

    overflow-wrap: anywhere;
}


/* ============================================
   MEHR INFO BUTTON
============================================ */

.achtung-excerpter .achtung-button {

    display: flex;

    align-items: center;
    justify-content: center;

    position: relative;

    margin: 0;
    padding: 0;

    z-index: 1;
}


/* BUTTON */

.achtung-excerpter .achtung-button a {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    white-space: nowrap;

    margin: 0;

    padding: 0.85rem 1.5rem;

    background-color: #343e5f;
    color: #ffffff;

    border: 2px solid #343e5f;
    border-radius: 5px;

    font-size: 0.95rem;
    font-weight: 700;

    text-decoration: none;

    box-sizing: border-box;

    transition: none;

    transform: none;
}


/* NO HOVER ANIMATIONS */

.achtung-excerpter .achtung-button a:hover {

    background-color: #343e5f;
    color: #ffffff;

    border-color: #343e5f;

    transform: none;
    transition: none;
}


/* KEYBOARD FOCUS */

.achtung-excerpter .achtung-button a:focus-visible {

    outline: 3px solid #de3730;

    outline-offset: 3px;
}


/* ============================================
   TABLET
============================================ */

@media (max-width: 900px) {

    .achtung-excerpter {

        padding: 1.5rem 1rem;

    }

    .achtung-excerpter .achtung-post {

        grid-template-columns:
            40px
            minmax(0, 1fr);

        padding: 1.5rem;

        gap: 1rem;
    }

    .achtung-excerpter .achtung-symbol {

        width: 40px;
        height: 40px;

    }

    .achtung-excerpter .achtung-button {

        grid-column: 1 / -1;

        justify-content: flex-end;

    }

}


/* ============================================
   MOBILE
============================================ */

@media (max-width: 600px) {

    .achtung-excerpter {

        padding: 1.25rem 1rem;

    }

    .achtung-excerpter .achtung-post {

        grid-template-columns:
            32px
            minmax(0, 1fr);

        padding: 1.25rem;

        gap: 0.75rem;

        border-radius: 8px;

    }

    .achtung-excerpter .achtung-symbol {

        width: 32px;
        height: 32px;

        font-size: 1.2rem;

    }

    .achtung-excerpter .achtung-label {

        font-size: 0.75rem;

        letter-spacing: 0.6px;

    }

    .achtung-excerpter .achtung-heading {

        font-size: 1.2rem;

    }

    .achtung-excerpter .achtung-excerpt {

        font-size: 0.95rem;

        line-height: 1.55;

    }

    .achtung-excerpter .achtung-button {

        grid-column: 1 / -1;

        width: 100%;

        margin-top: 0.5rem;

    }

    .achtung-excerpter .achtung-button a {

        width: 100%;

        text-align: center;

    }

}
/* ============================================
   ACHTUNG - ORIGINAL LANDING POSITION
============================================ */


/* POSITION INSIDE THE HERO */

#home .achtung-home-slot {
    position: absolute;

    bottom: 9rem;
    left: 1rem;
    right: 1rem;

    z-index: 10;

    display: flex;
    justify-content: center;
    align-items: center;

    margin: 0;
    padding: 0;
}


/* REMOVE EXTRA SECTION SPACING */

#home .achtung-home-slot .achtung-excerpter {
    position: static;

    display: flex;
    justify-content: center;

    width: 100%;

    margin: 0;
    padding: 0;

    background: transparent;
}


/* KEEP THE NEW CARD DESIGN */

#home .achtung-home-slot .achtung-post {
    position: relative;

    bottom: auto;
    left: auto;

    width: 100%;
    max-width: 1100px;

    margin: 0;

    background: #ffffff;

    border: 1px solid #efd4d4;
    border-left: 5px solid #de3730;

    border-radius: 10px;

    box-shadow: 0 4px 18px rgba(52, 62, 95, 0.09);
}


/* ============================================
   NORMAL TEXT STYLING
============================================ */


/* WICHTIGER HINWEIS - NORMAL TEXT */

#home .achtung-label {
    display: block;

    color: #343e5f;

    font-size: 1rem;
    font-weight: 400;

    text-transform: none;
    letter-spacing: normal;

    line-height: 1.5;

    margin: 0 0 0.4rem;

    padding: 0;

    background: transparent;
}


/* POST TITLE */

#home .achtung-heading {
    color: #343e5f;

    font-size: clamp(1.2rem, 2vw, 1.5rem);
    font-weight: 600;

    text-transform: none;
    letter-spacing: normal;

    line-height: 1.4;

    margin: 0 0 0.5rem;
}


/* DESCRIPTION */

#home .achtung-excerpt {
    color: #536079;

    font-size: 1rem;
    font-weight: 400;

    line-height: 1.6;

    margin: 0;

    text-align: left;
}


/* ============================================
   KEEP THE BUTTON DESIGN
============================================ */

#home .achtung-button a,
#home .achtung-button a:hover {
    background: #343e5f;
    color: #ffffff;

    border: 2px solid #343e5f;
    border-radius: 5px;

    transform: none;
    transition: none;

    text-decoration: none;
}


/* ============================================
   MOBILE
============================================ */

@media (max-width: 600px) {

    #home .achtung-home-slot {
        bottom: 9rem;

        left: 0.5rem;
        right: 0.5rem;
    }

    #home .achtung-home-slot .achtung-post {
        padding: 1rem;
        gap: 0.75rem;
    }

    #home .achtung-label {
        font-size: 0.9rem;
    }

    #home .achtung-heading {
        font-size: 1.15rem;
    }

    #home .achtung-excerpt {
        font-size: 0.9rem;
        line-height: 1.5;
    }

}/* ============================================
   ACHTUNG - RED BUTTON WITH HOVER EFFECT
============================================ */

/* NORMAL BUTTON */
#home .achtung-button a {
    background-color: #de3730;
    color: #ffffff;

    border: 2px solid #de3730;
    border-radius: 5px;

    text-decoration: none;

    transition: background-color 0.3s ease,
                color 0.3s ease;

    transform: none;
}

/* HOVER EFFECT */
#home .achtung-button a:hover {
    background-color: #ffffff;
    color: #de3730;

    border-color: #de3730;

    transform: none;
}

/* KEYBOARD FOCUS */
#home .achtung-button a:focus-visible {
    outline: 3px solid #343e5f;
    outline-offset: 3px;
}
/* ============================================
   AKTUELLES - SHOW ONLY 1 POST ON MOBILE
============================================ */

@media (max-width: 650px) {

    /* Display one card per row */
    #aktuelles .lts-news-grid {
        grid-template-columns: 1fr;
    }

    /* Hide all posts except the newest one */
    #aktuelles:not(.lts-news-archive-section)
    .latest-post-section > .lts-news-grid
    > .lts-news-card:nth-child(n+2) {
        display: none;
    }

    /* Make the visible card full width */
    #aktuelles .lts-news-card {
        width: 100%;
        max-width: 100%;
    }

    /* Keep the Alle Beiträge button centered */
    #aktuelles .lts-news-all {
        display: flex;
        justify-content: center;
        margin-top: 2rem;
    }

}
/* ACHTUNG - MAX WIDTH */

#home .achtung-home-slot .achtung-post {
    width: 100%;
    max-width: 900px;
    margin-left: 0;
    
}