/* Visitor presentation only. Keep the existing desktop layout and interactions. */
.tg-hero-boiler {
    max-width: 100%;
    height: auto;
}

@media (max-width: 991px) {
    /* The nine FAQ links must wrap instead of widening the entire page. */
    #faq .divTable,
    #faq .divTableBody {
        display: block;
        max-width: 100%;
    }

    #faq .divTableRow {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #faq .divTableCell,
    #faq .divTableHead {
        display: block;
        min-width: 0;
        overflow-wrap: anywhere;
        padding: 0;
    }

    #faq .divTableCell a,
    #faq .divTableHead a {
        display: flex;
        align-items: center;
        min-height: 44px;
        padding: 8px 10px;
    }
}


/* Visitor corrections: preserve the proportions of the three installation diagrams. */
#carousel-product .carousel-item > picture { display: block; }
#carousel-product .carousel-item > picture > img {
    width: 100%;
    height: auto;
    float: none !important;
    object-fit: contain;
}
#banner-choix h2.title-section { padding-inline: 0; }

/* These two sale labels must remain readable alongside the product prices. */
.badge.tg-destock-badge {
    font-size: clamp(1.125rem, 1.6vw, 1.375rem);
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: .025em;
    padding: .5em .8em;
    border-radius: .375rem;
    max-width: 100%;
    white-space: normal;
}

/* Actual WATTS VR12 photograph, scaled without changing its proportions. */
.tg-watts-vr12-image { display: block; width: 100%; max-width: 240px; height: auto; margin-inline: auto; }
.tg-watts-vr12-zoom { max-width: 390px; max-height: 60vh; object-fit: contain; }
.tg-watts-brand { display: block; width: 160px; max-width: 100%; height: auto; margin: 1rem auto; }

/* Keep the selected power together and centred in the expanded product sheet. */
#chaudieres .collapsible .card-large > :is(h2, h3).card-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .25rem;
    padding: .75rem 1rem;
    margin-bottom: 0;
    font-size: 1.5625rem;
    line-height: 1.25 !important;
    text-align: center;
}
#chaudieres .collapsible .card-large > :is(h2, h3).card-header > strong {
    display: block;
    white-space: nowrap;
    line-height: 1.2;
}