@charset "utf-8";


/* ============================================
   SECTIONS
============================================ */

.section {
  max-width:900px;
  margin:3em auto;
  padding:0 1em;
}

.section h2{
  font-size:1em;
  margin-bottom:1em;
  text-transform: none !important;
  }

.section p{
  font-size:1.05em;
  line-height:1.7;
}

@media all and (max-width: 1099px) {
  section {
    width: 78%;
    margin:0 auto;
    
  }
}

@media all and (max-width: 850px) {
  section {
    width: 95%;
    margin:0 auto;
     
  }
}

@media all and (max-width: 720px) {
  section {
    width: 95%;
    margin:0 auto;
    
  }
}

@media all and (max-width: 750px) {
.section_form {
  width: 100% !important;
}
}

/* ============================================
   PHOTO FLOTTANTE
============================================ */

.float-photo {
  float:right;
  max-width:300px;
  min-width:300px;
  margin:0 0 1em 1.5em;
}

.float-photo img {
  width:100%;
  height:auto;
  display:block;
  border-radius:0.6em;
  box-shadow:0 3px 8px rgba(0,0,0,0.1);
}

.float-photo img.social-icon {
  width: auto;
  height: auto;
  display: inline;
  border-radius: 0;
  box-shadow: none;
  margin-right: 0.5em;
}

@media (max-width: 580px) {
  .float-photo {
    float: none;
    max-width: 100%;
    margin: 1em 0;
    min-width:auto;
  }
  .float-photo img {
    margin: 0 auto;
    display: block;
  }
}

/* =====================================
   FORMULAIRE CONTACT
===================================== */

.contact-form {
  position:relative;
  margin-top:1em;
  padding:2.2em 1.5em 1.5em;
  border:1px solid #ccc;
  border-radius:10px;  
  clear:both;
}

.form-ligne {
  margin-bottom:0.9em;
}

.form-ligne label {
  display:block;
  font-weight:600;
  margin-bottom:0.3em;
  font-size:0.95em;
}

.form-ligne input[type="text"],
.form-ligne input[type="email"],
.form-ligne input[type="tel"],
.form-ligne textarea {
  width:100%;
  padding:0.65em 0.8em;
  border:1px solid #ccc;
  border-radius:6px;
  font-size:1em;
  box-sizing:border-box;
}

.form-ligne textarea {
  min-height:140px;
  resize:vertical;
}

.form-help {
  font-size:0.85em;
  color:var(--primary);
}

.form-error {
  color:#c72e2e;
  font-size:0.9em;
  margin-top:6px;
  min-height:1em;
}

.form-counter {
  color:var(--primary);
  opacity:0.7;
}

fieldset {
  border:none;
  padding:0;
  margin:0;
}

.contact-form button.bouton.primary {
  display:inline-flex;
  align-items:center;
  gap:0.5em;  
  color:  #f00;
  background: #000;
  padding:0.75em 1.6em;
  border-radius:40px;
  border: 1px solid rgba(231, 193, 145, 0.45);
  cursor:pointer;
}

.contact-form button.bouton.primary:hover {
  background: rgba(231, 193, 145, 0.15);
}

/* Honeypot */

.hp-container {
  position:absolute !important;
  left:-9999px !important;
  top:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  visibility:hidden !important;
}

.main2 h2 {
  display: block;
  background: none;
  border: none;
  padding: 0;
  border-radius: 0;
}


.contact-columns {
    display: flex;
    gap: 40px;
    align-items: center;
    margin: 50px 0;
}

.contact-left {
    flex: 2;   /* 2/3 */
}

.contact-right {
    flex: 1;   /* 1/3 */
    text-align: center;
}

.contact-left {
    text-align: left;
}

.contact-right {
    text-align: center;
}

.contact-right p {
    margin: 0;
}

.social-icon {
    vertical-align: middle;
    margin-right: 8px;
}

/* Mobile */
@media (max-width: 720px) {

    .contact-columns {
        flex-direction: column;
        gap: 25px;
        margin: 0 a
    }

    .contact-left,
    .contact-right {
        width: 100%;
        text-align: center;
    }

}