:root {
      --primary: #812626;
      --bg-beige: #ebe4de;
      --text-main: #333;
  }

  /* --- HERO --- */
  .img_home_contact {
      height: 65vh;
      position: relative;
      overflow: hidden;
  }

  .overlay_service_contact {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.4);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 2;
  }

  /* --- FORMULAIRE (Style Salon) --- */
  .contact_form_card {
      background: white;
      padding: 50px;
      border-radius: 20px;
      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.05);
      margin-top: -100px;
      z-index: 10;
      position: relative;
  }

  .input_salon {
      width: 100%;
      padding: 15px;
      background: #f9f6f4;
      border: 1px solid #eee;
      border-radius: 10px;
      transition: 0.3s;
      outline: none;
  }

  .input_salon:focus {
      border-color: var(--primary);
      background: white;
      box-shadow: 0 5px 15px rgba(129, 38, 38, 0.05);
  }

  .label_salon {
      font-weight: 600;
      font-size: 0.85rem;
      color: var(--text-main);
      margin-bottom: 8px;
      display: block;
  }

  /* --- CARTE ET LÉGENDE --- */
  .map_wrapper {
      border-radius: 20px;
      overflow: hidden;
      height: 400px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
      border: 1px solid #eee;
  }

  .info_card_vibrant {
      background: white;
      border-radius: 20px;
      box-shadow: 0 15px 40px rgba(0, 0, 0, 0.06);
      border: 1px solid rgba(129, 38, 38, 0.05);
      overflow: hidden;
  }

  .info_item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 12px 0;
      border-bottom: 1px dashed #eee;
  }

  .info_item:last-child {
      border-bottom: none;
  }

  .icon_circle {

      background: var(--primary);
      color: white;
      transform: rotate(-10deg);

      width: 38px;
      height: 38px;

      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 10px;
      font-size: 1.1rem;
      transition: 0.3s;
  }

  .info_item:hover .icon_circle {
      background: var(--bg-beige);
      color: var(--primary);
      transform: rotate(0deg);
  }

  .info_label {
      font-size: 0.7rem;
      text-transform: uppercase;
      color: #888;
      display: block;
  }

  .info_value {
      font-weight: 600;
      color: var(--text-main);
      margin: 0;
      font-size: 0.85rem;
  }

  /* --- SECTION TRANSFORMATION --- */
  .last_section {
      padding: 80px 0;
  }

  .bg_beige {
      background-color: var(--bg-beige);
  }

  

  .btn_reserve1 {
      background: var(--primary);
      color: white;
      border: none;
      padding: 15px 40px;
      border-radius: 50px;
      text-transform: uppercase;
      font-weight: 700;
      transition: 0.3s;
  }

  .btn_reserve1:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 25px rgba(129, 38, 38, 0.3);
      color: white;


      .dot_style {
          width: 12px;
          height: 12px;
          border-radius: 50%;
          display: inline-block;
      }
  }

  /* Style des Alertes Modernisées */
  .alert-salon-custom {
      display: flex;
      align-items: center;
      gap: 15px;
      padding: 18px 25px;
      border-radius: 15px;
      border: none;
      margin-bottom: 30px;
      font-weight: 500;
      font-size: 0.95rem;
      animation: slideInDown 0.5s ease-out;
  }

  .alert-success-salon {
      background: #f0f9f4;
      color: #1a5935;
      border-left: 5px solid #28a745;
  }

  .alert-error-salon {
      background: #fff5f5;
      color: #a94442;
      border-left: 5px solid #dc3545;
  }

  .alert-icon {
      font-size: 1.4rem;
      flex-shrink: 0;
  }

  @keyframes slideInDown {
      from {
          opacity: 0;
          transform: translateY(-10px);
      }

      to {
          opacity: 1;
          transform: translateY(0);
      }
  }