:root{
    --e-global-color-primary: #96C26D;
    --e-global-color-secondary: #005400;
    --e-global-color-text: #000000;
    --e-global-color-accent: #F8FFF8;
    --e-global-color-47aecc3: #68EDCB;
    --e-global-color-b7c1c77: #5E4BC0;
    --e-global-typography-primary-font-family: "Outfit";
    --e-global-typography-primary-font-size: 32px;
    --e-global-typography-primary-font-weight: 600;
    --e-global-typography-secondary-font-family: "Outfit";
    --e-global-typography-secondary-font-weight: 400;
    --e-global-typography-text-font-family: "Outfit";
    --e-global-typography-text-font-weight: 400;
    --e-global-typography-accent-font-family: "Roboto";
    --e-global-typography-accent-font-weight: 500;
}

/* ── Reset / Base ── */
*,:after,:before {
    background-repeat: no-repeat
}

:after,:before {
    text-decoration: inherit;
    vertical-align: inherit
}

*,:after,:before {
    box-sizing: border-box
}

html {
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    -moz-osx-font-smoothing: grayscale;
    -webkit-overflow-scrolling: touch;
    background-color: var(--page-bg-main-color);
    color: var(--e-global-color-b7c1c77);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    overflow-x: hidden
}

p {
    margin: 0
}

ol, ul {
    margin-block-end: 1em !important;
    padding-left: 0
}

main ul li {
    margin-top: 1em;
    list-style: none;
}

main ul li:nth-child(3n+1):before {
    background-color: #5E4BC0 !important;
}

main ul li:nth-child(3n+2):before {
    background-color: #96C26D !important;
}

main ul li:nth-child(3n):before {
    background-color: #68EDCB !important;
}

main ul li:before {
    content: " ";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 20px;
    margin-right: 1em;
}

nav ol, nav ul {
    list-style: none
}

b, strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

figure {
    margin: 0
}

figure img, figure svg {
    display: block;
    height: auto;
    width: 100%
}

figure embed, figure img, figure object, figure svg, figure video {
    height: auto;
    max-width: 100%
}

img {
    height: auto;
    max-width: 100%
}

table {
    border-collapse: collapse
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: initial
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

::selection {
    background-color: #27509b80;
    color: #fff;
    text-shadow: none
}

:link, :visited {
    -webkit-tap-highlight-color: transparent;
    color: #27509b;
    cursor: pointer;
    transition: .3s ease;
    transition-property: opacity, color, background-color
}

:link:active, :link:hover, :visited:active, :visited:hover {
    color: color-link-hover
}

a[href=tel] {
    text-decoration: underline
}

button, input[type=button], input[type=checkbox], input[type=file], input[type=radio], input[type=submit], label {
    cursor: pointer
}

button, input, optgroup, select, textarea {
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    margin: 0
}

textarea {
    font-family: inherit;
    resize: vertical
}

[tabindex], a, area, button, input, label, select, summary, textarea {
    touch-action: manipulation
}

[aria-busy=true] {
    cursor: progress
}

[aria-controls] {
    cursor: pointer
}

[aria-disabled] {
    cursor: default
}

@keyframes rotate {
    0% { transform: rotate(0) }
    to { transform: rotate(1turn) }
}

/* ── Typography ── */
.italic, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word
}

.italic a, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: inherit;
    font-size: inherit;
    font-weight: inherit
}

h1 {
    font-family: "Outfit", Sans-serif;
    font-size: 45px;
    font-weight: 700;
    color: var(--e-global-color-text) !important;
}

h2 {
    font-family: "Outfit", Sans-serif;
    font-size: 28px;
    font-weight: 600;
    line-height: 40px;
    color: var(--e-global-color-b7c1c77) !important;
}

h3 {
    font-family: "Outfit", Sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: var(--e-global-color-text) !important;
}

.title [style*=underline], .title u,
h1 [style*=underline], h1 u,
h2 [style*=underline], h2 u,
h3 [style*=underline], h3 u {
    text-decoration-color: var(--underline-color) !important;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-thickness: 5px !important;
    text-underline-offset: 3px
}

body.page .block-title {
    background-color: #fff;
    position: relative;
    z-index: 0
}

body.page .block-title .title {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0
}

body.page .block-title .title h1 {
    border-radius: 0 15px;
    color: #fff;
    font-size: 41px;
    font-weight: 900;
    line-height: 50px;
    max-width: var(--content-width);
    background-color: rgba(var(--first-rgb-val), .8)
}

section[class^=section--] h3.subtitle {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin-bottom: 0;
}

