/* The same editable PageBlock column pattern used on skutsje.jv.nl. */
#main.yntwelle-blocks > .main-content {
    max-width: none;
    padding: 0;
}

#content .yntwelle-course-block {
    width: min(calc(100% - 64px), 1280px);
    max-width: none;
    box-sizing: border-box;
    margin: 64px auto;
    padding: 0;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;
}

#content .yntwelle-course-block > .pageblock-content {
    width: auto;
    max-width: none;
    min-width: 0;
    min-height: 0;
    margin: 0;
    padding: 0;
    /* The old site stylesheet forces 100px of bottom padding on every column. */
    padding-bottom: 0 !important;
    box-sizing: border-box;
}

#content .yntwelle-course-intro > .pageblock-content { max-width: 850px; }
#content .yntwelle-course-block #content-titel {
    margin: 0 0 20px;
    padding: 0;
    font-size: 42px;
    font-weight: 400;
    line-height: 1.2;
}

#content .yntwelle-course-block h2 {
    margin: 0 0 20px;
    padding: 0;
    color: #286da4;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.2;
}

#content .yntwelle-course-block p { margin: 0 0 20px; }
#content .yntwelle-course-block p:last-child { margin-bottom: 0; }
#content .yntwelle-course-intro p:first-of-type { font-size: 23px; line-height: 1.5; }
#content .yntwelle-course-split > .yntwelle-course-copy > p:first-child {
    margin-bottom: 10px;
    color: #566372;
    font-size: 14px;
}

#content .yntwelle-course-split,
#content .yntwelle-course-contact {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: clamp(32px, 5vw, 72px);
}

#content .yntwelle-course-copy > ul { margin: 24px 0; padding: 0; list-style: none; }
#content .yntwelle-course-copy > ul > li { margin: 0; padding: 10px 0; border-bottom: 1px solid #dfe5e9; }
#content .yntwelle-course-copy strong { font-weight: 600; }

#content .yntwelle-course-media .jv-imagect {
    float: none;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    padding: 0;
}

#content .yntwelle-course-media img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto !important;
    margin: 0;
}

/* The legacy editor keeps the media wrappers, but strips custom inner classes. */
#content .yntwelle-course-media > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 20px;
}

#content .yntwelle-course-media > div > div:first-child:nth-last-child(3) { grid-row: span 2; }
#content .yntwelle-course-media p { margin: 10px 0 0; color: #566372; font-size: 14px; line-height: 1.5; }

#content .yntwelle-course-contact {
    align-items: stretch;
    gap: 0;
    margin-bottom: 72px;
}

#content .yntwelle-course-contact > .pageblock-content {
    padding: clamp(28px, 4vw, 56px);
    padding-bottom: clamp(28px, 4vw, 56px) !important;
}
#content .yntwelle-course-contact-title { display: flex; align-items: center; background: #263958; }
#content .yntwelle-course-contact-title h2 { margin: 0; color: white; }
#content .yntwelle-course-contact > .yntwelle-course-copy { background: #f2f4f4; }
#content .yntwelle-course-block a { color: #236598; overflow-wrap: anywhere; text-underline-offset: 3px; }
#content .yntwelle-course-contact a { font-weight: 600; }

@media (max-width: 800px) {
    #content .yntwelle-course-block { width: calc(100% - 40px); margin: 36px auto; font-size: 17px; }
    #content .yntwelle-course-block #content-titel { font-size: 32px; }
    #content .yntwelle-course-block h2 { font-size: 28px; }
    #content .yntwelle-course-intro p:first-of-type { font-size: 21px; }
    #content .yntwelle-course-split,
    #content .yntwelle-course-contact { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    #content .yntwelle-course-split > .yntwelle-course-copy { order: 0; }
    #content .yntwelle-course-split > .yntwelle-course-media { order: 1; }
    #content .yntwelle-course-contact { gap: 0; }
    #content .yntwelle-course-media > div { gap: 12px; }
}
