.hero,.section,.final-cta,.site-footer { position: relative; isolation: isolate; }
.hero > .container,.section > .container,.final-cta > .container,.site-footer > .container { position: relative; z-index: 1; }
.repair-decor-layer { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
.repair-tool { position: absolute; width: var(--tool-size); height: var(--tool-size); display: grid; place-items: center; margin: 0; color: var(--tool-color); opacity: .14; pointer-events: none; transform: translate(-50%,-50%); transition: opacity .22s ease; }
.repair-tool--back { z-index: 0; opacity: .035; }
.repair-tool--mid { z-index: 1; opacity: .075; }
.repair-tool--front { z-index: 2; opacity: .15; }
.repair-tool svg { width: 100%; height: 100%; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transform: translate3d(var(--tool-shift-x,0px),var(--tool-shift-y,0px),0) rotate(calc(var(--tool-rotation,0deg) + var(--tool-react-angle,0deg))) scale(var(--tool-react-scale,1)); transform-origin: center; }
.repair-tool--red { --tool-color: #ef4444; }
.repair-tool--blue { --tool-color: #3b82f6; }
.repair-tool--yellow { --tool-color: #facc15; }
.repair-tool--green { --tool-color: #10b981; }
.hero .repair-tool--back,.about .repair-tool--back,.final-cta .repair-tool--back,.site-footer .repair-tool--back { opacity: .055; }
.hero .repair-tool--mid,.about .repair-tool--mid,.final-cta .repair-tool--mid,.site-footer .repair-tool--mid { opacity: .13; }
.hero .repair-tool--front,.about .repair-tool--front,.final-cta .repair-tool--front,.site-footer .repair-tool--front { opacity: .22; }
.repair-tool.is-awake { opacity: .57; }
.repair-tool--back.is-awake { opacity: .17; }
.repair-tool--mid.is-awake { opacity: .34; }
.repair-tool.is-awake svg { stroke-width: 2; }
.repair-tool::after { position: absolute; inset: -17%; content: ""; border: 1px solid currentColor; border-radius: 50%; opacity: 0; transform: scale(.65); pointer-events: none; }
.repair-tool.is-tapped::after { animation: tool-ripple .52s ease-out; }
.repair-tool.is-awake svg { will-change: transform; }

@keyframes tool-ripple {
  0% { opacity: .55; transform: scale(.65); }
  100% { opacity: 0; transform: scale(1.35); }
}

@media(max-width:740px) {
  .repair-tool--front { width: min(var(--tool-size),34px); height: min(var(--tool-size),34px); }
  .repair-tool--mid { width: min(var(--tool-size),54px); height: min(var(--tool-size),54px); }
  .repair-tool--back { width: min(var(--tool-size),76px); height: min(var(--tool-size),76px); }
  .repair-tool:nth-child(5n) { display: none; }
  .repair-tool--front.is-awake { opacity: .48; }
  .repair-tool--mid.is-awake { opacity: .24; }
  .repair-tool--back.is-awake { opacity: .12; }
}
@media(prefers-reduced-motion:reduce) {
  .repair-tool,.repair-tool svg { transition: none !important; will-change: auto !important; }
  .repair-tool.is-tapped::after { animation: none; }
}