/* Marketing Lead / WhatsApp HD control system / 2026-10-26
   Uses the one-color 24x24 WhatsApp mark (Simple Icons, CC0), never a font glyph.
   Intentionally limited to WhatsApp controls: leave the Sand & Sage brand intact. */
:root {
  --ml-wa-forest: #147A4D;
  --ml-wa-forest-hover: #0E653E;
  --ml-wa-brand: #25D366;
  --ml-wa-glow: rgba(20,122,77,.18);
}
html body svg.ml-hd-wa-svg,
html body svg.ml-hd-wa-svg path {
  fill: currentColor!important;
  stroke: none!important;
  stroke-width: 0!important;
  animation: none!important;
  transform: none!important;
}
html body svg.ml-hd-wa-svg {
  display: block!important;
  box-sizing: content-box;
  width: 20px!important;
  height: 20px!important;
  min-width: 20px!important;
  max-width: 20px!important;
  flex: 0 0 20px!important;
  aspect-ratio: 1;
  pointer-events: none;
  vertical-align: middle;
}
/* Compact utility bar: calm background, intentionally prominent WhatsApp CTA. */
html body .ml-contactbar .ml-contactbar-inner {
  min-height: 55px;
  padding-block: 6px;
}
html body .ml-contactbar .ml-contactbar-actions { gap: 14px; }
html body .ml-contactbar .ml-contactbar-actions .ml-contactbar-email {
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: -.008em;
  font-weight: 600;
  min-height: 40px;
  color: #46565D;
}
html body .ml-contactbar .ml-contactbar-actions a.ml-contactbar-whatsapp {
  display: inline-flex!important;
  align-items: center!important;
  justify-content: center!important;
  gap: 9px!important;
  min-height: 43px!important;
  padding: 9px 18px 9px 14px!important;
  border: 1px solid var(--ml-wa-forest)!important;
  border-radius: 999px!important;
  background: var(--ml-wa-forest)!important;
  background-image: none!important;
  color: #FFFFFF!important;
  box-shadow: 0 4px 12px rgba(20,122,77,.12)!important;
  font-family: Poppins,system-ui,-apple-system,'Segoe UI',sans-serif!important;
  font-weight: 700!important;
  font-size: 13.5px!important;
  line-height: 1.25!important;
  letter-spacing: -.01em!important;
  text-align: center!important;
  text-decoration: none!important;
  white-space: nowrap!important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transform: translateY(0)!important;
  transition: background-color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s cubic-bezier(.2,.7,.2,1)!important;
}
html body .ml-contactbar a.ml-contactbar-whatsapp .ml-hd-wa-svg {
  width: 21px!important;
  height: 21px!important;
  min-width: 21px!important;
  max-width: 21px!important;
  flex: 0 0 21px!important;
  color: #FFFFFF!important;
}
html body .ml-contactbar .ml-contactbar-whatsapp:hover {
  background: var(--ml-wa-forest-hover)!important;
  border-color: var(--ml-wa-forest-hover)!important;
  box-shadow: 0 8px 20px rgba(14,101,62,.2)!important;
  transform: translateY(-1px)!important;
}
html body .ml-contactbar .ml-contactbar-whatsapp:active {
  transform: translateY(0)!important;
  box-shadow: 0 2px 8px rgba(14,101,62,.15)!important;
}
html body .ml-contactbar .ml-contactbar-whatsapp:focus-visible {
  outline: 3px solid rgba(20,122,77,.44)!important;
  outline-offset: 3px!important;
}
html body .ml-contactbar-whatsapp .ml-wa-label-short { display: none!important; }
/* Site-wide direct conversation buttons, not blog-share icons and plain links. */
html body :is(a.ml-form-wa,a.ml-ux-cta-whatsapp) {
  display: inline-flex!important;
  align-items: center!important;
  justify-content: center!important;
  gap: 10px!important;
  min-height: 48px!important;
  padding: 12px 19px!important;
  border: 1px solid var(--ml-wa-forest)!important;
  border-radius: 13px!important;
  background: var(--ml-wa-forest)!important;
  background-image: none!important;
  color: #FFFFFF!important;
  font: 700 13.5px/1.35 Poppins,system-ui,-apple-system,'Segoe UI',sans-serif!important;
  letter-spacing: -.008em!important;
  white-space: normal!important;
  text-align: center!important;
  text-decoration: none!important;
  box-shadow: 0 8px 20px rgba(20,122,77,.15)!important;
  transition: transform .23s cubic-bezier(.2,.7,.2,1),background-color .23s ease,box-shadow .23s ease,border-color .23s ease!important;
}
html body :is(a.ml-form-wa,a.ml-ux-cta-whatsapp):hover {
  background: var(--ml-wa-forest-hover)!important;
  border-color: var(--ml-wa-forest-hover)!important;
  color: #FFFFFF!important;
  transform: translateY(-2px)!important;
  box-shadow: 0 13px 24px rgba(20,122,77,.2)!important;
}
html body :is(a.ml-form-wa,a.ml-ux-cta-whatsapp):active {transform:translateY(0)!important;box-shadow:0 4px 12px rgba(20,122,77,.1)!important;}
html body :is(a.ml-form-wa,a.ml-ux-cta-whatsapp):focus-visible {outline:3px solid rgba(20,122,77,.40)!important;outline-offset:3px!important;}
html body :is(a.ml-form-wa,a.ml-ux-cta-whatsapp) .ml-hd-wa-svg {
  width: 21px!important;
  height: 21px!important;
  min-width: 21px!important;
  max-width: 21px!important;
  flex: 0 0 21px!important;
}
/* Existing floating icon: avoid blurry fonts or conflicting outline stroke. */
html body a.ml-left-whatsapp .ml-hd-wa-svg {
  width: 28px!important;
  height: 28px!important;
  min-width: 28px!important;
  max-width: 28px!important;
  flex: 0 0 28px!important;
  color: #fff!important;
}
@media (max-width: 600px) {
  html body .ml-contactbar-whatsapp .ml-wa-label-full { display:none!important; }
  html body .ml-contactbar-whatsapp .ml-wa-label-short { display:inline!important; }
  html body .ml-contactbar .ml-contactbar-inner { min-height: 51px; padding: 5px 11px; }
  html body .ml-contactbar .ml-contactbar-actions { width:100%; gap: 7px; justify-content:space-between; }
  html body .ml-contactbar .ml-contactbar-actions .ml-contactbar-email { font-size: 11.9px; font-weight:600; padding-inline:3px; }
  html body .ml-contactbar .ml-contactbar-actions a.ml-contactbar-whatsapp { min-height:40px!important; gap:7px!important; padding:8px 12px!important; font-size:12.6px!important; }
  html body .ml-contactbar .ml-contactbar-actions a.ml-contactbar-whatsapp .ml-hd-wa-svg { width:19px!important;height:19px!important;min-width:19px!important;max-width:19px!important;flex-basis:19px!important; }
}
@media (max-width: 350px) {
  html body .ml-contactbar .ml-contactbar-inner { padding-inline: 8px; }
  html body .ml-contactbar .ml-contactbar-actions { gap:4px; }
  html body .ml-contactbar .ml-contactbar-actions .ml-contactbar-email { font-size: 11px; }
  html body .ml-contactbar .ml-contactbar-actions .ml-contactbar-email svg {width:14px;height:14px;flex-basis:14px;}
  html body .ml-contactbar .ml-contactbar-actions a.ml-contactbar-whatsapp {padding: 8px 9px!important;font-size:11.8px!important;gap:6px!important;}
}
@media (prefers-reduced-motion: reduce) {
  html body .ml-contactbar .ml-contactbar-actions a.ml-contactbar-whatsapp,
  html body :is(a.ml-form-wa,a.ml-ux-cta-whatsapp) { transition: none!important; transform: none!important; animation:none!important; }
}
/* Small fixed WhatsApp shortcut follows the same refined green. */
html body a.ml-left-whatsapp {
  background: var(--ml-wa-forest)!important;
  background-image: none!important;
  border: 1px solid rgba(255,255,255,.8)!important;
  color: #FFFFFF!important;
  box-shadow: 0 8px 22px rgba(14,101,62,.21)!important;
  transition: background-color .2s ease,transform .2s ease,box-shadow .2s ease!important;
}
html body a.ml-left-whatsapp:hover {
  background: var(--ml-wa-forest-hover)!important;
  box-shadow: 0 12px 25px rgba(14,101,62,.27)!important;
  transform: translateY(-2px)!important;
}
html body a.ml-left-whatsapp:focus-visible {outline:3px solid rgba(20,122,77,.4)!important;outline-offset:4px!important;}
@media(prefers-reduced-motion: reduce){html body a.ml-left-whatsapp{transition:none!important;transform:none!important}}