/* Home shares the outer hero geometry, but keeps its content-driven height.
   Override WPBakery's calculated full-width inline geometry, not its contents. */
#page #content .headerbereich.home {
    box-sizing: border-box;
    width: min(var(--planhof-hero-width), calc(100vw - 30px)) !important;
    max-width: none;
    left: 0 !important;
    margin: 20px 0 0 50%;
    transform: translateX(-50%);
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: auto;
    padding-inline: max(20px, calc((min(var(--planhof-hero-width), calc(100vw - 30px)) - var(--contentWidth, 1200px)) / 2)) !important;
    border-radius: var(--border-radius);
    overflow: hidden;
}

/* Shared inner-page hero; use planhof-hero for future page heroes. */
#page #content :is(.planhof-hero, .about-hero, .seminars-hero, .magazine-hero, .legal-hero, .news-hero, .project-slider.seminar-hero) {
    box-sizing: border-box;
    width: min(var(--planhof-hero-width), calc(100vw - 30px));
    max-width: none;
    height: auto;
    min-height: var(--planhof-hero-min-height);
    max-height: none;
    aspect-ratio: var(--planhof-hero-ratio);
    margin: 20px 0 0 50%;
    transform: translateX(-50%);
}
@media (max-width: 767px) {
    /* Reserve The7's mobile header grid row until the header is initialized. */
    body.home.sticky-mobile-header:not(.transparent, .hidden-header) #page:has(> .masthead:not(.masthead-mobile-header))::before {
        content: "";
        grid-area: header;
        block-size: 74px;
    }
    #footer img.logo { max-width: 60%; height: auto; }
    :root { --planhof-hero-min-height: 360px; }
}

/* Shared typography; icon fonts keep their own family. */
.legal-hero { display: flex; align-items: center; overflow: hidden; border-radius: var(--border-radius); background-size: cover; background-position: center; }
.legal-hero::before, .legal-hero::after { display: none; }
.legal-hero > .wpb_column > .vc_column-inner { padding: 0; }
.legal-hero .legal-hero-heading {
    box-sizing: border-box; width: clamp(420px, 42vw, 790px); max-width: 100%; margin: 0;
    padding: 26px clamp(24px, 3vw, 48px) 26px clamp(28px, 5.8vw, 112px);
    border-radius: 0 var(--border-radius) var(--border-radius) 0; background: var(--dunkelblau-75);
}
#content .legal-hero h1 { margin: 0; color: var(--weiss); font-size: var(--heading-hero-size); font-weight: 300; line-height: 1.3; text-transform: uppercase; }
@media (max-width: 767px) {
    .legal-hero { align-items: flex-end; }
    .legal-hero .legal-hero-heading { width: 100%; padding: 22px 24px; }
    #content .legal-hero h1 { font-size: var(--heading-hero-legal-mobile-size); }
}
body, button, input, optgroup, select, textarea { font-family: var(--font-family); }
body .brlbs-cmpnt-container {
    --dialog-font-family: var(--font-family);
    --content-blocker-font-family: var(--font-family);
    font-family: var(--font-family);
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family);
    color: var(--heading-color);
    overflow-wrap: break-word;
    hyphens: auto;
}
#content .wpb_text_column:not(:where(.faq *, .seminar-copy-column *, .news-content-surface *, .seminar-cost-panel *, .seminar-term-request *, .seminar-newsletter *, .seminar-detail-faq *, .planhof-legal, .planhof-legal *)) h2 { font-size: var(--heading-section-large-size); }

/* Shared normal teaser typography; the hero slider retains its own variant. */
body #page :is(.portfolio-shortcode, .portfolio-carousel-shortcode, .blog-shortcode) .entry-title {
    font-size: var(--heading-teaser-size);
    font-weight: 400;
    line-height: 1.2;
}

