.site-header {
    z-index: 1000!important;
}
.menu-toggle {
    background-color: #4d4440!important;
}

/* 1) Style de base */
#menu-item-553 > a {
  display: inline-block;           /* pour permettre le padding et les bordures */
  background-color: #C71B00;          /* fond noir */
  color: #fff;                     /* texte blanc */
  border: 2px solid #C71B00;       /* contour rouge */
  border-radius: 4px;              /* coins arrondis */
  padding: 0px 10px 0px 10px;            /* espace intérieur */
  font-size: 14px;                 
  text-decoration: none;           /* on enlève le soulignement */
  transition: 
    background-color 0.2s ease, 
    color 0.2s ease;
}

/* 2) Hover / focus */
#menu-item-553 > a:hover,
#menu-item-553 > a:focus {
  background-color: #C71B00;       /* fond rouge au survol */
  color: #000;                     /* texte noir */
}

/* =========================================================
   FORMULAIRE CONTACT — VERSION MINIMALISTE / PREMIUM
   Compatible Ninja Forms
========================================================= */

/* ---------- Variables ---------- */
:root {
  --contact-bg: #e9e9e7;
  --contact-surface: transparent;
  --contact-text: #FFFFFF;
  --contact-muted: #808080;
  --contact-border: #FFFFFF;
  --contact-border-soft: #808080;
  --contact-hover: #111111;
  --contact-hover-text: #f5f5f3;
  --contact-error: #b42318;
  --contact-focus: #FFF;
  --contact-radius: 0px;
  --contact-transition: 0.25s ease;
}

/* ---------- Réglages généraux ---------- */
.nf-form-fields-required {
  display: none !important;
}

.nf-form-content {
  color: var(--contact-text);
}

.nf-before-form-content,
.nf-after-form-content,
.nf-form-content * {
  box-sizing: border-box;
}

/* ---------- Structure globale ---------- */
.nf-form-content .nf-field-container {
  margin-bottom: 22px !important;
}

.nf-form-content .nf-field {
  position: relative;
}

/* ---------- Labels ---------- */
.nf-field-label {
  margin-bottom: 8px !important;
}

.nf-field-label label,
.nf-field-label span {
  display: inline-block;
  color: var(--contact-text) !important;
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.01em;
}

/* Masquer les labels vides éventuels */
.nf-field-label:empty {
  display: none !important;
}

/* ---------- Inputs / Textarea / Select ---------- */
.ninja-forms-field.nf-element:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),
.nf-form-content select.ninja-forms-field,
.nf-form-content textarea.ninja-forms-field {
  width: 100% !important;
  min-height: 56px;
  padding: 16px 18px !important;
  background: var(--contact-surface) !important;
  color: var(--contact-text) !important;
  border: 1px solid var(--contact-border-soft) !important;
  border-radius: var(--contact-radius) !important;
  box-shadow: none !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  outline: none !important;
  transition:
    border-color var(--contact-transition),
    background-color var(--contact-transition),
    color var(--contact-transition),
    box-shadow var(--contact-transition) !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* Textarea */
.nf-form-content textarea.ninja-forms-field {
  min-height: 160px !important;
  resize: vertical !important;
}

/* Focus */
.ninja-forms-field.nf-element:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):focus,
.nf-form-content select.ninja-forms-field:focus,
.nf-form-content textarea.ninja-forms-field:focus {
  border-color: var(--contact-focus) !important;
  box-shadow: 0 0 0 1px var(--contact-focus) inset !important;
  background: rgba(255, 255, 255, 0.18) !important;
}

/* Placeholder */
.ninja-forms-field.nf-element::placeholder,
.nf-form-content textarea.ninja-forms-field::placeholder {
  color: var(--contact-muted) !important;
  opacity: 1 !important;
}

