/*
Theme Name: Ludec
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 5.6
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


/* Blog hero (single post - top layout) */
.single-post .ludecs-blog-hero {
  background-color: #000;
  position: relative;
  overflow: hidden;
}

/* Achtergrond SVG rechtsboven */
.single-post .ludecs-blog-hero::after{
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("https://ludecstaging.kinsta.cloud/wp-content/uploads/2026/01/LogoMiddel-1.svg");
  background-repeat: no-repeat;
  background-position: right top;
  background-size: contain;
  pointer-events: none;
  opacity: 1;
}

.single-post .page-title .overlay{
  display:none !important;
}

.single-post .ludecs-blog-hero__inner{
  position: relative;
  z-index: 2;
  min-height: 300px;         /* pas aan indien nodig */
  padding: 60px 20px;
  align-items: center;
  gap: 40px;
}



.single-post .ludecs-blog-hero__left{
  max-width: 860px;
}

.single-post .ludecs-blog-hero__breadcrumbs #breadcrumbs{
  margin: 0 0 18px 0;
  opacity: .8;
  font-size: 14px;
}

.single-post .ludecs-blog-hero__breadcrumbs,
.single-post .ludecs-blog-hero__breadcrumbs a{
  color: #fff;
  text-decoration: none;
}

.singe-post span.breadcrumb_last{
	display: none;
}

.single-post .ludecs-blog-hero__title{
  margin: 0 0 26px 0;
  color: #fff;
  font-size: 54px;           /* pas aan naar wens */
  line-height: 1.1;
  font-weight: 500;
}

.single-post .ludecs-blog-hero__meta{
  display: flex;
  align-items: center;
  gap: 16px;
  color: #fff;
}

.single-post .ludecs-blog-hero__avatar img{
  border-radius: 999px;
  display: block;
}

.single-post .ludecs-blog-hero__author{
  font-size: 18px;
  font-weight: 500;
}

.single-post .ludecs-blog-hero__date{
  margin-top: 4px;
  opacity: .85;
  font-size: 14px;
}

/* Verberg de huidige pagina */
.ludecs-blog-hero__breadcrumbs .breadcrumb_last {
  display: none;
}

/* Verberg de divider die vóór de huidige pagina staat */
.ludecs-blog-hero__breadcrumbs .divider:nth-last-of-type(2) {
  display: none;
}

/* Rechts: share icons */
.single-post .ludecs-blog-hero__right{
  margin-left: auto;
}

.single-post .ludecs-blog-hero__share{
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* Single post: haal Flatsome row negatieve margins weg zodat full-width echt full-width is */
.single-post #content > .container > .row,
.single-post .page-wrapper > .row,
.single-post .blog-wrapper > .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100%;
}

.single-post .entry-content {
  padding-top: 0 !important;
}

.single-post .article-inner {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

/* Maak alleen de header section binnen article full-bleed */
.single-post .article-inner .blog-header-img {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.single-post .article-inner .blog-header-img img {
  display: block;
  max-width: 1470px;
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
 .single-post #content > .container > .row{
    padding-left: 20px;
    padding-right: 20px;
  }

}