/* One stable opening screen. Only the photograph absorbs remaining space. */
.customer-viewport-measure {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 100vh;
    visibility: hidden;
    pointer-events: none;
}

body.customer-page {
    padding-top: var(--navigation-header-height, 96px) !important;
    background: #f5f8fb;
}

.customer-intro {
    --customer-screen-height: 100vh;
    display: grid;
    grid-template-rows: minmax(80px, 1fr) auto;
    height: calc(var(--customer-screen-height) - var(--navigation-header-height, 96px));
    min-height: min-content;
    background: #edf3f7;
}

@supports (height: 100svh) {
    .customer-intro { --customer-screen-height: 100svh; }
    .customer-viewport-measure { height: 100svh; }
}

.customer-intro-media {
    position: relative;
    min-width: 0;
    min-height: 80px;
    background: #dce8ee;
}

.customer-intro-media > a:not(#scrollToPhone),
.customer-intro-media > .main-header {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.customer-intro-media .main-header {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0 !important;
    padding: 0;
    background-size: cover;
    background-position: center;
    background-attachment: scroll;
    transform: none;
    transition: none;
}

/* The shared container spacing must not shrink an embedded hero video. */
#page .customer-intro-media .main-header { padding: 0; }

.customer-intro-media iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.customer-hero-gallery-label {
    position: absolute;
    left: max(20px, calc((100% - 1140px) / 2));
    bottom: 20px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    max-width: calc(100% - 100px);
    padding: 10px 16px;
    border: 1px solid rgba(255, 255, 255, .75);
    border-radius: 12px;
    background: #fff;
    color: #173c56;
    box-shadow: 0 3px 14px rgba(0, 30, 50, .15);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    text-shadow: none;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

/* The label belongs to the existing gallery link; keep its target and geometry. */
@media (hover: hover) {
    .customer-intro-media > a:hover .customer-hero-gallery-label {
        border-color: #9fbdd3;
        background: #dfedf7;
        box-shadow: 0 5px 16px rgba(0, 30, 50, .20);
    }
}

.customer-intro-media > a:focus-visible .customer-hero-gallery-label,
.customer-intro-media > a:active .customer-hero-gallery-label {
    border-color: #9fbdd3;
    background: #dfedf7;
    box-shadow: 0 5px 16px rgba(0, 30, 50, .20);
}

@media (prefers-reduced-motion: reduce) {
    .customer-hero-gallery-label {
        transition: none;
    }
}

.customer-intro-media > a:focus-visible {
    outline: 3px solid #fff;
    outline-offset: -6px;
}

.customer-intro .white.customer-page-header {
    margin: 0;
    padding: 18px 0;
    background: transparent;
}

.customer-intro .customer-summary {
    gap: 24px;
    margin: 0;
    padding: 22px;
    border-color: #dce6ed;
    border-radius: 20px;
    box-shadow: 0 6px 26px rgba(20, 48, 68, .06);
}

.customer-intro .customer-summary-address {
    align-items: center;
    gap: 10px;
    border-color: #e0eaf1;
    border-radius: 12px;
    background: #f4f8fb;
    line-height: 1.5;
}

.customer-intro .customer-summary-address > .customer-summary-address-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    margin: 0;
    border: 1px solid #dce8f0;
    border-radius: 10px;
    background: #fff;
    color: #286586;
    font-size: 19px;
}

.customer-intro .customer-address-street,
.customer-intro .customer-address-locality {
    display: block;
}

.customer-intro .customer-address-street {
    color: #344f61;
    font-weight: 500;
}

.customer-intro .customer-address-locality {
    color: #526b7a;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

.customer-intro .customer-address-street:not([hidden]) + .customer-address-locality {
    margin-top: 2px;
}

.customer-intro .customer-address-street[hidden] { display: none; }

.customer-intro #scrollToPhone.btn-phone {
    position: absolute;
    z-index: 2;
    top: auto;
    left: auto;
    right: 16px;
    bottom: 16px;
    width: 48px;
    height: 48px;
}

.customer-intro #scrollToPhone.btn-phone > .fa { font-size: 24px; }

/* Breadcrumbs remain complete, after the introduction instead of above it. */
body.customer-page .customer-page-content ol.customer-breadcrumb {
    margin: 0 0 20px !important;
    padding: 0 0 16px;
    border: 0;
    border-bottom: 1px solid #dce6ed;
    background: transparent;
    font-size: 12px;
}

.customer-section-nav {
    margin: 0 0 32px;
    padding: 0;
}

.customer-section-nav-title {
    margin: 0 0 10px;
    color: #607584;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
}

.customer-section-nav-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.customer-section-nav-links > a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    max-width: 100%;
    padding: 10px 16px;
    border: 1px solid #d8e4ed;
    border-radius: 12px;
    background: #fff;
    color: #225b82;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: none;
}

.customer-section-nav-links > a:hover { background: #eaf2f8; }
.customer-section-nav-links > a[hidden], .customer-section-nav[hidden] { display: none; }

@media (max-width: 1199.98px) {
    .customer-intro .customer-summary { gap: 16px; padding: 20px; }
    .customer-intro .customer-summary-actions { padding-top: 14px; }
}

@media (max-width: 767.98px) {
    .customer-intro .white.customer-page-header { padding: 10px 0; }
    .customer-intro .customer-page-header > .container { padding-inline: 10px; }
    .customer-intro .customer-summary { gap: 12px; padding: 14px; border-radius: 16px; }
    .customer-intro .customer-summary-name { font-size: 22px; line-height: 1.3; }
    .customer-intro .customer-summary-address { margin-top: 8px; padding: 8px; font-size: 13px; line-height: 1.5; }
    .customer-intro .customer-summary-address > .customer-summary-address-icon {
        flex-basis: 28px;
        width: 28px;
        height: 28px;
        border-radius: 9px;
        font-size: 18px;
    }
    .customer-intro .customer-address-locality { font-size: 12.5px; }
    .customer-intro .customer-summary-actions { padding-top: 10px; }
    .customer-intro .customer-summary-links { margin-bottom: 8px; }
    .customer-intro .customer-summary-links > a,
    .customer-intro .title.customer .customer-summary-links #scrollToText {
        flex-direction: row;
        gap: 6px;
        /* Wrap whole controls instead of compressing their icon and short label. */
        min-width: max-content;
        min-height: 44px;
        padding: 8px 6px;
        font-size: 12px;
    }
    .customer-intro .customer-summary-links > a > .fa { font-size: 20px; }
    .customer-intro .customer-summary-contact > button[data-target="#modal-contact-form"] {
        min-height: 44px;
        padding: 10px 12px;
        font-size: 14px;
    }
    .customer-intro .has-offerte-new { min-height: 44px; margin-top: 8px; padding: 8px 12px; font-size: 13px !important; }
    .customer-hero-gallery-label { left: 16px; bottom: 16px; padding: 8px 12px; }
    .customer-section-nav { margin-bottom: 24px; }
    .customer-section-nav-links > a { padding: 9px 12px; font-size: 13px; }
}

@media (min-width: 360px) and (max-width: 1199.98px) {
    body.customer-page.customer-page-landscape {
        padding-top: calc(var(--navigation-header-height, 60px) + 40px) !important;
    }
    .customer-intro.customer-intro-landscape {
        height: calc(var(--customer-screen-height) - var(--navigation-header-height, 60px) - 40px);
        grid-template-columns: minmax(136px, 1fr) minmax(0, 3fr);
        grid-template-rows: auto;
    }
    .customer-intro-landscape .customer-intro-media { min-height: 180px; }
    .customer-intro-landscape .white.customer-page-header { align-self: center; padding: 8px 0; }
    .customer-intro-landscape .customer-page-header > .container { width: 100%; padding-inline: 8px; }
    .customer-intro-landscape .customer-summary { padding: 10px; gap: 8px; }
    .customer-intro-landscape .customer-summary-identity { gap: 12px; }
    .customer-intro-landscape .customer-summary-name { font-size: 18px; line-height: 1.3; }
    .customer-intro-landscape .customer-summary-address { margin-top: 4px; padding: 4px 6px; font-size: 12.5px; line-height: 1.4; }
    .customer-intro-landscape .customer-summary-address > .customer-summary-address-icon { flex-basis: 24px; width: 24px; height: 24px; border-radius: 8px; font-size: 16px; }
    .customer-intro-landscape .customer-address-locality { font-size: 12.5px; }
    .customer-intro-landscape .customer-summary-portrait { flex-basis: 56px; width: 56px; height: 56px; border-radius: 14px; }
    .customer-intro-landscape .customer-summary-actions { padding-top: 6px; }
    .customer-intro-landscape .customer-summary-actions-inner {
        display: grid;
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
        gap: 8px;
        align-items: center;
    }
    .customer-intro-landscape .has-offerte-new { margin-top: 4px; padding: 8px 10px; font-size: 13px !important; }
    .customer-intro-landscape .customer-summary-links { gap: 6px; margin: 0; }
    .customer-intro-landscape .customer-summary-links > a,
    .customer-intro-landscape .title.customer .customer-summary-links #scrollToText {
        flex: 1 1 32px;
        min-width: 36px;
        min-height: 44px;
        flex-direction: column;
        gap: 2px;
        padding: 4px;
        font-size: 11px;
    }
    .customer-intro-landscape .customer-summary-links > a > .fa { font-size: 18px; }
    .customer-intro-landscape .customer-summary-contact > button[data-target="#modal-contact-form"] {
        min-height: 44px;
        padding: 8px;
        font-size: 13px;
        line-height: 1.4;
    }
    .customer-intro-landscape .customer-hero-gallery-label {
        left: 12px;
        bottom: 80px;
        flex-direction: column;
        gap: 2px;
        max-width: calc(100% - 24px);
        padding: 8px;
        font-size: 12px;
    }
}