[class^=section--] {
    background-size: 100% 100%
}

[class^=section--].white-color h1,
[class^=section--].white-color h2,
[class^=section--].white-color h3,
[class^=section--].white-color h4,
[class^=section--].white-color h5,
[class^=section--].white-color h6 {
    color: #fff
}

/* ── Layout ── */
.content-wrapper {
    margin: 0 auto;
    max-width: var(--content-width);
    width: 100%
}

.page-content {
    /* hérite du flux normal */
}

.site-main {
    /* hérite du flux normal */
}

/* ── Sections ── */
.section--text-img {
    /* conteneur de section générique */
}

.section--html {
    /* conteneur section HTML brut */
}

.section--bloc-picto-info {
    /* conteneur section picto-info */
}

.section--cta-links {
    /* conteneur section CTA links */
}

/* Marges de section */
.section--text-img.margin-bottom {
    margin-bottom: 30px
}

/* ── Wrappers internes ── */
.bloc-text-img {
    font-size: 18px;
    font-weight: 400;
    line-height: 24px
}

.bloc-text-img.ptop-tiny, section.ptop-tiny   { padding-top: 25px }
.bloc-text-img.ptop-big, section.ptop-big    { padding-top: 64px }
.bloc-text-img.pbottom-tiny, section.pbottom-tiny { padding-bottom: 25px }
.bloc-text-img.pbottom-none, section.pbottom-none { padding-bottom: 0 }
.bloc-text-img.pleft-tiny, section.pleft-tiny  { padding-left: 32px }
.bloc-text-img.pleft-none, section.pleft-none  { padding-left: 0 }
.bloc-text-img.pright-tiny, section.pright-tiny { padding-right: 32px }
.bloc-text-img.pright-none, section.pright-none { padding-right: 0 }

.inner-bloc-text-img .picture {
	min-height: 275px
}

.inner-bloc-text-img {
    display: flex;
    flex-direction: column;
    row-gap: 12px
}

.inner-title {
    /* conteneur titre */
}

.inner-text {
    display: flex;
    gap: 32px
}

.bloc-html {
    /* conteneur bloc HTML */
}

.inner-html {
    /* contenu HTML brut */
}

/* ── WYSIWYG ── */
.wysiwyg ul li ul {
    list-style-position: inside;
    list-style-type: "- "
}

/* ── Couleurs de fond ── */
.bg-none-color {
    background-color: transparent
}

.bg-white-color, .svg-white-color:after, .svg-white-color:before {
    background-color: #fff
}

.bg-fifth-color, .svg-fifth-color:after, .svg-fifth-color:before {
    background-color: var(--fifth-color)
}

.bg-transparent-hover-color:hover, .svg-transparent-hover-color:hover:after, .svg-transparent-hover-color:hover:before {
    background-color: initial
}

/* ── Couleurs de texte ── */
.none-color {
    color: inherit
}

.white-color {
    color: #fff
}

.first-color {
    color: var(--first-color)
}

/* ── Couleurs de bordure ── */
.border-second-color {
    border-color: var(--second-color)
}

.border-fifth-color {
    border-color: var(--fifth-color)
}

.border-fifth-hover-color:hover {
    border-color: var(--fifth-color)
}

/* ── SVG couleurs ── */
.svg-third-color svg circle, .svg-third-color svg path,
svg.svg-third-color circle, svg.svg-third-color path {
    fill: var(--third-color) !important
}

.svg-white-color svg circle, .svg-white-color svg path,
svg.svg-white-color circle, svg.svg-white-color path {
    fill: #fff !important
}

.svg-fifth-hover-color:hover svg circle, .svg-fifth-hover-color:hover svg path,
svg.svg-fifth-hover-color:hover circle, svg.svg-fifth-hover-color:hover path {
    fill: var(--fifth-color) !important
}

/* Reset stroke pour les couleurs svg utilisées */
.svg-third-color svg circle, .svg-third-color svg path,
.svg-white-color svg circle, .svg-white-color svg path {
    stroke: #0000
}

/* ── Contenu ── */
.content {
    /* zone de contenu textuel */
}

.content.none-color {
    color: inherit
}

.content.vert-top {
    align-self: flex-start
}

/* ── Picto-infos (section étapes) ── */
.bloc-picto-infos .inner {
    border-radius: 5px;
    border-style: solid;
    border-width: 2px;
    padding: 30px 30px 43px;
    position: relative;
    text-align: center;
    z-index: 0
}

