/* SECTION ENGAGE */
.title-section{ color:var(--primary); font-size:25px; font-weight:800; font-style:italic; }
.title-section-second{ color:#8c8c8c99; font-size:25px; font-weight:800; font-style:italic; }
.title-style-five .title-section{ color:var(--primary); font-weight:800; font-size:40px; text-shadow:-3px 29px 0 rgba(140,140,140,.6); }


.section-engage{ padding:30px 0; margin-bottom: 50px}
.item-sengage{ background:#fff!important; border-radius:20px; box-shadow:0 2px 20px rgba(0,0,0,.4); padding:20px!important; min-height:281px; }
.section-engage .disc{ color:#000; }
.section-engage .disc span{ color:var(--primary); font-weight:600; }
.section-engage .items{ padding:0 160px; }

input{
     width: 100%;
    padding: 8px 14px;
    background: var(--bg-soft);
    border: 1px solid var(--border);
    border-radius: 12px;
    font-size: 14px;
    color: var(--ink);
}
.form-parrainage label {
    display: block;
    margin-bottom: 8px;
    color: #000;
    font-weight: 600;
    font-size: 14px;
}



/* ====== Entête Offres avec overlay SVG ====== */
.section-head-offres{
  position: relative;
  padding: 60px 0 50px;
  background-image: url('../../assets/images/offres-head.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}
.section-head-offres::after{
  content:"";
  position:absolute; inset:0;
  background: url('../../assets/images/offres-gradient-head.svg') center bottom / cover no-repeat;
  z-index:1; pointer-events:none; opacity:.85;
}
.section-head-offres .content{ position:relative; z-index:2; text-align:center; }
.section-head-offres .title{ font-size:40px; color:#fff; font-weight:800; margin:0; }
.section-head-offres .desc{ font-size:16px; color:#fff; }

/* ====== Menu Offres (onglets) ====== */
.offres-menu{ margin:22px 0 12px; }
.offres-menu ul{
  display:flex; gap:40px; list-style:none; padding:0; margin:0;
  align-items:flex-end; flex-wrap:wrap;    justify-content: center;
}
.offres-menu li{
  position:relative;
  cursor:pointer;
  padding:8px 0;                 /* espace pour l'underline */
  font-weight:500;
  font-size:17px;
  color:#111;                    /* non actif = noir */
  transition:color .2s ease;
}
.offres-menu li:hover{ color:#000; }
.offres-menu li.active{ color:#e96002; }   /* actif = orange */

.offres-menu li::after{                 /* barre sous l’onglet */
  content:"";
  position:absolute;
  left:0; bottom:5px;
  width:100%; height:2px;
  background:#e96002;
  border-radius:2px;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .25s ease;
}
.offres-menu li.active::after{
  transform:scaleX(1);
}


/* On cache par défaut, JS affichera le bon onglet */
.offres-section{ display:none; }

/* ====== Bloc Franchise ====== */
.section-franchises{
	margin-bottom: 50px;
}
.body-franchise{ padding: 0 160px; }
.media-franchise{ display:flex; justify-content:center; margin:50px 0; }
.media-franchise img{ max-width:400px; height:auto; }

.content-franchise{
  position:relative; padding:90px 30px 30px; border-radius:18px;
  background-image:
    linear-gradient(0deg, #e9600d 18%, rgba(233,96,13,0) 100%),
    url('../../assets/images/bg-franchise-offres.png');
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.content-franchise h2{ color:#fff; font-size:18px; font-weight:700; margin:100px 0 10px; }
.content-franchise p{ color:#fff; font-size:15px; margin:0; }

/* Bouton Franchise (SVG non modifié) */
.btn-default{
  background:#fff; color:#e96002; padding:0 40px; height:45px;
  border:2px solid #e96002; display:inline-flex; align-items:center; gap:8px;
  width:auto; font-weight:600; font-size:16px; border-radius:20px; text-decoration:underline;
}
.btn-default:hover{ background:#e96002; color:#fff; }
.btn-franchise{
  position:absolute; top:0; left:50%; transform:translate(-50%, -50%);
}

/* ====== Parrainage ====== */
.section-parrainage{
	    padding: 30px 0;
	    margin-bottom: 50px;
}
.section-parrainage .title h3{ font-size:35px; color:#000; font-weight:800; text-align:justify; }
.section-parrainage .title h4{ font-size:35px; color:#000; font-weight:800; text-align:center;margin-top:20px; }

.section-parrainage .title span{ color:#e96002; }

.body-parrainage{ padding:0 160px; }
.body-parrainage .title .desc{ font-size:15px; color:#000; line-height:1.6; }

.form-parrainage{ max-width:750px; margin:30px auto; }
.input-half-wrapper{ display:flex; gap:20px; }
.input-half-wrapper .signle-input{ flex:1; }
.signle-input{ margin-bottom:18px; }
.signle-input input, .signle-input textarea{
  width:100%; border:1px solid #d9d9d9; border-radius:12px; padding:12px 14px; font-size:15px; background:#fff; height: 45px;
}
.signle-input input:focus, .signle-input textarea:focus{
  border-color:#e96002; box-shadow:0 0 0 3px rgba(233,96,2,.15); outline:none;
}
.form-parrainage .consent label{ display:flex; align-items:center; gap:8px; font-size:14px; color:#555; }
.btn-parrainage{ width:100%; font-weight:700; font-size:18px; height:40px; border-radius:12px; padding:10px 40px; }
.btn-parrainage:hover{ background:#cf5402; }

/* Questions */
.title-question{ color:#e96002; font-size:18px; font-weight:600; margin:0 0 3px; }
.questions-items p{ color:#000; font-size:15px; }
.questions-items .item{ margin-bottom:10px; }

/* ====== Responsive ====== */
@media (max-width: 991.98px){
  .body-franchise, .body-parrainage{ padding:0 16px; }
  .content-franchise{ padding:80px 16px 20px; }
  .content-franchise h2{ margin-top:60px; }
  .input-half-wrapper{ flex-direction:column; gap:0; }




  
}

@media (max-width: 576px){

  .body-franchise, .body-parrainage{ padding:0 16px; }
  .content-franchise{ padding:80px 16px 20px; }
  .content-franchise h2{ margin-top:60px; font-size:18px;line-height:1.2 }
  .input-half-wrapper{ flex-direction:column; gap:0; }

  .section-head-offres .title{
     font-size: 26px;
  }
  .section-head-offres .content{
    line-height: 1.2;
  }
  .offres-menu{
    margin: 12px 0 12px;
  }
  .offres-menu ul{
    gap: 7px;
  }
  .offres-menu li{
    font-size: 15px;
  }
  .media-franchise{
    margin: 0px 0 50px;
  }
  .media-franchise img {
    max-width: 300px;
   }
   .btn-franchise{
    width: 300px;
   }
   .content-franchise p{
    line-height: 1.5;
   }



   .title-style-five .title-section{
    font-size: 26px;
   }
   .section-engage .items{
    padding: 0 20px;
   }

   .section-parrainage .title h3{
    font-size: 22px;
    text-align: left;
   }
   .form-parrainage .consent label{
    line-height: 1.2;
   }

   .section-parrainage .title h4{
    font-size: 22px;
   }
   .questions-items p{
    line-height: 1.4;
   }

}