/* ============================================================
   GARANTIES (lÃƒÆ’Ã‚Â¨vent les freins avant le formulaire)
   ============================================================ */
.garanties-strip{padding:0 24px;margin-top:-40px;position:relative;z-index:3;}
.garanties-grid{
  max-width:1120px;margin:0 auto;background:#fff;border-radius:20px;box-shadow:0 30px 60px -24px rgba(27,20,100,.28);
  display:grid;grid-template-columns:repeat(4,1fr);
}
.garantie-item{display:flex;align-items:center;gap:14px;padding:26px 22px;border-right:1px solid var(--white-line);}
.garantie-item:last-child{border-right:none;}
.garantie-ic{
  flex:none;width:42px;height:42px;border-radius:12px;background:var(--white-fog);color:var(--second-color);
  display:flex;align-items:center;justify-content:center;font-size:16px;
}
.garantie-t{font-size:14px;font-weight:700;color:var(--primary-color);}
.garantie-s{font-size:12px;color:var(--color-grey);margin-top:2px;}


/* ============================================================
   FORM WIZARD
   ============================================================ */

.section.section-fog {
    position: relative;
    margin-top: -69px;
    padding: 140px 0 40px;
    background-image: url(../images/bg/bg-services.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    overflow: hidden;
}

.section.section-fog .shape-cta.shape-3 {
    top: 0;
}


.wizard-card{
  max-width:820px;margin:0 auto;background:#fff;border:1px solid var(--white-line);border-radius:24px;
  padding:48px;box-shadow:0 30px 70px -30px rgba(27,20,100,.18);
}
.wizard-steps{display:flex;align-items:center;margin-bottom:44px;}
.wizard-step{display:flex;align-items:center;gap:12px;flex:none;}
.wizard-step-round{
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--white-fog);
  color:var(--color-grey);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:14px;
  position:relative;
  transition:.3s;
  flex:none;
}
.wizard-step-round i{position:absolute;opacity:0;font-size:12px;transition:opacity .2s;}
.wizard-step.active .wizard-step-round{background: var(--second-color);color:#fff;}
.wizard-step.done .wizard-step-round{background:#2FAE64;color:#fff;}
.wizard-step.done .wizard-step-round span{opacity:0;}
.wizard-step.done .wizard-step-round i{opacity:1;}
.wizard-step-txt{display:none;}
.wizard-step-l{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--color-grey);font-family:var(--font-mono);}
.wizard-step-t{font-size:13px;font-weight:700;color:var(--primary-color);}
.wizard-step.active .wizard-step-txt{display:block;}
.wizard-line{flex:1;height:2px;background:var(--white-line);margin:0 10px;position:relative;top: 50%;}

.wizard-panel{display:none;}
.wizard-panel.active{display:block;animation:panelIn .4s var(--ease);}
.wizard-panel-head{margin-bottom:26px;}
.wizard-panel-head h2{font-size:22px;color: var(--second-color);margin-bottom:6px;}
.wizard-panel-head p{font-size:14px;color:var(--color-grey);}

.wf-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:8px;}
.wf-field{display:flex;flex-direction:column;gap:8px;}
.wf-field.full{grid-column:1/-1;}
.wf-field label{font-size:13px;font-weight:700;color:var(--primary-color);}
.wf-field label span{color:var(--second-color);}
.wf-input{position:relative;}
.wf-input i:first-child{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--color-grey);font-size:14px;}
.wf-input input,.wf-input select,.wf-input textarea{
  width:100%;border:1.5px solid var(--white-line);border-radius:11px;padding:13px 16px 13px 44px;
  font-family:var(--font-body);font-size:14px;color:var(--black-color);background:var(--white-fog);
  transition:border-color .3s,background .3s;appearance:none;
}
.wf-input textarea{padding-left:16px;resize:vertical;min-height:130px;}
.wf-input input:focus,.wf-input select:focus,.wf-input textarea:focus{outline:none;border-color:var(--second-color);background:#fff;}
.wf-input .caret{position:absolute;right:16px;left:auto;pointer-events:none;font-size:11px;}
.wf-help{font-size:12px;color:var(--color-grey);margin-top:-2px;}

.wf-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:28px;}
.wf-choice{cursor:pointer;}
.wf-choice input{position:absolute;opacity:0;width:0;height:0;}
.wf-choice-box{
  display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 10px;border-radius:14px;
  border:1.5px solid var(--white-line);background:var(--white-fog);text-align:center;transition:.25s;
}
.wf-choice-box i{font-size:18px;color:var(--color-grey);transition:.25s;}
.wf-choice-box span{font-size:12px;font-weight:700;color:var(--primary-color);}
.wf-choice:hover .wf-choice-box{border-color:var(--primary-color);}
.wf-choice input:checked ~ .wf-choice-box{background:var(--primary-color);border-color:var(--primary-color);}
.wf-choice input:checked ~ .wf-choice-box i,
.wf-choice input:checked ~ .wf-choice-box span{color:#fff;}
.wf-choice input:checked ~ .wf-choice-box i{color:var(--second-color-light);}

.wf-radios{display:flex;flex-direction:column;gap:12px;margin-bottom:8px;}
.wf-radio{display:flex;align-items:center;gap:12px;cursor:pointer;padding:14px 16px;border-radius:12px;border:1.5px solid var(--white-line);transition:.25s;}
.wf-radio:hover{border-color:var(--primary-color);}
.wf-radio input{position:absolute;opacity:0;width:0;height:0;}
.wf-radio-dot{
  flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--white-line);position:relative;transition:.25s;
}
.wf-radio-dot::after{
  content:'';position:absolute;inset:3px;border-radius:50%;background:var(--second-color);opacity:0;transform:scale(.4);transition:.25s;
}
.wf-radio input:checked ~ .wf-radio-dot{border-color:var(--second-color);}
.wf-radio input:checked ~ .wf-radio-dot::after{opacity:1;transform:scale(1);}
.wf-radio span:last-child{font-size:14px;color:var(--primary-color);}