.bloc-picto-infos .inner .picto-infos {
    margin-top: 32px;
    column-gap: 32px;
    display: flex;
    justify-content: center
}

.bloc-picto-infos .inner .picto-infos .picto-info {
    text-align: center;
    width: 25%
}

.bloc-picto-infos .inner .picto-infos .picto-info figure {
    display: inline-block;
    height: 70px;
    margin-bottom: 15px;
    width: 70px
}

.bloc-picto-infos .inner .picto-infos .picto-info figure img,
.bloc-picto-infos .inner .picto-infos .picto-info figure svg {
    max-height: 100%;
    color: var(--e-global-color-b7c1c77) !important;
}

.bloc-picto-infos .inner .picto-infos .picto-info .info {
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    margin-bottom: 7px
}

.bloc-picto-infos .inner .picto-infos .picto-info .info .highlight {
    font-size: 20px;
    font-weight: 700;
    line-height: 26px
}

/* Paddings bloc-picto-infos utilisés dans le PHP */
.bloc-picto-infos.ptop-tiny   { padding-top: 25px }
.bloc-picto-infos.pbottom-tiny { padding-bottom: 25px }
.bloc-picto-infos.pleft-tiny  { padding-left: 32px }
.bloc-picto-infos.pright-tiny { padding-right: 32px }
.bloc-picto-infos.pleft-none  { padding-left: 0 }
.bloc-picto-infos.pright-none { padding-right: 0 }

/* Picto-info individuel (utilisé dans section CTA / étapes) */
.picto-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    column-gap: 10px
}

.picto-infos {
    display: flex;
    flex-wrap: wrap;
    gap: 16px
}

.info {
    display: flex;
    flex-direction: column
}

.figure-row-1 {
    font-weight: 900
}

.figure-row-1.highlight {
    font-size: 20px;
    line-height: 26px
}

.figure-row-2 {
    font-weight: 400
}

/* ── Boutons ── */
.btn {
    background-color: #5E4BC0;
    font-family: "Outfit", Sans-serif;
    font-size: 16px;
    text-decoration: none;
    fill: var(--e-global-color-accent);
    color: var(--e-global-color-accent);
    border-style: solid;
    border-width: 2px 2px 2px 2px;
    border-color: #5E4BC0;
    border-radius: 20px 20px 20px 20px;
    padding: 8px 25px 8px 25px;
}

.btn:hover {
    background-color: #FFFFFF;
    color: #5E4BC0;

}

.btn svg {
    height: 7px;
    margin-left: 2px;
    width: 12px
}

.btn svg path {
    transition: all .3s
}

.btn-border {
    border-style: solid;
    border-width: 1px
}

/* ── CTA links ── */
.bloc-cta-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center
}

/* ── Picto générique ── */
.picto {
    display: inline-block
}

.pen-arrow {
    display: inline-block
}

/* ── Classes utilitaires ── */
.center {
    text-align: center
}

.highlight {
    font-weight: 900
}

/* ── Elementor wrapper (présent dans le PHP) ── */
.elementor {
    /* conteneur Elementor */
}

.elementor-element {
    /* élément Elementor */
}

.e-con {
    /* conteneur flex Elementor */
}

.e-con-boxed {
    /* conteneur boxed Elementor */
}

.e-con-inner {
    width: 100%
}

.e-flex {
    display: flex
}

/* ── Media queries pertinentes ── */
@media only screen and (max-width: 400Px) {
    .italic, h1, h2, h3, h4, h5, h6 {
        overflow-wrap: normal
    }
}

@media only screen and (max-width: 480Px) {
    .btn {
        white-space: normal
    }

    .bloc-picto-infos.pleft-tiny,
    .bloc-picto-infos.pleft-none {
        padding-left: 0
    }

    .bloc-picto-infos.pright-tiny,
    .bloc-picto-infos.pright-none {
        padding-right: 0
    }
}

@media only screen and (max-width: 769Px) {
    .btn {
        font-size: 14px;
        line-height: 19px;
        padding: 4px 8px
    }

    .btn svg {
        transform: translateY(1.5px);
        width: 8px
    }

	.inner-text {
    	flex-wrap: wrap;
	}

    .title [style*=underline], .title u,
    h1 [style*=underline], h1 u,
    h2 [style*=underline], h2 u,
    h3 [style*=underline], h3 u,
    h4 [style*=underline], h4 u,
    h5 [style*=underline], h5 u,
    h6 [style*=underline], h6 u {
        text-decoration-thickness: 2px !important;
        text-underline-offset: 4px
    }
}