html {
  scroll-behavior: smooth;
}

section {
  scroll-margin-top: 6rem;
}

/* ========== HEADER: phone row must stay above logo row ========== */
header.sticky {
  isolation: isolate;
}

.header-phone-row {
  position: relative;
  z-index: 3;
  background-color: #ffffff;
  overflow: visible;
}

.header-main-row {
  position: relative;
  z-index: 1;
  overflow: visible;
}

.header-phone {
  position: relative;
  z-index: 2;
  overflow: visible;
}

.header-logo-wrap {
  overflow: hidden;
  flex-shrink: 0;
  max-height: 5rem;
}

/* Desktop header phone — same pattern as reference (span + link, not icon inside <a>) */
.header-phone {
  color: #1a1a1a !important;
}

.header-phone__link {
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  text-decoration: none !important;
  transition: none !important;
  position: relative;
  z-index: 2;
  white-space: nowrap;
  line-height: 1.5;
  overflow: visible;
  opacity: 1 !important;
  visibility: visible !important;
}

.header-phone__link:hover,
.header-phone__link:hover .header-phone__number {
  color: #6ab8ee !important;
  -webkit-text-fill-color: #6ab8ee !important;
}

.header-phone__number {
  color: inherit;
  -webkit-text-fill-color: inherit;
}

/* Yandex Metrika phone-goal masking: nested <small opacity="…"> */
a[href^="tel:"] small,
a[href^="tel:"] small small {
  opacity: 1 !important;
  font-size: inherit !important;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

/* --- Phone icon (no Lucide) --- */
.phone-icon {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  flex-shrink: 0;
  background-color: #6ab8ee;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.903.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.903.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
}

.phone-icon--md {
  width: 1.25rem;
  height: 1.25rem;
}

/* --- Other tel: links (mobile menu, footer, sidebar) --- */
a[href^="tel:"],
a[href^="tel:"] .tel-number,
.site-phone,
.site-phone .tel-number {
  color: #1a1a1a !important;
  -webkit-text-fill-color: #1a1a1a !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  text-decoration: none;
  transition: none !important;
  position: relative;
  z-index: 2;
  line-height: 1.5;
  overflow: visible;
  opacity: 1 !important;
  visibility: visible !important;
}

a[href^="tel:"]:hover,
a[href^="tel:"]:hover .tel-number,
.site-phone:hover,
.site-phone:hover .tel-number {
  color: #6ab8ee !important;
  -webkit-text-fill-color: #6ab8ee !important;
}

.site-phone--light,
.site-phone--light .tel-number {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.site-phone--light:hover,
.site-phone--light:hover .tel-number {
  color: #6ab8ee !important;
  -webkit-text-fill-color: #6ab8ee !important;
}

/* Lucide must not inject SVG into tel links */
a[href^="tel:"] svg.lucide,
a[href^="tel:"] svg {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}