/* ---------- Champs de type liste / select ---------- */
.nf-form-content select.ninja-forms-field {
  background-image:
    linear-gradient(45deg, transparent 50%, #111 50%),
    linear-gradient(135deg, #111 50%, transparent 50%);
  background-position:
    calc(100% - 22px) calc(50% - 3px),
    calc(100% - 16px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 44px !important;
}

/* ---------- Description / aide ---------- */
.nf-field-description,
.nf-field-description p,
.ninja-forms-req-symbol,
.nf-field-help {
  color: var(--contact-muted) !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}

/* ---------- Erreurs ---------- */
.nf-error .ninja-forms-field.nf-element,
.nf-error textarea.ninja-forms-field,
.nf-error select.ninja-forms-field {
  border-color: var(--contact-error) !important;
  box-shadow: 0 0 0 1px var(--contact-error) inset !important;
}

.nf-error-msg,
.ninja-forms-req-symbol,
.nf-form-errors .nf-error-msg {
  color: var(--contact-error) !important;
  font-size: 0.88rem !important;
  margin-top: 8px !important;
}

/* ---------- Cases à cocher / radio ---------- */
.nf-field-element ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.nf-field-element ul li {
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
}

/* On masque le style natif sans supprimer l’accessibilité */
.nf-field-element input[type="checkbox"],
.nf-field-element input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.nf-field-element input[type="checkbox"] + label,
.nf-field-element input[type="radio"] + label {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  gap: 12px;
  padding-left: 0 !important;
  color: var(--contact-text) !important;
  cursor: pointer;
  user-select: none;
  font-size: 0.95rem !important;
  line-height: 1.5 !important;
}

/* boîte / rond */
.nf-field-element input[type="checkbox"] + label::before,
.nf-field-element input[type="radio"] + label::before {
  content: "";
  display: inline-block;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border: 1px solid var(--contact-border);
  background: transparent;
  transition:
    background var(--contact-transition),
    border-color var(--contact-transition),
    transform var(--contact-transition);
}

.nf-field-element input[type="radio"] + label::before {
  border-radius: 50%;
}

.nf-field-element input[type="checkbox"] + label::before {
  border-radius: 0;
}

/* coche checkbox */
.nf-field-element input[type="checkbox"] + label::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 6px;
  width: 5px;
  height: 9px;
  border: solid #c48133;
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity var(--contact-transition);
}

/* point radio */
.nf-field-element input[type="radio"] + label::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 7px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  opacity: 0;
  transition: opacity var(--contact-transition);
}

.nf-field-element input[type="checkbox"]:checked + label::before,
.nf-field-element input[type="radio"]:checked + label::before {
  background: var(--contact-border);
  border-color: var(--contact-border);
}

.nf-field-element input[type="checkbox"]:checked + label::after,
.nf-field-element input[type="radio"]:checked + label::after {
  opacity: 1;
}

.nf-field-element input[type="checkbox"] + label:hover::before,
.nf-field-element input[type="radio"] + label:hover::before {
  transform: scale(1.04);
}

/* ---------- Boutons étape précédente / suivante ---------- */
.nf-next-previous {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: flex-start;
  margin: 28px 0 0 !important;
  padding: 0 !important;
}

.nf-next-previous input.nf-previous,
.nf-next-previous input.nf-next {
  min-height: 52px;
  padding: 0 24px !important;
  border: 1px solid var(--contact-border) !important;
  border-radius: var(--contact-radius) !important;
  background: transparent !important;
  color: var(--contact-text) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition:
    background-color var(--contact-transition),
    color var(--contact-transition),
    border-color var(--contact-transition) !important;
}

.nf-next-previous input.nf-previous:hover,
.nf-next-previous input.nf-next:hover,
.nf-next-previous input.nf-previous:focus,
.nf-next-previous input.nf-next:focus {
  background: var(--contact-hover) !important;
  color: var(--contact-hover-text) !important;
  border-color: var(--contact-hover) !important;
  outline: none !important;
}

/* ---------- Bouton envoyer ---------- */
/* Remplace #nf-field-22 si l’ID change un jour */
.nf-form-content input[type="submit"].ninja-forms-field,
.nf-form-content .submit-wrap input[type="button"],
.nf-form-content .submit-wrap input[type="submit"],
#nf-field-22.ninja-forms-field.nf-element[type="submit"] {
  min-height: 56px;
  padding: 0 28px !important;
  border: 1px solid var(--contact-border) !important;
  border-radius: var(--contact-radius) !important;
  background: transparent !important;
  color: var(--contact-text) !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition:
    background-color var(--contact-transition),
    color var(--contact-transition),
    border-color var(--contact-transition),
    opacity var(--contact-transition) !important;
}

