/* Upholstery page: animated sofa scene + step art. Pure CSS/SVG, off for reduced motion. */
.sofa-stage { margin: 30px 0 0; overflow: hidden; border: 1px solid #dfe2dc; border-radius: 16px; background: #EEF8F1; }
.sofa-scene, .step-art { display: block; width: 100%; height: auto; }
.sofa-hero .compact-actions { flex-wrap: wrap; }
.sofa-hero .compact-actions > p strong { color: var(--green); }
.sofa-steps .compact-step figure { aspect-ratio: 4 / 3; background: #EEF8F1; }
.sofa-steps .step-art { height: 100%; }


.sofa-scene .spray, .sofa-scene .suck, .sofa-scene .flow, .sofa-scene .dirt, .sofa-scene .spark, .sofa-scene .wet, .sofa-scene .lab { opacity: 0; }
.sofa-scene .lab-start { opacity: 1; }
.sofa-scene * { transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) {
  .sofa-scene .spray { animation: nc-spray 8s ease-in-out infinite; }
  .sofa-scene .drop { animation: nc-drop .6s linear infinite; }
  .sofa-scene .d2 { animation-delay: .15s; } .sofa-scene .d3 { animation-delay: .3s; } .sofa-scene .d4 { animation-delay: .45s; }
  .sofa-scene .suck, .sofa-scene .dirt { animation: nc-suck 8s ease-in-out infinite; }
  .sofa-scene .flow { animation: nc-suck 8s ease-in-out infinite, nc-flow .5s linear infinite; }
  .sofa-scene .pull { animation: nc-pull .5s linear infinite; }
  .sofa-scene .stain { animation: nc-stain 8s ease-in-out infinite; }
  .sofa-scene .wet { animation: nc-wet 8s ease-in-out infinite; }
  .sofa-scene .spark { animation: nc-spark 8s ease-out infinite; }
  .sofa-scene .s2 { animation-delay: .25s; } .sofa-scene .s3 { animation-delay: .5s; }
  .sofa-scene .led { animation: nc-blink 1.6s ease-in-out infinite; }
  .sofa-scene .tank, .sofa-scene .dtank { transform-box: fill-box; transform-origin: bottom; animation: nc-tank 8s ease-in-out infinite; }
  .sofa-scene .dtank { animation-name: nc-dtank; }
  .sofa-scene .bub { animation: nc-bub 1.4s ease-in infinite; } .sofa-scene .b2 { animation-delay: .7s; }
  .sofa-scene .lab-start { animation: nc-lab-start 8s infinite; }
  .sofa-scene .lab-spray { animation: nc-spray 8s infinite; }
  .sofa-scene .lab-suck { animation: nc-suck 8s infinite; }
  .sofa-scene .lab-clean { animation: nc-lab-clean 8s infinite; }
  .step-art .tag { animation: nc-swing 3s ease-in-out infinite; transform-box: view-box; transform-origin: 66px 22px; }
  .step-art .check { stroke-dasharray: 46; animation: nc-check 3s ease-out infinite; }
  .step-art .mini-tool { animation: nc-scrub 1.6s ease-in-out infinite alternate; }
  .step-art .mini-spray { animation: nc-blink .8s ease-in-out infinite; }
  .step-art .mini-stain { animation: nc-fade 3.2s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
  .step-art .steam { animation: nc-steam 2.4s ease-out infinite; }
  .step-art .steam.d2 { animation-delay: .8s; } .step-art .steam.d3 { animation-delay: 1.6s; }
  .step-art .fan { animation: nc-spin 1s linear infinite; transform-box: view-box; transform-origin: 132px 56px; }
}
@media (prefers-reduced-motion: reduce) {
  .sofa-scene .spray, .sofa-scene .lab-spray { opacity: 1; }
  .sofa-scene .lab-start { opacity: 0; }
  .sofa-scene .stain { opacity: .45; }
  .sofa-scene .wet { opacity: .35; }
}
@keyframes nc-spray { 0%, 8.5% { opacity: 0 } 10%, 18.5% { opacity: 1 } 20%, 32.5% { opacity: 0 } 34%, 42.5% { opacity: 1 } 44%, 56.5% { opacity: 0 } 58%, 64.5% { opacity: 1 } 66%, 100% { opacity: 0 } }
@keyframes nc-suck { 0%, 20.5% { opacity: 0 } 22%, 30.5% { opacity: 1 } 32%, 44.5% { opacity: 0 } 46%, 54.5% { opacity: 1 } 56%, 66% { opacity: 0 } 67%, 71% { opacity: 1 } 73%, 100% { opacity: 0 } }
@keyframes nc-drop { 0% { transform: translate(0, 0); opacity: 1 } 100% { transform: translate(-22px, 12px); opacity: 0 } }
@keyframes nc-pull { 0% { transform: translateY(8px); opacity: 0 } 40% { opacity: 1 } 100% { transform: translateY(-8px); opacity: 0 } }
@keyframes nc-flow { to { stroke-dashoffset: 40 } }
@keyframes nc-stain { 0%, 8% { opacity: 1; transform: scale(1) } 20% { opacity: .8 } 32% { opacity: .62 } 44% { opacity: .42; transform: scale(.95) } 56% { opacity: .22 } 66% { opacity: .08 } 72%, 93% { opacity: 0; transform: scale(.85) } 100% { opacity: 1; transform: scale(1) } }
@keyframes nc-wet { 0%, 8% { opacity: 0 } 20% { opacity: .4 } 66% { opacity: .6 } 76% { opacity: .5 } 93%, 100% { opacity: 0 } }
@keyframes nc-spark { 0%, 73% { opacity: 0; transform: scale(0) rotate(0) } 79% { opacity: 1; transform: scale(1.2) rotate(45deg) } 88%, 100% { opacity: 0; transform: scale(.2) rotate(90deg) } }
@keyframes nc-blink { 50% { opacity: .35 } }
@keyframes nc-dtank { 0%, 30% { transform: scaleY(.2) } 72%, 92% { transform: scaleY(1) } 100% { transform: scaleY(.2) } }
@keyframes nc-tank { 0%, 20% { transform: scaleY(1) } 72%, 92% { transform: scaleY(.55) } 100% { transform: scaleY(1) } }
@keyframes nc-bub { 0% { transform: translateY(0); opacity: 0 } 30% { opacity: .9 } 100% { transform: translateY(-22px); opacity: 0 } }
@keyframes nc-lab-start { 0%, 7% { opacity: 1 } 8.5%, 93% { opacity: 0 } 95%, 100% { opacity: 1 } }
@keyframes nc-lab-clean { 0%, 73% { opacity: 0 } 74.5%, 91.5% { opacity: 1 } 93%, 100% { opacity: 0 } }
@keyframes nc-swing { 0%, 100% { transform: rotate(-6deg) } 50% { transform: rotate(6deg) } }
@keyframes nc-check { 0%, 20% { stroke-dashoffset: 46 } 50%, 100% { stroke-dashoffset: 0 } }
@keyframes nc-scrub { from { transform: translateX(-14px) } to { transform: translateX(14px) } }
@keyframes nc-fade { 0%, 10% { opacity: 1; transform: scale(1) } 80% { opacity: .1; transform: scale(.7) } 100% { opacity: 1; transform: scale(1) } }
@keyframes nc-steam { 0% { transform: translateY(8px); opacity: 0 } 30% { opacity: 1 } 100% { transform: translateY(-14px); opacity: 0 } }
@keyframes nc-spin { to { transform: rotate(360deg) } }
/* type scale, same as homepage (home-v2.css): H1 56/84, lead 16/19, card H3 18/20 */
.sofa-hero .service-heading h1 { margin: 0; font-size: 56px; font-weight: 700; letter-spacing: -.052em; line-height: 1.02; }
.sofa-hero .rental-product h3, .sofa-steps .compact-step h3, #machines .rental-product h3 { font-size: 18px; }
@media (min-width: 900px) {
  .sofa-hero .service-heading h1 { font-size: 84px; max-width: 12em; }
  .sofa-hero .service-heading p { font-size: 19px; }
  #machines .rental-product h3, .sofa-steps .compact-step h3 { font-size: 20px; }
  .sofa-stage { max-width: 900px; }
}
.sofa-scene .dtank { transform-box: fill-box; transform-origin: bottom; transform: scaleY(.5); }
