@font-face {
  font-family: "Antonio";
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
  src: url("./fonts/antonio-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Manrope";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("./fonts/manrope-latin.woff2") format("woff2");
}

:root {
  --mp-contact-pink: #b83268;
  --mp-contact-pink-dark: #8f234f;
  --mp-focus: #ffbf47;
}

/* Typographie globale : aucun widget HTML Elementor n'est modifié. */
body {
  font-family: "Manrope", Arial, sans-serif !important;
  font-weight: 400;
}

body :where(
  p,
  li,
  dd,
  dt,
  blockquote,
  label,
  input,
  textarea,
  select,
  option,
  table,
  small,
  .elementor-widget-text-editor,
  .elementor-icon-list-text,
  .ti-widget,
  [class^="mp-"],
  [class*=" mp-"]
) {
  font-family: "Manrope", Arial, sans-serif !important;
  font-weight: 400;
}

body :where(h1, h2, h3, h4, h5, h6, .elementor-heading-title),
body :where(h1, h2, h3, h4, h5, h6, .elementor-heading-title) :where(span, strong, em, a) {
  font-family: "Antonio", Impact, sans-serif !important;
  font-weight: 700 !important;
}

body :where(
  nav a,
  .menu-item > a,
  button,
  [role="button"],
  .button,
  .elementor-button,
  input[type="button"],
  input[type="submit"],
  .mp-contact-toggle,
  .mp-contact-action,
  #mp-header a
) {
  font-family: "Manrope", Arial, sans-serif !important;
  font-weight: 600 !important;
}

.ti-widget,
.ti-widget * {
  font-family: "Manrope", Arial, sans-serif !important;
}

.mp-contact-launcher {
  position: fixed;
  left: max(20px, env(safe-area-inset-left));
  bottom: max(20px, env(safe-area-inset-bottom));
  z-index: 99998;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  font-family: inherit;
}

.mp-contact-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px) scale(.98);
  transform-origin: bottom left;
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  pointer-events: none;
}

.mp-contact-launcher.is-open .mp-contact-actions {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.mp-contact-toggle,
.mp-contact-action {
  min-height: 48px;
  border: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 18px;
  color: #fff !important;
  text-decoration: none !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 10px 28px rgba(2, 28, 59, .24);
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.mp-contact-toggle {
  background: var(--mp-contact-pink);
}

.mp-contact-toggle:hover,
.mp-contact-toggle:focus-visible {
  background: var(--mp-contact-pink-dark);
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(2, 28, 59, .3);
}

.mp-contact-action {
  min-width: 150px;
  justify-content: flex-start;
  background: var(--mp-contact-pink);
}

.mp-contact-action:hover,
.mp-contact-action:focus-visible {
  background: var(--mp-contact-pink-dark);
  transform: translateX(3px);
}

.mp-contact-action--whatsapp:hover,
.mp-contact-action--whatsapp:focus-visible {
  background: var(--mp-contact-pink-dark);
}

.mp-contact-toggle:focus-visible,
.mp-contact-action:focus-visible,
#ast-scroll-top:focus-visible {
  outline: 3px solid var(--mp-focus) !important;
  outline-offset: 3px;
}

.mp-contact-toggle svg,
.mp-contact-action svg {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  fill: currentColor;
}

#ast-scroll-top {
  right: max(20px, env(safe-area-inset-right)) !important;
  bottom: max(20px, env(safe-area-inset-bottom)) !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  padding: 0 !important;
  background: var(--mp-contact-pink) !important;
  color: #fff !important;
  line-height: 1 !important;
  box-shadow: 0 10px 28px rgba(2, 28, 59, .24) !important;
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}

#ast-scroll-top:hover,
#ast-scroll-top:focus-visible {
  background: var(--mp-contact-pink-dark) !important;
  transform: translateY(-3px);
  box-shadow: 0 14px 32px rgba(2, 28, 59, .3) !important;
}

#ast-scroll-top:not([style*="display: none"]) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#ast-scroll-top .ast-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  line-height: 0 !important;
}

#ast-scroll-top .ast-arrow-svg {
  display: block !important;
  width: 22px !important;
  height: auto !important;
  margin: 0 !important;
  transform: rotate(180deg) !important;
}

/* Évite le flash de la balise de remplacement créée autour de Trustindex. */
.elementor-shortcode > pre.ti-widget {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: inherit !important;
  white-space: normal !important;
  font: inherit !important;
}

.mp-s-cta,
.wpcf7-submit {
  background-color: #9f1239 !important;
  color: #fff !important;
}

#mp-footer {
  color: #cbd2da !important;
}

#mp-footer h3 {
  color: #fff !important;
}

#mp-header .mp-menu > li > a {
  color: #fff !important;
}

#mp-real .mp-r-dots button {
  position: relative;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#mp-real .mp-r-dots button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .6);
  transform: translate(-50%, -50%);
}

#mp-real .mp-r-dots button.on::before {
  width: 24px;
  background: #f45b93;
}

.mp-f-pkick,
.mp-f-bottom span,
.mp-f-bottom .made {
  color: rgba(255, 255, 255, .76) !important;
}

@media (max-width: 480px) {
  .mp-contact-launcher {
    left: 14px;
    bottom: max(14px, env(safe-area-inset-bottom));
  }

  #ast-scroll-top {
    right: 14px !important;
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
  }

  .mp-contact-toggle {
    min-width: 48px;
    padding: 0 14px;
  }

  .mp-contact-action {
    min-width: 142px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mp-contact-actions,
  .mp-contact-toggle,
  .mp-contact-action,
  #ast-scroll-top {
    transition: none !important;
  }
}
