/* Team popup as on lacos.eu (10.11.2026).
   The team cards were aligned with lacos.eu in review 29.10.2026 (point-08);
   the popup that opens on click still used the original Systemhaus layout.
   These rules take over the lacos.eu popup: 16px text, bold name, text left
   and a 300px image right in a grid, arrows in brown inside the white box. */

/* BEGIN team-popup-box */
/* White box with the lacos.eu inner spacing. */
.mfp-inline-holder .mfp-content:has(.teamBox.lightbox) {
    padding-left: 110px;
    padding-right: 110px;
}
@media (max-width: 630px) {
    .mfp-inline-holder .mfp-content:has(.teamBox.lightbox) {
        padding: 30px;
    }
}
/* END team-popup-box */

/* BEGIN team-popup-layout */
.teamBox.lightbox {
    max-width: 100%;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: .2px;
}
.teamBox.lightbox div.inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) min(300px, (100% - 20px) / 2);
    gap: 20px;
    min-height: 100px;
}
.teamBox.lightbox div.data {
    order: 1;
    float: none;
    width: auto;
    padding-right: 0;
}
.teamBox.lightbox div.image {
    order: 2;
    float: none;
    width: auto;
}
.teamBox.lightbox div.image img {
    position: absolute;
}
/* Same slight zoom on hover as on lacos.eu. */
.teamBox.lightbox:hover div.image img {
    left: -5%;
    top: -5%;
    width: 110%;
}
@media (max-width: 768px) {
    .teamBox.lightbox div.inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}
@media (max-width: 676px) {
    .teamBox.lightbox div.inner {
        grid-template-columns: 1fr;
    }
    .teamBox.lightbox div.data {
        order: 2;
    }
    .teamBox.lightbox div.image {
        order: 1;
    }
}
/* END team-popup-layout */

/* BEGIN team-popup-text */
.teamBox.lightbox div.inner span {
    line-height: 26.4px;
}
.teamBox.lightbox div.inner span.name {
    font-size: 16px;
    font-family: 'contobold';
    padding-right: 40px;
}
.teamBox.lightbox div.inner span.position {
    padding-right: 40px;
}
.teamBox.lightbox div.inner span.tel,
.teamBox.lightbox div.inner a.mail,
.teamBox.lightbox div.inner span.maillabel {
    font-size: 16px;
}
/* END team-popup-text */

/* BEGIN team-popup-arrows */
/* Arrows inside the white box in the lacos.eu brown. The original Systemhaus
   home page (body#lc-1) placed them at the window edge; that is overridden here. */
.mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow {
    width: 102px;
    height: 204px;
    margin-top: -102px;
}
.mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow:after {
    border-right-color: #643c28;
    border-top-color: #643c28;
}
body .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left,
body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left {
    left: calc(50% - 515px);
}
body .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right,
body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right {
    right: calc(50% - 515px);
}
body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left:after {
    left: auto;
    right: 0;
}
body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right:after {
    left: 0;
    right: auto;
}
@media (max-width: 1200px) {
    body .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left,
    body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left {
        left: 2%;
    }
    body .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right,
    body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right {
        right: 2%;
    }
}
@media (max-width: 630px) {
    body .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left,
    body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-left {
        left: -4%;
    }
    body .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right,
    body#lc-1 .mfp-wrap:has(.teamBox.lightbox) button.mfp-arrow-right {
        right: -4%;
    }
}
/* END team-popup-arrows */