.rpi_bericht_item {
    background-color: white;
    border-radius: 10px;
    background: white;
    box-shadow: 10px 10px 32px #edeeef,
        -10px -10px 32px #f7f8f9;
    position: relative;
    overflow: hidden !important;
}

.bento-filler {
    background-color: #edeef0;
    border-radius: 4px;
}

.rpi_instagram_cover,
.rpi_instagram_wrapper>* {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    transform: scale(1);
    z-index: 1;
    overflow: hidden !important;
}

.rpi_instagram_fade {
    transform: scale(1.1);
    filter: blur(11px) saturate(0);
    opacity: 0.6;
    z-index: -0;
}

.rpi_instagram_cover {
    transform: scale(0.9);
    border-radius: 4px;
}

/* artikel overzicht */
.rpi_volledig_artikel {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-color: #354F4A;
    cursor: pointer;
}

.rpi_volledig_artikel .rpi_artikel_bg {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    z-index: 1;
    overflow: hidden !important;
    transition: all 500ms cubic-bezier(0.250, 0.250, 0.000, 0.975);
    /* custom */
    transition-timing-function: cubic-bezier(0.250, 0.250, 0.000, 0.975);
    /* custom */
    opacity: 1;
    filter: blur(0px);
}

.rpi_volledig_artikel:hover .rpi_artikel_bg {
    opacity: 0.8;
    filter: blur(10px) brightness(1.1);
}

.rpi_volledig_artikel .rpi_artikel_fade {
    z-index: 2;
    position: Absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 100%;
    background: #354F4A;
    transition: all 500ms cubic-bezier(0.250, 0.250, 0.000, 0.975);
    /* custom */

    transition-timing-function: cubic-bezier(0.250, 0.250, 0.000, 0.975);
    /* custom */
    opacity: 0.6;


    background: linear-gradient(15deg, rgba(53, 79, 74, 1) 20%, rgba(53, 79, 74, 0.168) 50%);

}

.rpi_volledig_artikel .rpi_artikel_cover {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 130px;
    z-index: 2;
    /* border: 1px solid red; */
    padding: 31px;
}

.rpi_volledig_artikel:hover .rpi_artikel_fade {

    width: 200%;
    height: 150%;
    opacity: 1;
}

.rpi_volledig_artikel .rpi_artikel_cover .rpi_title {
    font-size: 27px;
    color: white !important;
}

.rpi_volledig_artikel .rpi_artikel_cover .rpi_title a {
    color: white;
    font-family: 'Lancaste', Helvetica, Arial, Lucida, sans-serif;
    font-size: 50px;
    color: #c9a471;
}

.rpi_volledig_artikel .rpi_artikel_cover .rpi_excerpt {
    margin-top: 16px;
    font-size: 16px;
    color: white;
}

/* Inline artikel */

.rdi_inline_artikel {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
    grid-gap: 30px;
}

.rdi_inline_artikel .rdi_artikel_img {
    width: 100%;
    height: 100%;
    border-radius: 10px 10px 0px 0px;
}

.rdi_inline_artikel .rdi_artikel_content {
    position: relative;
    padding: 20px 20px;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: stretch;
}

.rdi_inline_artikel .rdi_artikel_content .rdi_title {
    font-size: 27px;
    color: #354F4A;
    font-family: 'Lancaste', Helvetica, Arial, Lucida, sans-serif;
    font-size: 50px;
    color: #354F4A;
}

.rdi_title {
    padding: 10px;
}

.rdi_inline_artikel .rdi_artikel_content .rdi_title a {
    color: #c9a471;
    font-family: 'Lancaste', Helvetica, Arial, Lucida, sans-serif;
    font-size: 50px;
    color: #c9a471;
}

.rdi_inline_artikel .rdi_artikel_content .rdi_excerpt {
    margin-top: 16px;
    font-size: 16px;
    color: #354F4A;
}

.rdi_artikel_img {
    background-size: cover;
    background-position: center;
}

.rpi_volledigbericht_tag,
.rpi_bericht_tag {
    pointer-events: none;
    position: absolute;
    right: 25px;
    z-index: 9;
    top: 25px;
    width: 34px;
    height: 34px;
    background-color: #364341cf;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 500ms cubic-bezier(0.640, 0.235, 0.000, 0.995);
    /* custom */

    transition-timing-function: cubic-bezier(0.640, 0.235, 0.000, 0.995);
    /* custom */
}

.rpi_bericht_icon,
.rpi_instagram_badge {
    pointer-events: none;
    transition: all 500ms cubic-bezier(0.640, 0.235, 0.000, 0.995);
    /* custom */
    transition-timing-function: cubic-bezier(0.640, 0.235, 0.000, 0.995);
    /* custom */
    width: 20px;
    height: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("/wp-content/uploads/2025/04/instagram.svg");
}

.rpi_instagram_bericht:hover>.rpi_bericht_tag>.rpi_instagram_badge {
    transform: scale(1.2);
    transition: all 500ms cubic-bezier(0.640, 0.235, 0.000, 0.995);
    /* custom */
    transition-timing-function: cubic-bezier(0.640, 0.235, 0.000, 0.995);
    /* custom */
    width: 30px;
    height: 30px;
}

.rpi_instagram_bericht:hover>.rpi_bericht_tag {
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-color: #364341cf;
}

