/* Water Hygiene is the visual source; adapt only the different content counts. */
.water-service-page {
    --service-green: var(--water-green);
    --service-navy: var(--water-navy);
    --service-line: var(--water-line);
}
.water-service-page .water-stage-hero::after { display: none; }
.water-service-page .water-stage-hero-copy,
.water-service-page .water-stage-hero-visual { min-width: 0; }
.water-service-page .water-service-hero-visual { display: block; min-height: 0; width: 100%; }
@media (min-width: 1251px) {
    .water-service-facility .water-stage-hero-grid {
        grid-template-columns: minmax(28rem, .78fr) minmax(0, 1.22fr);
        gap: clamp(1.5rem, 2vw, 2rem);
    }
}
.water-service-hero-screens { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.water-service-hero-screens > :first-child { grid-column: 1 / -1; }
.water-service-page .water-service-image-note { margin: .85rem 0 0; color: var(--water-muted); font-size: .66rem; line-height: 1.6; }
.water-service-page .water-stage-signal-grid,
.water-service-page .water-stage-capability-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.water-service-page .water-stage-capability-grid article { min-height: 0; }
.water-service-page .water-stage-capability-grid article > p { margin: 0; font-size: .8rem; line-height: 1.7; color: var(--water-text); }
.water-service-page .water-stage-heading > p:not(.water-stage-eyebrow) { margin: .9rem auto 0; color: var(--water-muted); font-size: .9rem; line-height: 1.7; }
.water-service-page .water-stage-journey-grid strong { min-height: 4.2em; }
.water-service-page .water-stage-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.water-service-page .water-stage-feature-grid > article { display: flex; flex-direction: column; }
.water-service-feature-screens { display: flex; flex-direction: column; justify-content: center; gap: .6rem; height: 20rem; padding: 1rem; border-bottom: 1px solid var(--water-line); background: #f8fbfa; }
.water-service-feature-screens .service-screen { flex: 0 0 auto; width: min(100%, calc(14rem * var(--screen-aspect))); align-self: center; box-shadow: none; }
.water-service-feature-screens:has(> :nth-child(2)) .service-screen { width: min(100%, calc(5rem * var(--screen-aspect))); }
.water-service-page .water-service-feature-copy { padding: 1.2rem; }
.water-service-page .water-service-feature-copy h3 { margin: .6rem 0 .75rem; min-height: 4.05em; }
.water-service-page .water-service-feature-copy > p { margin: 0 0 1rem; }
.water-service-page .water-service-feature-copy > p:not(.water-stage-eyebrow):not(.water-service-image-note),
.water-service-feature-copy li { color: var(--water-text); font-size: .78rem; line-height: 1.65; }
.water-service-feature-copy ul { display: grid; gap: .5rem; margin: 0 0 1rem; padding-left: 1rem; }
.water-service-feature-copy li::marker { color: var(--water-green); }
.water-service-page .water-stage-ai-copy > .water-stage-button { margin-top: 1.5rem; }
.water-service-page .water-stage-ai-visual img { display: block; width: 100%; height: auto; }
.water-service-page .water-stage-ai-panel { min-width: 0; }
.water-service-page .water-stage-ai-copy { min-width: 0; }
.water-service-outcomes .solution-outcomes-intro { text-align: left; }
.water-service-outcomes .water-service-outcome-source a { color: var(--water-green); text-decoration: underline; text-underline-offset: .2em; }
.water-service-page .service-screen figcaption { color: var(--water-navy); }
/* Show supplied hero composites at full column width without extra frames. */
:is(.water-service-cmms, .water-service-facility, .water-service-security) .sector-system-composite .sector-system-back { width: 100%; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
:is(.water-service-cmms, .water-service-facility, .water-service-security) .sector-system-details:empty { display: none; }
/* Match the sector screenshot frames without altering the source image proportions. */
:is(.water-service-cmms, .water-service-facility, .water-service-security) .water-stage-hero-visual figcaption,
:is(.water-service-cmms, .water-service-facility, .water-service-security) .water-stage-hero-visual > .water-service-image-note,
:is(.water-service-cmms, .water-service-facility, .water-service-security) .water-service-feature-screens figcaption,
.water-service-cmms .water-service-feature-copy > .water-stage-eyebrow,
.water-service-cmms .water-service-feature-copy > .water-service-image-note { display: none; }
:is(.water-service-cmms, .water-service-facility, .water-service-security) .water-service-feature-screens {
    display: flex;
    align-items: center;
    justify-content: center;
    height: auto;
    min-height: 0;
    padding: 0;
    aspect-ratio: var(--feature-frame-aspect);
    overflow: visible;
    background: #fff;
    border-bottom: 0;
}
:is(.water-service-cmms, .water-service-facility, .water-service-security) .water-service-feature-screens .service-screen {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    transform: none;
    flex: 0 0 auto;
}
:is(.water-service-cmms, .water-service-facility, .water-service-security) .water-service-feature-screens .service-screen-body { border-radius: 0; background: transparent; }
.water-service-cmms .water-service-feature-copy h3 { margin-top: 0; }
/* Retain the original UI panels, but hide the decorative backgrounds in these full-image composites. */
.water-service-facility .service-screen-asset-feature .service-screen-body img,
.water-service-security .service-screen-assets-feature .service-screen-body img {
    clip-path: polygon(10.1563% 11.7818%, 82.8646% 11.7818%, 82.8646% 41.7455%, 99.3750% 41.7455%, 99.3750% 71.7091%, 88.6979% 71.7091%, 88.6979% 89.8182%, 4.4792% 89.8182%, 4.4792% 66.5455%, 23.2813% 66.5455%, 23.2813% 53.0182%, 10.1563% 53.0182%);
}
.water-service-facility .service-screen-forms-feature .service-screen-body img {
    clip-path: polygon(5.1422% 0.5827%, 61.3786% 0.5827%, 61.3786% 33.3576%, 97.1007% 33.3576%, 97.1007% 99.6358%, 44.7484% 99.6358%, 44.7484% 73.9985%, 5.1422% 73.9985%);
}
.water-service-facility .service-screen-equipment-record-feature .service-screen-body img {
    clip-path: polygon(22.5000% 10.3303%, 92.5521% 10.3303%, 92.5521% 75.0527%, 75.0521% 75.0527%, 75.0521% 85.1019%, 2.8125% 85.1019%, 2.8125% 53.8299%, 22.5000% 53.8299%);
}
/* Keep the real UI pixels, excluding decoration and portraits over blank panel areas. */
.water-service-cmms .service-screen-asset-feature .service-screen-body img { clip-path: polygon(4.5833% 18.6250%, 70.8333% 18.6250%, 70.8333% 50.0000%, 95.7500% 50.0000%, 95.7500% 76.1667%, 32.2917% 76.1667%, 32.2917% 65.6250%, 4.5833% 65.6250%); }
.water-service-cmms .service-screen-overview-feature .service-screen-body img { clip-path: polygon(7.7083% 27.7917%, 88.3333% 27.7917%, 88.3333% 73.1250%, 22.0833% 73.1250%, 22.0833% 62.0833%, 7.7083% 62.0833%); }
.water-service-cmms .service-screen-calendar-feature .service-screen-body img { clip-path: polygon(10.3333% 30.4167%, 88.9583% 30.4167%, 88.9583% 57.5000%, 78.7500% 57.5000%, 78.7500% 69.7500%, 10.3333% 69.7500%); }
/* Mask only the exterior circles and dashed lines in the Security feature composites. */
.water-service-security .service-screen-schedule-feature .service-screen-body img {
    clip-path: polygon(34.7396% 8.5476%, 92.6042% 8.5476%, 92.6042% 51.7026%, 62.0833% 51.7026%, 62.0833% 54.6908%, 92.3438% 54.6908%, 92.3438% 80.9590%, 62.0833% 80.9590%, 62.0833% 87.8388%, 7.3958% 87.8388%, 7.3958% 30.3683%, 34.7396% 30.3683%);
}
.water-service-security .service-screen-portal-feature .service-screen-body img {
    clip-path: polygon(39.9479% 0.0000%, 100.0000% 0.0000%, 100.0000% 70.8447%, 86.9792% 70.8447%, 86.9792% 85.5586%, 38.8021% 85.5586%, 38.8021% 78.8147%, 6.8750% 78.8147%, 6.8750% 14.3052%, 39.9479% 14.3052%);
}
@media (max-width: 1100px) {
    .water-service-page .water-stage-signal-grid,
    .water-service-page .water-stage-capability-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .water-service-page .water-stage-signal-grid > div:nth-child(2n) { border-right: 0; }
    .water-service-page .water-stage-feature-grid { grid-template-columns: 1fr; }
    .water-service-feature-screens { height: auto; min-height: 16rem; flex-direction: row; align-items: center; }
    .water-service-feature-screens .service-screen,
    .water-service-feature-screens:has(> :nth-child(2)) .service-screen { flex: 1 1 0; width: 0; }
    .water-service-page .water-service-feature-copy h3 { min-height: 0; }
}
@media (max-width: 760px) {
    .water-service-page .water-stage-signal-grid,
    .water-service-page .water-stage-capability-grid { grid-template-columns: 1fr; }
    .water-service-page .water-stage-journey-grid strong { min-height: 0; }
    .water-service-feature-screens { flex-direction: column; min-height: 0; }
    .water-service-feature-screens .service-screen,
    .water-service-feature-screens:has(> :nth-child(2)) .service-screen { width: 100%; flex: 0 1 auto; }
    .water-service-hero-screens { gap: .6rem; }
    .water-service-page .service-screen figcaption { font-size: .65rem; }
}
