*{box-sizing:border-box}
html,body{margin:0;background:#000;color:#fff;min-height:100%;scroll-behavior:smooth}
body{font-family:Arial,sans-serif}
.site{position:relative;background:#000}
.canvas{position:relative;width:100%;max-width:1536px;margin:0 auto;background:#000;line-height:0}
.design{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.hotspot{position:absolute;display:block;z-index:5;line-height:normal;border-radius:4px}
.hotspot:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* Coordinates based on the uploaded 1536x1024 design */
.hs-home{left:29.4%;top:4.4%;width:4.6%;height:5.2%}
.hs-services{left:35.2%;top:4.4%;width:6.2%;height:5.2%}
.hs-work{left:42.5%;top:4.4%;width:6.3%;height:5.2%}
.hs-insurance{left:50.6%;top:4.4%;width:6.8%;height:5.2%}
.hs-about{left:59.0%;top:4.4%;width:6.5%;height:5.2%}
.hs-contact{left:67.3%;top:4.4%;width:6.4%;height:5.2%}
.hs-top-phone{left:79.9%;top:3.1%;width:16.2%;height:5.5%}

.hs-hero-phone{left:3.0%;top:34.7%;width:15.7%;height:5.6%}
.hs-estimate{left:20.4%;top:34.7%;width:15.3%;height:5.6%}

.hs-bottom-phone{left:22.8%;top:86.0%;width:15.5%;height:10.0%}
.hs-email{left:42.4%;top:86.0%;width:19.8%;height:10.0%}
.hs-directions{left:65.0%;top:86.0%;width:14.8%;height:10.0%}

.hs-instagram{left:82.9%;top:89.1%;width:3.4%;height:5.0%}
.hs-facebook{left:86.7%;top:89.1%;width:3.4%;height:5.0%}
.hs-tiktok{left:90.5%;top:89.1%;width:3.4%;height:5.0%}

/* Hash targets that scroll to the right part of the image */
.anchor{position:absolute;left:0;width:1px;height:1px;pointer-events:none}
.a-services{top:49%}
.a-work{top:66%}
.a-insurance{top:67%}
.a-about{top:80%}
.a-contact{top:85%}

.mobile-call{display:none}

@media (max-width:700px){
  body{padding-bottom:64px}
  .canvas{
    width:1536px;
    max-width:none;
    transform-origin:top left;
    /* Scale the exact desktop composition to fit the phone width */
    transform:scale(calc(100vw / 1536));
    margin-bottom:calc((1024px * (100vw / 1536)) - 1024px);
  }
  .mobile-call{
    display:block;position:fixed;z-index:99;left:12px;right:12px;bottom:12px;
    background:#d71920;color:#fff;text-align:center;text-decoration:none;
    font-weight:800;padding:14px;border-radius:6px;box-shadow:0 10px 30px #000
  }
}