.wf-consent{display:flex;align-items:flex-start;gap:12px;margin-top:20px;cursor:pointer;}
.wf-consent input{margin-top:3px;}
.wf-consent span{font-size:12.5px;color:var(--color-grey);}
.wf-consent .req{color:var(--second-color);}

/* ---------- ÃƒÆ’Ã¢â‚¬Â°tats d'erreur (module validation-formulaires.js) ---------- */
.wf-error-msg{
  font-size:12px;color:#E23D3D;margin-top:6px;min-height:0;display:none;
}
.wf-error-msg:not(:empty){display:block;animation:errIn .25s var(--ease);}
@keyframes errIn{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:translateY(0);}}
.wf-field.has-error .wf-input input,
.wf-field.has-error .wf-input select,
.wf-field.has-error .wf-input textarea{
  border-color:#E23D3D !important;background:#FFF5F5 !important;
}
.wf-field.has-error > label{color:#E23D3D;}
.wf-field.has-error .wf-choices .wf-choice-box{border-color:#E23D3D;}
.wf-consent.has-error span:last-child{color:#E23D3D;}

.wf-foot{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding-top:26px;border-top:1px solid var(--white-line);}
.wf-foot .spacer{width:1px;}

.wf-honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none;}

.wf-note{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px;font-size:12.5px;color:var(--color-grey);}
.wf-note i{color:#2FAE64;}


/* ---------- Alternative : appeler / whatsapp ---------- */
.wizard-alt{
  max-width:820px;margin:34px auto 0;display:flex;align-items:center;gap:20px;padding:24px 28px;
  border-radius:18px;background:var(--white-fog);flex-wrap:wrap;
}
.wizard-alt-ic{
  flex:none;
  width:46px;
  height:46px;
  border-radius:12px;
  background:#fff;
  color: var(--second-color);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
}
.wizard-alt-txt{flex:1;min-width:200px;}
.wizard-alt-t{font-size:14.5px;font-weight:700;color:var(--primary-color);}
.wizard-alt-s{font-size:12.5px;color:var(--color-grey);}
.wizard-alt-btns{display:flex;gap:10px;}

/* ============================================================
   MODALE DE NOTIFICATION (remplace les alert() natifs du navigateur)
   ============================================================ */
.notif-overlay{
  position:fixed;inset:0;background:rgba(13,11,46,.6);backdrop-filter:blur(4px);z-index:3000;
  display:flex;align-items:center;justify-content:center;padding:24px;
  opacity:0;pointer-events:none;transition:opacity .3s var(--ease);
}
.notif-overlay.open{opacity:1;pointer-events:auto;}
.notif-modal{
  background:#fff;border-radius:20px;max-width:420px;width:100%;padding:36px 32px 28px;
  text-align:center;box-shadow:0 30px 70px -20px rgba(13,11,46,.4);
  transform:translateY(18px) scale(.96);transition:transform .35s var(--ease);
}
.notif-overlay.open .notif-modal{transform:translateY(0) scale(1);}
.notif-icon{
  width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:24px;margin:0 auto 20px;
}
.notif-modal.success .notif-icon{background:#E6F7EE;color:#2FAE64;}
.notif-modal.error .notif-icon{background:#FDEAEA;color:#E23D3D;}
.notif-modal.info .notif-icon{background:var(--white-fog);color:var(--primary-color);}
.notif-title{font-family:var(--second-font);font-size:19px;color:var(--primary-color);margin-bottom:10px;}
.notif-text{font-size:14px;color:var(--color-grey);line-height:1.6;margin-bottom:26px;}
.notif-actions{display:flex;gap:12px;justify-content:center;}
.notif-actions .btn{padding:12px 24px;font-size:13.5px;}
 
/* ---------- ÃƒÆ’Ã¢â‚¬Â°tats d'erreur (module validation-formulaires.js) ---------- */
.wf-error-msg{
  font-size:12px;color:#E23D3D;margin-top:6px;min-height:0;display:none;
}
.wf-error-msg:not(:empty){display:block;animation:errIn .25s var(--ease);}
@keyframes errIn{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:translateY(0);}}
.wf-field.has-error .wf-input input,
.wf-field.has-error .wf-input select,
.wf-field.has-error .wf-input textarea{
  border-color:#E23D3D !important;background:#FFF5F5 !important;
}
.wf-field.has-error > label{color:#E23D3D;}
.wf-field.has-error .wf-choices .wf-choice-box{border-color:#E23D3D;}
.wf-consent.has-error span:last-child{color:#E23D3D;}
 
.wf-foot{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding-top:26px;border-top:1px solid var(--white-line);}
.wf-foot .spacer{width:1px;}
 
.wf-honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none;}
 
.wf-note{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:20px;font-size:12.5px;color:var(--color-grey);}
.wf-note i{color:#2FAE64;}
 



/* *******************************************************************************************************
                                              process
******************************************************************************************************* */
section.wrapper-process {
    padding: 70px 0 100px;
    position: relative;
    background-image: url(../images/bg/bg-process.jpg);
    background-size: cover;
}

.process.container {
    width: 1250px;
}

.wrap-process {
    /* background-image: url(../images/bg/bg-line-process.png); */
    /* background-position: center center; */
    background-repeat: no-repeat;
    background-size: 70% auto;
    position: relative;
    align-content: flex-start;
    margin-top: 50px;
    align-items: unset;
}

.content-item-process {
    width: 20%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

span.num-process {
    color: #fff;
    font-family: 'League Spartan', sans-serif;
    font-size: 40px;
    font-weight: 700;
}

.item-process {
    width: 25%;
    padding: 0 15px;
    position: relative;
}

.content-item-process:nth-child(2n) .item-process {
    margin-top: 0px;
    transform: translateY(40px);
}

.wrap-item-process {
}

.circle-image {
    margin-bottom: 15px;
    text-align: center;
    position: relative;
}

.circle-image svg {
    transform: rotate(30deg);
    transition: all 0.4s;
    opacity: 70%;
}

.text-right {
    font-size: 17px;
}

.count-chiffres small {
    font-size: 24px;
}

.circle-image svg path:nth-child(1), .circle-image svg path:nth-child(2), .circle-image svg path:nth-child(4) {
    fill: var(--primary-color);
}

.process-icon {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    height: 140px;
    width: 140px;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.process-icon img {
    width: 60px;
    /* filter: grayscale(100%); */
}

.wrap-item-process:hover .process-icon img {
    /*transform: rotateY(360deg);*/
}

.process--meta {
    text-align: center;
}

h4.process--title {
    font-size: 18px;
    color: #000;
    line-height: 25px;
    font-weight: 600;
    margin-bottom: 5px;
}

p.process--text {
    margin: 0 0 20px 0;
    /*! font-family: 'Roboto',sans-serif; */
    font-size: 15px;
    line-height: 22px;
    color: #444;
    font-weight: 400;
    padding-top: 7px;
}

.item-process:nth-child(2) .circle-image svg, .item-process:nth-child(4) .circle-image svg {
    width: 160px;
    height: 160px;
}

.item-process:nth-child(2) .process-icon, .item-process:nth-child(4) .process-icon {
    width: 120px;
    height: 120px;
}

.wrap-btn-annaire {
    justify-content: center;
    display: flex;
    margin-top: 26px;
}

.primary-btn.btn-btn-process1 {
    margin-right: 15px;
}

.primary-btn.whatsapp {
    color: #25d366;
    background: white;
    border-color: #25d366;
}
.primary-btn.whatsapp span {
    background-color: #25d36636;
}

.primary-btn.btn-btn-process2 svg {
    fill: var(--primary-color);
}

.primary-btn.btn-btn-process2:hover {
    color: white;
}

.primary-btn.btn-btn-process2:hover svg {
    fill: white;
}

.chiffre-item-guide {
    font-size: 86px;
    font-weight: 700;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px var(--clr-theme-2);
    line-height: 1.6;
    -webkit-text-stroke: 1px var(--second-color);
    position: absolute;
    z-index: 2;
    left: 10%;
    top: -24%;
    opacity: 0.4;
}

.process .section-title {
    margin-bottom: 90px;
}

.bg-process.has-animation {
}

ul.shape-point {
}

li.start-point {
    position: absolute;
    z-index: 1;
    top: -0.437rem;
    left: 13px;
    color: var(--second-color);
}

.opacity-animation.transition-50.transition-delay-10 {
    opacity: 1;
    visibility: visible;
    transition: cubic-bezier(0,1,1,1) 0.5s,opacity 0.3s;
}

li.end-point {
    position: absolute;
    z-index: 1;
    top: -14px;
    right: 44px;
}

.opacity-animation.transition-50.transition-delay-4000 {
    opacity: 1;
    visibility: visible;
    transition-delay: 4s;
    transition: cubic-bezier(0,1,1,1) 0.5s,opacity 0.3s;
    color: var(--second-color);
}

.bg-process.has-animation svg {
    position: absolute;
    top: 6px;
    left: 23px;
    right: 0;
    width: 1300px !important;
    object-fit: cover;
}

.bg-process svg path {
    /* stroke: #c6942a; */
    /* opacity: 20%; */
    /* stroke-dasharray: 1300; */
    /* stroke-dashoffset: 1300; */
    /* animation: dash_animation 4s linear forwards; */
    width: 1300px;
}

.content-elmt-process {
    position: relative;
}

.process .title-filigrane {
    color: #808080de;
}

.bg-process svg path:nth-child(1) {
    stroke: var(--black-color);
    /* opacity: 20%; */
    /*! stroke-dasharray: 1300; */
    /*! stroke-dashoffset: 1300; */
    animation: dash_animation 4s linear forwards;
}

.bg-process svg path:nth-child(2) {
    /* stroke: #F6F6F6; */
    stroke: #034c76;
    /* stroke-dasharray: 4; */
}

.wrap-item-process:hover svg {
    /*! fill: #fa360a; */
    opacity: 100%;
    transform: rotate(0deg);
}

.wrap-item-process:hover .circle-image svg path:nth-child(1), .wrap-item-process:hover .circle-image svg path:nth-child(2), .wrap-item-process:hover .circle-image svg path:nth-child(4) {
    fill: var(--primary-color);
}

.wrap-item-process:hover .process-icon img {
    filter: grayscale(0);
}