body #content .magazine-results .blog-shortcode .entry-title,
body .news-current-posts .blog-shortcode .entry-title,
body .seminar-related .portfolio-shortcode .entry-title {
    font-size: var(--heading-teaser-size);
}
#content .text-weiss :where(h1, h2, h3, h4, h5, h6),
.headerbereich .headline h1,
.headerbereich .portfolio-carousel-shortcode .entry-title,
.headerbereich .portfolio-carousel-shortcode .entry-title a { color: var(--weiss); }
.myChildrensLinkIsApplied { cursor: pointer; }
/* Placeholder testimonials remain visible for the client presentation. */
.myChildrensLinkIsApplied:focus-visible { outline: 3px dotted var(--href-outline-farbe); outline-offset: 4px; }

#page :where(.portfolio-shortcode, .portfolio-carousel-shortcode) .portfolio-categories,
#page :where(.portfolio-shortcode, .portfolio-carousel-shortcode) .portfolio-categories a {
    color: var(--weiss);
}

/* Cap heading text blocks against the page width, preserving narrower columns. */
@media (min-width: 1200px) {
    #content .wpb_text_column:has(h2):not(.planhof-legal, .planhof-legal *, .faq *, .newsletter *, .seminar-copy-column *, .news-content-surface *, .contact-form-panel *, .seminar-cost-panel *, .seminar-term-request *, .seminar-newsletter *) {
        width: 100%;
        max-width: calc(var(--contentWidth, 100vw) * .6);
    }
}

/* Let the card clip its outer corners; the image/text seam stays square. */
#content :is(.portfolio-shortcode, .portfolio-carousel-shortcode) .post-thumbnail-wrap,
#content :is(.portfolio-shortcode, .portfolio-carousel-shortcode) .post-thumbnail,
#content :is(.portfolio-shortcode, .portfolio-carousel-shortcode) .post-thumbnail a,
#content :is(.portfolio-shortcode, .portfolio-carousel-shortcode) .post-thumbnail img {
    border-radius: 0;
}
/* Fill the stretched image column without percentage-height rounding gaps. */
#content .portfolio-shortcode:is(.mode-grid, .mode-masonry) .post .post-thumbnail-wrap {
    position: relative;
    align-self: stretch;
    height: auto;
}
#content .portfolio-shortcode:is(.mode-grid, .mode-masonry) .post .post-thumbnail {
    position: absolute;
    inset: 0;
    width: 100%;
}
#content .portfolio-shortcode:is(.mode-grid, .mode-masonry) .post .post-thumbnail a {
    display: block;
    width: 100%;
    height: 100%;
}
#content .portfolio-shortcode:is(.mode-grid, .mode-masonry) .post .post-thumbnail img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 767px) {
    #content .portfolio-shortcode:is(.mode-grid, .mode-masonry) .post .post-thumbnail {
        position: relative;
        aspect-ratio: 16 / 9;
    }
    #content .portfolio-shortcode:is(.mode-grid, .mode-masonry) .post .post-thumbnail a {
        position: absolute;
        inset: 0;
    }
}

/* Reusable components are available on every page. */
section.newsletter { padding-bottom: calc(var(--standard-padding) / 2); }
.newsletter { scroll-margin-top: 110px; }