@media (min-width: 360px) and (max-width: 539.98px) {
    .customer-intro.customer-intro-landscape { grid-template-columns: minmax(104px, 1fr) minmax(0, 3fr); }
    .customer-intro-landscape .white.customer-page-header { padding: 2px 0; }
    .customer-intro-landscape .customer-page-header > .container { padding-inline: 6px; }
    .customer-intro-landscape .customer-summary { padding: 8px; gap: 6px; }
    .customer-intro-landscape .customer-summary-name { font-size: 17px; line-height: 1.25; }
    .customer-intro-landscape .customer-summary-actions { padding-top: 4px; }
    .customer-intro-landscape .customer-summary-actions-inner { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 6px; }
    .customer-intro-landscape .customer-summary-links { gap: 4px; }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .customer-intro.customer-intro-landscape:not(.customer-intro-compact) {
        grid-template-columns: minmax(240px, 1fr) minmax(0, 1.65fr);
    }
}

/* Use the same stable height as the photograph, never a live browser-bar height. */
@media (max-width: 767.98px) {
    .customer-intro-compact:not(.customer-intro-landscape) .white.customer-page-header { padding-block: 6px; }
    .customer-intro-compact:not(.customer-intro-landscape) .customer-summary { gap: 8px; padding: 10px; }
    .customer-intro-compact:not(.customer-intro-landscape) .customer-summary-name { font-size: 20px; line-height: 1.25; }
    .customer-intro-compact:not(.customer-intro-landscape) .customer-summary-address { margin-top: 6px; padding: 6px; }
    .customer-intro-compact:not(.customer-intro-landscape) .customer-summary-actions { padding-top: 6px; }
    .customer-intro-compact:not(.customer-intro-landscape) .customer-summary-links { margin-bottom: 6px; }
}

