/* Zusätzliche CSS-Regeln für das Styling des Custom Sorted Pages Shortcodes */
.custom-page-grid {
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
    justify-content: space-between; /* Verteilt die Items gleichmäßig */
}

.custom-page-inner-wrap {
    flex: 1 1 30%; /* Drei Spalten auf Desktop */
    max-width: 30%; /* Stellt sicher, dass die Boxen nicht breiter werden */
    margin: 10px;
    background: #fff;
    border: 1px solid #e1e1e1;
    padding: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    box-sizing: border-box; /* Damit das Padding korrekt berücksichtigt wird */
    text-decoration: none; /* Entfernt die Standard-Linkformatierung */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@media (max-width: 1024px) {
    .custom-page-inner-wrap {
        flex: 1 1 45%; /* Zwei Spalten auf Tablets */
        max-width: 45%;
    }
}

@media (max-width: 768px) {
    .custom-page-inner-wrap {
        flex: 1 1 100%; /* Eine Spalte auf Smartphones */
        max-width: 100%;
    }
}

.custom-page-inner-wrap:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

.custom-page-image img {
    width: 100%; /* Bilder auf 100% der Elternbreite skalieren */
    height: auto; /* Höhe automatisch anpassen */
    max-width: 100%; /* Stellt sicher, dass Bilder nicht zu groß werden */
    display: block;
    margin: 0 auto; /* Zentriert das Bild innerhalb des Containers */
}

.custom-page-title {
    font-size: 1.5em;
    margin-bottom: 10px;
    text-decoration: none; /* Entfernt die Unterstreichung */
}

.custom-page-title span {
    color: #e07a5f !important; /* Orange Farbe für die Links */
    text-decoration: none !important; /* Entfernt die Unterstreichung */
}

.custom-page-title span:hover {
    text-decoration: underline !important; /* Unterstreichung bei Hover */
}

.custom-page-excerpt {
    font-size: 1em;
    color: #666;
    text-decoration: none !important; /* Entfernt die Unterstreichung */
}




/* Custom CSS SERP Page */

/* Full-width wrapper */
.custom-search-page {
  width: 100%;
  padding: 60px 0;
  background: #fff;
}

/* Inner centered content block */
.custom-search-header,
.custom-search-grid,
.custom-search-pagination,
.custom-search-no-results {
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

/* Title */
.custom-search-title {
  font-size: 33px;
  margin-bottom: 20px;
  text-align: center;
}

.custom-search-heading {
  font-size: 23px;
  margin: 0 0 10px;
  display: block; /* Ensure it behaves like a block element */
}




/* Search form below title */
.custom-simple-search-form {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;
  max-width: 620px;
  margin: 0 auto 20px auto;
  flex-wrap: wrap;
}

/* Input field */
.custom-simple-search-form input[type="search"] {
  flex: 1;
  padding: 12px 16px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-sizing: border-box;
  min-width: 300px;
  margin-bottom: 20px;
}

/* Icon button */
.custom-search-icon-button {
  background-color: #ffffff;
  border: 1px solid #ccc;
  padding: 10px 14px;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease, color 0.2s ease;
  margin-bottom: 20px;
}

/* Icon styling */
.custom-search-icon-button svg {
  fill: #FF7A3D; /* Your custom orange */
  width: 20px;
  height: 20px;
  transition: fill 0.2s ease;
}

/* Hover effect */
.custom-search-icon-button:hover {
  background-color: #FF7A3D;
}

.custom-search-icon-button:hover svg {
  fill: #ffffff;
}





/* Responsive grid */
.custom-search-grid {
  display: grid;
  grid-template-columns: 1fr; /* Mobile: 1 column */
  gap: 30px;
}

@media (min-width: 1025px) {
  .custom-search-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Search result item */
.custom-search-item {
  border: 1px solid #ddd;
  padding: 20px;
  border-radius: 6px;
  background: #fafafa;
  transition: box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.custom-search-item:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.custom-search-thumb {
  margin-bottom: 15px;
}

.custom-search-thumb img {
  width: 100%;
  border-radius: 4px;
}

.custom-search-heading {
  font-size: 18px;
  margin: 0 0 10px;
}

.custom-search-heading a {
  text-decoration: none;
}

.custom-search-heading a:hover {
  text-decoration: underline;
}

.custom-search-excerpt {
  font-size: 15px;
  color: #444;
  line-height: 1.6;
}

/* Pagination */
.custom-search-pagination {
  text-align: center;
  margin-top: 40px;
}

.custom-search-pagination a,
.custom-search-pagination span {
  display: inline-block;
  margin: 0 5px;
  padding: 8px 12px;
  background-color: #eee;
  border-radius: 4px;
  text-decoration: none;
  color: #333;
}

.custom-search-pagination .current {
  background-color: #ccc;
  font-weight: bold;
}

/* No results */
.custom-search-no-results {
  text-align: center;
  padding: 40px;
  background-color: #f8f8f8;
  border-radius: 6px;
}




.uagb-post__image img {
	display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1; /* or 3 / 2 or 16 / 9 depending on your image shape */
}


.uagb-post__image {
  aspect-ratio: 1 / 1; /* This ensures the container reserves space */
  overflow: hidden;
}


@media (max-width: 921px) {
  .uagb-post-grid img {
    aspect-ratio: 1 / 1;
  }
}
@media (max-width: 544px) {
  .uagb-post-grid img {
    aspect-ratio: 1 / 1; /* Make it square on tiny screens, if better */
  }
}


/* Fix layout shift for custom post image blocks */
.wp-post-image {
  aspect-ratio: 1 / 1; /* Adjust to 1 / 1 or 3 / 4 depending on shape */
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}


@media (max-width: 921px) {
  .wp-post-image {
    aspect-ratio: 1 / 1; /* Square on tablets */
  }
}
@media (max-width: 767px) {
  .wp-post-image {
    aspect-ratio: 1 / 1; /* Portrait on mobile */
  }
}

/* 🔧 Reserve space for mobile header to prevent CLS */
@media (max-width: 921px) {
  .ast-mobile-header-wrap {
    min-height: 80px; /* Adjust if needed */
  }

  .ast-header-break-point .main-header-bar .ast-builder-grid-row {
    min-height: 80px;
  }
}



/* 🔧 Ensure search icon and menu button don't shift layout */
.ast-search-menu-icon,
.ast-header-break-point .ast-menu-toggle {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* 🔧 Prevent icon jump from late-loaded SVGs */
.ast-search-menu-icon svg,
.ast-menu-toggle svg {
  width: 20px;
  height: 20px;
  display: block;
}



.ast-header-break-point .main-header-bar {
  transition: none !important;
}

@media (max-width: 921px) {
  div#content.site-content {
    min-height: 100vh;
    padding-bottom: 2rem;
  }

@media (max-width: 544px) {
  div#content.site-content {
    min-height: 100vh;
    padding-bottom: 2rem;
				    }
		
		
.wp-block-group {
    min-height: 1px;
	

	@media (max-width: 1024px) {
  .ast-scroll-to-topright {
    bottom: 50px !important; 
  }
}