@media (max-width: 992px) {
    .kunden .vc_column-inner > .wpb_wrapper { flex-wrap: wrap; justify-content: center; gap: 20px; }
    .kunden .wpb_text_column { flex-basis: 100%; text-align: center; }
    .kunden .wpb_single_image { flex: 0 1 25%; padding: 0 12px; margin-bottom: 0; }
    .bilderBox .wpb_column.text { padding-inline: 24px; }
}
@media (max-width: 767px) {
    :root {
        --standard-padding: 48px;
        --standard-padding-top: 48px;
        --standard-padding-bottom: 48px;
        --standard-margin: 48px;
        --standard-margin-top: 48px;
        --standard-margin-bottom: 48px;
    }
    #content .wpb_text_column:not(:where(.faq *, .seminar-copy-column *, .news-content-surface *, .seminar-cost-panel *, .seminar-term-request *, .seminar-newsletter *, .seminar-detail-faq *, .planhof-legal, .planhof-legal *)) h2 { font-size: var(--heading-section-large-mobile-size); line-height: 1.2; }
    /* Reserve space while The7 hides the carousel before initialization. */
    .headerbereich.home .wpb_wrapper:has(> .portfolio-carousel-shortcode.owl-carousel:not(.owl-loaded))::after {
        content: "";
        display: block;
        block-size: 388px;
    }
    .headerbereich.home { background-position: 65% center !important; }
    .headerbereich.home .headline h1 { font-size: var(--heading-home-hero-mobile-size); line-height: 1.2; }
    .headerbereich .post .post-entry-content { padding-top: 65px !important; }
    .headerbereich .post .post-entry-content h3 { font-size: var(--heading-home-slider-mobile-size) !important; }
    .headerbereich .post .post-entry-content .seminar-details ul { flex-wrap: wrap; gap: 8px 16px; }
    .headerbereich .post .post-entry-content .seminar-details ul li { margin-right: 0; }
    #content .portfolio-shortcode.mode-grid .dt-css-grid { grid-template-columns: minmax(0, 1fr) !important; }
    #content .portfolio-shortcode.mode-grid .post { flex-direction: column; min-width: 0; width: 100%; }
    #content .portfolio-shortcode.mode-grid .post .post-thumbnail-wrap { width: 100%; max-width: none; height: auto; }
    #content .portfolio-shortcode.mode-grid .post .post-thumbnail-wrap a { width: 100%; height: auto; }
    #content .portfolio-shortcode.mode-grid .post .post-thumbnail-wrap img { aspect-ratio: 16 / 9; height: auto; object-fit: cover; }
    #content .portfolio-shortcode.mode-grid .post .post-entry-content { width: 100%; box-sizing: border-box; padding-top: 65px; }
    #content .portfolio-shortcode .seminar-details ul { flex-wrap: wrap; gap: 8px; }
    #page .kunden .vc_column-inner > .wpb_wrapper {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 20px 16px;
    }
    #page .kunden .wpb_text_column { grid-column: 1 / -1; }
    #page .kunden .wpb_single_image { width: 100%; min-width: 0; margin: 0; padding: 0; }
    #page .kunden .wpb_single_image :is(figure, .vc_single_image-wrapper) { display: block; width: 100%; }
    #page .kunden .wpb_single_image img { width: 100%; height: auto; }

    /* Reusable mobile cards: halve the old 65px image-to-title gap. */
    #page #content .portfolio-shortcode.mode-grid .post .post-entry-content { padding-top: 32.5px; }

    #page :is(.infobox-planhof, .teilnehmer) .aio-icon-box.left-icon {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }
    #page :is(.infobox-planhof, .teilnehmer) .aio-icon-left { display: block; margin: 0; }
    #page :is(.infobox-planhof, .teilnehmer) .aio-ibd-block { display: block; width: 100%; min-width: 0; }
    #page :is(.infobox-planhof, .teilnehmer) .aio-icon-description { padding: 0; }
    #page .teilnehmer .aio-icon-img { margin: 0; max-width: 100%; }

    #page .infoBoxen .infobox-planhof { padding-inline: 0; }
    #page :is(a.link-btn, .link-btn a, .post-details) { overflow-wrap: anywhere; hyphens: auto; }

    .headerbereich .portfolio-carousel-shortcode .entry-excerpt { display: none; }
    #page .headerbereich .portfolio-carousel-shortcode .owl-nav {
        display: flex;
        justify-content: flex-end;
        gap: 12px;
        height: auto;
        min-height: 46px;
        margin-top: 16px;
    }
    #page .headerbereich .portfolio-carousel-shortcode .owl-nav :is(.owl-prev, .owl-next) {
        position: relative !important;
        inset: auto !important;
        transform: none !important;
        margin: 0 !important;
        flex: 0 0 auto;
    }
    .ult-carousel-wrapper.teilnehmenden .slick-slide { padding-right: 16px; }
    .ult-carousel-wrapper.teilnehmenden .slick-slide .aio-icon-component.teilnehmer { padding: 24px; }
    .ult-carousel-wrapper.teilnehmenden .slick-slide .aio-icon-component.teilnehmer .aio-icon-img { margin-right: 16px; }
    .bilderBox.ansprechpartner h3 { font-size: var(--heading-contact-person-mobile-size); margin-bottom: 24px; }
}
/* Align outer card edges on phones and portrait tablets. */
@media (max-width: 991px) {
    #page #content :is(.infoBoxen, .zitatBox, .bilderBox) { margin-inline: 0; }
    /* Nested picture rows otherwise inherit the section's negative gutters. */
    #page #content .vc_section:has(> .bilderBox) { margin-inline: 0; padding-inline: 0; }

    /* Shared compact button height; retain room for the 28px arrow circle. */
    #page {
        --button-compact-padding-y: 11px;
        --button-compact-min-height: 44px;
    }
    #page :is(a.link-btn, .link-btn a, .post-details.details-type-link,
        .post-details.details-type-btn, .paginator .button-load-more),
    #page #content .planhof-contact-form button.planhof-submit,
    #page section.newsletter #rmOrganism .rmBase__comp--cta,
    #page .websail :is(.ws-button-primary, .ws-button-clear),
    body.planhof-seminar-detail #page :is(#butlerTabelle, #termine) .websail :is(.ws-book-now-link, .ws-course-info > a.ws-cell-link),
    #page #content .wpb_text_column.linkliste ul li a,
    #page #content .filter-bg-decoration .filter-categories a,
    #page #content .planhof-about-team .filter a {
        box-sizing: border-box;
        min-height: var(--button-compact-min-height);
        padding-top: var(--button-compact-padding-y);
        padding-bottom: var(--button-compact-padding-y);
        line-height: 1.2;
    }
    #page #content .wpb_text_column.linkliste ul,
    #page #content .planhof-about-team .filter-categories,
    #page #content .magazine-results .filter-categories {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 12px;
    }
    #page #content .wpb_text_column.linkliste ul li {
        max-width: 100%;
        margin: 0;
        padding: 0;
    }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .kenBurnsEffekt-01 img, .kenBurnsEffekt-02 img { animation: none; }
    .headerbereich .owl-stage, .teilnehmenden .slick-track { transition: none !important; }
    a.link-btn, .link-btn a, .post-details, .kunden img, .filter-categories a { transition: none; }
}