@media (min-width: 360px) {
    body.customer-page.customer-page-landscape.customer-page-compact {
        padding-top: calc(var(--navigation-header-height, 60px) + 40px) !important;
    }
    .customer-intro-compact.customer-intro-landscape {
        height: calc(var(--customer-screen-height) - var(--navigation-header-height, 60px) - 40px);
        grid-template-columns: minmax(88px, 1fr) minmax(0, 4fr);
        grid-template-rows: auto;
    }
    .customer-intro-compact.customer-intro-landscape .customer-intro-media { min-height: 144px; }
    .customer-intro-compact.customer-intro-landscape .white.customer-page-header { align-self: center; padding-block: 2px; }
    .customer-intro-compact.customer-intro-landscape .customer-page-header > .container { width: 100%; padding-inline: 6px; }
    .customer-intro-compact.customer-intro-landscape .customer-summary {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
        align-items: center;
        gap: 6px;
        padding: 6px;
    }
    .customer-intro-compact.customer-intro-landscape.customer-intro-with-offers .customer-summary {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr) minmax(0, 1.2fr);
    }
    .customer-intro-compact.customer-intro-landscape .customer-summary-identity,
    .customer-intro-compact.customer-intro-landscape .customer-summary-copy,
    .customer-intro-compact.customer-intro-landscape .customer-summary-actions,
    .customer-intro-compact.customer-intro-landscape .customer-summary-actions-inner { display: contents; }
    .customer-intro-compact.customer-intro-landscape .customer-summary-portrait { display: none; }
    .customer-intro-compact.customer-intro-landscape .customer-summary-name {
        grid-column: 1 / -1;
        grid-row: 1;
        font-size: 17px;
        line-height: 1.25;
    }
    .customer-intro-compact.customer-intro-landscape .customer-summary-address {
        grid-column: 1 / -1;
        grid-row: 2;
        margin: 0;
        padding: 4px 6px;
        font-size: 12.5px;
        line-height: 1.4;
    }
    .customer-intro-compact.customer-intro-landscape .customer-summary-address > .customer-summary-address-icon {
        flex-basis: 24px;
        width: 24px;
        height: 24px;
        border-radius: 8px;
        font-size: 16px;
    }
    .customer-intro-compact.customer-intro-landscape .customer-address-locality { font-size: 12.5px; }
    .customer-intro-compact.customer-intro-landscape .customer-summary-links { grid-column: 1; grid-row: 3; gap: 4px; margin: 0; }
    /* Follow the existing DOM/keyboard order: offers, information/social links, contact. */
    .customer-intro-compact.customer-intro-landscape.customer-intro-with-offers .customer-summary-links { grid-column: 2; }
    .customer-intro-compact.customer-intro-landscape .customer-summary-links > a,
    .customer-intro-compact.customer-intro-landscape .title.customer .customer-summary-links #scrollToText {
        flex-basis: 24px;
        flex-direction: column;
        gap: 2px;
        min-width: 28px;
        min-height: 44px;
        padding: 4px 2px;
        font-size: 11px;
    }
    .customer-intro-compact.customer-intro-landscape .customer-summary-links > a > .fa { font-size: 18px; }
    .customer-intro-compact.customer-intro-landscape .has-offerte-new {
        grid-column: 1;
        grid-row: 3;
        margin: 0;
        padding: 6px;
        font-size: 13px !important;
        text-align: center;
        line-height: 1.35;
        overflow-wrap: anywhere !important;
    }
    .customer-intro-compact.customer-intro-landscape .customer-summary-contact { grid-column: 2; grid-row: 3; }
    .customer-intro-compact.customer-intro-landscape.customer-intro-with-offers .customer-summary-contact { grid-column: 3; }
    .customer-intro-compact.customer-intro-landscape .customer-summary-contact > button[data-target="#modal-contact-form"] { min-height: 44px; padding: 6px; font-size: 13px; line-height: 1.4; }
    .customer-intro-compact.customer-intro-landscape .customer-hero-gallery-label { left: 8px; max-width: calc(100% - 16px); padding-inline: 4px; overflow-wrap: anywhere !important; }
}

@media (min-width: 360px) and (max-width: 539.98px) {
    .customer-intro-compact.customer-intro-landscape .customer-summary { gap: 4px; padding: 4px; }
    .customer-intro-compact.customer-intro-landscape .has-offerte-new { font-size: 12px !important; }
}

@media (min-width: 360px) and (max-width: 479.98px) {
    .customer-intro-compact.customer-intro-landscape .customer-summary-links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .customer-intro-compact.customer-intro-landscape .customer-summary-contact > button[data-target="#modal-contact-form"] {
        flex-direction: column;
        gap: 4px;
        overflow-wrap: anywhere !important;
    }
}

@media print {
    body.customer-page,
    body.customer-page.customer-page-landscape,
    body.customer-page.customer-page-landscape.customer-page-compact { padding-top: 0 !important; background: #fff; }
    .customer-intro,
    .customer-intro.customer-intro-landscape,
    .customer-intro.customer-intro-landscape.customer-intro-compact { display: block; height: auto; min-height: 0; }
    .customer-intro .customer-intro-media { height: 240px; }
    .customer-section-nav { display: none; }
}