/* Marketing Lead | Unified Sand & Sage UI | 2026-10-26
   Loaded after every legacy stylesheet. Do not style admin pages. */
:root {
  --mlux-ink:#334155;
  --mlux-body:#586677;
  --mlux-sage:#477662;
  --mlux-sage-hover:#345E4F;
  --mlux-gold:#A68A56;
  --mlux-cream:#FCFBF8;
  --mlux-line:#E7E3DA;
  --mlux-surface:#FFFFFF;
  --mlux-shadow:0 12px 30px rgba(51,65,85,.075);
  --mlux-motion:cubic-bezier(.2,.75,.2,1);
}

/* Unified headings: preserve all page-specific SEO words and emphasis spans. */
html body .ml-ux-h1 {
  font-family:Poppins,system-ui,-apple-system,Arial,sans-serif!important;
  font-size:clamp(35px,3.65vw,60px)!important;
  font-weight:800!important;
  line-height:1.12!important;
  letter-spacing:-.045em!important;
  text-wrap:balance;
  overflow-wrap:normal!important;
  hyphens:none;
  color:var(--mlux-ink)!important;
  max-width:100%;
  margin-block-start:0!important;
  margin-block-end:clamp(14px,1.8vw,24px)!important;
}
html body .ml-ux-h1-long {
  font-size:clamp(33px,3.15vw,52px)!important;
  line-height:1.15!important;
  letter-spacing:-.038em!important;
}
html body .ml-ux-h1 :is(span,strong,em){line-height:inherit!important}
html body :is(.hero-content,.dev-hero-content,.sem-hero-content,.smm-hero-content,.elg-hero-content,.intro-content,.crm-hero-content) {min-width:0!important;}
html body :is(.hero-content,.dev-hero-content,.sem-hero-content,.smm-hero-content,.elg-hero-content) > p {
  max-width:66ch;
  font-size:clamp(14px,1.13vw,17px)!important;
  line-height:1.75!important;
  color:var(--mlux-body)!important;
  text-wrap:pretty;
}

