.service-animation{--anim-ink:#243a42;--anim-red:#b51d30;--anim-paper:#fffaf0;box-sizing:border-box;background:var(--anim-paper);max-width:1280px;color:var(--anim-ink);isolation:isolate;border:1px solid #d6cfc0;border-radius:22px;margin:64px auto;padding:clamp(22px,4vw,52px);overflow:hidden}.animation-heading{grid-template-columns:1.3fr 1fr;align-items:end;gap:32px;margin-bottom:30px;display:grid}.service-animation .animation-eyebrow{letter-spacing:.13em;text-transform:uppercase;color:#9e2330;margin:0 0 12px;font-size:11px;font-weight:800;line-height:1.5}.service-animation .animation-heading h2{letter-spacing:-.045em;color:var(--anim-ink);font-size:clamp(29px,3.4vw,48px);line-height:1.05;margin:0!important}.animation-heading h2 span{color:var(--anim-red)}.animation-heading>p{max-width:400px;margin:0;font-size:16px;line-height:1.65}.animation-chooser{border-top:1px solid #ded6c8;flex-wrap:wrap;align-items:center;gap:14px;padding:16px 0 26px;display:flex}.animation-chooser label{font-size:13px;font-weight:800}.animation-chooser select{max-width:100%;min-height:46px;color:var(--anim-ink);font:inherit;background:#fff;border:1px solid #9baca9;border-radius:6px;padding:10px 38px 10px 13px;font-size:14px}.animation-chooser>span{color:#53666a;margin-left:auto;font-size:12px}.animation-body{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:32px;display:grid}.animation-visual{background:#eef5f1;border:1px solid #bfcec6;border-radius:14px;min-width:0;overflow:hidden}.animation-scene-label{letter-spacing:.14em;color:#48645a;justify-content:space-between;padding:17px 20px 0;font-size:10px;font-weight:800;display:flex}.service-cartoon{width:100%;height:auto;display:block}.service-cartoon text{fill:#40565c;font:600 13px system-ui,sans-serif}.animation-controls{background:#e3ede6;border-top:1px solid #bfcec6;align-items:center;gap:8px;padding:14px 16px;display:flex}.animation-controls button{color:#243a42;cursor:pointer;white-space:nowrap;background:#fffaf0;border:1px solid #9caf9f;border-radius:6px;min-height:40px;padding:10px 12px;font:700 12px system-ui,sans-serif}.animation-controls>span{text-align:right;color:#53666a;margin-left:auto;font-size:10px;line-height:1.5}.service-animation .animation-explanation h3{letter-spacing:-.035em;color:var(--anim-ink);margin:0 0 12px;font-size:clamp(25px,2.5vw,34px);line-height:1.1}.animation-summary{margin:0 0 18px;font-size:14px;line-height:1.65}.animation-steps{gap:8px;margin:0;padding:0;list-style:none;display:grid}.animation-steps li{margin:0;padding:0}.animation-steps button{text-align:left;width:100%;color:var(--anim-ink);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;gap:13px;padding:12px;display:flex}.animation-steps button[aria-current=step]{background:#fff;border-color:#d4c8b8;box-shadow:0 3px #e8dece}.animation-step-number{background:#e8e1d3;border-radius:50%;flex:none;place-items:center;width:29px;height:29px;font-size:11px;font-weight:800;display:grid}.animation-steps button[aria-current=step] .animation-step-number{background:var(--anim-red);color:#fff}.animation-steps strong{font:800 14px system-ui,sans-serif;display:block}.animation-step-copy{color:#53666a;margin-top:5px;font:13px/1.55 system-ui,sans-serif;display:block}.service-animation .animation-note{color:#5d6866;border-top:1px solid #ded6c8;margin:26px 0 0;padding-top:18px;font-size:11px;line-height:1.65}.animation-steps button:hover,.animation-controls button:hover{border-color:var(--anim-red)}.service-cartoon .cleaning-tool{transform:translate(45px)}.is-playing .cleaning-tool{animation:3s ease-in-out infinite tool-work}.is-playing .brush-spin{transform-origin:350px 276px;animation:.65s linear infinite brush-work}.is-playing .water-jets{animation:.7s linear infinite water-work}.is-playing .buildup-clearing{animation:4.8s ease-out infinite buildup-clear}.is-playing .camera-travels{animation:4.8s ease-in-out infinite camera-work}.service-cartoon .burst-head-moving{transform:translate(60px)}.is-playing .burst-head-moving{animation:4.8s linear infinite burst-work}.is-playing .liner-expanding{transform-origin:360px 275px;animation:4.8s ease-out infinite liner-work}.is-playing .curing-light{animation:4.8s ease-in-out infinite camera-work}.is-playing .flow-dashes{animation:1.6s linear infinite water-work}.is-playing .smoke-wisp{animation:2s ease-in-out infinite smoke-work}.is-playing .leak-drop{animation:1.3s ease-in infinite drop-work}.is-playing .rain-drop{animation:1.6s ease-in infinite drop-work}.is-playing .vacuum-particle{animation:1.4s linear infinite suction-work}.is-playing .chamber-tool{animation:2s ease-in-out infinite chamber-work}.is-playing .cutting-tool{animation:1.5s ease-in-out infinite cut-work}@keyframes tool-work{0%,to{transform:translate(-35px)}50%{transform:translate(75px)}}@keyframes brush-work{to{transform:rotate(360deg)}}@keyframes water-work{to{stroke-dashoffset:-80px}}@keyframes buildup-clear{0%,10%{opacity:1}90%,to{opacity:.12}}@keyframes camera-work{0%{transform:translate(-140px)}80%,to{transform:translate(110px)}}@keyframes burst-work{0%{transform:translate(-230px)}to{transform:translate(260px)}}@keyframes liner-work{0%{transform:scaleY(.3)}60%,to{transform:scaleY(1)}}@keyframes smoke-work{0%{opacity:.1;transform:translateY(12px)}60%{opacity:.8}to{opacity:0;transform:translateY(-20px)}}@keyframes drop-work{0%{opacity:.9;transform:translateY(-3px)}to{opacity:0;transform:translateY(18px)}}@keyframes suction-work{0%{opacity:.9;transform:translate(8px,30px)}to{opacity:0;transform:translate(-15px,-65px)}}@keyframes chamber-work{0%,to{transform:translateY(-20px)}50%{transform:translateY(35px)}}@keyframes cut-work{0%,to{transform:translateY(5px)}50%{transform:translateY(-3px)}}@media (max-width:800px){.service-animation{border-radius:15px;margin:36px 18px;padding:24px 18px}.animation-heading,.animation-body{grid-template-columns:1fr;gap:24px}.animation-heading>p{max-width:none;font-size:14px}.animation-chooser>span{margin-left:0}.animation-chooser select{flex:1;min-width:0}.animation-heading{margin-bottom:24px}.animation-controls>span{font-size:9px}.animation-step-copy{font-size:13px}.service-animation .animation-note{font-size:11px}.legacy-page article>.service-animation{margin-left:0;margin-right:0}.animation-body{gap:25px}}@media (prefers-reduced-motion:reduce){.service-animation *,.service-animation :before,.service-animation :after{transition:none!important;animation:none!important}}@media print{.animation-controls,.animation-chooser{display:none}.service-animation{break-inside:avoid}.animation-body{grid-template-columns:1fr 1fr}}
