.parcours-paliers {
width: 100%;
--pp-font-bubble: var(--wp--preset--font-family--cera-pro, inherit);
--pp-font-caption: var(--wp--preset--font-family--cera-pro, inherit);
}
.parcours-paliers__placeholder {
margin: 0;
font-family: var(--pp-font-caption);
font-size: var(--wp--preset--font-size--2, 0.938rem);
color: var(--wp--preset--color--default, #000);
opacity: 0.7;
}
.parcours-paliers__list {
display: flex;
flex-flow: row wrap;
align-items: stretch;
justify-content: center;
gap: var(--wp--preset--spacing--3, 1rem);
list-style: none;
margin: 0;
padding: 0;
}
.parcours-paliers__item {
flex: calc(50% - var(--wp--preset--spacing--1));
background-color: var(--wp--preset--color--primary);
height: auto;
max-width: 100%;
padding: var(--wp--preset--spacing--2);
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: var(--wp--preset--spacing--1, 1rem);
min-width: 0;
border-radius: 6px;
}
.parcours-paliers__item:last-child {
background-color: var(--wp--preset--color--default);
color: var(--wp--preset--color--white);
}
.parcours-paliers__bubble-wrap {
display: flex;
justify-content: center;
width: 100%;
}
.parcours-paliers__bubble {
box-sizing: border-box;
display: inline-flex;
align-items: center;
justify-content: center;
max-width: 100%;
font-size: var(--wp--preset--font-size--5);
font-weight: 700;
line-height: 1.2;
text-align: center;
text-transform: uppercase;
}
.parcours-paliers__item:last-child .parcours-paliers__bubble {
color: var(--wp--preset--color--white);
}
.parcours-paliers__caption {
width: 100%;
min-width: 0;
}
.parcours-paliers__caption > *:first-child {
margin-top: 0;
}
.parcours-paliers__caption > *:last-child {
margin-bottom: 0;
}
.parcours-paliers__buttons {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.5em;
width: 100%;
margin-top: auto;
}
.parcours-paliers__item:last-child .parcours-paliers__buttons .wp-block-button__link {
background: var(--wp--preset--color--white) !important;
color: var(--wp--preset--color--default) !important;
}
.parcours-paliers__item:last-child .parcours-paliers__buttons .wp-block-button__link:hover {
background: var(--wp--preset--color--default) !important;
color: var(--wp--preset--color--white) !important;
box-shadow: inset 0 0 0 1px var(--wp--preset--color--white);
}
@media (max-width: 768px) {
.parcours-paliers__item {
flex: 100%!important;
}
}