/* Real outline icons, independent of icon fonts, with stable dimensions. */
i.ml-ux-vector-icon {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto;
  font-style:normal!important;
  font-family:inherit!important;
  font-size:0!important;
  line-height:0!important;
  vertical-align:-.12em;
  color:inherit;
  max-width:none;
}
i.ml-ux-vector-icon::before,i.ml-ux-vector-icon::after{display:none!important;content:none!important}
svg.ml-ux-icon-svg,svg.ml-outline-svg {
  display:block;
  width:1.2em;
  height:1.2em;
  min-width:0;
  min-height:0;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.85!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  transform:none;
  animation:none;
  pointer-events:none;
}
.site-header .header-contact .ml-ux-vector-icon svg {width:16px!important;height:16px!important;}
.ml-left-whatsapp i.ml-ux-vector-icon svg {width:28px!important;height:28px!important;stroke-width:1.9!important;color:white!important;}
.ml-left-whatsapp {background:#20C766!important;box-shadow:0 11px 28px rgba(32,199,102,.2)!important;}
.ml-left-whatsapp:hover {background:#18A957!important;}
.ml-premium-social-link i.ml-ux-vector-icon svg,
.ml-lux-social i.ml-ux-vector-icon svg {width:18px!important;height:18px!important;}
.ml-lux-feature i.ml-ux-vector-icon svg {width:22px!important;height:22px!important;}
.ml-lux-footer .ml-lux-contact-card i.ml-ux-vector-icon svg {width:19px!important;height:19px!important;}
.ml-lux-badge i.ml-ux-vector-icon svg {width:16px!important;height:16px!important;}
.ml-premium-icon svg.ml-outline-svg {stroke-width:1.95!important;width:53%!important;height:53%!important;}
.ml-premium-icon:empty::after {content:none!important;}
.ml-nav-svg-icon svg.ml-outline-svg {width:17px!important;height:17px!important;}
:is(.ml-lux-feature,.ml-premium-icon,.ml-service-icon,.ml-nav-svg-icon,.ml-premium-social-link) {will-change:auto!important;}

/* One shared button motion language for links, form submits and footer CTAs. */
html body a.ml-ux-cta,html body button.ml-ux-cta {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  position:relative;
  max-width:100%;
  min-height:48px;
  padding:12px 21px!important;
  border-radius:13px!important;
  font-family:Poppins,system-ui,Arial,sans-serif!important;
  font-size:clamp(12px,1vw,14px)!important;
  font-weight:750!important;
  line-height:1.35!important;
  letter-spacing:0!important;
  text-align:center!important;
  text-decoration:none!important;
  white-space:normal!important;
  vertical-align:middle;
  transition:transform .24s var(--mlux-motion),box-shadow .24s var(--mlux-motion),background-color .24s ease,border-color .24s ease,color .24s ease!important;
  transform:translate3d(0,0,0);
  animation:none!important;
  cursor:pointer;
}
html body a.ml-ux-cta-primary,html body button.ml-ux-cta-primary {
  background:var(--mlux-sage)!important;
  background-image:none!important;
  color:#fff!important;
  border:1px solid var(--mlux-sage)!important;
  box-shadow:0 8px 20px rgba(52,94,79,.16)!important;
}
html body a.ml-ux-cta-secondary,html body button.ml-ux-cta-secondary,
html body a.ml-ux-cta-inverse {
  background:#fff!important;
  background-image:none!important;
  color:var(--mlux-ink)!important;
  border:1px solid var(--mlux-line)!important;
  box-shadow:0 6px 16px rgba(51,65,85,.055)!important;
}
html body a.ml-ux-cta-whatsapp {background:#20C766!important;color:#fff!important;border-color:#20C766!important;}
html body a.ml-ux-cta:hover,html body button.ml-ux-cta:hover {
  transform:translate3d(0,-2px,0)!important;
  box-shadow:0 15px 28px rgba(51,65,85,.15)!important;
}
html body a.ml-ux-cta-primary:hover,html body button.ml-ux-cta-primary:hover,
html body button.ml-ux-submit:hover {background:var(--mlux-sage-hover)!important;border-color:var(--mlux-sage-hover)!important;}
html body a.ml-ux-cta-secondary:hover,html body a.ml-ux-cta-inverse:hover {border-color:var(--mlux-sage)!important;color:var(--mlux-sage)!important;}
html body a.ml-ux-cta-whatsapp:hover {background:#159d4f!important;}
html body a.ml-ux-cta:active,html body button.ml-ux-cta:active {transform:translate3d(0,0,0) scale(.985)!important;box-shadow:0 4px 12px rgba(51,65,85,.09)!important;}
html body a.ml-ux-cta:focus-visible,html body button.ml-ux-cta:focus-visible {outline:3px solid rgba(71,118,98,.42)!important;outline-offset:3px!important;}
html body .ml-ux-cta svg:not(.ml404-svg){width:18px!important;height:18px!important;flex:0 0 18px!important;stroke:currentColor!important;}
html body .ml-ux-cta i.ml-ux-vector-icon {margin:0!important;}
html body .ml-ux-cta i.ml-ux-vector-icon svg {width:18px!important;height:18px!important;}

/* One uniform conversion-form language on all 28 contact/marketing forms.
   CMS variants are enhanced to the same markup without changing field names. */
html body .ml-ux-form-card.ml-form-shell,
html body #contact .ml-ux-form-card.ml-form-shell,
html body :is(.lead-form-box,.form-box,.ml-consult-card,.elg-panel,.sem-panel,.smm-panel,.dev-panel).ml-ux-form-card {
  display:block!important;
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  padding:clamp(22px,2.5vw,34px)!important;
  background:linear-gradient(155deg,#fff 0%,#FCFBF8 100%)!important;
  border:1px solid var(--mlux-line)!important;
  border-radius:23px!important;
  box-shadow:var(--mlux-shadow)!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
html body .ml-ux-form-card.ml-form-shell::before {height:3px!important;background:linear-gradient(90deg,#477662,#C2A878)!important;inset:0 0 auto!important;}
html body .ml-ux-form-card.ml-form-shell::after {display:none!important;content:none!important;}
html body .ml-ux-form-card :is(h2,h3){font-size:clamp(23px,2vw,30px)!important;line-height:1.22!important;letter-spacing:-.035em!important;color:var(--mlux-ink)!important;max-width:100%;}
html body .ml-ux-form-card :is(.ml-form-kicker,.ml-form-privacy){color:var(--mlux-body)!important;}
html body .ml-ux-form-card form.ml-ux-consult-form {
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:14px!important;
  height:auto!important;
  min-height:0!important;
  max-width:100%!important;
  overflow:visible!important;
  margin:0!important;
  padding:0!important;
}
html body form.ml-ux-consult-form .ml-ux-fields,
html body form.ml-ux-consult-form .ml-form-grid-v2 {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  align-items:start!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-field,.ml-field-v2){
  display:flex!important;
  flex-direction:column!important;
  gap:7px!important;
  min-width:0!important;
  grid-column:auto!important;
  margin:0!important;
  padding:0!important;
  align-self:start!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-field--message,.ml-ux-field--website,.ml-field-v2[data-ml-field="message"]){grid-column:1/-1!important;}
html body form.ml-ux-consult-form.ml-ux-no-service .ml-ux-field--email {grid-column:1/-1!important;}
html body form.ml-ux-consult-form :is(.ml-ux-field-label,.ml-field-label-v2){
  display:block!important;
  position:static!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  clip:auto!important;
  overflow:visible!important;
  white-space:normal!important;
  text-transform:none!important;
  letter-spacing:0!important;
  color:var(--mlux-ink)!important;
  font:650 12.5px/1.45 Poppins,Arial,sans-serif!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2){
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  min-width:0!important;
  width:100%!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-field-icon,.ml-field-icon-v2){
  position:absolute!important;
  left:15px!important;
  top:18px!important;
  z-index:1!important;
  width:19px!important;height:19px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  pointer-events:none!important;
  color:var(--mlux-sage)!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-field-icon,.ml-field-icon-v2) svg {
  display:block!important;width:19px!important;height:19px!important;
  fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2) :is(input:not([type="hidden"]),select,textarea) {
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  display:block!important;
  box-sizing:border-box!important;
  margin:0!important;
  border:1px solid #D9DDD7!important;
  border-radius:12px!important;
  background:#fff!important;
  background-image:none!important;
  color:var(--mlux-ink)!important;
  font:500 14px/1.5 Poppins,Arial,sans-serif!important;
  box-shadow:none!important;
  outline:none!important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2) :is(input:not([type="hidden"]),select){height:54px!important;padding:0 14px 0 43px!important;}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2) textarea {
  height:116px!important;min-height:116px!important;
  resize:vertical!important;
  padding:14px 15px 14px 43px!important;
}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2) :is(input,select,textarea)::placeholder{color:#7D8791!important;opacity:1;}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2) :is(input,select,textarea):hover{border-color:#B8CBBF!important;}
html body form.ml-ux-consult-form :is(.ml-ux-input-wrap,.ml-field-control-v2) :is(input,select,textarea):focus-visible{
  border-color:var(--mlux-sage)!important;
  background-color:#fff!important;
  box-shadow:0 0 0 3px rgba(71,118,98,.13)!important;
}
html body form.ml-ux-consult-form button.ml-ux-submit {
  display:inline-flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:11px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:56px!important;
  border-radius:13px!important;
  margin-top:4px!important;
  padding:14px 18px!important;
  background:var(--mlux-sage)!important;
  background-image:none!important;
  border:1px solid var(--mlux-sage)!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(52,94,79,.17)!important;
  font:750 14px/1.3 Poppins,Arial,sans-serif!important;
  white-space:normal!important;
  text-align:center!important;
  transition:transform .24s var(--mlux-motion),background .24s ease,box-shadow .24s ease!important;
}
html body form.ml-ux-consult-form button.ml-ux-submit::before,
html body form.ml-ux-consult-form button.ml-ux-submit::after {content:none!important;display:none!important;}
html body form.ml-ux-consult-form button.ml-ux-submit:hover{transform:translateY(-2px)!important;background:var(--mlux-sage-hover)!important;box-shadow:0 16px 30px rgba(52,94,79,.24)!important;}
html body form.ml-ux-consult-form button.ml-ux-submit .ml-ux-button-arrow {
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 24px!important;width:24px!important;height:24px!important;
  border-radius:50%;background:rgba(255,255,255,.16);
  transition:transform .22s ease;
}
html body form.ml-ux-consult-form button.ml-ux-submit .ml-ux-button-arrow svg{width:15px!important;height:15px!important;flex:0 0 15px!important;stroke-width:1.85!important;}
html body form.ml-ux-consult-form button.ml-ux-submit:hover .ml-ux-button-arrow{transform:translateX(3px)}
html body .ml-ux-form-card .ml-form-fast-track{border-radius:13px!important;box-shadow:none!important;background:#fff!important;border:1px solid var(--mlux-line)!important;}
html body .ml-ux-form-card .ml-form-wa{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;border-radius:12px!important;color:#fff!important;}

/* Consistent visible service icons and card spacing. */
.ml-lux-feature:focus-within,.hero-point.ml-service-tile:focus-visible {outline:3px solid rgba(71,118,98,.27);outline-offset:3px}
.ml-premium-icon svg.ml-outline-svg {max-width:32px!important;max-height:32px!important;}
.ml-lux-feature > i.ml-ux-vector-icon,.ml-lux-feature .feature-icon i.ml-ux-vector-icon {display:flex!important;align-items:center!important;justify-content:center!important;}

/* Micro-animations: subtle entrance on first view, no looping effects. */
@keyframes mlux-appear {from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.ml-ux-appeared.section-title {animation:mlux-appear .48s var(--mlux-motion) both!important;}
.ml-ux-appeared.ml-lux-feature {animation:mlux-appear .4s var(--mlux-motion) both!important;}
.ml-ux-appeared.ml-premium-icon {animation:mlux-appear .4s var(--mlux-motion) both!important;}

/* Narrow screens: controls must never clip or create horizontal overflow. */
html body :is(.hero-grid,.ml-form-shell,.ml-form-grid-v2,.ml-ux-fields,.header-contact,.ml-lux-grid,.industries-luxury) {min-width:0;box-sizing:border-box;}
html body .ml-ux-form-card {max-width:100%!important;}
@media(max-width:800px){
  html body .ml-ux-h1 {font-size:clamp(30px,5.3vw,42px)!important;letter-spacing:-.04em!important;}
  html body .ml-ux-h1-long {font-size:clamp(28px,5vw,38px)!important;}
  html body form.ml-ux-consult-form .ml-ux-fields,
  html body form.ml-ux-consult-form .ml-form-grid-v2{grid-template-columns:1fr!important;gap:12px!important;}
  html body form.ml-ux-consult-form :is(.ml-ux-field,.ml-field-v2){grid-column:1!important;}
  html body .ml-ux-form-card.ml-form-shell {padding:20px!important;border-radius:19px!important;}
  html body a.ml-ux-cta,html body button.ml-ux-cta {max-width:100%;}
}
@media(max-width:430px){
  html body .ml-ux-h1 {font-size:clamp(29px,8.1vw,35px)!important;letter-spacing:-.035em!important;line-height:1.17!important;}
  html body .ml-ux-h1-long {font-size:clamp(27px,7.5vw,32px)!important;}
  html body .ml-ux-form-card.ml-form-shell {padding:17px!important;}
  html body .ml-ux-form-card :is(h2,h3) {font-size:23px!important;}
  html body .ml-ux-cta {overflow-wrap:normal;word-break:normal;}
  html body .ml-left-whatsapp{width:52px!important;height:52px!important;left:12px!important;bottom:14px!important;}
}
@media(prefers-reduced-motion:reduce){
  html body .ml-ux-cta,html body .ml-ux-submit,
  .ml-ux-appeared.section-title,.ml-ux-appeared.ml-lux-feature,.ml-ux-appeared.ml-premium-icon {
    animation:none!important;transition:none!important;transform:none!important;
  }
  html body button.ml-ux-submit .ml-ux-button-arrow {transition:none!important;transform:none!important;}
}

/* The homepage's top four links are distinct, semantically labelled
   service tiles - no decorative green checkmark reused for every category. */
html body .hero .hero-points.ml-ux-service-grid {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:13px!important;
  margin:26px 0 27px!important;
  padding:0!important;
  align-items:stretch!important;
}
html body .hero .hero-points a.ml-ux-service-card {
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr) 23px!important;
  align-items:center!important;
  gap:13px!important;
  width:100%!important;
  min-width:0!important;
  min-height:100px!important;
  margin:0!important;
  padding:15px 14px!important;
  border:1px solid var(--mlux-line)!important;
  border-radius:16px!important;
  background:#fff!important;
  color:var(--mlux-ink)!important;
  box-shadow:0 6px 18px rgba(51,65,85,.05)!important;
  white-space:normal!important;
  text-decoration:none!important;
  text-align:left!important;
  line-height:1.4!important;
  transition:transform .22s var(--mlux-motion),box-shadow .22s var(--mlux-motion),border-color .22s ease!important;
  animation:none!important;
}
html body .hero .hero-points a.ml-ux-service-card::before,
html body .hero .hero-points a.ml-ux-service-card::after {content:none!important;display:none!important;}
html body .hero .hero-points a.ml-ux-service-card:hover,
html body .hero .hero-points a.ml-ux-service-card:focus-visible {
  transform:translateY(-3px)!important;
  border-color:rgba(71,118,98,.45)!important;
  box-shadow:0 14px 26px rgba(51,65,85,.1)!important;
}
html body .hero .hero-points .ml-ux-service-card-icon {
  display:grid!important;place-items:center!important;
  width:44px!important;height:44px!important;
  color:var(--mlux-sage)!important;
  background:#F1F6F0!important;
  border:1px solid #D8E8DC!important;
  border-radius:13px!important;
}
html body .hero .hero-points .ml-ux-service-card-icon svg {width:23px!important;height:23px!important;}
html body .hero .hero-points .ml-ux-service-card-copy {display:flex!important;flex-direction:column!important;min-width:0!important;gap:5px!important;}
html body .hero .hero-points .ml-ux-service-card-title {display:block!important;font:750 13px/1.36 Poppins,Arial,sans-serif!important;color:var(--mlux-ink)!important;}
html body .hero .hero-points .ml-ux-service-card-desc {display:block!important;font:500 11.5px/1.48 Poppins,Arial,sans-serif!important;color:var(--mlux-body)!important;}
html body .hero .hero-points .ml-ux-service-card-arrow {
  display:grid!important;place-items:center!important;
  width:22px!important;height:22px!important;color:var(--mlux-sage)!important;
  transition:transform .22s ease!important;
}
html body .hero .hero-points .ml-ux-service-card-arrow svg{width:18px!important;height:18px!important;}
html body .hero .hero-points a.ml-ux-service-card:hover .ml-ux-service-card-arrow{transform:translateX(3px)!important;}
/* Floating social rail is useful on wide screens but blocks paragraph copy on phones. */
@media(max-width:980px){
  html body .ml-quick-links .ml-premium-social,
  html body .ml-premium-social {display:none!important;visibility:hidden!important;pointer-events:none!important;}
}
@media(max-width:680px){
  html body .hero .hero-points.ml-ux-service-grid{grid-template-columns:1fr!important;}
  html body .hero .hero-points a.ml-ux-service-card{min-height:82px!important;padding:13px!important;}
  html body .hero .hero-points .ml-ux-service-card-desc{font-size:11px!important;}
}
@media(prefers-reduced-motion:reduce){
  html body .hero .hero-points a.ml-ux-service-card,
  html body .hero .hero-points .ml-ux-service-card-arrow{transition:none!important;animation:none!important;transform:none!important;}
}
/* Services overview: category icons for all six actual service offerings. */
html body .ml-seo-service.ml-ux-directory-card {position:relative;}
html body .ml-seo-service .ml-ux-directory-icon {
  display:grid!important;place-items:center!important;
  width:50px!important;height:50px!important;
  margin:0 0 16px!important;
  color:var(--mlux-sage)!important;
  background:#F0F6F1!important;
  border:1px solid #DCE9DE!important;
  border-radius:15px!important;
  box-shadow:none!important;
}
html body .ml-seo-service .ml-ux-directory-icon svg {width:26px!important;height:26px!important;}
html body .ml-seo-service.ml-ux-directory-card h3 {margin-top:0!important;color:var(--mlux-ink)!important;}
@media (prefers-reduced-motion:reduce) {
  html body a.ml-ux-cta,
  html body button.ml-ux-cta,
  html body a.ml-ux-cta:hover,
  html body button.ml-ux-cta:hover,
  html body a.ml-ux-cta:active,
  html body button.ml-ux-cta:active,
  html body .hero .hero-points a.ml-ux-service-card:hover {
    transition:none!important;animation:none!important;transform:none!important;
  }
  html body .ml-ux-appeared.section-title,
  html body .ml-ux-appeared.ml-lux-feature,
  html body .ml-ux-appeared.ml-premium-icon {animation:none!important;transition:none!important;transform:none!important;}
}