.nf-form-content input[type="submit"].ninja-forms-field:hover,
.nf-form-content input[type="submit"].ninja-forms-field:focus,
.nf-form-content .submit-wrap input[type="button"]:hover,
.nf-form-content .submit-wrap input[type="button"]:focus,
.nf-form-content .submit-wrap input[type="submit"]:hover,
.nf-form-content .submit-wrap input[type="submit"]:focus,
#nf-field-22.ninja-forms-field.nf-element[type="submit"]:hover,
#nf-field-22.ninja-forms-field.nf-element[type="submit"]:focus {
  background: var(--contact-hover) !important;
  color: var(--contact-hover-text) !important;
  border-color: var(--contact-hover) !important;
  outline: none !important;
}

.nf-form-content input[type="submit"].ninja-forms-field:disabled,
.nf-form-content input[type="submit"].ninja-forms-field[aria-disabled="true"],
#nf-field-22.ninja-forms-field.nf-element[type="submit"]:disabled,
#nf-field-22.ninja-forms-field.nf-element[type="submit"][aria-disabled="true"] {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
}

/* ---------- Consentement RGPD spécifique ---------- */
/* Garde cette partie uniquement si #nf-field-20 est bien la case concernée */
/* Wrapper : checkbox + texte sur la même ligne */
/* Wrapper global */
#nf-field-20-wrap {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
}

/* Bloc checkbox */
#nf-field-20-wrap .nf-field-element {
  flex: 0 0 auto !important;
  width: 18px !important;
  min-width: 18px !important;
  margin-top: 4px !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Bloc label */
#nf-field-20-wrap .nf-field-label {
  flex: 1 1 auto !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* Input checkbox réellement cliquable */
#nf-field-20 {
  display: inline-block !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 1px solid #111 !important;
  background: transparent !important;
  border-radius: 0 !important;
  position: relative !important;
  cursor: pointer !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 3 !important;
}

/* coche */
#nf-field-20::after {
  content: "";
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.2s ease;
}

#nf-field-20:checked {
  background: #111 !important;
  border-color: #111 !important;
}

#nf-field-20:checked::after {
  opacity: 1;
}

/* label cliquable aussi */
#nf-label-field-20 {
  display: block !important;
  margin: 0 !important;
  cursor: pointer !important;
  line-height: 1.5 !important;
}

/* ---------- Colonnes / responsive ---------- */
.nf-form-content .list-wrap,
.nf-form-content .textbox-wrap,
.nf-form-content .email-wrap,
.nf-form-content .phone-wrap,
.nf-form-content .textarea-wrap {
  width: 100%;
}

/* ---------- Messages de confirmation ---------- */
.nf-response-msg,
.nf-success-msg {
  margin-top: 24px;
  padding: 16px 18px;
  border: 1px solid var(--contact-border);
  color: var(--contact-text);
  background: rgba(255, 255, 255, 0.2);
  font-size: 0.95rem;
  line-height: 1.5;
}

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
  .ninja-forms-field.nf-element:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),
  .nf-form-content select.ninja-forms-field,
  .nf-form-content textarea.ninja-forms-field {
    min-height: 52px;
    padding: 14px 16px !important;
    font-size: 16px !important; /* évite le zoom iPhone */
  }

  .nf-next-previous {
    justify-content: stretch;
  }

  .nf-next-previous input.nf-previous,
  .nf-next-previous input.nf-next,
  .nf-form-content input[type="submit"].ninja-forms-field,
  .nf-form-content .submit-wrap input[type="submit"] {
    width: 100%;
  }
}