/* The same compact, raised contact buttons on the main site and service pages. */
html body:is([data-page], .design-02) .floating-contact {
  position: fixed;
  z-index: 70;
  inset: auto max(12px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) auto;
  display: flex;
  visibility: visible;
  flex-direction: column;
  align-items: center;
  width: 48px;
  gap: 6px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  transform: none;
  pointer-events: none;
}

html body:is([data-page], .design-02) .floating-contact .float-button {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0;
  gap: 0;
  border: 3px solid #2c7d67;
  border-radius: 50%;
  background: linear-gradient(145deg, #a0ddcc, #467d71 52%, #164b42);
  color: #fff;
  box-shadow: 0 2px 4px #082b3940, inset 0 1px 1px #ffffffb3;
  text-decoration: none;
  white-space: nowrap;
  line-height: 1;
  transform: none;
  transition: none;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}

html body:is([data-page], .design-02) .floating-contact .float-face {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  margin: 0;
  padding: 0;
  gap: 0;
  border: 1px solid #ffffff70;
  border-radius: 50%;
  color: #fff;
  box-shadow: inset 0 1px 2px #ffffffb3, inset 0 -2px 3px #052f4d66;
}

html body:is([data-page], .design-02) .floating-contact .float-call .float-face {
  background: radial-gradient(ellipse at 32% 16%, #9edbe9 0%, #368cb9 35%, #125a89 65%, #0a3e69 100%);
}

html body:is([data-page], .design-02) .floating-contact .float-line .float-face {
  background: radial-gradient(ellipse at 32% 16%, #a8edc5 0%, #2eae6a 35%, #008a42 65%, #005e31 100%);
}

html body:is([data-page], .design-02) .floating-contact :is(.icon, .float-line-symbol) {
  display: block;
  flex: none;
  width: 24px;
  height: 24px;
  color: #fff;
}

html body:is([data-page], .design-02) .floating-contact .float-button:focus-visible {
  outline: 3px solid #b17e19;
  outline-offset: 3px;
}

/* Older cached scripts may still add these classes; the buttons stay visible. */
html body:is([data-page], .design-02) .floating-contact:is(.is-obstructing, .is-over-footer) {
  visibility: visible;
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  html body:is([data-page], .design-02) .floating-contact .float-button:hover {
    border-color: #155d4c;
  }
}

@media (forced-colors: active) {
  html body:is([data-page], .design-02) .floating-contact .float-button {
    border-color: ButtonText;
  }
}

@media print {
  html body:is([data-page], .design-02) .floating-contact { display: none; }
}