.section-timeline .bloc-timeline {row-gap: 4rem; flex-direction: column; width: calc(100% - 4rem); margin: 0 auto;}
.section-timeline .item-timeline {flex-direction: column; align-items: center; justify-content: center; row-gap: 1rem; text-align: center; background-color: var(--couleur-secondaire-light); border-radius: 2rem; width: 100%; padding: 2rem; position: relative; box-shadow: var(--ombre-photo-light);}
.section-timeline .item-timeline p {text-transform: uppercase; font-size: 2rem; color: var(--couleur-secondaire); margin: 0 auto;}
.section-timeline .item-timeline img {max-width: 6rem; max-height: 6rem;}
.section-timeline .item-timeline .emoji {font-size: 3.5rem;}

.section-timeline .item-timeline {--border: .3rem; }

.section-timeline .item-timeline::before { content: ""; position: absolute; border: dashed var(--couleur-principale); height: calc(100% + 3.7rem); width: calc(50% + 2rem);}
.section-timeline .item-timeline:first-of-type::before {border-width: 0 var(--border) var(--border) 0;  border-radius: 0 0 4rem 0; bottom: -2.5rem; right: -2.3rem; height: calc(50% + 2rem); }
.section-timeline .item-timeline:nth-of-type(2)::before {border-width: var(--border) 0 var(--border) var(--border); border-radius: 4rem 0 0 4rem; bottom: -2.5rem; left: -2rem;}
.section-timeline .item-timeline:nth-of-type(3)::before {border-width: var(--border) var(--border) var(--border) 0; border-radius: 0 4rem 4rem 0; top: -1.8rem; right: -2rem;}
.section-timeline .item-timeline:nth-of-type(4)::before {border-width: var(--border) 0 0 var(--border); border-radius: 4rem 0 0 0; top: -1.8rem; left: -2rem; height: calc(50% + 2rem);}


.section-timeline .item-timeline::after { content: ""; position: absolute; background-color: #fff; border: .3rem solid var(--couleur-principale); width: 1.2rem; height: 1.2rem; border-radius: 50%; top: 50%; transform: translateY(-50%);  }
/*.section-timeline .item-timeline::after { content: "\f04b"; position: absolute; font-weight: 900; font-family: "Font Awesome 6 Free"; top: 50%; transform: translateY(-50%); color: var(--couleur-principale); }*/


.section-timeline .item-timeline:nth-child(odd)::after {right: -3rem;}
.section-timeline .item-timeline:nth-child(even)::after {left: -2.7rem;}

@media (min-width: 1025px) {
    .section-timeline .bloc-timeline {column-gap: 4rem; flex-direction: row; width: auto; margin: 0;}
    .section-timeline .item-timeline {flex: 1; padding: 3rem 2rem;}
    .section-timeline .item-timeline::before {height: calc(50% + 2rem); }
    .section-timeline .item-timeline:first-of-type::before {border-width: var(--border) var(--border) 0 0;  border-radius: 0 4rem 0 0; width: calc(100% + 6rem); height: calc(50% + 2rem); top: -2rem; bottom: auto; right: -2.3rem; }
    .section-timeline .item-timeline:nth-of-type(2)::before {border-width: 0 var(--border) var(--border) var(--border); border-radius: 0 0 4rem 4rem; width: calc(100% + 3.7rem); bottom: -2.5rem; left: -2rem;}
    .section-timeline .item-timeline:nth-of-type(3)::before {border-width: var(--border) var(--border) 0 var(--border); border-radius: 4rem 4rem 0 0; width: calc(100% + 3.7rem); top: -2rem; left: -2rem; right: auto;}
    .section-timeline .item-timeline:nth-of-type(4)::before {border-width: 0 0 var(--border) var(--border); border-radius: 0 0 0 4rem; width: calc(100% + 5rem); bottom: -2.5rem; left: -2rem; top: auto;}
    .section-timeline .item-timeline::after {left: 50%; transform: translateX(-50%); right: 50%;  }
    .section-timeline .item-timeline:nth-child(odd)::after {top: -2.8rem;}
    .section-timeline .item-timeline:nth-child(even)::after {bottom: -3.2rem; left: 50%; top: auto;}
    .section-timeline .item-timeline .emoji {font-size: 4rem;}

}