/* Kundenabstimmung: Seminar-Teaser, Textlinks und Erfahrungen. */
#page #content :is(.portfolio-shortcode, .portfolio-carousel-shortcode) .entry-title {
    margin-bottom: 24px;
}

/* Nur Fliesstext in Textelementen; gestaltete Buttons/Filter bleiben erhalten. */
#page #content .wpb_text_column:not(.linkliste) :is(p, li) a:not(:where(.link-btn, .link-btn *, .dt-btn, .vc_btn3, .telefon, .mail)) {
    color: var(--dunkelblau);
    text-decoration: underline;
}

#page #content .wpb_text_column:not(.linkliste) :is(p, li) a:not(:where(.link-btn, .link-btn *, .dt-btn, .vc_btn3, .telefon, .mail)):hover {
    text-decoration: none;
}

/* Vergleichstabelle auf der Inhouse-Seite. */
body.page-id-32 #content .wpb_text_column table {
    width: 100%;
    border-collapse: collapse;
}
body.page-id-32 #content .wpb_text_column table :is(th, td) {
    border: 1px solid var(--teaser-border-color);
    padding: 12px clamp(10px, 1.4vw, 18px);
    vertical-align: top;
    overflow-wrap: anywhere;
}
body.page-id-32 #content .wpb_text_column table th {
    background-color: var(--bg-hellblau);
    color: var(--dunkelblau);
}

/* Alle Karten orientieren sich am laengsten Text, auch ausserhalb des Viewports. */
.home .ult-carousel-wrapper.teilnehmenden .slick-track {
    display: flex;
    align-items: stretch;
}
.home .ult-carousel-wrapper.teilnehmenden .slick-track > .slick-slide {
    display: flex;
    height: auto;
}
.home .ult-carousel-wrapper.teilnehmenden .slick-slide > .aio-icon-component.teilnehmer {
    flex: 1;
    width: 100%;
}

#page #content .dt-team-shortcode :is(.team-author > p, .team-content, .team-content p) {
    font-size: var(--the7-base-font-size);
}