.rpi_bericht_icon {
    background-image: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%3E%0A%20%20%3Cpath%20fill%3D%22%23ffffff%22%20d%3D%22M15.5857864%2C12%20L7.29289322%2C20.2928932%20C6.90236893%2C20.6834175%206.90236893%2C21.3165825%207.29289322%2C21.7071068%20C7.68341751%2C22.0976311%208.31658249%2C22.0976311%208.70710678%2C21.7071068%20L17.7071068%2C12.7071068%20C18.0976311%2C12.3165825%2018.0976311%2C11.6834175%2017.7071068%2C11.2928932%20L8.70710678%2C2.29289322%20C8.31658249%2C1.90236893%207.68341751%2C1.90236893%207.29289322%2C2.29289322%20C6.90236893%2C2.68341751%206.90236893%2C3.31658249%207.29289322%2C3.70710678%20L15.5857864%2C12%20Z%22%2F%3E%0A%3C%2Fsvg%3E%0A');
}

.rpi_volledigbericht_tag {
    width: 120px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    padding: 0px 9px;
    line-height: 25px;
    font-size: 18px;
    font-weight: 700;
}

.rpi_volledigbericht_tag>span {
    color: white;
    padding-top: 2px;
}
.rpi_volledig_artikel:hover > .rpi_volledigbericht_tag{
    transform: scale(1.1) translate(-10px, 10px);  
}

/* ——————————————————————————————————
   Volledige bericht-content
   —————————————————————————————————— */

.rpi_blog_content {
    max-width: 1200px;
    /* centrale kolombreedte */
    margin: 0 auto;
    padding: 2rem 1rem;
}

.rpi_blog_content .rpi_blog_row {
    display: flex;
    gap: 2rem;
    /* ruimte tussen kolommen */
    margin-bottom: 1rem;
    align-items: center;
}

.rpi_blog_content .rpi_blog_row.rpi_row_reverse {
    flex-direction: row-reverse;
    /* beeld rechts, tekst links */
}

.rpi_blog_content .rpi_blog_row.rpi_row_full {
    /* full-width tekst wanneer geen afbeelding */
    flex-direction: row;
    display: flex;
    align-items: stretch;
}

.rpi_blog_row.rpi_row_full {}

.rpi_blog_row.rpi_row_full {}

.rpi_blog_content .rpi_blog_row.rpi_row_full .rpi_blog_col.rpi_blog_img {
    display: none;
    /* geen afbeelding = verbergen */
}

/* combinatie van reverse + full (komt zelden voor, maar veilig) */
.rpi_blog_content .rpi_blog_row.rpi_row_reverse.rpi_row_full {
    flex-direction: column;
}

/* ——————————————————————————————————
   Kolommen
   —————————————————————————————————— */

.rpi_blog_content .rpi_blog_col {
    flex: 1 1 50%;
}

.rpi_blog_content .rpi_blog_col.rpi_blog_img {
    max-width: 45%;
}

.rpi_blog_content .rpi_blog_col.rpi_blog_img img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
}

.rpi_blog_content .rpi_blog_col.rpi_blog_txt {
    flex: 1 1 55%;
    padding-top: 20px;
    padding-bottom: 20px;
}

/* ——————————————————————————————————
   Typografie
   —————————————————————————————————— */

.rpi_blog_content .rpi_blog_col.rpi_blog_txt h2 {
    margin: 0 0 .75rem;
    font-size: clamp(1.4rem, 2.5vw, 2rem);
    line-height: 1.25;
    color: #354F4A;
    font-weight: 600;
    font-family: 'Gill Sans', Helvetica, Arial, Lucida, sans-serif;
}

.rpi_blog_content .rpi_blog_col.rpi_blog_txt p {
    margin: 0 0 1.25rem;
    color: #444;
    line-height: 1.6;
}

/* ——————————————————————————————————
   Responsive
   —————————————————————————————————— */

@media (max-width:768px) {
    .rpi_blog_content .rpi_blog_row {
        flex-direction: column;
    }

    .rpi_blog_content .rpi_blog_col,
    .rpi_blog_content .rpi_blog_col.rpi_blog_img {
        max-width: 100%;
    }

    .rpi_blog_content .rpi_blog_col.rpi_blog_txt {
        padding-top: 1rem;
    }
}

/* gerelateerd */

.rpi_blog_related_items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    padding: 20px;
}

.rpi_blog_related_items .rpi_blog_related_item {
    background-color: white;
    border-radius: 4px;
    background: white;
    position: relative;
    overflow: hidden !important;
}

.rpi_blog_related_items .rpi_blog_related_item a {
    width: 100%;
    height: 410px;
    /* border:1px solid red; */
    float: left;
}

.rpi_blog_related_items .rpi_blog_related_item a .rpir_post_image {
    width: 100%;
    height: calc(100% - 60px);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}

.rpi_blog_related_items .rpi_blog_related_item a h3 {
    padding: 0px;
    /* border: 1px solid red; */
    height: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 19px;
    font-weight: 600 !important;
}

.rpi_blog_related_items .rpi_blog_related_item a .rpir_soort_post {
    background-color: #354f4abe;
    float: left;
    position: absolute;
    right: 10px;
    top: 10px;
    padding: 3px 10px;
    font-weight: 600;
    color: white;
    padding-top: 7px;
    border-radius: 4px;
}