/* Cleanfil-S durability: one supplied technical slide, reorganized for the web. */
.hl-home .hl-technology-guide { background:#fff; }
.hl-home .hl-guide-head { display:block; text-align:center; }
.hl-home .hl-guide-head .hfm-hero-benefit { margin-inline:auto; max-width:1100px; font-size:clamp(21px, 1.8vw, 27px); line-height:1.75; word-break:keep-all; }
.hl-guide-head .hfm-hero-benefit strong { color:#176db5; font-weight:700; }
@media(max-width:1100px) { .hl-guide-copy-break { display:none; } }
.hl-guide-player { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.9fr); align-items:start; gap:32px; margin:36px 0 30px; }
.hl-home .hl-guide-film { max-width:none; margin:0; }
.hl-home .hl-guide-scenes { display:grid; grid-template-columns:1fr; gap:12px; margin:0; }
.hl-guide-scenes > button { display:flex; align-items:flex-start; gap:14px; width:100%; min-width:0; padding:20px; border:1px solid #d3e2ec; border-radius:12px; background:#eaf5fc; color:#224860; font:inherit; text-align:left; cursor:pointer; }
.hl-guide-scenes > button > span:last-child { display:block; min-width:0; }
.hl-guide-scenes .hfm-path-number { padding-top:3px; }
.hl-guide-scenes small, .hl-guide-scenes strong, .hl-guide-scenes em { display:block; }
.hl-home .hl-guide-scenes strong { font-size:20px; line-height:1.45; margin:7px 0 0; }
.hl-home .hl-guide-scenes .hm-guide-detail { margin:8px 0 12px; font-size:12px; line-height:1.6; }
.hl-guide-scenes em { font-size:12px; line-height:1.6; font-style:normal; }
.hl-guide-scenes em > span { margin-left:8px; font-size:10px; }
.hl-guide-scenes > button[aria-pressed="true"] { background:#176db5; border-color:#176db5; color:#fff; box-shadow:none; }
.hl-home .hl-guide-scenes > button[aria-pressed="true"] :is(.hfm-path-number, small, strong, .hm-guide-detail, em) { color:#fff; }
.hl-guide-scenes > button:hover { border-color:#4a9ac0; }
.hl-guide-scenes > button:focus-visible { outline:3px solid #237da8; outline-offset:3px; }
.hl-home #home-foundation .wf-story-split { display:block; }
.hl-home #home-foundation .wf-story-copy { max-width:960px; }
#home-technology-guide { scroll-margin-top:82px; }
@media(max-width:900px) {
 .hl-guide-player { grid-template-columns:1fr; gap:26px; margin:28px 0; }
 .hl-guide-scenes > button { padding:15px 18px; }
 .hl-home .hl-guide-scenes .hm-guide-detail { margin:5px 0 7px; }
}
@media(max-width:700px) {
 #home-technology-guide { scroll-margin-top:70px; }
}
.hl-home .hm-technology-connection { scroll-margin-top:82px; position:relative; padding:88px 0 84px; margin:0; overflow:hidden; background:radial-gradient(ellipse at 85% 0%,#1f6481 0%,transparent 54%),linear-gradient(120deg,#102d46,#104661); color:#fff; text-align:center; }
.hm-technology-connection::before { content:""; position:absolute; width:800px; height:800px; border:1px solid #ffffff0d; border-radius:50%; top:-550px; left:-350px; pointer-events:none; }
.hm-technology-connection > .wf-section-inner { position:relative; }
.hl-home .hm-technology-connection h2 { margin:0; color:#fff; font-size:clamp(34px,3.9vw,56px); line-height:1.3; letter-spacing:-.045em; font-weight:700; }
.hm-technology-connection h2 span { color:#94e0ed; }
.hm-connection-description { text-wrap:balance; max-width:860px; margin:28px auto 0; color:#c6dce7; font-size:17px; line-height:1.9; font-weight:400; }
.hm-connection-benefit { margin:28px auto 0; color:#f2f8fc; font-size:21px; font-weight:500; line-height:1.8; letter-spacing:-.02em; }
.hm-connection-link { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:52px; margin-top:32px; padding:14px 24px; border:1px solid #94c8dd; border-radius:6px; background:#ffffff08; color:#fff; font-size:14px; line-height:1.6; font-weight:600; text-decoration:none; }
.hm-connection-link:hover { background:#ffffff16; border-color:#fff; }
.hm-connection-link:focus-visible { outline:3px solid #a2e5ef; outline-offset:5px; }
@media(max-width:700px) {
 .hl-home .hm-technology-connection { scroll-margin-top:70px; padding:64px 0; }
 .hl-home .hm-technology-connection h2 { font-size:32px; line-height:1.4; }
 .hm-connection-description { font-size:15px; margin-top:24px; }
 .hm-connection-benefit { font-size:18px; margin-top:24px; }
 .hm-connection-benefit br { display:none; }
 .hm-connection-link { max-width:100%; gap:16px; font-size:13px; padding:13px 18px; }
}
.hl-home .hfm-first-path .hm-guide-detail { display:block; margin:7px 0 16px; font-size:13px; line-height:1.6; color:#648094; font-weight:400; }
.hl-home .hfm-first-path strong { font-size:21px; margin:7px 0 0; }
.hl-home .hfm-hero-scope a { color:#287698; text-decoration:underline; text-underline-offset:3px; margin-left:8px; }
.hl-home .hm-proof { padding:104px 0 82px; background:#f6f9fb; }
.hm-proof-head { display:block; grid-template-columns:minmax(0,1fr) 270px; gap:60px; align-items:center; margin-bottom:78px; }
.hl-home .hm-proof-head h2 { color:#173e5a; font-size:clamp(32px,3.25vw,46px); font-weight:700; line-height:1.38; letter-spacing:-.045em; margin:0 0 25px; }
.hm-lead { color:#5f7c90; font-size:18px; line-height:1.85; margin:0; font-weight:400; }
.hm-strength-number { display:flex; flex-direction:column; align-items:flex-start; gap:20px; padding:34px 0 34px 34px; border-left:1px solid #bbd7e6; color:#24759a; text-decoration:none; }
.hm-strength-number > span { font-size:12px; color:#59829b; }
.hm-strength-number > strong { font-size:86px; font-weight:650; letter-spacing:-.06em; line-height:1; white-space:nowrap; }
.hm-strength-number small { font-size:23px; letter-spacing:-.02em; font-weight:500; }
.hm-strength-number em { font-size:12px; line-height:1.6; font-style:normal; color:#3d87a9; }
.hm-chapter { margin-top:76px; padding-top:65px; border-top:1px solid #d4e3ed; }
#home-peeling-chart { scroll-margin-top:90px; }
.hm-peeling-chapter > .hm-chart-panel { margin-top:32px; }
.hm-peeling-overview { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:44px; margin-bottom:44px; }
.hm-peeling-copy .hm-chapter-head { grid-template-columns:32px minmax(0,1fr); gap:16px; margin-bottom:0; }
.hm-peeling-copy .hm-step { width:30px; height:30px; font-size:11px; }
.hm-peeling-copy .hm-chapter-head h3 { font-size:clamp(26px,2.2vw,32px); line-height:1.5; }
.hm-peeling-copy .hm-chapter-head > div > p:last-child { font-size:14px; }
.hm-peeling-copy .hm-definition { margin:28px 0 0 48px; padding:24px; border:1px solid #c9deeb; border-radius:12px; background:#eaf3f8; }
.hm-peeling-copy .hm-definition h4 { font-size:20px; }
.hm-peeling-copy .hm-definition p { font-size:14px; line-height:1.85; }
.hm-peeling-overview > .hm-chart-panel { min-width:0; padding:26px 20px 18px; }
.hm-peeling-overview .hm-chart-panel > figcaption { display:block; }
.hm-peeling-overview .hm-chart-unit { display:block; margin-top:8px; }
.hm-peeling-overview .hm-chart-panel svg { margin-top:18px; }
.hm-peeling-overview .hm-chart-tick { font-size:21px; }
.hm-peeling-overview .hm-chart-value { font-size:34px; }
.hm-peeling-overview .hm-chart-label { font-size:28px; }
@media(max-width:1000px) {
 .hm-peeling-overview { grid-template-columns:1fr; gap:30px; }
 .hm-peeling-copy .hm-chapter-head h3 { font-size:30px; }
}
@media(max-width:700px) {
 .hm-peeling-copy .hm-chapter-head h3 { font-size:26px; }
 .hm-peeling-copy .hm-definition { margin-left:0; }
 .hm-peeling-overview > .hm-chart-panel { padding:24px 12px; }
 .hm-peeling-overview .hm-chart-tick { font-size:30px; }
 .hm-peeling-overview .hm-chart-value { font-size:42px; }
 .hm-peeling-overview .hm-chart-label { font-size:34px; }
}
.hm-chapter-head { display:grid; grid-template-columns:55px minmax(0,1fr); gap:26px; margin:0 0 34px; }
.hm-step { display:flex; width:40px; height:40px; align-items:center; justify-content:center; border-radius:50%; border:1px solid #91b9cf; color:#3685a7; font-size:12px; font-weight:650; margin-top:3px; }
.hm-eyebrow { display:block; color:#49829f; font-size:12px; line-height:1.6; font-weight:600; margin:0 0 14px; letter-spacing:.025em; }
.hm-chapter-head h3 { font-size:34px; font-weight:650; letter-spacing:-.04em; line-height:1.45; color:#1a435f; margin:0 0 20px; }
.hm-chapter-head h3:last-child { margin-bottom:0; }
.hm-chapter-head > div > p:last-child { max-width:920px; margin:0; color:#668092; font-size:16px; line-height:1.9; font-weight:400; }
.hm-chapter-head p strong { color:#3b718e; font-weight:600; }
.hm-comparison { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.hm-material { border:1px solid #d7e3ea; background:#fff; border-radius:16px; overflow:hidden; }
.hm-material.is-hifilm { border-color:#82b8d3; }
.hm-material > header { padding:25px 29px; background:#eef3f6; }
.hm-material.is-hifilm > header { background:#e3f1f8; }
.hm-material > header > span { color:#7d919e; font-size:10px; font-weight:650; letter-spacing:.12em; }
.hm-material.is-hifilm > header > span { color:#2e87ae; }
.hm-material h4 { color:#34596f; font-size:24px; font-weight:650; margin:0; line-height:1.45; letter-spacing:-.03em; }
.hm-material.is-hifilm h4 { color:#1f6e97; }
.hm-material > header p { color:#6f889a; font-size:13px; line-height:1.7; margin:8px 0 0; }
.hm-proof .hm-photo { margin:0; padding:28px; }
.hm-photo > a { display:block; border-radius:8px; overflow:hidden; }
.hm-photo img { display:block; width:100%; height:auto; }
.hm-interface-comparison .hm-photo > a { display:flex; justify-content:center; align-items:center; min-height:360px; background:#f2f5f6; }
.hm-interface-comparison .hm-photo img { height:360px; object-fit:contain; }
.hm-photo figcaption { color:#6a8294; font-size:12px; line-height:1.8; margin-top:17px; }
.hm-layer-explanation { padding-top:40px; }
.hm-layer-explanation > div { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:48px; align-items:center; }
.hm-layer-explanation .hm-eyebrow { grid-column:1/-1; }
.hm-layer-explanation h3 { font-size:28px; color:#234e68; line-height:1.5; margin:0; font-weight:600; letter-spacing:-.03em; }
.hm-layer-explanation > div > p:last-child { color:#6e889a; font-size:16px; line-height:1.8; margin:0; }
.hm-layer-explanation dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; margin:28px 0 0; }
.hm-layer-explanation dl > div { padding:24px 0 0; border-top:1px solid #ccdde8; }
.hm-layer-explanation dt { color:#3a7493; font-size:17px; font-weight:600; }
.hm-layer-explanation dd { font-size:15px; color:#6b8395; line-height:1.8; margin:10px 0 0; }
.hm-test-setup { display:grid; grid-template-columns:286px minmax(0,1fr); align-items:center; gap:52px; padding:30px 38px; margin:0 0 32px; border:1px solid #d8e4ec; border-radius:15px; background:#fff; }
.hm-test-setup img { display:block; width:286px; height:241px; object-fit:contain; }
.hm-test-setup h4 { color:#28536d; font-size:25px; font-weight:600; line-height:1.5; letter-spacing:-.03em; margin:0 0 15px; }
.hm-test-setup p { font-size:15px; font-weight:400; line-height:1.85; color:#688398; margin:0 0 16px; }
.hm-proof .hm-specimen { padding-bottom:22px; border-bottom:1px solid #e3ebf0; }
.hm-specimen > a { display:flex; align-items:center; justify-content:center; background:#f5f7f8; min-height:176px; }
.hm-specimen img { width:320px; height:153px; max-width:100%; object-fit:contain; }
.hm-specimen figcaption { text-align:center; }
.hm-proof .hm-braid { padding-top:24px; }
.hm-braid img { aspect-ratio:2.36; object-fit:contain; background:#f5f7f8; }
.hm-source-note { color:#738a9a; font-size:12px; font-weight:400; line-height:1.85; margin:22px 0 0; }
.hm-chart-panel { background:#fff; border:1px solid #d7e4ed; border-radius:18px; padding:35px 42px 28px; margin:0; }
.hm-chart-panel > figcaption { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.hm-chart-panel h4 { color:#2a5672; font-size:25px; font-weight:650; line-height:1.5; margin:0; }
.hm-chart-panel .hm-eyebrow { font-size:10px; letter-spacing:.12em; margin-bottom:8px; }
.hm-chart-unit { color:#65899e; font-size:12px; line-height:1.7; }
.hm-chart-panel svg { display:block; width:100%; max-width:920px; height:auto; margin:28px auto 0; overflow:visible; }
.hm-chart-grid { stroke:#dde7ee; stroke-width:1; }
.hm-chart-tick { fill:#7892a3; font-size:14px; font-weight:400; }
.hm-animated-bar { transform-box:fill-box; transform-origin:center bottom; }
.hm-bar-hifilm { fill:#167eae; }.hm-bar-reference { fill:#becbd4; }
.hm-chart-value { fill:#2b6c90; font-size:25px; font-weight:650; }
.hm-chart-label { fill:#345d77; font-size:21px; font-weight:600; }.hm-chart-sub { fill:#849aa9; font-size:13px; }
.hm-chart-controls { display:flex; align-items:center; justify-content:center; gap:14px; margin:10px 0 0; flex-wrap:wrap; }
.hm-chart-controls button, .hm-chart-controls a { display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:11px 16px; min-height:44px; border:1px solid #c8dce9; border-radius:6px; background:#fff; color:#367e9f; font-size:12px; font-weight:550; cursor:pointer; text-decoration:none; }
.hm-chart-controls a { border-color:transparent; }
.hm-chart-controls button[aria-pressed="true"] { background:#eaf4f9; border-color:#88b3cc; }
.hm-chart-controls button:disabled { color:#6c7e8a; cursor:default; background:#f3f6f8; }
.hm-motion-status { font-size:12px; line-height:1.7; color:#64839a; margin:18px 0 0; text-align:center; }
.hm-original-claims { padding:29px 32px; border-left:3px solid #61a4c4; background:#eaf3f8; margin-top:28px; }
.hm-original-claims blockquote { font-size:21px; line-height:1.7; font-weight:600; color:#326885; margin:0; letter-spacing:-.02em; }
.hm-original-claims > p:last-child { color:#6b8699; font-size:12px; line-height:1.8; margin:17px 0 0; }
.hm-definition { padding:30px 0; border-bottom:1px solid #d6e4ed; }
.hm-definition h4 { color:#325f79; font-size:22px; line-height:1.5; font-weight:650; margin:0 0 16px; }
.hm-definition p { font-size:15px; color:#6b8396; line-height:1.9; margin:12px 0 0; }
.hm-definition strong { font-weight:600; color:#49768e; }
.hm-source-details { border:1px solid #d0e0eb; border-radius:10px; background:#fff; margin-top:24px; }
.hm-source-details > summary { padding:22px 25px; font-size:14px; font-weight:600; color:#3a7598; cursor:pointer; }
.hm-source-details > div { padding:0 25px 25px; }
.hm-source-details p { color:#6d8598; font-size:13px; line-height:1.9; margin:0 0 20px; }
.hm-source-details table { width:100%; border-collapse:collapse; font-size:13px; line-height:1.7; color:#587a90; margin:20px 0; }
.hm-source-details caption { text-align:left; padding-bottom:12px; font-weight:650; color:#2e6788; }
.hm-source-details th,.hm-source-details td { text-align:left; vertical-align:top; border-bottom:1px solid #dce7ef; padding:14px 12px; }
.hm-source-details th { font-weight:600; background:#f3f8fb; }
.hm-original-slide { display:block; width:100%; height:auto; margin-top:24px; }
.hl-home .hm-proof > .wf-section-inner > .hfm-term-note { margin:40px 0 0; max-width:1040px; }
.hl-home .hm-proof .hfm-connection { margin:30px 0 0; padding:32px 38px; }
@media(prefers-reduced-motion:reduce) { .hm-animated-bar { animation:none!important; transform:none!important; } }
@media(max-width:1000px) {
 .hm-proof-head { gap:30px; grid-template-columns:minmax(0,1fr) 210px; }
 .hm-strength-number { padding-left:24px; }.hm-strength-number > strong { font-size:68px; }.hm-strength-number small { font-size:19px; }
 .hm-lead { font-size:16px; }
 .hm-chapter-head h3 { font-size:30px; }.hm-comparison { gap:20px; }
 .hm-proof .hm-photo { padding:22px; }.hm-interface-comparison .hm-photo > a { min-height:295px; }.hm-interface-comparison .hm-photo img { height:295px; }
 .hm-material > header { padding:23px; }.hm-material h4 { font-size:22px; }
 .hm-test-setup { gap:28px; padding:28px; grid-template-columns:230px minmax(0,1fr); }.hm-test-setup img { width:230px; height:auto; }
 .hm-chart-panel { padding:28px; }
}
@media(max-width:700px) {
 .hl-home .hfm-first-path a > span:last-child { display:block; }
 .hl-home .hfm-first-path small { font-size:12px; }.hl-home .hfm-first-path strong { font-size:20px; margin-top:6px; }
 .hl-home .hfm-first-path .hm-guide-detail { margin:6px 0 10px; font-size:12px; }
 .hl-home .hfm-first-path em { width:auto; font-size:12px; }
 .hl-home .hm-proof { padding:65px 0; }.hm-proof-head { display:block; margin-bottom:44px; }
 .hl-home .hm-proof-head h2 { font-size:31px; line-height:1.4; }.hm-lead { font-size:16px; }.hm-lead br { display:none; }
 .hm-strength-number { padding:25px 0 0; border-left:0; border-top:1px solid #c5dce9; margin-top:28px; gap:14px; }
 .hm-strength-number > strong { font-size:72px; }.hm-strength-number small { font-size:23px; }
 .hm-chapter { padding-top:42px; margin-top:44px; }.hm-chapter-head { grid-template-columns:32px minmax(0,1fr); gap:14px; margin-bottom:25px; }
 .hm-step { width:29px; height:29px; font-size:10px; }.hm-chapter-head h3 { font-size:26px; }.hm-eyebrow { font-size:11px; }
 .hm-chapter-head > div > p:last-child { font-size:14px; line-height:1.85; }
 .hm-comparison { grid-template-columns:1fr; gap:24px; }.hm-material > header { padding:22px; }.hm-material h4 { font-size:23px; }
 .hm-interface-comparison .hm-photo img { height:300px; }.hm-interface-comparison .hm-photo > a { min-height:300px; }
 .hm-layer-explanation > div { display:block; }.hm-layer-explanation h3 { font-size:26px; margin-bottom:18px; }.hm-layer-explanation > div > p:last-child { font-size:15px; }
 .hm-layer-explanation dl { grid-template-columns:1fr; gap:0; margin-top:25px; }.hm-layer-explanation dl > div { padding:21px 0; }
 .hm-test-setup { grid-template-columns:1fr; padding:25px; gap:24px; }.hm-test-setup img { width:min(100%,286px); margin:auto; }
 .hm-test-setup h4 { font-size:23px; }.hm-test-setup p { font-size:14px; }
 .hm-chart-panel { padding:24px 12px; border-radius:13px; }.hm-chart-panel > figcaption { align-items:flex-start; flex-direction:column; gap:10px; padding-inline:7px; }.hm-chart-panel h4 { font-size:23px; }.hm-chart-unit { font-size:11px; }
 .hm-chart-panel svg { margin:20px 0; }.hm-chart-tick { font-size:30px; }.hm-chart-value { font-size:42px; }.hm-chart-label { font-size:34px; }.hm-chart-sub { font-size:26px; }
 .hm-chart-controls { gap:8px; }.hm-chart-controls button,.hm-chart-controls a { font-size:11px; padding:10px 11px; }
 .hm-source-note { font-size:11px; padding-inline:5px; }
 .hm-original-claims { padding:24px 22px; }.hm-original-claims blockquote { font-size:18px; }
 .hm-definition p { font-size:14px; }.hm-source-details > summary { padding:20px; font-size:13px; }.hm-source-details > div { padding:0 16px 20px; }
 .hm-source-details th,.hm-source-details td { font-size:11px; padding:10px 6px; }.hm-source-details table { table-layout:fixed; }
 .hl-home .hm-proof .hfm-connection { padding:26px; }
}

/* Blue emphasis sweeps from left to right without moving the copy. */
@supports ((background-clip:text) or (-webkit-background-clip:text)) {
 .hl-guide-head .hl-copy-highlight { background-image:linear-gradient(to right,#176db5 50%,#9aabb8 50%); background-size:200% 100%; background-position:0% 0%; background-clip:text; -webkit-background-clip:text; color:transparent; }
}

/* Current-scene captions sit inside the lower edge of each explainer film. */
.hfv-film[data-film] .hfv-screen > .hfv-caption {
 position:absolute; inset:auto 0 0; z-index:3; width:100%; max-width:none;
 box-sizing:border-box; margin:0 !important; min-height:0 !important;
 padding:28px 24px 18px !important; color:#fff !important; font-size:clamp(13px,1.1vw,17px) !important;
 font-weight:500; line-height:1.65; text-align:center; word-break:keep-all;
 background:linear-gradient(to bottom,rgba(12,32,48,0),rgba(12,32,48,.64) 40%,rgba(12,32,48,.78));
 text-shadow:0 1px 3px rgba(0,0,0,.45); pointer-events:none;
}
@media(max-width:700px) {
 .hfv-film[data-film] .hfv-screen > .hfv-caption { padding:20px 14px 12px !important; font-size:12px !important; line-height:1.5; }
}

/* Align the three-card stack with the film and share one corner radius. */
.hl-guide-player { --guide-radius:16px; }
.hl-guide-player .hl-guide-scenes > button,
.hl-home .hl-guide-player .hfv-film-editorial .hfv-screen { border-radius:var(--guide-radius); }
@media(min-width:901px) {
 .hl-guide-player { align-items:stretch; }
 .hl-home .hl-guide-scenes { grid-template-rows:repeat(3,minmax(0,1fr)); }
 .hl-guide-scenes > button { align-items:center; }
 .hl-home .hl-guide-scenes .hm-guide-detail { margin-bottom:0; }
 .hl-home .hl-guide-film { display:flex; }
 .hl-guide-film > .hfv-film { display:flex; flex-direction:column; flex:1; min-width:0; }
 .hl-guide-film > .hfv-film > .hfv-screen { flex:1; width:100%; }
}

/* Material introduction: headline left, supporting copy right. */
.hl-home #home-foundation .wf-story-copy {
 display:grid; grid-template-columns:1.08fr 1fr; column-gap:60px; row-gap:24px;
 max-width:none; align-items:start;
}
.hl-home #home-foundation .wf-story-copy > .wf-kicker { grid-column:1 / -1; margin:0; }
.hl-home #home-foundation .wf-story-copy > h2 { margin:0; }
.hl-foundation-description { min-width:0; }
.hl-home #home-foundation .hl-foundation-description p { margin:0; color:#5c7385; font-size:16px; line-height:1.85; font-weight:400; word-break:keep-all; }
.hl-home #home-foundation .hl-foundation-description p + p { margin-top:20px; }
@media(max-width:900px) {
 .hl-home #home-foundation .wf-story-copy { grid-template-columns:1fr; gap:22px; }
 .hl-home #home-foundation .hl-foundation-description p { font-size:15px; }
}

.hl-home #home-foundation h2 .hl-foundation-accent { color:#176db5; }

/* Cleanfil-S opening band. */
.hl-home .hm-proof { padding-top:0; }
.hl-home .hm-proof-head { padding:104px 0 78px; margin:0; background:#001d3a; }
.hl-home .hm-proof-head h2 { color:#fff; }
.hl-home .hm-proof-head .wf-kicker { color:#d4ebff; }
.hl-home .hm-proof-head .hm-lead { color:#e6f2fc; }
.hl-home .hm-proof > .wf-section-inner > .hm-chapter:first-child { margin-top:0; border-top:0; }
@media(max-width:700px) {
 .hl-home .hm-proof-head { padding:65px 0 48px; }
}

.hl-home .hm-proof-head { text-align:center; }

/* Peeling proof: copy and definition above an open comparison graph. */
.hm-peeling-overview { grid-template-columns:1.1fr 1fr; align-items:center; gap:54px; margin-bottom:38px; }
.hm-peeling-overview > .hm-definition { margin:0; padding:26px 30px; border:1px solid #c9deeb; border-radius:16px; background:#eaf3f8; }
.hm-peeling-overview > .hm-definition h4 { font-size:21px; }
.hm-peeling-overview > .hm-definition p { font-size:15px; line-height:1.85; }
.hm-peeling-chapter > .hm-chart-panel { padding:0; margin:0 0 50px; background:transparent; border:0; border-radius:0; box-shadow:none; }
.hm-peeling-chapter > .hm-chart-panel svg { width:100%; max-width:1100px; margin:0 auto; }
.hm-peeling-chapter > .hm-chart-panel > .hm-chart-unit { display:block; margin:10px 0 0; text-align:center; font-size:12px; }
.hm-percent-badge { transform-box:fill-box; transform-origin:center; }
@media(max-width:900px) {
 .hm-peeling-overview { grid-template-columns:1fr; gap:26px; }
 .hm-peeling-overview > .hm-definition { padding:22px; }
}
@media(max-width:700px) {
 .hm-peeling-chapter > .hm-chart-panel .hm-chart-tick { font-size:22px; }
 .hm-peeling-chapter > .hm-chart-panel .hm-chart-value { font-size:30px; }
 .hm-peeling-chapter > .hm-chart-panel .hm-chart-label { font-size:28px; }
 .hm-peeling-chapter > .hm-chart-panel > .hm-chart-unit { font-size:11px; }
}

/* WAVE opening: match the centered Cleanfil-S blue header. */
.hl-home #home-device { padding:0; }
.hl-home .hm-wave-head { padding:104px 0 78px; background:#001d3a; text-align:center; }
.hl-home .hm-wave-head .wf-kicker { color:#d4ebff; }
.hl-home .hm-wave-head h2 { margin:0 0 25px; color:#fff; font-size:clamp(32px,3.25vw,46px); font-weight:700; line-height:1.38; letter-spacing:-.045em; word-break:keep-all; }
.hl-home .hm-wave-head .hm-wave-lead { max-width:960px; margin:0 auto; color:#e6f2fc; font-size:18px; line-height:1.85; font-weight:400; word-break:keep-all; }
.hl-home .hm-wave-description { max-width:960px; margin:20px auto 0; color:#e6f2fc; font-size:16px; line-height:1.85; word-break:keep-all; text-wrap:balance; }
.hl-home .hm-wave-description p { margin:0; color:inherit; font:inherit; }
.hl-home .hm-wave-description p + p { margin-top:12px; }
.hl-home .hm-wave-video { margin:0 0 48px; }
@media(max-width:700px) {
 .hl-home .hm-wave-head { padding:65px 0 48px; }
 .hl-home .hm-wave-head h2 { font-size:31px; line-height:1.4; }
 .hl-home .hm-wave-head .hm-wave-lead { font-size:16px; }
 .hl-home .hm-wave-description { font-size:15px; }
 .hl-home .hm-wave-video { margin-bottom:32px; }
}

/* WAVE benefits from the supplied three-card reference. */
.hm-wave-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; margin-top:48px; }
.hm-wave-benefits article { position:relative; min-width:0; min-height:380px; padding:30px; border:1px solid #cfe3f0; border-radius:18px; background:#fff; overflow:hidden; }
.hm-wave-benefits .hm-benefit-number { display:inline-block; color:#d0d3d5; font-size:42px; line-height:1.1; font-weight:700; border-bottom:4px solid currentColor; }
.hm-wave-benefits .hm-benefit-copy { position:relative; z-index:1; margin-top:38px; }
.hm-wave-benefits .hm-benefit-copy p { margin:0 0 8px; color:#4c5257; font-size:17px; line-height:1.65; word-break:keep-all; }
.hm-wave-benefits .hm-benefit-copy h3 { margin:0; color:#20272c; font-size:clamp(22px,2vw,28px); font-weight:700; line-height:1.45; letter-spacing:-.035em; word-break:keep-all; }
.hm-wave-benefits .hm-benefit-copy strong { color:#176db5; font-weight:700; }
.hm-wave-benefits .hm-benefit-icon { position:absolute; right:8px; bottom:-5px; width:118px; height:118px; color:#d2e9ed; }
@media(max-width:900px) {
 .hm-wave-benefits { gap:16px; }
 .hm-wave-benefits article { padding:22px; }
}
@media(max-width:700px) {
 .hm-wave-benefits { grid-template-columns:1fr; gap:20px; margin-top:32px; }
 .hm-wave-benefits article { min-height:310px; padding:26px; }
 .hm-wave-benefits .hm-benefit-copy { margin-top:28px; }
 .hm-wave-benefits .hm-benefit-copy h3 { font-size:26px; }
}

/* Transition from comparison to the three WAVE benefits. */
.hm-wave-benefits-intro { margin-top:54px; text-align:center; }
.hm-wave-down-arrow { width:100px; height:110px; margin:0 auto 30px; background:linear-gradient(180deg,#d8edfc00 0%,#83c3ed 30%,#176db5 100%); clip-path:polygon(28% 0,72% 0,72% 56%,100% 56%,50% 100%,0 56%,28% 56%); }
.hl-home .hm-wave-benefits-intro h2 { margin:0; color:#173951; font-size:clamp(30px,3.1vw,44px); line-height:1.4; font-weight:700; letter-spacing:-.04em; word-break:keep-all; }
.hl-home .hm-wave-benefits-intro h2 span { color:#176db5; }
@media(max-width:700px) {
 .hm-wave-benefits-intro { margin-top:40px; }
 .hm-wave-down-arrow { width:78px; height:88px; margin-bottom:24px; }
 .hl-home .hm-wave-benefits-intro h2 { font-size:28px; }
}

.hl-home #home-problem .wf-story-head h2 .hm-aeration-energy-accent { color:#176db5; }

/* Research headline: draw toward the reported saving, then reveal it. */
.hm-energy-heading { display:grid; grid-template-columns:1.1fr 1fr; gap:54px; align-items:center; margin-bottom:54px; }
.hl-home .hm-energy-heading h2 { margin:0; color:#173951; font-size:clamp(30px,3vw,44px); font-weight:700; line-height:1.45; letter-spacing:-.04em; word-break:keep-all; }
.hl-home .hm-energy-heading h2 span { color:#176db5; }
.hm-energy-callout { display:flex; align-items:center; gap:28px; min-width:0; }
.hm-energy-line { display:block; flex:1; min-width:50px; height:5px; background:#176db5; transform-origin:left center; border-radius:3px; }
.hm-energy-percent { display:block; flex-shrink:0; color:#176db5; font-size:clamp(56px,6vw,86px); font-weight:750; line-height:1.2; letter-spacing:-.055em; white-space:nowrap; }
.hl-home #home-energy .hl-energy-preview { padding:0; border:0; border-radius:0; background:transparent; }
.hl-home #home-energy .hl-energy-unit, .hl-home #home-energy .hl-energy-chart { max-width:none; }
@media(max-width:820px) {
 .hm-energy-heading { grid-template-columns:1fr; gap:28px; margin-bottom:38px; }
 .hm-energy-callout { gap:24px; }
 .hm-energy-percent { font-size:64px; }
}

#home-energy .hl-energy-row i { transform-origin:left center; }

/* Centered vertical savings headline and downward gradient reveal. */
.hm-energy-heading { display:flex; flex-direction:column; gap:28px; text-align:center; }
.hm-energy-callout { flex-direction:column; gap:24px; }
.hm-energy-line { flex:none; width:5px; min-width:0; height:88px; background:linear-gradient(180deg,rgba(23,109,181,0),#73b9e7 35%,#176db5); transform-origin:center top; }
@media(max-width:820px) {
 .hm-energy-heading { gap:24px; }
 .hm-energy-line { height:68px; }
}

/* System opening uses the footer navy with selective blue emphasis. */
.hl-home #home-applications { padding-top:0; }
.hl-home .hm-system-head { padding:104px 0 78px; background:#001d3a; text-align:center; }
.hl-home .hm-system-head .hm-system-emphasis { color:#48aaff; }
.hl-home .hm-system-lead .hm-system-emphasis { font-weight:600; }
.hl-home .hm-system-head .wf-kicker { color:#d4ebff; }
.hl-home .hm-system-head h2 { margin:0 0 25px; color:#fff; font-size:clamp(32px,3.25vw,46px); font-weight:700; line-height:1.38; letter-spacing:-.045em; word-break:keep-all; }
.hl-home .hm-system-lead { max-width:1040px; margin:0 auto; color:#e6f2fc; font-size:18px; line-height:1.85; font-weight:400; word-break:keep-all; text-wrap:balance; }
.hl-home .hm-system-content { padding-top:64px; }
.hl-home .hm-system-content .wf-story-case-grid { margin-top:0; }
@media(max-width:700px) {
 .hl-home .hm-system-head { padding:65px 0 48px; }
 .hl-home .hm-system-head h2 { font-size:31px; line-height:1.4; }
 .hl-home .hm-system-lead { font-size:16px; }
 .hl-home .hm-system-content { padding-top:36px; }
}

/* Photo-led treatment fields: titles only. */
.hm-system-gallery { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.hm-system-photo-card { display:block; min-width:0; overflow:hidden; border:1px solid #d8e4ed; border-radius:18px; background:#fff; text-decoration:none; }
.hm-system-photo-card img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
.hl-home .hm-system-photo-card h3 { margin:0; padding:21px 18px; color:#173951; font-size:22px; line-height:1.4; font-weight:700; letter-spacing:-.03em; }
.hm-system-photo-card:hover { border-color:#176db5; }
@media(max-width:700px) {
 .hm-system-gallery { grid-template-columns:repeat(4,minmax(240px,1fr)); gap:18px; overflow-x:auto; padding-bottom:12px; scroll-snap-type:x proximity; }
 .hm-system-photo-card { scroll-snap-align:start; }
 .hl-home .hm-system-photo-card h3 { padding:20px 22px; font-size:23px; }
}

.hl-home .wf-story-cta h2 .hm-cta-accent { color:#176db5; }

/* Exchange the comparison and energy section backgrounds. */
.hl-home #home-problem { background:#fff; }
.hl-home #home-energy { background:#f5f8fa; }

/* Match homepage navigation edges to the section containers. */
body[data-view="home"] .wf-navrow { width:min(1200px,calc(100% - 80px)); margin-inline:auto; padding-inline:0; }
@media(max-width:1050px) {
 body[data-view="home"] .wf-navrow { width:calc(100% - 48px); }
}
@media(max-width:600px) {
 body[data-view="home"] .wf-navrow { width:calc(100% - 36px); }
}

@media(min-width:1021px) and (max-width:1240px) {
 body[data-view="home"] .wf-navrow .wf-brand { min-width:190px; }
}

/* Match the closing consultation headline to the system headline. */
.hl-home .wf-story-cta h2 { font-size:clamp(32px,3.25vw,46px); line-height:1.38; }
@media(max-width:700px) {
 .hl-home .wf-story-cta h2 { font-size:31px; line-height:1.4; }
}

/* A single application-and-consultation section with an even vertical rhythm. */
.hl-home #home-applications { --system-closing-gap:104px; padding-bottom:0; background:#edf5fa; }
.hl-home #home-applications .hm-system-cta { margin:var(--system-closing-gap) 0 0; padding:0 0 var(--system-closing-gap); border:0; background:transparent; }
.hl-home #home-applications .hm-system-cta .wf-section-inner { display:flex; flex-direction:column; align-items:center; gap:32px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.hl-home #home-applications .hm-system-cta h2 { margin:0; }
.hl-home #home-applications .hm-system-cta .wf-actions { margin:0; }
@media(max-width:700px) {
 .hl-home #home-applications { --system-closing-gap:64px; }
}

/* Match the SYSTEM band: footer navy, white copy, selective accessible blue. */
.hl-home :is(.hm-proof-head,.hm-wave-head) .hm-band-emphasis { color:#48aaff; }
.hl-home .hm-wave-description .hm-band-emphasis { font-weight:600; }

body[data-view="home"] .wf-hero-copy h1 .hm-hero-a2z { color:#b7edf0; }