.before-after {
--before-after-border-radius: 8px;
--before-after-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
--before-after-scroller-size: 50px;
--before-after-scroller-border: 4px solid #fff;
--before-after-scroller-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
--before-after-label-bg: rgba(0, 0, 0, 0.7);
--before-after-label-color: #fff;
--before-after-label-padding: 8px 16px;
--before-after-label-border-radius: 20px;
--before-after-line-color: #fff;
--before-after-line-width: 2px;
margin: 2rem 0;
}
.before-after__container  {
max-width: 1280px;
margin: 0 auto;
padding: 0 1rem;
}
.before-after__title {
font-size: 2rem;
font-weight: 700;
text-align: center;
margin-bottom: 1rem;
color: var(--color-heading, #333);
}
.before-after__subtitle {
text-align: center;
margin-bottom: 2rem;
color: var(--color-text, #666);
line-height: 1.6;
max-width: 600px;
margin-left: auto;
margin-right: auto;
}
.before-after__wrapper {
position: relative;
width: 100%;
max-width: 900px;
margin: 0 auto;
border-radius: var(--before-after-border-radius);
overflow: hidden;
box-shadow: var(--before-after-shadow);
background-color: #f8f9fa; height: auto;
} .before-after__wrapper::before {
content: '';
display: block;
padding-top: 56.25%; }
.before-after__image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
.before-after__image--before {
z-index: 1;
}
.before-after__image--after {
z-index: 2;
width: 50%; }
.before-after__content-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover; object-position: left center;
display: block;
user-select: none;
-webkit-user-drag: none;
} .before-after__image--after .before-after__content-image {
object-position: left center;
} .before-after__image--before .before-after__content-image {
object-position: left center;
} .before-after__image--after {
will-change: width;
}
.before-after__label {
position: absolute;
top: 12px;
padding: var(--before-after-label-padding);
background: var(--before-after-label-bg);
color: var(--before-after-label-color);
border-radius: var(--before-after-label-border-radius);
font-size: 0.875rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
z-index: 10; pointer-events: none; }
.before-after__label--after,
.before-after__label--before {
left: 12px;
width: fit-content;
}
.before-after__scroller {
position: absolute;
top: 50%;
left: calc(50% - 25px);
width: var(--before-after-scroller-size);
height: var(--before-after-scroller-size);
transform: translateY(-50%);
background: transparent;
border: var(--before-after-scroller-border);
border-radius: 50%;
cursor: grab;
z-index: 20;
box-shadow: var(--before-after-scroller-shadow);
transition: all 0.2s ease;
user-select: none;
touch-action: none;
}
.before-after__scroller:hover {
transform: translateY(-50%) scale(1.1);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}
.before-after__scroller--active {
cursor: grabbing;
transform: translateY(-50%) scale(1.1);
}
.before-after__scroller-thumb {
width: 100%;
height: 100%;
padding: 8px;
box-sizing: border-box;
}
.before-after__scroller-line {
position: absolute;
top: 100%;
left: 50%;
width: var(--before-after-line-width);
height: 9999px;
background: var(--before-after-line-color);
transform: translateX(-50%);
z-index: 15;
}
.before-after__scroller-line::before {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
width: var(--before-after-line-width);
height: 9999px;
background: var(--before-after-line-color);
transform: translateX(-50%);
}
.before-after__instructions {
text-align: center;
margin-top: 1.5rem;
color: var(--color-text-muted, #888);
font-size: 0.875rem;
font-style: italic;
}
.before-after__error {
padding: 2rem;
background: #f8d7da;
border: 1px solid #f5c6cb;
border-radius: var(--before-after-border-radius);
color: #721c24;
text-align: center;
} @media (max-width: 768px) {
.before-after__title {
font-size: 1.5rem;
}
.before-after__subtitle {
font-size: 0.9rem;
margin-bottom: 1.5rem;
}
.before-after__wrapper {
max-width: 100%;
border-radius: 6px;
}
.before-after__label {
top: 10px;
padding: 6px 12px;
font-size: 0.75rem;
}
.before-after__label--before {
left: 10px;
}
.before-after__label--after {
right: 10px;
}
.before-after__scroller {
width: 40px;
height: 40px;
border-width: 3px;
}
.before-after__scroller-thumb {
padding: 6px;
}
.before-after__instructions {
font-size: 0.8rem;
margin-top: 1rem;
}
}
@media (max-width: 480px) {
.before-after__title {
font-size: 1.25rem;
}
.before-after__subtitle {
font-size: 0.85rem;
margin-bottom: 1rem;
}
.before-after__label {
top: 8px;
padding: 4px 8px;
font-size: 0.7rem;
}
.before-after__label--before {
left: 8px;
}
.before-after__label--after {
right: 8px;
}
.before-after__scroller {
width: 36px;
height: 36px;
border-width: 2px;
}
.before-after__scroller-thumb {
padding: 5px;
}
} .before-after__scroller:focus {
outline: 2px solid var(--color-primary, #007cba);
outline-offset: 2px;
}
.before-after__scroller:focus:not(:focus-visible) {
outline: none;
} .before-after__wrapper {
animation: before-after-fade-in 0.6s ease-out;
}
@keyframes before-after-fade-in {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
} @media (prefers-color-scheme: dark) {
.before-after {
--before-after-label-bg: rgba(255, 255, 255, 0.9);
--before-after-label-color: #333;
--before-after-scroller-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
}
.before-after__title {
color: var(--color-heading-dark, #fff);
}
.before-after__subtitle {
color: var(--color-text-dark, #ccc);
}
.before-after__instructions {
color: var(--color-text-muted-dark, #aaa);
}
} @media (prefers-reduced-motion: reduce) {
.before-after__scroller {
transition: none;
}
.before-after__wrapper {
animation: none;
}
.before-after__scroller:hover {
transform: translateY(-50%);
}
}
.blog-latest {
background-color: #ffffff;
}
.blog-latest__container {
margin: 0 auto;
max-width: 1280px; padding: 5rem 1.5rem; } .blog-latest__title {
text-align: center;
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0 0 3rem 0; line-height: 1.2;
} .blog-latest__grid {
display: grid;
gap: 2rem; grid-template-columns: 1fr;
}
@media (min-width: 640px) {
.blog-latest__grid {
grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
.blog-latest__grid {
grid-template-columns: repeat(3, 1fr); }
} .blog-latest__article {
background-color: #ffffff;
border-radius: 1rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); border: 1px solid #e5e7eb; overflow: hidden;
transition: all 0.2s ease;
height: fit-content;
}
.blog-latest__article:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); transform: translateY(-4px);
} .blog-latest__image {
width: 100%;
height: 12rem; overflow: hidden;
}
.blog-latest__image-link {
display: block;
width: 100%;
height: 100%;
}
.blog-latest__thumbnail {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.2s ease;
}
.blog-latest__article:hover .blog-latest__thumbnail {
transform: scale(1.05);
} .blog-latest__content {
padding: 1.5rem; } .blog-latest__meta {
display: flex;
align-items: center;
gap: 0.75rem; margin-bottom: 0.75rem; flex-wrap: wrap;
}
.blog-latest__date {
font-size: 0.75rem; color: #6b7280; font-weight: 500;
}
.blog-latest__category {
font-size: 0.75rem; font-weight: 600; color: var(--accent-color); background-color: #eef2ff; padding: 0.25rem 0.5rem; border-radius: 0.375rem; } .blog-latest__article-title {
margin: 0 0 0.75rem 0; }
.blog-latest__article-link {
font-size: 1.125rem; font-weight: 600; color: #111827; text-decoration: none;
line-height: 1.3;
transition: color 0.2s ease;
}
.blog-latest__article-link:hover {
color: var(--accent-color); text-decoration: none;
}
.blog-latest__article-link:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
border-radius: 0.25rem;
} .blog-latest__excerpt {
color: #4b5563; line-height: 1.6;
margin: 0 0 1rem 0; font-size: 0.875rem; } .blog-latest__read-more {
margin-top: auto;
}
.blog-latest__link {
display: inline-flex;
align-items: center;
gap: 0.25rem; font-size: 0.875rem; font-weight: 600; color: var(--accent-color); text-decoration: none;
transition: all 0.2s ease;
}
.blog-latest__link:hover {
color: var(--accent-hover); text-decoration: none;
gap: 0.5rem; }
.blog-latest__link:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
border-radius: 0.25rem;
} .blog-latest__action {
text-align: center;
margin-top: 3rem; }
.blog-latest__button {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0.375rem; background-color: #111827; padding: 0.75rem 1.5rem; font-size: 0.875rem; font-weight: 600; color: #ffffff;
text-decoration: none;
transition: all 0.2s ease;
border: 2px solid transparent;
}
.blog-latest__button:hover {
background-color: #1f2937; text-decoration: none;
transform: translateY(-1px);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.blog-latest__button:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
}
.blog-latest__button:active {
transform: translateY(0);
} .blog-latest__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.blog-latest__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.blog-latest__container {
padding: 3rem 1rem;
}
.blog-latest__title {
font-size: 1.5rem;
margin-bottom: 2rem;
}
.blog-latest__grid {
gap: 1.5rem;
}
.blog-latest__content {
padding: 1.25rem;
}
.blog-latest__image {
height: 10rem;
}
.blog-latest__meta {
flex-direction: column;
align-items: flex-start;
gap: 0.5rem;
}
.blog-latest__action {
margin-top: 2rem;
}
.blog-latest__button {
width: 100%;
max-width: 300px;
}
} .blog-latest__grid[data-count="1"] {
grid-template-columns: 1fr;
max-width: 400px;
margin: 0 auto;
}
.blog-latest__grid[data-count="2"] {
grid-template-columns: 1fr;
}
@media (min-width: 640px) {
.blog-latest__grid[data-count="2"] {
grid-template-columns: repeat(2, 1fr);
max-width: 800px;
margin: 0 auto;
}
} @media (prefers-reduced-motion: reduce) {
.blog-latest__article,
.blog-latest__thumbnail,
.blog-latest__link,
.blog-latest__button {
transition: none;
}
.blog-latest__article:hover,
.blog-latest__button:hover,
.blog-latest__button:active {
transform: none;
}
.blog-latest__article:hover .blog-latest__thumbnail {
transform: none;
}
}
:root {
--carousel-gap: 20px;
--carousel-border-radius: 8px;
--carousel-overlay-bg: rgba(0, 0, 0, 0.3);
--carousel-overlay-hover-bg: rgba(0, 0, 0, 0.5);
--carousel-nav-size: 44px;
--carousel-nav-color: #fff;
--carousel-nav-bg: rgba(0, 0, 0, 0.7);
--carousel-nav-hover-bg: rgba(0, 0, 0, 0.9);
--lightbox-bg: rgba(0, 0, 0, 0.95);
--lightbox-nav-size: 60px;
--lightbox-close-size: 40px;
--lightbox-z-index: 9999;
--transition-fast: 0.2s ease;
--transition-normal: 0.3s ease;
} .carousel-lightbox {
margin: 2rem 0;
}
.carousel-lightbox__container {
max-width: 1280px;
margin: 0 auto;
padding: 0 1rem;
}
.carousel-lightbox__title {
font-size: 2rem;
font-weight: 600;
margin-bottom: 1.5rem;
text-align: center;
color: #333;
}
.carousel-lightbox__wrapper {
position: relative;
} .carousel-lightbox .swiper {
padding: 0;
margin: 0;
overflow: hidden; }
.carousel-lightbox .swiper-wrapper {
display: flex;
align-items: stretch;
}
.carousel-lightbox .swiper-slide {
height: auto;
display: flex;
} .carousel-lightbox__slide {
position: relative;
width: 100%;
height: 300px;
border-radius: var(--carousel-border-radius);
overflow: hidden;
background: #f5f5f5;
transition: transform var(--transition-fast);
}
.carousel-lightbox__slide:hover {
transform: translateY(-2px);
}
.carousel-lightbox__image-button {
position: relative;
width: 100%;
height: 100%;
border: none;
background: none;
padding: 0;
cursor: pointer;
display: block;
overflow: hidden;
}
.carousel-lightbox__image {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform var(--transition-normal);
}
.carousel-lightbox__image-button:hover .carousel-lightbox__image {
transform: scale(1.05);
} .carousel-lightbox__overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: var(--carousel-overlay-bg);
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: opacity var(--transition-fast);
}
.carousel-lightbox__image-button:hover .carousel-lightbox__overlay,
.carousel-lightbox__image-button:focus .carousel-lightbox__overlay {
opacity: 1;
}
.carousel-lightbox__zoom-icon {
width: 48px;
height: 48px;
color: white;
filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
} .carousel-lightbox__slide-caption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
color: white;
padding: 1rem;
transform: translateY(100%);
transition: transform var(--transition-fast);
}
.carousel-lightbox__slide:hover .carousel-lightbox__slide-caption {
transform: translateY(0);
}
.carousel-lightbox__slide-caption p {
margin: 0;
font-size: 0.9rem;
line-height: 1.4;
} .carousel-lightbox__nav {
position: absolute;
width: var(--carousel-nav-size);
height: var(--carousel-nav-size);
background: var(--carousel-nav-bg);
border-radius: 50%;
color: var(--carousel-nav-color);
border: none;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all var(--transition-fast);
top: 50%;
transform: translateY(-50%);
z-index: 10;
}
.carousel-lightbox__nav:hover {
background: var(--carousel-nav-hover-bg);
transform: translateY(-50%) scale(1.1);
}
.carousel-lightbox__nav::after {
font-size: 18px;
font-weight: bold;
}
.carousel-lightbox__nav.swiper-button-disabled {
opacity: 0.3;
cursor: not-allowed;
}
.carousel-lightbox__nav.swiper-button-disabled:hover {
background: var(--carousel-nav-bg);
transform: translateY(-50%) scale(1);
} .carousel-lightbox__pagination {
position: relative;
margin-top: 1.5rem;
text-align: center;
}
.carousel-lightbox__pagination .swiper-pagination-bullet {
width: 12px;
height: 12px;
background: #ccc;
opacity: 1;
transition: all var(--transition-fast);
}
.carousel-lightbox__pagination .swiper-pagination-bullet-active {
background: #007cba;
transform: scale(1.2);
} .carousel-lightbox__modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: var(--lightbox-z-index);
opacity: 0;
visibility: hidden;
transition: opacity var(--transition-normal), visibility var(--transition-normal);
}
.carousel-lightbox__modal[aria-hidden="false"] {
opacity: 1;
visibility: visible;
}
.carousel-lightbox__modal-backdrop {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--lightbox-bg);
display: flex;
align-items: center;
justify-content: center;
padding: 2rem;
}
.carousel-lightbox__modal-content {
position: relative;
max-width: 90vw;
max-height: 90vh;
display: flex;
flex-direction: column;
align-items: center;
} .carousel-lightbox__modal-close {
position: absolute;
top: -60px;
right: 0;
width: var(--lightbox-close-size);
height: var(--lightbox-close-size);
background: rgba(255, 255, 255, 0.9);
border: none;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all var(--transition-fast);
z-index: 10;
}
.carousel-lightbox__modal-close:hover {
background: white;
transform: scale(1.1);
}
.carousel-lightbox__close-icon {
width: 20px;
height: 20px;
color: #333;
} .carousel-lightbox__modal-nav {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: var(--lightbox-nav-size);
height: var(--lightbox-nav-size);
background: rgba(255, 255, 255, 0.9);
border: none;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all var(--transition-fast);
z-index: 10;
}
.carousel-lightbox__modal-nav:hover {
background: white;
transform: translateY(-50%) scale(1.1);
}
.carousel-lightbox__modal-nav--prev {
left: -80px;
}
.carousel-lightbox__modal-nav--next {
right: -80px;
}
.carousel-lightbox__modal-nav svg {
width: 24px;
height: 24px;
color: #333;
} .carousel-lightbox__modal-image-container {
position: relative;
max-width: 100%;
max-height: 70vh;
display: flex;
align-items: center;
justify-content: center;
}
.carousel-lightbox__modal-image {
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
border-radius: var(--carousel-border-radius);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
} .carousel-lightbox__modal-caption {
margin-top: 1rem;
max-width: 600px;
text-align: center;
}
.carousel-lightbox__modal-caption p {
color: white;
font-size: 1rem;
line-height: 1.5;
margin: 0;
}
.carousel-lightbox__modal-counter {
margin-top: 0.5rem;
color: rgba(255, 255, 255, 0.8);
font-size: 0.9rem;
font-weight: 500;
} body.carousel-lightbox-modal-open {
overflow: hidden;
} .carousel-lightbox__empty {
padding: 3rem;
text-align: center;
background: #f8f9fa;
border-radius: var(--carousel-border-radius);
border: 2px dashed #dee2e6;
}
.carousel-lightbox__empty p {
margin: 0;
color: #6c757d;
font-style: italic;
} @media (max-width: 768px) {
.carousel-lightbox .swiper {
padding: 0 30px;
margin: 0 -30px;
}
.carousel-lightbox__nav {
width: 36px;
height: 36px;
}
.carousel-lightbox__nav::after {
font-size: 14px;
}
.carousel-lightbox__modal-backdrop {
padding: 1rem;
}
.carousel-lightbox__modal-close {
top: -50px;
width: 36px;
height: 36px;
}
.carousel-lightbox__close-icon {
width: 18px;
height: 18px;
}
.carousel-lightbox__modal-nav {
width: 48px;
height: 48px;
}
.carousel-lightbox__modal-nav--prev {
left: -60px;
}
.carousel-lightbox__modal-nav--next {
right: -60px;
}
.carousel-lightbox__modal-image-container {
max-height: 60vh;
}
.carousel-lightbox__slide {
height: 200px;
}
}
@media (max-width: 480px) {
.carousel-lightbox .swiper {
padding: 0 20px;
margin: 0 -20px;
}
.carousel-lightbox__nav {
width: 32px;
height: 32px;
}
.carousel-lightbox__modal-nav--prev {
left: 10px;
}
.carousel-lightbox__modal-nav--next {
right: 10px;
}
.carousel-lightbox__modal-close {
top: 10px;
right: 10px;
}
.carousel-lightbox__slide {
height: 180px;
}
.carousel-lightbox__title {
font-size: 1.5rem;
}
} .carousel-lightbox__image-button:focus,
.carousel-lightbox__nav:focus,
.carousel-lightbox__modal-close:focus,
.carousel-lightbox__modal-nav:focus {
outline: 2px solid #007cba;
outline-offset: 2px;
} .carousel-lightbox__modal[aria-hidden="false"] .carousel-lightbox__modal-content {
animation: lightboxFadeIn 0.3s ease;
}
@keyframes lightboxFadeIn {
from {
opacity: 0;
transform: scale(0.9);
}
to {
opacity: 1;
transform: scale(1);
}
}
.content-split {
background-color: #ffffff;
}
.content-split__container {
margin: 0 auto;
max-width: 1280px; display: grid;
align-items: center;
gap: 3rem; padding: 5rem 1.5rem; }
@media (min-width: 1024px) {
.content-split__container {
grid-template-columns: 1fr 1fr; }
} .content-split__content {
order: 1;
}
@media (min-width: 1024px) {
.content-split__content {
order: unset;
}
} .content-split__title {
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0;
line-height: 1.2;
} .content-split__wysiwyg {
margin-top: 1.5rem; max-width: none;
color: #374151; } .content-split__wysiwyg > * {
margin-bottom: 1rem;
}
.content-split__wysiwyg > *:last-child {
margin-bottom: 0;
}
.content-split__wysiwyg p {
line-height: 1.7;
margin-bottom: 1rem;
}
.content-split__wysiwyg h2,
.content-split__wysiwyg h3,
.content-split__wysiwyg h4 {
font-weight: 600;
color: #111827;
margin-top: 1.5rem;
margin-bottom: 0.5rem;
line-height: 1.3;
}
.content-split__wysiwyg h2 {
font-size: 1.5rem;
}
.content-split__wysiwyg h3 {
font-size: 1.25rem;
}
.content-split__wysiwyg h4 {
font-size: 1.125rem;
}
.content-split__wysiwyg ul,
.content-split__wysiwyg ol {
padding-left: 1.5rem;
margin-bottom: 1rem;
}
.content-split__wysiwyg li {
margin-bottom: 0.5rem;
}
.content-split__wysiwyg a {
color: var(--accent-color);
text-decoration: underline;
}
.content-split__wysiwyg a:hover {
color: var(--accent-hover);
}
.content-split__wysiwyg strong {
font-weight: 600;
color: #111827;
}
.content-split__wysiwyg blockquote {
border-left: 4px solid #e5e7eb;
padding-left: 1rem;
margin: 1.5rem 0;
font-style: italic;
color: #6b7280;
} .content-split__action {
margin-top: 2rem; }
.content-split__button {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0.375rem; background-color: #111827; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 600; color: #ffffff;
text-decoration: none;
transition: all 0.2s ease;
border: 2px solid transparent;
}
.content-split__button:hover {
background-color: #1f2937; text-decoration: none;
transform: translateY(-1px);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.content-split__button:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
}
.content-split__button:active {
transform: translateY(0);
} .content-split__media {
position: relative;
order: 0;
}
@media (min-width: 1024px) {
.content-split__media {
order: unset;
}
}
.content-split__image {
width: 100%;
border-radius: 0.75rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); border: 1px solid rgba(17, 24, 39, 0.1); } .content-split__image-placeholder {
width: 100%;
height: 300px;
background-color: #f3f4f6;
border-radius: 0.75rem;
border: 2px dashed #d1d5db;
display: flex;
align-items: center;
justify-content: center;
color: #6b7280;
font-weight: 500;
}
.content-split__image-placeholder p {
margin: 0;
} @media (max-width: 1024px) {
.content-split__container {
padding: 3rem 1rem;
gap: 2rem;
}
.content-split__title {
font-size: 1.5rem;
}
.content-split__wysiwyg {
margin-top: 1rem;
}
.content-split__action {
margin-top: 1.5rem;
}
.content-split__button {
width: 100%;
max-width: 300px;
padding: 0.75rem 1.5rem;
}
} @media (prefers-reduced-motion: reduce) {
.content-split__button {
transition: none;
}
.content-split__button:hover,
.content-split__button:active {
transform: none;
}
}
.cta-centered {
background-color: var(--accent-color); color: #ffffff;
}
.cta-centered__container {
margin: 0 auto;
max-width: 768px; padding: 4rem 1.5rem; text-align: center;
} .cta-centered__title {
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #ffffff;
margin: 0;
line-height: 1.2;
} .cta-centered__text {
margin-top: 0.75rem; color: #c7d2fe; line-height: 1.6;
margin-bottom: 0;
} .cta-centered__action {
margin-top: 2rem; } .cta-centered__button {
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0.375rem; background-color: #ffffff;
padding: 0.75rem 1.25rem; font-size: 0.875rem; font-weight: 600; color: var(--accent-hover); text-decoration: none;
transition: all 0.2s ease;
border: 2px solid transparent;
}
.cta-centered__button:hover {
background-color: #eef2ff; text-decoration: none;
transform: translateY(-1px);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.cta-centered__button:focus {
outline: 2px solid #ffffff;
outline-offset: 2px;
}
.cta-centered__button:active {
transform: translateY(0);
} .cta-centered--placeholder {
background-color: #f3f4f6;
color: #374151;
padding: 2rem;
text-align: center;
border: 2px dashed #d1d5db;
border-radius: 0.5rem;
}
.cta-centered--placeholder p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.cta-centered__container {
padding: 3rem 1rem;
}
.cta-centered__title {
font-size: 1.5rem;
}
.cta-centered__button {
width: 100%;
max-width: 300px;
padding: 1rem 1.5rem;
}
} @media (prefers-reduced-motion: reduce) {
.cta-centered__button {
transition: none;
}
.cta-centered__button:hover {
transform: none;
}
.cta-centered__button:active {
transform: none;
}
}
.faq-details {
background-color: #ffffff;
}
.faq-details__container {
margin: 0 auto;
max-width: 768px; padding: 5rem 1.5rem; } .faq-details__title {
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0 0 2rem 0; line-height: 1.2;
} .faq-details__items {
display: flex;
flex-direction: column;
gap: 1rem; } .faq-details__item {
border-radius: 0.5rem; border: 1px solid #e5e7eb; padding: 1rem; background-color: #ffffff;
transition: all 0.2s ease;
}
.faq-details__item:hover {
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.faq-details__item[open] {
border-color: var(--accent-color);
box-shadow: 0 0 0 1px var(--accent-color);
} .faq-details__question {
cursor: pointer;
user-select: none; font-size: 0.875rem; font-weight: 600; color: #111827; line-height: 1.4;
padding-right: 1rem; list-style: none; } .faq-details__question::-webkit-details-marker {
display: none;
}
.faq-details__question::marker {
content: none;
} .faq-details__question::after {
content: "▼";
position: absolute;
right: 1rem;
top: 50%;
transform: translateY(-50%);
font-size: 0.75rem;
color: #6b7280;
transition: transform 0.2s ease;
}
.faq-details__item {
position: relative;
}
.faq-details__item[open] .faq-details__question::after {
transform: translateY(-50%) rotate(180deg);
color: var(--accent-color);
} .faq-details__question:hover {
color: var(--accent-color);
} .faq-details__answer {
margin-top: 0.5rem; font-size: 0.875rem; color: #4b5563; line-height: 1.6;
padding-right: 1rem; }
.faq-details__answer p {
margin: 0.5rem 0;
}
.faq-details__answer p:first-child {
margin-top: 0;
}
.faq-details__answer p:last-child {
margin-bottom: 0;
}
.faq-details__answer ul,
.faq-details__answer ol {
margin: 0.5rem 0;
padding-left: 1.5rem;
}
.faq-details__answer li {
margin: 0.25rem 0;
} .faq-details__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.faq-details__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.faq-details__container {
padding: 3rem 1rem;
}
.faq-details__title {
font-size: 1.5rem;
}
.faq-details__item {
padding: 0.75rem;
}
.faq-details__question::after {
right: 0.75rem;
}
.faq-details__answer {
padding-right: 0.75rem;
}
} @media (prefers-reduced-motion: reduce) {
.faq-details__item,
.faq-details__question::after {
transition: none;
}
} .faq-details__question:focus-visible {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
border-radius: 0.25rem;
} .faq-details__question[aria-expanded="true"]::after {
transform: translateY(-50%) rotate(180deg);
} @media (prefers-reduced-motion: no-preference) {
.faq-details__answer {
animation: fadeInUp 0.3s ease-out;
}
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(-10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.features-grid {
background-color: #ffffff;
}
.features-grid__container {
margin: 0 auto;
max-width: 1280px; padding: 5rem 1.5rem; } .features-grid__header {
margin: 0 auto;
max-width: 672px; text-align: center;
}
.features-grid__title {
font-size: 2.25rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0;
line-height: 1.1;
}
.features-grid__intro {
margin-top: 1rem; color: #4b5563; margin-bottom: 0;
line-height: 1.6;
} .features-grid__items {
margin-top: 3rem; display: grid;
gap: 2rem; grid-template-columns: 1fr;
}
@media (min-width: 640px) {
.features-grid__items {
grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
.features-grid__items {
grid-template-columns: repeat(3, 1fr); }
} .features-grid__item {
border-radius: 1rem; border: 1px solid #e5e7eb; padding: 2rem; background-color: #ffffff;
transition: all 0.2s ease;
}
.features-grid__item:hover {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
transform: translateY(-2px);
} .features-grid__icon {
margin-bottom: 1rem; }
.features-grid__emoji {
font-size: 3rem; line-height: 1;
display: inline-block;
}
.features-grid__image {
width: 48px;
height: 48px;
object-fit: cover;
border-radius: 0.5rem;
} .features-grid__item-title {
margin-top: 1rem; font-size: 1.125rem; font-weight: 600; color: #111827; margin-bottom: 0;
line-height: 1.4;
} .features-grid__item-text {
margin-top: 0.5rem; font-size: 0.875rem; color: #4b5563; line-height: 1.5;
margin-bottom: 0;
} .features-grid__empty {
margin-top: 3rem;
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.features-grid__empty p {
margin: 0;
font-weight: 500;
} .features-grid--placeholder {
background-color: #f3f4f6;
color: #374151;
padding: 2rem;
text-align: center;
border: 2px dashed #d1d5db;
border-radius: 0.5rem;
}
.features-grid--placeholder p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.features-grid__container {
padding: 3rem 1rem;
}
.features-grid__title {
font-size: 1.875rem;
}
.features-grid__items {
margin-top: 2rem;
gap: 1.5rem;
}
.features-grid__item {
padding: 1.5rem;
}
.features-grid__emoji {
font-size: 2.5rem;
}
} @media (prefers-reduced-motion: reduce) {
.features-grid__item {
transition: none;
}
.features-grid__item:hover {
transform: none;
}
}
.features-screenshot {
background-color: #111827; color: #ffffff;
}
.features-screenshot__container {
margin: 0 auto;
max-width: 1280px; display: grid;
gap: 3rem; padding: 6rem 1.5rem; align-items: center;
}
@media (min-width: 1024px) {
.features-screenshot__container {
grid-template-columns: 1fr 1fr; }
} .features-screenshot__content {
order: 1;
}
@media (min-width: 1024px) {
.features-screenshot__content {
order: unset;
}
} .features-screenshot__eyebrow {
font-size: 1rem; font-weight: 600; color: var(--accent-light); margin: 0;
} .features-screenshot__title {
margin-top: 0.5rem; font-size: 2.25rem; font-weight: 600; color: #ffffff;
line-height: 1.1;
margin-bottom: 0;
} .features-screenshot__intro {
margin-top: 1.5rem; color: #d1d5db; line-height: 1.6;
margin-bottom: 0;
} .features-screenshot__features {
margin-top: 2.5rem; display: flex;
flex-direction: column;
gap: 1.5rem; } .features-screenshot__feature {
position: relative;
padding-left: 1.75rem; } .features-screenshot__bullet {
position: absolute;
left: 0;
top: 0.25rem; display: inline-block;
width: 1rem; height: 1rem; border-radius: 0.25rem;
background-color: var(--accent-opacity-30); } .features-screenshot__feature-title {
font-weight: 600; color: #ffffff;
margin: 0;
line-height: 1.4;
} .features-screenshot__feature-text {
margin-top: 0.25rem;
color: #d1d5db; line-height: 1.5;
margin-bottom: 0;
} .features-screenshot__image {
order: 0;
}
@media (min-width: 1024px) {
.features-screenshot__image {
order: -1; justify-self: end; }
}
.features-screenshot__img {
max-width: 100%;
border-radius: 0.75rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); border: 1px solid rgba(255, 255, 255, 0.1); } .features-screenshot__img-placeholder {
max-width: 100%;
height: 300px;
background-color: #374151;
border-radius: 0.75rem;
border: 2px dashed #6b7280;
display: flex;
align-items: center;
justify-content: center;
color: #9ca3af;
font-weight: 500;
}
.features-screenshot__img-placeholder p {
margin: 0;
} .features-screenshot--placeholder {
background-color: #f3f4f6;
color: #374151;
padding: 2rem;
text-align: center;
border: 2px dashed #d1d5db;
border-radius: 0.5rem;
}
.features-screenshot--placeholder p {
margin: 0;
font-weight: 500;
} @media (max-width: 1024px) {
.features-screenshot__container {
padding: 4rem 1rem;
gap: 2rem;
}
.features-screenshot__title {
font-size: 1.875rem;
}
.features-screenshot__features {
margin-top: 2rem;
gap: 1.25rem;
}
}
.gallery-grid {
background-color: #ffffff;
}
.gallery-grid__container {
margin: 0 auto;
max-width: 1280px; padding: 5rem 1.5rem; } .gallery-grid__title {
text-align: center;
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0 0 3rem 0; line-height: 1.2;
} .gallery-grid__grid {
display: grid;
gap: 1rem; grid-template-columns: repeat(2, 1fr);
}
.gallery-grid__grid--2-cols {
grid-template-columns: repeat(2, 1fr);
}
.gallery-grid__grid--3-cols {
grid-template-columns: repeat(2, 1fr);
}
.gallery-grid__grid--4-cols {
grid-template-columns: repeat(2, 1fr);
}
.gallery-grid__grid--5-cols {
grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px) {
.gallery-grid__grid--2-cols {
grid-template-columns: repeat(2, 1fr);
}
.gallery-grid__grid--3-cols {
grid-template-columns: repeat(3, 1fr);
}
.gallery-grid__grid--4-cols {
grid-template-columns: repeat(3, 1fr);
}
.gallery-grid__grid--5-cols {
grid-template-columns: repeat(3, 1fr);
}
}
@media (min-width: 1024px) {
.gallery-grid__grid--2-cols {
grid-template-columns: repeat(2, 1fr);
}
.gallery-grid__grid--3-cols {
grid-template-columns: repeat(3, 1fr);
}
.gallery-grid__grid--4-cols {
grid-template-columns: repeat(4, 1fr);
}
.gallery-grid__grid--5-cols {
grid-template-columns: repeat(5, 1fr);
}
} .gallery-grid__item {
position: relative;
border-radius: 0.75rem; overflow: hidden;
background-color: #f3f4f6; cursor: pointer;
transition: all 0.2s ease;
}
.gallery-grid__item:hover {
transform: scale(1.02);
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
} .gallery-grid__image-button {
display: block;
width: 100%;
height: 100%;
border: none;
background: none;
padding: 0;
cursor: pointer;
position: relative;
}
.gallery-grid__image-button:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
} .gallery-grid__image {
width: 100%;
height: 100%;
object-fit: cover;
transition: all 0.2s ease;
}
.gallery-grid__item:hover .gallery-grid__image {
transform: scale(1.05);
} .gallery-grid__overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
transition: all 0.2s ease;
}
.gallery-grid__item:hover .gallery-grid__overlay {
opacity: 1;
}
.gallery-grid__zoom-icon {
width: 2rem; height: 2rem; color: #ffffff;
} .gallery-grid__caption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
color: #ffffff;
padding: 1rem;
transform: translateY(100%);
transition: transform 0.2s ease;
}
.gallery-grid__item:hover .gallery-grid__caption {
transform: translateY(0);
}
.gallery-grid__caption p {
margin: 0;
font-size: 0.875rem; line-height: 1.4;
} .gallery-grid__modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
display: none; }
.gallery-grid__modal[aria-hidden="false"] {
display: flex;
}
.gallery-grid__modal-backdrop {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.9);
display: flex;
align-items: center;
justify-content: center;
padding: 1rem;
}
.gallery-grid__modal-content {
position: relative;
max-width: 90vw;
max-height: 90vh;
display: flex;
flex-direction: column;
}
.gallery-grid__modal-close {
position: absolute;
top: -3rem;
right: 0;
background: none;
border: none;
color: #ffffff;
font-size: 1.5rem;
cursor: pointer;
padding: 0.5rem;
border-radius: 0.375rem;
transition: background-color 0.2s ease;
}
.gallery-grid__modal-close:hover {
background-color: rgba(255, 255, 255, 0.1);
}
.gallery-grid__modal-close:focus {
outline: 2px solid #ffffff;
outline-offset: 2px;
}
.gallery-grid__close-icon {
width: 1.5rem;
height: 1.5rem;
}
.gallery-grid__modal-image {
max-width: 100%;
max-height: 80vh;
object-fit: contain;
border-radius: 0.5rem;
}
.gallery-grid__modal-caption {
margin-top: 1rem;
text-align: center;
color: #ffffff;
}
.gallery-grid__modal-caption p {
margin: 0;
font-size: 1rem;
line-height: 1.5;
} .gallery-grid__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.gallery-grid__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.gallery-grid__container {
padding: 3rem 1rem;
}
.gallery-grid__title {
font-size: 1.5rem;
margin-bottom: 2rem;
}
.gallery-grid__grid {
gap: 0.75rem;
}
.gallery-grid__modal-content {
max-width: 95vw;
}
.gallery-grid__modal-close {
top: -2.5rem;
font-size: 1.25rem;
}
.gallery-grid__modal-image {
max-height: 70vh;
}
} @media (prefers-reduced-motion: reduce) {
.gallery-grid__item,
.gallery-grid__image,
.gallery-grid__overlay,
.gallery-grid__caption,
.gallery-grid__modal-close {
transition: none;
}
.gallery-grid__item:hover {
transform: none;
}
.gallery-grid__item:hover .gallery-grid__image {
transform: none;
}
} body.gallery-modal-open {
overflow: hidden;
} .gallery-grid__modal[aria-hidden="false"] .gallery-grid__modal-backdrop {
animation: fadeIn 0.2s ease-out;
}
.gallery-grid__modal[aria-hidden="false"] .gallery-grid__modal-content {
animation: scaleIn 0.2s ease-out;
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes scaleIn {
from {
transform: scale(0.9);
opacity: 0;
}
to {
transform: scale(1);
opacity: 1;
}
} @media (prefers-reduced-motion: reduce) {
.gallery-grid__modal-backdrop,
.gallery-grid__modal-content {
animation: none;
}
}
.block-gallery-slider {
width: 100%;
max-width: 100%;
min-width: 0; overflow: visible;
@apply pt-8 md:pt-[100px];
} .gallery-slider__viewport {
position: relative;
width: 100%;
max-width: 100%;
min-width: 0;
} .gallery-slider-swiper {
width: 100%;
max-width: 100%;
min-width: 0;
position: relative;
overflow: hidden; } .gallery-slider__figure {
margin: 0;
width: 100%;
}
.gallery-slider__img {
width: 100%;
height: auto;
display: block;
object-fit: cover;
aspect-ratio: 1267 / 585;
} .gallery-slider__caption { font-family: var(--font-primary, inherit);
font-size: 18px;
font-weight: 400; color: #81908C; margin-top: 12px;
line-height: 1.4;
} .gallery-slider-pagination {
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 16px;
position: relative !important; bottom: auto !important;
@apply mt-4 md:!-mt-4 !pb-[50px] md:!pb-[75px];
} .gallery-slider-pagination .swiper-pagination-bullet {
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #E4E4E3; opacity: 1; transition: background-color 0.25s ease;
cursor: pointer;
} .gallery-slider-pagination .swiper-pagination-bullet-active {
background-color: #707070;
} .gallery-slider__link {
display: block;
width: 100%;
cursor: zoom-in;
} .gallery-slider__nav {
position: absolute;
top: 50%;
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
margin: 0;
transform: translateY(-50%);
border: none;
border-radius: 50%;
background-color: rgba(255, 255, 255, 0.85);
color: #2D413C;
cursor: pointer;
transition: background-color 0.25s ease, color 0.25s ease, opacity 0.25s ease;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}
.gallery-slider__nav:hover {
background-color: #2D413C;
color: #fff;
}
.gallery-slider__nav svg {
width: 24px;
height: 24px;
display: block;
}
.gallery-slider__nav--prev {
left: -32px;
}
.gallery-slider__nav--next {
right: -32px;
}
.gallery-slider__nav--prev,
.gallery-slider__nav--next {
opacity: .5;
}
.gallery-slider__nav--prev:hover,
.gallery-slider__nav--next:hover {
opacity: .85;
}
.logo-slider-pagination {
display: none;
}
.gallery-slider__nav.swiper-button-disabled {
opacity: 0;
pointer-events: none;
}
@media (max-width: 640px) {
.gallery-slider__nav {
width: 36px;
height: 36px;
}
.gallery-slider__nav svg {
width: 20px;
height: 20px;
}
.gallery-slider__nav--prev { left: -36px; }
.gallery-slider__nav--next { right: -36px; }
} .block-logo-slider {
width: 100%;
max-width: 100%;
overflow: visible; 
@apply py-0;
}
.logo-slider-swiper {
width: 100%;
position: relative;
overflow: hidden; 
}
.logo-slider-swiper .swiper-wrapper {
display: flex;
align-items: center;
}
.logo-slider-swiper .swiper-wrapper .swiper-slide {
max-width: 250px;
max-height: 150px;
}
.logo-slider__figure {
margin: 0;
display: flex;
align-items: center;
justify-content: center;
}
.logo-slider__img {
max-width: 100%;
height: auto;
max-height: 150px;
width: auto;
display: block;
object-fit: contain !important;
filter: grayscale(100%);
opacity: 0.6;
transition: filter 0.25s ease, opacity 0.25s ease;
}
.logo-slider__img:hover {
filter: grayscale(0%);
opacity: 1;
}
.hero-centered {
background-color: #111827; color: #ffffff;
}
.hero-centered__container {
margin: 0 auto;
max-width: 768px; padding: 8rem 1.5rem; text-align: center;
} .hero-centered__eyebrow {
font-size: 0.875rem; font-weight: 600; color: var(--accent-light); margin: 0;
} .hero-centered__title {
margin-top: 0.75rem; font-size: 3rem; font-weight: 600; letter-spacing: -0.025em; line-height: 1.1;
margin-bottom: 0;
} @media (min-width: 640px) {
.hero-centered__title {
font-size: 3.75rem; }
} .hero-centered__lead {
margin-top: 1.5rem; font-size: 1.125rem; color: #d1d5db; margin-bottom: 0;
line-height: 1.6;
} .hero-centered__actions {
margin-top: 2.5rem; display: flex;
align-items: center;
justify-content: center;
gap: 1rem; flex-wrap: wrap;
} .hero-centered__button {
text-decoration: none;
font-size: 0.875rem; font-weight: 600; transition: all 0.2s ease;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0.375rem; } .hero-centered__button--primary {
background-color: var(--accent-color); color: #ffffff;
padding: 0.75rem 1.25rem; border: 2px solid transparent;
}
.hero-centered__button--primary:hover {
background-color: var(--accent-hover); text-decoration: none;
}
.hero-centered__button--primary:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
} .hero-centered__button--secondary {
color: #ffffff;
padding: 0.75rem 0;
background: transparent;
border: none;
}
.hero-centered__button--secondary:hover {
color: var(--accent-light); text-decoration: underline;
}
.hero-centered__button--secondary:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
border-radius: 0.25rem;
} .hero-centered--placeholder {
background-color: #f3f4f6;
color: #374151;
padding: 2rem;
text-align: center;
border: 2px dashed #d1d5db;
border-radius: 0.5rem;
}
.hero-centered--placeholder p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.hero-centered__container {
padding: 4rem 1rem; }
.hero-centered__title {
font-size: 2.25rem; }
.hero-centered__actions {
flex-direction: column;
gap: 0.75rem;
}
.hero-centered__button {
width: 100%;
max-width: 300px;
padding: 0.875rem 1.5rem;
}
} @media (prefers-reduced-motion: reduce) {
.hero-centered__button {
transition: none;
}
} @media (prefers-color-scheme: dark) {
.hero-centered {
background-color: #000000;
}
}
.hero-split {        
background-size: auto 455px;
background-position: bottom right;
background-repeat: no-repeat;
background-color: #F5F5F5;
padding-bottom: 455px; width: 100vw;
margin-left: calc(50% - 50vw);
}
@media screen and (min-width: 968px) {
.hero-split {
padding-bottom: 0;
}
.home .hero-split {
background-color: #ffffff;
background-size: auto 100%; 
background-position: top right; 
background-repeat: no-repeat;
background-color: #F5F5F5;
}
}
.hero-split__container {
margin: 0 auto;
max-width: 1280px; 
display: grid;
align-items: center;
gap: 3rem; 
padding: 5rem 0; 
}
@media (min-width: 1024px) {
.hero-split__container {
grid-template-columns: 1fr 1fr; 
}
}
@media (max-width: 1280px) {
.hero-split__container {
padding: 5rem 2rem; 
}
} .hero-split__content {
order: 1;
}
@media (min-width: 1024px) {
.hero-split__content {
order: unset;
}
} .hero-split__eyebrow {
font-size: 0.875rem; 
font-weight: 600; 
color: var(--accent-color); 
margin: 0;
} .hero-split__title {
margin-top: 0.5rem;  
font-size: 55px;
line-height: 60px;
font-weight: 400; 
color: #000000; 
margin-bottom: 40px;
} .hero-split__lead {
@apply font-primary text-[22px] leading-[26px] font-normal;
} .hero-split__actions {
margin-top: 2rem; 
display: flex;
gap: 1rem; 
flex-wrap: wrap;
} .hero-split__button {
text-decoration: none;
font-size: 0.875rem; 
font-weight: 600; 
transition: all 0.2s ease;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0.375rem; 
} .hero-split__button--primary {
background-color: #111827; 
color: #ffffff;
padding: 0.5rem 1rem; 
border: 2px solid transparent;
}
.hero-split__button--primary:hover {
background-color: #1f2937; 
text-decoration: none;
}
.hero-split__button--primary:focus {
outline: 2px solid #111827;
outline-offset: 2px;
} .hero-split__button--secondary {
color: #111827; 
padding: 0.5rem 0;
background: transparent;
border: none;
}
.hero-split__button--secondary:hover {
color: var(--accent-color); 
text-decoration: underline;
}
.hero-split__button--secondary:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
border-radius: 0.25rem;
} .hero-split__image {
position: relative;
order: 0;
}
@media (min-width: 1024px) {
.hero-split__image {
order: unset;
}
}
.hero-split__img {
width: 100%;
border-radius: 0.75rem; 
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); 
border: 1px solid rgba(17, 24, 39, 0.1); 
} .hero-split__img-placeholder {
width: 100%;
height: 300px;
background-color: #f3f4f6;
border-radius: 0.75rem;
border: 2px dashed #d1d5db;
display: flex;
align-items: center;
justify-content: center;
color: #6b7280;
font-weight: 500;
}
.hero-split__img-placeholder p {
margin: 0;
} .hero-split--placeholder {
background-color: #f3f4f6;
color: #374151;
padding: 2rem;
text-align: center;
border: 2px dashed #d1d5db;
border-radius: 0.5rem;
}
.hero-split--placeholder p {
margin: 0;
font-weight: 500;
} @media (max-width: 767px) {
.hero-split__container {
padding: 5rem 36px; 
gap: 2rem;
}
.hero-split__title {
font-size: 36px;
line-height: 46px;
margin-bottom: 25px;
}
.hero-split__actions {
flex-direction: column;
gap: 0.75rem;
}
.hero-split__button {
width: 100%;
max-width: 300px;
padding: 0.75rem 1.5rem;
}
} @media (prefers-reduced-motion: reduce) {
.hero-split__button {
transition: none;
}
}
.hero-split__container {
@apply px-9;
}
.hero-block {
position: relative;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
color: white;
overflow: hidden;
} .hero-block::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(135deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);
z-index: 1;
} .hero-block .container {
position: relative;
z-index: 2;
} @keyframes fade-in-up {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-fade-in-up {
animation: fade-in-up 0.8s ease-out forwards;
}
.hero-block h1 {
animation-delay: 0.2s;
}
.hero-block p {
animation-delay: 0.4s;
}
.hero-block a {
animation-delay: 0.6s;
} @media (max-width: 768px) {
.hero-block h1 {
font-size: 2.5rem;
line-height: 1.2;
}
.hero-block p {
font-size: 1.125rem;
line-height: 1.6;
}
}
@media (max-width: 480px) {
.hero-block h1 {
font-size: 2rem;
}
.hero-block p {
font-size: 1rem;
}
} .hero-block .btn-primary:hover,
.hero-block .btn-secondary:hover {
transform: translateY(-2px);
box-shadow: 0 10px 25px rgba(0,0,0,0.2);
transition: all 0.3s ease;
}
.hero-block .btn-outline:hover {
transform: translateY(-2px);
box-shadow: 0 10px 25px rgba(255,255,255,0.2);
transition: all 0.3s ease;
}
.logo-cloud {
background-color: #ffffff;
}
.logo-cloud__container {
margin: 0 auto;
max-width: 1280px; padding: 4rem 1.5rem; } .logo-cloud__eyebrow {
text-align: center;
font-size: 0.875rem; font-weight: 600; color: #6b7280; margin: 0 0 2rem 0; text-transform: uppercase;
letter-spacing: 0.05em;
} .logo-cloud__logos {
display: grid;
grid-template-columns: repeat(3, 1fr); gap: 2rem; align-items: center;
justify-items: center;
}
@media (min-width: 640px) {
.logo-cloud__logos {
grid-template-columns: repeat(3, 1fr); }
}
@media (min-width: 1024px) {
.logo-cloud__logos {
grid-template-columns: repeat(6, 1fr); }
} .logo-cloud__logo {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 80px;
transition: all 0.2s ease;
}
.logo-cloud__logo:hover {
transform: scale(1.05);
} .logo-cloud__image {
height: 2rem; width: auto;
max-width: 100%;
filter: grayscale(100%);
opacity: 0.7;
transition: all 0.2s ease;
object-fit: contain;
}
.logo-cloud__logo:hover .logo-cloud__image {
filter: grayscale(0%);
opacity: 1;
} .logo-cloud__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.logo-cloud__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.logo-cloud__container {
padding: 3rem 1rem;
}
.logo-cloud__logos {
grid-template-columns: repeat(2, 1fr);
gap: 1.5rem;
}
.logo-cloud__logo {
height: 60px;
}
.logo-cloud__image {
height: 1.5rem;
}
} .logo-cloud__logos[data-count="3"] {
grid-template-columns: repeat(3, 1fr);
}
.logo-cloud__logos[data-count="4"] {
grid-template-columns: repeat(4, 1fr);
}
.logo-cloud__logos[data-count="5"] {
grid-template-columns: repeat(5, 1fr);
}
@media (max-width: 1024px) {
.logo-cloud__logos[data-count="4"],
.logo-cloud__logos[data-count="5"],
.logo-cloud__logos[data-count="6"] {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 640px) {
.logo-cloud__logos[data-count="3"],
.logo-cloud__logos[data-count="4"],
.logo-cloud__logos[data-count="5"],
.logo-cloud__logos[data-count="6"] {
grid-template-columns: repeat(2, 1fr);
}
} @media (prefers-reduced-motion: reduce) {
.logo-cloud__logo,
.logo-cloud__image {
transition: none;
}
.logo-cloud__logo:hover {
transform: none;
}
}
.newsletter-centered {
background-color: #f9fafb; }
.newsletter-centered__container {
margin: 0 auto;
max-width: 768px; padding: 5rem 1.5rem; text-align: center;
} .newsletter-centered__title {
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0;
line-height: 1.2;
} .newsletter-centered__text {
margin-top: 0.75rem; color: #4b5563; line-height: 1.6;
margin-bottom: 0;
} .newsletter-centered__form {
margin: 0 auto;
margin-top: 2rem; display: flex;
max-width: 448px; gap: 0.75rem; align-items: stretch;
} .newsletter-centered__input {
min-width: 0;
flex: 1; border-radius: 0.375rem; border: 1px solid #d1d5db;
padding: 0.5rem 0.75rem; font-size: 0.875rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); transition: all 0.2s ease;
}
.newsletter-centered__input::placeholder {
color: #9ca3af; }
.newsletter-centered__input:focus {
outline: none;
border-color: var(--accent-color);
box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.1); } .newsletter-centered__button {
border-radius: 0.375rem; background-color: var(--accent-color); padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 600; color: #ffffff;
border: none;
cursor: pointer;
transition: all 0.2s ease;
white-space: nowrap;
}
.newsletter-centered__button:hover {
background-color: var(--accent-hover); transform: translateY(-1px);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
.newsletter-centered__button:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
}
.newsletter-centered__button:active {
transform: translateY(0);
} .newsletter-centered__note {
margin-top: 1rem;
color: #6b7280;
font-style: italic;
}
.newsletter-centered__note small {
font-size: 0.75rem;
} @media (max-width: 640px) {
.newsletter-centered__container {
padding: 3rem 1rem;
}
.newsletter-centered__title {
font-size: 1.5rem;
}
.newsletter-centered__form {
flex-direction: column;
gap: 0.75rem;
max-width: 100%;
}
.newsletter-centered__input,
.newsletter-centered__button {
padding: 0.75rem 1rem;
}
} .newsletter-centered__form[data-loading] .newsletter-centered__button {
opacity: 0.7;
cursor: not-allowed;
}
.newsletter-centered__form[data-success] {
opacity: 0.8;
}
.newsletter-centered__form[data-error] .newsletter-centered__input {
border-color: #dc2626;
} .sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
@media (prefers-reduced-motion: reduce) {
.newsletter-centered__input,
.newsletter-centered__button {
transition: none;
}
.newsletter-centered__button:hover,
.newsletter-centered__button:active {
transform: none;
}
}
.pricing-3 {
background-color: #ffffff;
}
.pricing-3__container {
margin: 0 auto;
max-width: 1280px; padding: 6rem 1.5rem; } .pricing-3__header {
margin: 0 auto;
max-width: 672px; text-align: center;
margin-bottom: 3rem; }
.pricing-3__title {
font-size: 2.25rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0;
line-height: 1.1;
}
.pricing-3__intro {
margin-top: 1rem; color: #4b5563; margin-bottom: 0;
line-height: 1.6;
} .pricing-3__plans {
display: grid;
gap: 1.5rem; grid-template-columns: 1fr;
}
@media (min-width: 640px) {
.pricing-3__plans {
grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
.pricing-3__plans {
grid-template-columns: repeat(3, 1fr); }
} .pricing-3__plan {
border-radius: 1rem; border: 1px solid #e5e7eb; padding: 2rem; background-color: #ffffff;
transition: all 0.2s ease;
position: relative;
}
.pricing-3__plan:hover {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
transform: translateY(-2px);
} .pricing-3__plan--featured {
border: 1px solid var(--accent-color); box-shadow: 0 0 0 1px var(--accent-color);
}
.pricing-3__plan--featured::before {
content: "Recommandé";
position: absolute;
top: -0.5rem;
left: 50%;
transform: translateX(-50%);
background-color: var(--accent-color);
color: #ffffff;
padding: 0.25rem 0.75rem;
border-radius: 9999px;
font-size: 0.75rem;
font-weight: 600;
} .pricing-3__plan-name {
font-size: 1rem; font-weight: 600; color: #111827; margin: 0;
line-height: 1.4;
} .pricing-3__plan-price {
margin-top: 1rem; font-size: 2.25rem; font-weight: 600; color: #111827; margin-bottom: 0;
line-height: 1.1;
} .pricing-3__features {
margin-top: 1.5rem; display: flex;
flex-direction: column;
gap: 0.5rem; list-style: none;
padding: 0;
}
.pricing-3__feature {
font-size: 0.875rem; color: #4b5563; line-height: 1.5;
position: relative;
padding-left: 1.5rem;
}
.pricing-3__feature::before {
content: "✓";
position: absolute;
left: 0;
color: #10b981; font-weight: 600;
} .pricing-3__cta {
margin-top: 2rem; display: inline-flex;
justify-content: center;
align-items: center;
width: 100%;
border-radius: 0.375rem; background-color: #111827; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 600; color: #ffffff;
text-decoration: none;
transition: all 0.2s ease;
border: 2px solid transparent;
}
.pricing-3__cta:hover {
background-color: #1f2937; text-decoration: none;
transform: translateY(-1px);
}
.pricing-3__cta:focus {
outline: 2px solid var(--accent-color);
outline-offset: 2px;
} .pricing-3__plan--featured .pricing-3__cta {
background-color: var(--accent-color);
}
.pricing-3__plan--featured .pricing-3__cta:hover {
background-color: var(--accent-hover);
} .pricing-3__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.pricing-3__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.pricing-3__container {
padding: 4rem 1rem;
}
.pricing-3__title {
font-size: 1.875rem;
}
.pricing-3__plan {
padding: 1.5rem;
}
.pricing-3__plan-price {
font-size: 2rem;
}
} @media (prefers-reduced-motion: reduce) {
.pricing-3__plan,
.pricing-3__cta {
transition: none;
}
.pricing-3__plan:hover,
.pricing-3__cta:hover {
transform: none;
}
}
.services-block {
padding: 4rem 0;
background-color: #f9fafb;
} .services-block .text-center h2 {
color: #111827;
font-size: 2.25rem;
font-weight: 700;
margin-bottom: 1rem;
line-height: 1.2;
}
.services-block .text-center p {
color: #6b7280;
font-size: 1.25rem;
max-width: 42rem;
margin: 0 auto;
line-height: 1.6;
} .service-card {
background: white;
border-radius: 0.5rem;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
padding: 1.5rem;
transition: all 0.3s ease;
transform: translateY(0);
}
.service-card:hover {
box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
transform: translateY(-0.5rem);
} .service-icon {
font-size: 2.25rem;
margin-bottom: 1rem;
text-align: center;
}
.service-icon img {
width: 4rem;
height: 4rem;
margin: 0 auto;
object-fit: contain;
}
.service-icon span {
font-size: 3.75rem;
display: block;
} .service-content h3 {
color: #111827;
font-size: 1.25rem;
font-weight: 600;
margin-bottom: 0.75rem;
line-height: 1.4;
}
.service-content p {
color: #6b7280;
margin-bottom: 1rem;
line-height: 1.6;
}
.service-content a {
color: #3b82f6;
font-weight: 500;
transition: color 0.2s ease;
text-decoration: none;
}
.service-content a:hover {
color: #1d4ed8;
} .services-block .grid {
display: grid;
gap: 2rem;
}
.services-block .grid-cols-1 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.services-block .md\\:grid-cols-2 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.services-block .lg\\:grid-cols-3 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.services-block .lg\\:grid-cols-4 {
grid-template-columns: repeat(1, minmax(0, 1fr));
} @media (min-width: 768px) {
.services-block .md\\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1024px) {
.services-block .lg\\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.services-block .lg\\:grid-cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
} .service-card {
opacity: 0;
animation: fade-in-up 0.6s ease-out forwards;
}
.service-card:nth-child(1) { animation-delay: 0.1s; }
.service-card:nth-child(2) { animation-delay: 0.2s; }
.service-card:nth-child(3) { animation-delay: 0.3s; }
.service-card:nth-child(4) { animation-delay: 0.4s; }
.service-card:nth-child(5) { animation-delay: 0.5s; }
.service-card:nth-child(6) { animation-delay: 0.6s; }
@keyframes fade-in-up {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.stats-grid {
background-color: #ffffff;
}
.stats-grid__container {
margin: 0 auto;
max-width: 1280px; padding: 4rem 1.5rem; } .stats-grid__items {
display: grid;
grid-template-columns: repeat(2, 1fr); gap: 2rem; text-align: center;
}
@media (min-width: 640px) {
.stats-grid__items {
grid-template-columns: repeat(4, 1fr); }
} .stats-grid__item {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
} .stats-grid__label {
font-size: 0.875rem; color: #6b7280; font-weight: 400;
margin: 0;
line-height: 1.4;
} .stats-grid__value {
margin-top: 0.5rem; font-size: 1.875rem; font-weight: 600; color: #111827; margin-bottom: 0;
line-height: 1.1;
} .stats-grid__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.stats-grid__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.stats-grid__container {
padding: 3rem 1rem;
}
.stats-grid__items {
gap: 1.5rem;
}
.stats-grid__value {
font-size: 1.5rem;
}
} @media (prefers-reduced-motion: no-preference) {
.stats-grid__value {
transition: transform 0.2s ease;
}
.stats-grid__item:hover .stats-grid__value {
transform: scale(1.05);
}
} @media (prefers-reduced-motion: reduce) {
.stats-grid__value {
transition: none;
}
.stats-grid__item:hover .stats-grid__value {
transform: none;
}
}
.steps-horizontal {
background-color: #ffffff;
}
.steps-horizontal__container {
margin: 0 auto;
max-width: 1024px; padding: 5rem 1.5rem; } .steps-horizontal__title {
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0 0 2.5rem 0; line-height: 1.2;
} .steps-horizontal__steps {
display: grid;
gap: 2rem; grid-template-columns: 1fr;
list-style: none;
padding: 0;
margin: 0;
}
@media (min-width: 640px) {
.steps-horizontal__steps {
grid-template-columns: repeat(3, 1fr); }
} .steps-horizontal__step {
border-radius: 1rem; border: 1px solid #e5e7eb; padding: 1.5rem; background-color: #ffffff;
position: relative;
transition: all 0.2s ease;
}
.steps-horizontal__step:hover {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
transform: translateY(-2px);
} .steps-horizontal__step-number {
font-size: 0.75rem; font-weight: 600; color: var(--accent-color); text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 0.5rem;
} .steps-horizontal__step-title {
margin-top: 0.5rem; font-size: 1.125rem; font-weight: 600; color: #111827; margin-bottom: 0;
line-height: 1.4;
} .steps-horizontal__step-text {
margin-top: 0.5rem; font-size: 0.875rem; color: #4b5563; line-height: 1.5;
margin-bottom: 0;
} @media (min-width: 640px) {
.steps-horizontal__step:not(:last-child)::after {
content: '→';
position: absolute;
top: 50%;
right: -1.5rem;
transform: translateY(-50%);
font-size: 1.5rem;
color: #d1d5db;
z-index: 1;
}
} .steps-horizontal__empty {
text-align: center;
padding: 3rem;
background-color: #f9fafb;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.steps-horizontal__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 640px) {
.steps-horizontal__container {
padding: 3rem 1rem;
}
.steps-horizontal__title {
font-size: 1.5rem;
margin-bottom: 2rem;
}
.steps-horizontal__steps {
gap: 1.5rem;
}
.steps-horizontal__step {
padding: 1.25rem;
} .steps-horizontal__step:not(:last-child)::after {
content: '↓';
position: absolute;
bottom: -1.25rem;
left: 50%;
transform: translateX(-50%);
font-size: 1.25rem;
color: #d1d5db;
z-index: 1;
}
} @media (prefers-reduced-motion: no-preference) {
.steps-horizontal__step:nth-child(1) {
animation-delay: 0ms;
}
.steps-horizontal__step:nth-child(2) {
animation-delay: 100ms;
}
.steps-horizontal__step:nth-child(3) {
animation-delay: 200ms;
}
.steps-horizontal__step:nth-child(4) {
animation-delay: 300ms;
}
.steps-horizontal__step:nth-child(5) {
animation-delay: 400ms;
}
.steps-horizontal__step:nth-child(6) {
animation-delay: 500ms;
}
} @media (prefers-reduced-motion: reduce) {
.steps-horizontal__step {
transition: none;
}
.steps-horizontal__step:hover {
transform: none;
}
}
.testimonials-cards {
background-color: #f9fafb; }
.testimonials-cards__container {
margin: 0 auto;
max-width: 1280px; padding: 6rem 1.5rem; } .testimonials-cards__title {
text-align: center;
font-size: 1.875rem; font-weight: 600; letter-spacing: -0.025em; color: #111827; margin: 0 0 3rem 0; line-height: 1.2;
} .testimonials-cards__items {
display: grid;
gap: 2rem; grid-template-columns: 1fr;
}
@media (min-width: 768px) {
.testimonials-cards__items {
grid-template-columns: repeat(2, 1fr); }
} .testimonials-cards__item {
border-radius: 1rem; background-color: #ffffff;
padding: 2rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); border: 1px solid rgba(17, 24, 39, 0.05); margin: 0;
transition: all 0.2s ease;
}
.testimonials-cards__item:hover {
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
transform: translateY(-2px);
} .testimonials-cards__quote {
color: #374151; line-height: 1.6;
margin: 0;
font-style: italic;
position: relative;
}
.testimonials-cards__quote::before {
content: "\201C";
font-size: 3rem;
color: #d1d5db;
position: absolute;
top: -1rem;
left: -0.5rem;
font-family: serif;
line-height: 1;
} .testimonials-cards__author {
margin-top: 1rem; font-size: 0.875rem; color: #6b7280; margin-bottom: 0;
}
.testimonials-cards__author-name {
font-weight: 600;
color: #374151; }
.testimonials-cards__author-role {
font-weight: 400;
} .testimonials-cards__empty {
text-align: center;
padding: 3rem;
background-color: #ffffff;
border: 2px dashed #d1d5db;
border-radius: 1rem;
color: #6b7280;
}
.testimonials-cards__empty p {
margin: 0;
font-weight: 500;
} @media (max-width: 768px) {
.testimonials-cards__container {
padding: 4rem 1rem;
}
.testimonials-cards__title {
font-size: 1.5rem;
margin-bottom: 2rem;
}
.testimonials-cards__items {
gap: 1.5rem;
}
.testimonials-cards__item {
padding: 1.5rem;
}
.testimonials-cards__quote::before {
font-size: 2rem;
top: -0.5rem;
}
} @media (prefers-reduced-motion: reduce) {
.testimonials-cards__item {
transition: none;
}
.testimonials-cards__item:hover {
transform: none;
}
} @media (min-width: 1024px) {
.testimonials-cards__items[data-count="3"],
.testimonials-cards__items[data-count="6"] {
grid-template-columns: repeat(3, 1fr);
}
.testimonials-cards__items[data-count="4"],
.testimonials-cards__items[data-count="8"] {
grid-template-columns: repeat(2, 1fr);
}
}
.timeline-vertical { }
.timeline-vertical__inner {
width: 100%;
} .timeline-vertical__title {
margin: 0 0 28px 0;
text-transform: uppercase;
} .timeline-vertical__timeline {
display: flex;
flex-direction: column;
gap: 18px; } .timeline-vertical__item {
display: grid;
grid-template-columns: 1fr 56px 160px;
align-items: center;
column-gap: 0;
} .timeline-vertical__label {
position: relative;
padding: 16px 60px 16px 20px;
text-transform: uppercase;
font-size: 16px;
line-height: 20px;
color: #000;
} .timeline-vertical__label::after {
content: "";
position: absolute;
top: 50%;
right: -10px;
transform: translateY(-50%);
width: 0;
height: 0;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-left: 10px solid currentColor; } .timeline-vertical__rail {
position: relative;
height: 100%;
min-height: 44px; } .timeline-vertical__rail::before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
top: -18px; bottom: -18px;
width: 1px;
background: #1a1818;
} .timeline-vertical__item:first-child .timeline-vertical__rail::before {
top: 0;
}
.timeline-vertical__item:last-child .timeline-vertical__rail::before {
bottom: 0;
} .timeline-vertical__dot {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 10px;
height: 10px;
background: #1a1818;
border-radius: 9999px;
} .timeline-vertical__year {
font-size: 56px;
line-height: 56px;
font-weight: 700;
color: #000;
letter-spacing: 0;
padding-left: 6px;
} .timeline-vertical__item--green .timeline-vertical__label {
background: #BFCF5C;
}
.timeline-vertical__item--green .timeline-vertical__label::after {
border-left-color: #BFCF5C;
}
.timeline-vertical__item--yellow .timeline-vertical__label {
background: #F1D94E; }
.timeline-vertical__item--yellow .timeline-vertical__label::after {
border-left-color: #F1D94E;
}
.timeline-vertical__item--grey .timeline-vertical__label {
background: #D9D9D9; }
.timeline-vertical__item--grey .timeline-vertical__label::after {
border-left-color: #D9D9D9;
} @media (max-width: 768px) {
.timeline-vertical__item {
grid-template-columns: minmax(0, 400px) 40px 116px;
}
.timeline-vertical__year {
font-size: 42px;
line-height: 42px;
}
}
@media (max-width: 1023px) {
.timeline-vertical__label {
padding: 16px 20px 16px 20px;
font-size: 15px;
line-height: 19px;
} 
}
.actus-slider {
width: 100%;
padding: 70px 0 40px 0;
}
.actus-slider__inner {
display: block;
grid-template-columns: 1fr;
row-gap: 28px;
} .actus-slider__intro {
display: flex;
flex-direction: column;
gap: 8px;
}
.actus-slider__title {
margin: 0;
text-transform: uppercase;
@apply font-bold;
line-height: 1.05;
letter-spacing: 0.02em;
}
.actus-slider__ctas {
display: flex;
gap: 16px;
flex-flow: row wrap;
}
.actus-slider__ctas > p {
margin: 0;
@apply w-full;
}
.actus-slider__ctas .btn--primary { justify-content: center;
text-align: center;
flex: 1 1 0;
@apply w-full;
}
.actus-slider__rule {
display: block;
height: 1px;
width: 100%;
background: #000;
opacity: 0.35;
margin: 40px 0;
} .actus-slider__content {
margin-top: 0;
position: relative;
}
.actus-slider__swiper {
position: relative;
overflow: hidden;
width: 100%;
}
.actus-slider__swiper .swiper-wrapper {
display: flex;
align-items: stretch;
height: 100%; }
.actus-slider__swiper .swiper-slide {
height: auto;
} .actus-slider__card {
padding: 0 70px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: start;
gap: 0;
min-height: 100px;
@apply text-black;
}
.actus-slider__meta time {
display: inline-block;
color: #000;
opacity: 0.5;
@apply text-[12px] md:text-[20px];
}
.actus-slider__card-title {
margin: 0;
text-transform: uppercase;
@apply text-[15px] leading-[24px] md:text-[22px] md:leading-[30px] font-normal;
}
.actus-slider__card-title a {
color: inherit;
text-decoration: none;
@apply text-[15px] leading-[24px] md:text-[22px] md:leading-[30px] font-medium md:font-normal;
}
.actus-slider__excerpt {
margin: 0;
} .actus-slider__nav {
display: flex;
justify-content: space-between;
gap: 18px;
margin-top: 20px;
width: 100%;
margin-left: 0;
position: absolute;
top: 32px;
left: 0;
z-index: 2;
}
.actus-slider__nav-btn {
width: 30px;
height: 30px;
background: transparent;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
line-height: 1;
cursor: pointer;
}
.actus-slider__prev, 
.actus-slider__next {
&:hover svg circle {
fill: #BFCF5C;
stroke: #BFCF5C;
}
} @media (min-width: 768px) {
.actus-slider {
width: 100%;
padding: 150px 0 55px 0;
}
.actus-slider__inner {
display: grid;
grid-template-columns: 25% 75%;
column-gap: 40px;
align-items: start;
}
.actus-slider__nav-btn {
width: 44px;
height: 44px;
}
.actus-slider__ctas {
display: flex;
gap: 0;
flex-wrap: wrap;
}
.actus-slider__intro {
padding-right: 0;
}
.actus-slider__rule {
display: none;
}
.actus-slider__content {
margin-top: 0;
padding-left: 40px;
}
.actus-slider__swiper .swiper-wrapper {
border-left: 1px solid rgba(0, 0, 0, 0.35);
min-height: 300px;
} .actus-slider__slide {
height: auto;
}
.actus-slider__card {
padding: 0 32px;
justify-content: start;
padding-top: 50px;
gap: 12px;
} .actus-slider__slide:not(:first-child) .actus-slider__card {
border-left: 1px solid rgba(0,0,0,0.35);
}
.actus-slider__slide:last-child .actus-slider__card {
border-right: 1px solid rgba(0, 0, 0, 0.35);
}
.actus-slider__nav {
justify-content: center;
margin-top: 32px;  
width: 100vw;
margin-left: calc(25% - 50vw);
gap: 70px;
position: initial;
}
.actus-slider__ctas {
flex-direction: column;
align-items: flex-start;
}
.actus-slider__ctas .btn--primary {
min-width: 200px;
flex: 0 0 auto;
}
} .badge-une {
display: inline-block;
margin-left: 0 !important;
padding: 2px 8px;
font-size: 0.65em;
font-weight: 600;
line-height: 1.4;
letter-spacing: 0.06em;
text-transform: uppercase;
color: #fff;
background-color: rgb(45,65,60);
vertical-align: middle;
white-space: nowrap;
}
.formations-cards { 
width: 100%; 
padding: 38px 0 45px 0;
} .formations-cards__header {
display: grid;
grid-template-columns: 1fr;
row-gap: 14px;
padding-bottom: 20px;
}
.formations-cards__title {
margin: 0; font-weight: 600;
color: #000;
text-transform: uppercase;
}
.formations-cards__header-cta { display: none; } .formations-cards__grid {
display: grid;
grid-template-columns: 1fr;
align-items: stretch; } .formations-cards__card {
display: flex; flex-flow: column nowrap; padding: 36px 0 16px 0;
border-top: 1px solid #707070;
@apply text-black;
}
.formations-cards__card-title {
@apply font-primary text-[30px] leading-[35px] font-normal uppercase mb-8;
}
.formations-cards__media {
width: 100%;
height: 335px;
overflow: hidden;
}
.formations-cards__media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.formations-cards__body {
position: relative;
padding-top: 14px;
flex: 1 1 auto; display: flex;
flex-direction: column;
}
.formations-cards__text { margin: 0; }
.formations-cards__arrow {
margin-top: auto; align-self: flex-end;
width: 40px;
height: 40px;
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
}
.formations-cards__arrow svg {
width: 40px;
height: 40px;
display: block;
}
.formations-cards__arrow:hover svg circle {
fill: #BFCF5C;
stroke: #BFCF5C;
} .formations-cards__card-rule { display: none; } .formations-cards__footer-cta { margin-top: 22px; } @media (min-width: 768px) {
.formations-cards { 
padding: 60px 0 85px 0;
}
.formations-cards__header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 32px 0;
}
.formations-cards__title { }
.formations-cards__header-cta { display: block; }
.formations-cards__footer-cta { display: none; }
.formations-cards__grid {
grid-template-columns: 1fr 1fr;
column-gap: 0;
row-gap: 0;
align-items: stretch; background: none;
background-image: none;
} .formations-cards__card {
display: flex;
flex-flow: column nowrap;
padding: 22px 36px 26px 36px;
border-top: none;
} .formations-cards__card:nth-child(odd) { padding-right: 36px;margin-left: -36px; }
.formations-cards__card:nth-child(even) { padding-left: 36px;margin-right: -36px; } .formations-cards__grid::before,
.formations-cards__grid::after {
content: none !important;
}
:root { --fc-line: #707070;
--fc-stroke: 1px; --fc-inset-x: 36px; --fc-pad-y: 36px; --fc-cross-gap: 14px;
}
.formations-cards__grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0 !important;
align-items: stretch;
}
.formations-cards__card {
position: relative;
display: flex;
flex-flow: column nowrap;
padding: var(--fc-pad-y) var(--fc-inset-x) 26px var(--fc-inset-x);
}  .formations-cards__card::before {
content: "";
position: absolute;
left: var(--fc-inset-x);
right: var(--fc-inset-x);
top: 0;
height: var(--fc-stroke);
background: var(--fc-line);
pointer-events: none;
}  .formations-cards__card:nth-child(odd) {
padding-right: calc(var(--fc-inset-x) + 18px); }
.formations-cards__card:nth-child(odd)::after {
content: "";
position: absolute;
right: 0;
top: 36px;
bottom: 0;
height: calc(100% - 72px);
width: var(--fc-stroke);
background: var(--fc-line);
pointer-events: none;
} .formations-cards__card:nth-child(even) {
padding-left: calc(var(--fc-inset-x) + 18px);
} .formations-cards__body {
position: relative;
flex: 1 1 auto;
padding-top: 34px;
display: flex;
flex-direction: column;
}  .formations-cards__card:nth-child(-n + 2) .formations-cards__body::before,
.formations-cards__card:nth-child(-n + 2) .formations-cards__body::after {
bottom: var(--fc-cross-gap);
} .formations-cards__card:nth-child(n + 3) .formations-cards__body::before,
.formations-cards__card:nth-child(n + 3) .formations-cards__body::after {
top: var(--fc-cross-gap);
} .formations-cards__grid::before,
.formations-cards__grid::after,
.formations-cards__card-rule {
display: none !important;
content: none !important;
}
}
.deux-colonnes {
--gap: 140px;
--radius: 13px;
@apply py-[60px] px-0 md:py-[100px];
} .deux-colonnes__grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: var(--gap);
align-items: stretch;
} .deux-colonnes__col {
overflow: hidden; 
min-height: 100%;
height: 100%;
} .deux-colonnes__inner {
height: 100%;
padding: 0;
display: flex;
flex-direction: column;
justify-content: center;
}
.deux-colonnes--dark .deux-colonnes__col--right .deux-colonnes__inner { }
.deux-colonnes__inner h2 {
@apply !mt-0 !mb-[32px] md:!mb-4;
} 
.card-modernise .deux-colonnes__col--left .deux-colonnes__inner { } .deux-colonnes__wysiwyg > *:first-child { margin-top: 0; }
.deux-colonnes__wysiwyg > *:last-child { margin-bottom: 0; }  .deux-colonnes__wysiwyg ul {
list-style: none;
}
.deux-colonnes__wysiwyg ul li {
position: relative;
padding-left: 24px;
}
.deux-colonnes__wysiwyg ul li::before {
content: "•";
position: absolute;
left: 0;
font-size: 40px;
top: -12px;
line-height: 1;
} .deux-colonnes__media {
height: 100%;
width: 100%;
}
.deux-colonnes__img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
} .deux-colonnes--light {
background: transparent;
}
.deux-colonnes--dark {
background: #000;
padding: 64px 0;
} .deux-colonnes--dark .deux-colonnes__col--type-wysiwyg,
.deux-colonnes--dark .deux-colonnes__col--type-wysiwyg_bg {
color: #fff;
}
@media screen and (max-width: 768px) {
.deux-colonnes--reverse .deux-colonnes__col--left {
order: 2;
}
.deux-colonnes--reverse .deux-colonnes__col--right {
order: 1;
}
} .deux-colonnes__empty {
padding: 16px;
border: 1px dashed rgba(0,0,0,.25);
background: rgba(255,255,255,.6);
} @media (max-width: 900px) {
.deux-colonnes__grid {
grid-template-columns: 1fr;
gap: 45px;
} .deux-colonnes__col--type-image .deux-colonnes__media {
min-height: 260px;
} }
@media (max-width: 1023px) {
}
.resource-card {
display: block;
text-decoration: none;
background: #BFCF5C;
width: 571px;
height: 335px; max-width: 100%;
outline: none;
}
.resource-card:hover,
.resource-card:focus-visible {
background: #2D413C;
}
.resource-card__inner {
height: 100%;
display: grid;
grid-template-columns: 1fr;
}
.resource-card--report .resource-card__inner {
grid-template-columns: 1fr 200px; }
.resource-card__content {
padding: 28px 28px 24px 28px;
display: flex;
flex-direction: column;
justify-content: space-between;
min-width: 0;
}
.resource-card__title {
margin: 0;
font-size: 30px;
line-height: 35px;
font-weight: 700;
color: #000;
text-transform: uppercase;
}
.resource-card:hover .resource-card__title,
.resource-card:focus-visible .resource-card__title {
color: #fff;
}
.resource-card .btn--arrow {
margin-top: 0;
transform: rotate(-45deg);
}
.resource-card:hover .btn--arrow,
.resource-card:focus-visible .btn--arrow {
@apply border-white;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}
.resource-card__action {
display: inline-flex;
align-items: center;
gap: 12px;
} .resource-card__see {
font-size: 20px;
line-height: 26px;
font-weight: 400;
color: #000;
text-transform: uppercase;
position: relative;
padding-left: 46px;
}
.resource-card__see::before {
content: "↗";
position: absolute;
left: 0;
top: 0;
width: 34px;
height: 34px;
border: 1px solid #1a1818;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.resource-card:hover .resource-card__see,
.resource-card:focus-visible .resource-card__see {
color: #fff;
}
.resource-card:hover .resource-card__see::before,
.resource-card:focus-visible .resource-card__see::before {
border-color: #fff;
color: #fff;
} .resource-card__download {
font-size: 20px;
line-height: 26px;
font-weight: 400;
color: #000;
text-transform: uppercase;
}
.btn--download.resource-card__download::before {
top: 20px;
}
.resource-card__inner:hover .btn--download.resource-card__download::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.resource-card:hover .resource-card__download,
.resource-card:focus-visible .resource-card__download {
color: #fff;
} .resource-card__media {
width: 200px;
height: 335px;
overflow: hidden;
}
.resource-card__media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block; }
.resource-card__action {
margin-top: auto;
display: inline-flex;
align-items: center;
gap: 14px;
}
.resource-card__label {
font-size: 20px;
line-height: 26px;
font-weight: 400;
text-transform: uppercase;
color: #000;
}
.resource-card:hover .resource-card__label,
.resource-card:focus-visible .resource-card__label {
color: #fff;
} @media (max-width: 1024px) {
.resource-card {
width: 100%;
height: auto; }
.resource-card__inner {
height: 100%;
}
.resource-card--report .resource-card__inner {
grid-template-columns: 1fr;
grid-template-rows: 1fr;
}
.resource-card__media {
width: 100%;
height: auto;
}
.resource-card__media img {
height: 100%;
}
.resource-card__title {
font-size: 20px;
line-height: 30px;
}
.resource-card__action .btn--download {
padding-left: 36px;
}
.resource-card__action .btn--download::before {
left: 0px;
}
.resource-card__download {
font-size: 16px;
line-height: 26px;
}
.resource-card {
max-width: 400px;
}
}
@media (min-width: 1024px) and (max-width: 1280px) {
.resource-card__title {
font-size: 22px;
line-height: 26px;
}
.resource-card__media {
width: 200px;
height: 100%;
}
.resource-card {
height: 250px;
max-width: 100%;
}
}
.key-figures {
@apply mt-8;
}
.key-figures__inner {
width: 100%;
} .key-figures__grid {
display: grid;
grid-template-columns: 1fr;
}
@media (min-width: 768px) {
.key-figures__grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1024px) {
.key-figures__grid {
grid-template-columns: repeat(4, 1fr);
}
}
.key-figures__item {
padding: 16px 0;
} @media (min-width: 768px) and (max-width: 1023px) {
.key-figures__item:nth-child(even) {
border-left: 1px solid #707070;
}
.key-figures__item {
padding: 32px;
}
} @media (min-width: 1024px) {
.key-figures__item:not(:first-child) {
border-left: 1px solid #707070;
}
.key-figures__item {
padding: 0 36px;
}
}
@media screen and (min-width: 1280px) {
.key-figures__item {
padding: 0 60px;
}
} .key-figures__value {
font-family: var(--font-primary, inherit);
font-size: 60px;
line-height: 1;
font-weight: 500; color: #000;
margin: 0 0 14px 0;
}
@media (min-width: 1024px) {
.key-figures__value {
font-size: 90px;
}
} .key-figures__label {
margin: 0;
text-transform: uppercase;
}
.key-figures__details {
margin: 0;
}
.key-figures__empty {
margin: 0;
}
.ensa-tabs {
position: relative;
background: transparent;
}
.ensa-tabs__inner {
margin: 0 auto;
}
@media screen and (max-width: 767px) {
.ensa-tabs__inner {
width: 100vw;
left: -36px;
padding-left: 36px;
padding-right: 36px;
position: relative;
background-color: rgba(245, 245, 245, 1);
}
.ensa-tabs__nav {
width: calc(100% - 72px);
margin: auto;
padding-left: 36px;
padding-right: 36px;
}
} .ensa-tabs__nav {
position: relative;
display: flex;
align-items: stretch;
gap: 0;
margin: 0;
width: 100%; 
background: transparent; 
} .ensa-tabs__tab {
position: relative;
z-index: 2; 
appearance: none;
border: 0;
cursor: pointer;
background: rgba(245, 245, 245, 0.5);
padding: 34px 70px;
line-height: 1;
text-transform: uppercase;
border-right: 2px solid white;
}
.ensa-tabs__tab.is-active,
.ensa-tabs__tab[aria-selected="true"] {
background: #F5F5F5;
margin-bottom: -1px; 
font-weight: 700;
}
.ensa-tabs__tab:first-child {
border-left: 2px solid white;
}
.ensa-tabs__tab:first-child.is-active, 
.ensa-tabs__tab:first-child[aria-selected="true"] {
border-left: 2px solid transparent;
} .ensa-tabs__panels {
position: relative;
z-index: 1;
padding-bottom: 60px;
} .ensa-tabs__panels::before {
content: "";
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 100vw;
top: 0;
bottom: 0;
background: #F5F5F5;
z-index: -1;
} .ensa-tabs.is-accordion .ensa-tabs__nav {
display: none;
} .ensa-tabs__acc-btn {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
appearance: none;
border: 0;
cursor: pointer;
background: rgba(245, 245, 245, 0.5);
padding: 22px 18px;
text-transform: uppercase;
} .ensa-tabs__acc-icon {
width: 12px;
height: 12px;
display: inline-block;
border-right: 2px solid #1A1818;
border-bottom: 2px solid #1A1818;
transform: rotate(45deg);
margin-left: 16px;
}
.ensa-tabs__acc-btn[aria-expanded="true"] .ensa-tabs__acc-icon {
transform: rotate(-135deg);
}
.ensa-tabs.is-accordion .ensa-tabs__panels {
padding-top: 0;
padding-bottom: 0;
} .ensa-tabs.is-accordion .ensa-tabs__panel {
padding-top: 24px;
padding-bottom: 30px;
} @media (max-width: 767px) {
.ensa-tabs {
background: #F5F5F5;
}
.ensa-tabs__acc-btn {
padding: 22px 18px 22px 0;
}
.ensa-tabs__acc-btn {position: relative;}
.ensa-tabs__acc-btn::before {
position: absolute;
content: '';
width: 100vw;
height: 2px;
background: white;
right: 0;
left: 0;
margin-left: calc(50% - 50vw);
top: 0;
bottom: 100%;
}
} .ensa-tabs__nav {
position: relative;
}
.ensa-tabs__nav::before {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 100%; 
width: 100vw; 
background: #F5F5F5;
z-index: 0;
}
.ensa-tabs__tab {
position: relative;
z-index: 2;
}
.ensa-tabs__nav::after {
z-index: 1;
}
.team{
width: 100%;
padding: 38px 0 45px 0;
} .team__inner{
width: 100%;
} :root{
--tc-line: #707070;
--tc-stroke: 1px; --tc-inset-x: 36px; --tc-pad-y: 36px; --tc-mid-pad: 18px; --tc-cross-gap: 14px;
} .team__cols{
display: grid;
grid-template-columns: 1fr;
gap: 0;
position: relative;
} .team__cols::before{ content: none !important; }
.team__col{
display: flex;
flex-direction: column;
} .team__card{
position: relative;
display: flex;
flex-direction: column;
padding: var(--tc-pad-y) var(--tc-inset-x) 26px var(--tc-inset-x);
} .team__top{
display: flex;
gap: 18px;
align-items: flex-start;
flex-flow: row wrap;
}
@media screen and (min-width: 1024px) {
.team__top {
flex-flow: row nowrap;
}
}
.team__photo{
width: 305px;
flex: 0 0 220px;
}
.team__photo img{
width: 100%;
height: 100%;
object-fit: cover;
display: block;
} .team__meta{
flex: 1 1 auto;
}
.team__name{
margin: 0 0 6px 0;
}
.team__role{
margin: 0;
} .team__bottom{
margin-top: auto;
display: flex;
flex-direction: column;
}
.team__toggle{
margin-top: 10px;
align-self: flex-end;
width: 40px;
height: 40px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
background: transparent;
border: 0;
cursor: pointer;
}
.team__toggle svg{
width: 40px;
height: 40px;
display: block;
}
.team__panel{
margin-top: 14px;
}
.team__desc{
margin: 32px 0 0 0;
} .team__toggle-icon.is-minus{ display: none; }
.team__toggle[aria-expanded="true"] .team__toggle-icon.is-plus{ display: none; }
.team__toggle[aria-expanded="true"] .team__toggle-icon.is-minus{ display: block; } @media (min-width: 1024px){
.team{
padding: 60px 0 85px 0;
}
.team__cols{
grid-template-columns: 1fr 1fr;
gap: 0;
align-items: start;
}  .team__col .team__card + .team__card::before{
content: "";
position: absolute;
left: var(--tc-inset-x);
right: var(--tc-inset-x);
top: 0;
height: var(--tc-stroke);
background: var(--tc-line);
pointer-events: none;
} .team__col--left .team__card{
padding-right: calc(var(--tc-inset-x) + var(--tc-mid-pad));
min-height: 288px;
}
.team__col--left .team__card::after{
content: "";
position: absolute;
right: -1px;
top: var(--tc-pad-y);
bottom: var(--tc-pad-y);
width: var(--tc-stroke);
background: var(--tc-line);
pointer-events: none;
}
.team__col--right .team__card{
padding-left: calc(var(--tc-inset-x) + var(--tc-mid-pad));
min-height: 288px;
}
.team__col--right .team__card::after{
content: "";
position: absolute;
left: 0;
top: var(--tc-pad-y);
bottom: var(--tc-pad-y);
width: var(--tc-stroke);
background: var(--tc-line);
pointer-events: none;
} .team__col .team__card + .team__card::after{
top: calc(var(--tc-pad-y) + var(--tc-cross-gap));
}
} @media (max-width: 1023px){
.team__cols{
grid-template-columns: 1fr;
} .team__card{
padding: 36px 0 16px 0;
border-top: 1px solid #707070;
} .team__card::before,
.team__card::after{
content: none !important;
} .team__photo{
width: 100px;
flex: 0 0 100px;
height: 100px;
}
}
@media (min-width: 1023px){
.team__photo{
flex: 0 0 165px;
height: 150px;
}
}
.parallaxe {
position: relative;
left: 50%;
width: 100vw;
margin-left: -50vw;
margin-right: 0;
overflow-x: clip;
height: var(--parallaxe-h-desktop, 420px);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}
@supports not (overflow: clip) {
.parallaxe {
overflow-x: hidden;
}
}
@media (max-width: 900px) {
.parallaxe {
height: var(--parallaxe-h-mobile, 260px);
background-attachment: scroll; 
margin-top: 32px;
}
}
.parallaxe__empty {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 16px;
border: 1px dashed rgba(0,0,0,.25);
background: rgba(255,255,255,.6);
} 
.listing-posts {
--lp-line: #707070;
--lp-stroke: 1px;
--lp-inset-x: 36px;
--lp-pad-y: 50px;
--lp-mid-pad: 18px;
--lp-cross-gap: 14px;
--lp-pad-bottom: 50px;
--lp-arrow-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.11' height='37.11' viewBox='0 0 37.11 37.11'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' d='M0 0h37.11v37.11H0z' data-name='Rectangle 132'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 195'%3E%3Ccircle cx='17.906' cy='17.906' r='17.906' data-name='Ellipse 42' transform='translate(.649 .649)'/%3E%3Cpath d='M9.832 18.742h16.17' data-name='Ligne 204'/%3E%3Cpath d='M17.81 10.496c.322.322 7.925 8.192 7.925 8.192l-7.925 7.925' data-name='Tracé 387'/%3E%3C/g%3E%3C/svg%3E");
width: 100%;
padding-top: 40px; }
.listing-posts__inner {
width: 100%;
} .listing-posts__featured {
margin-bottom: 24px;
}
.listing-posts__featured-card {
padding-top: 0;
padding-bottom: 50px;
border-bottom: 1px solid var(--lp-line);
}
#listing-posts--type-conference .listing-posts__featured-content {
display: contents !important;
min-height: 100%;
}
.listing-posts__featured-title {
margin: 0 0 24px;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 3rem;
line-height: 1.15;
font-weight: 400;
color: #000;
}
.listing-posts__featured-title a {
color: inherit;
text-decoration: none;
}
.listing-posts__featured-media {
display: block;
margin-bottom: 24px;
text-decoration: none;
}
.listing-posts__featured-image {
display: block;
width: 100%;
height: 335px;
object-fit: cover;
}
.listing-posts__featured-date {
margin: 0 0 16px;
@apply font-primary text-lg uppercase;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.listing-posts__featured-excerpt {
margin-top: 0;
}
.listing-posts__featured-excerpt p {
margin: 0;
@apply font-primary text-lg;
font-weight: 400;
color: #000;
}
.listing-posts__featured-footer {
display: flex;
justify-content: flex-end;
margin-top: auto;
padding-top: 24px;
}
.listing-posts--type-conference .listing-posts__footer {
justify-content: space-between;
padding-top: 0;
} .listing-posts__tabs {
margin-bottom: 0;
}
.listing-posts__tabs.ensa-tabs {
background: transparent;
}
.listing-posts__tabs .ensa-tabs__inner {
margin: 0;
}
.listing-posts__tabs .ensa-tabs__nav {
position: relative;
display: flex;
align-items: stretch;
gap: 0;
margin: 0;
width: 100%;
background: transparent;
}
.listing-posts__tabs .ensa-tabs__nav::before {
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 100%;
width: 100vw;
background: #f5f5f5;
z-index: 0;
}
.listing-posts__tabs .ensa-tabs__tab {
position: relative;
z-index: 2;
display: inline-flex;
align-items: center;
justify-content: center;
appearance: none;
text-decoration: none;
cursor: pointer;
border: 0;
background: rgba(245, 245, 245, 0.5);
padding: 34px 70px;
line-height: 1;
color: #1a1818;
text-transform: uppercase;
border-right: 2px solid #fff;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 22px;
font-weight: 400;
}
.listing-posts__tabs .ensa-tabs__tab:first-child {
border-left: 2px solid #fff;
}
.listing-posts__tabs .ensa-tabs__tab.is-active,
.listing-posts__tabs .ensa-tabs__tab[aria-current="page"] {
background: #f5f5f5;
margin-bottom: -1px;
font-weight: 700;
}
.listing-posts__tabs .ensa-tabs__tab:first-child.is-active,
.listing-posts__tabs .ensa-tabs__tab:first-child[aria-current="page"] {
border-left: 2px solid transparent;
} .listing-posts__grid {
display: grid;
gap: 0;
}
.listing-posts--cols-1 .listing-posts__grid {
grid-template-columns: 1fr;
}
.listing-posts--cols-2 .listing-posts__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.listing-posts--cols-3 .listing-posts__grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 768px) {
.listing-posts--cols-3 .listing-posts__grid,
.listing-posts--cols-2 .listing-posts__grid,
.listing-posts--cols-1 .listing-posts__grid {
grid-template-columns: 1fr;
}
}
.listing-posts__card {
position: relative;
min-width: 0;
}
.listing-posts__content {
display: flex;
flex-direction: column;
min-height: 100%;
} .listing-posts__title {
margin: 0 0 24px;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 30px;
line-height: 35px;
font-weight: 400;
color: #000;
}
.listing-posts__title a {
color: inherit;
text-decoration: none;
font-size: 30px;
line-height: 35px;
font-weight: 400;
color: #000;
}
.listing-posts__media {
display: block;
margin-bottom: 24px;
text-decoration: none;
}
.listing-posts__image {
display: block;
width: 100%;
height: 335px;
object-fit: cover;
}
.listing-posts__date {
margin: 0 0 16px;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 2.3rem;
line-height: 3.4rem;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.listing-posts__excerpt {
margin-top: 0;
}
.listing-posts__excerpt p {
margin: 0;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 22px;
line-height: 28px;
font-weight: 400;
color: #000;
}
.listing-posts__footer {
display: flex;
justify-content: flex-end;
margin-top: auto;
padding-top: 24px;
} .listing-posts__cta,
.listing-posts__featured-cta,
.listing-posts__pagination-arrow {
display: inline-flex;
align-items: center;
justify-content: center;
width: 37px;
height: 37px;
text-decoration: none;
flex: 0 0 37px;
}
.listing-posts__cta-icon,
.listing-posts__featured-cta-icon,
.listing-posts__pagination-arrow-icon {
display: block;
width: 37px;
height: 37px;
background-image: var(--lp-arrow-icon);
background-repeat: no-repeat;
background-position: center;
background-size: 37px 37px;
}
.listing-posts__pagination-arrow--prev .listing-posts__pagination-arrow-icon,
.listing-posts__pagination-arrow.is-prev .listing-posts__pagination-arrow-icon {
transform: rotate(180deg);
} .listing-posts__pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 18px;
margin-top: 56px;
padding-bottom: 80px;
}
.listing-posts__pagination-center {
display: flex;
align-items: center;
gap: 18px;
}
.listing-posts__pagination-label {
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 23px;
line-height: 34px;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
text-transform: uppercase;
}
.listing-posts__pagination-pages {
display: flex;
align-items: center;
gap: 14px;
}
.listing-posts__pagination-page {
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 23px;
line-height: 34px;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
text-decoration: none;
}
.listing-posts__pagination-page.is-active {
color: #000;
}
.listing-posts__pagination-arrow.is-disabled {
opacity: 0.5;
pointer-events: none;
}
.listing-posts__pagination > .listing-posts__pagination-arrow:first-child .listing-posts__pagination-arrow-icon {
transform: rotate(180deg);
} .listing-posts__empty {
padding: 32px 0;
}
.type-travaux_etudiants .single-post__date {
display: none;
} @media (min-width: 768px) {
.listing-posts--cols-2 .listing-posts__card {
padding-top: var(--lp-pad-y);
padding-bottom: var(--lp-pad-bottom);
}
.listing-posts--cols-2 .listing-posts__card:nth-child(odd) {
padding-left: 0;
padding-right: calc(var(--lp-inset-x) + var(--lp-mid-pad));
}
.listing-posts--cols-2 .listing-posts__card:nth-child(even) {
padding-left: calc(var(--lp-inset-x) + var(--lp-mid-pad));
padding-right: 0;
} .listing-posts--cols-2 .listing-posts__card:nth-child(n + 3)::before {
content: "";
position: absolute;
top: 0;
height: var(--lp-stroke);
background: var(--lp-line);
pointer-events: none;
}
.listing-posts--cols-2 .listing-posts__card:nth-child(odd):nth-child(n + 3)::before {
left: 0;
right: var(--lp-inset-x);
}
.listing-posts--cols-2 .listing-posts__card:nth-child(even):nth-child(n + 3)::before {
left: var(--lp-inset-x);
right: 0;
} .listing-posts--cols-2 .listing-posts__card:nth-child(odd)::after {
content: "";
position: absolute;
right: 0;
top: var(--lp-pad-y);
bottom: var(--lp-pad-y);
width: var(--lp-stroke);
background: var(--lp-line);
pointer-events: none;
} .listing-posts--cols-2 .listing-posts__card:nth-child(odd):nth-child(n + 3)::after {
top: calc(var(--lp-pad-y) + var(--lp-cross-gap));
} .listing-posts--cols-1 .listing-posts__card {
padding: 40px 0;
border-top: 1px solid var(--lp-line);
}
.listing-posts--cols-1 .listing-posts__card:first-child {
border-top: 0;
padding-top: 0;
} .listing-posts--cols-3 .listing-posts__card {
padding: 40px 20px;
border-top: 1px solid var(--lp-line);
}
}
@media (max-width: 767px) {
.listing-posts {
padding-top: 56px;
}
.listing-posts__featured {
margin-bottom: 8px;
}
.listing-posts__featured-card {
padding-bottom: 36px;
}
.listing-posts__featured-image,
.listing-posts__image {
height: 240px;
}
.listing-posts__card {
padding: 36px 0 16px;
border-top: 1px solid var(--lp-line);
}
.listing-posts__card::before,
.listing-posts__card::after {
content: none !important;
}
.listing-posts__card:first-child {
border-top: 0;
padding-top: 0;
}
.listing-posts__pagination {
gap: 12px;
margin-top: 36px;
}
.listing-posts__pagination-center {
gap: 12px;
}
.listing-posts__pagination-pages {
gap: 10px;
}
.listing-posts__tabs.ensa-tabs {
background: #f5f5f5;
}
.listing-posts__tabs .ensa-tabs__nav {
flex-direction: column;
align-items: stretch;
padding: 0;
}
.listing-posts--type-travaux_etudiants .listing-posts__tabs .ensa-tabs__nav {
padding: 0 0 32px 0;
}
.listing-posts--type-travaux_etudiants .listing-posts__grid {
border-top: 1px solid #707070;
padding-top: 32px;
}
.listing-posts__tabs .ensa-tabs__nav::before {
display: none;
}
.listing-posts__tabs .ensa-tabs__tab {
justify-content: space-between;
width: 100%;
padding: 22px 18px 22px 0;
border: 0;
border-top: 2px solid #fff;
margin: 0;
text-transform: uppercase;
}
.listing-posts__tabs .ensa-tabs__tab:first-child {
border-left: 0;
}
.listing-posts__tabs .ensa-tabs__tab.is-active,
.listing-posts__tabs .ensa-tabs__tab[aria-current="page"] {
margin-bottom: 0;
}
}
.listing-posts.is-loading {
opacity: 0.6;
pointer-events: none;
}
.listing-posts .bandeau-block .full-width {
background-repeat: no-repeat;
background-size: cover;
left: 50%;
margin-left: -50vw;
margin-right: -50vw;
position: relative;
right: 50%;
width: 100vw;
padding-bottom: 80px;
}  .listing-posts__video-trigger {
cursor: pointer;
position: relative;
display: block;
} .listing-posts__featured {
@apply py-8 md:pt-[100px] md:pb-[145px];
}
.listing-posts--type-conference .listing-posts__featured {
@apply relative w-screen left-1/2 right-1/2 -ml-[50vw] -mr-[50vw] bg-grey;
}
.listing-posts--type-conference .listing-posts__grid {
padding-top: 50px;
}
.listing-posts__featured-card {
padding: 0;
border-bottom: none; }
.listing-posts__featured-content {
display: flex;
flex-direction: column;
gap: 0;
} .listing-posts__featured-title {
margin: 0 0 10px;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 2.2rem;
line-height: 1.2;
font-weight: 400;
color: #000;
text-transform: uppercase;
letter-spacing: 0.01em;
}
.listing-posts__featured-title a {
color: inherit;
text-decoration: none;
}
.listing-posts__featured-title a:hover {
text-decoration: underline;
text-underline-offset: 3px;
}
.listing-posts--type-conference .listing-posts__featured-title a {
@apply text-[30px] leading-[30px] !no-underline;
}
.listing-posts--type-conference .listing-posts__title a {
@apply text-[22px] leading-[28px] !no-underline;
} .listing-posts__featured-media {
display: block;
width: 100%;
text-decoration: none;
overflow: hidden;
}
.listing-posts__featured-image {
display: block;
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
object-fit: cover;
transition: transform 0.35s ease;
}
.listing-posts__featured-media:hover .listing-posts__featured-image {
transform: scale(1.015);
}  .listing-posts__card--video .listing-posts__media {
overflow: hidden;
}
.listing-posts__card--video .listing-posts__image {
transition: transform 0.35s ease;
}
.listing-posts__card--video .listing-posts__media:hover .listing-posts__image {
transform: scale(1.015);
} @media (max-width: 767px) {
.listing-posts__featured {
margin-bottom: 32px;
padding-bottom: 36px;
}
.listing-posts__featured-title {
font-size: 1.8rem;
}
}
#glightbox-body .gprev, 
#glightbox-body .gnext {
display: none;
}
.listing-posts__featured-player {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
background: #000;
}
.listing-posts__featured-player iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
} .badge-une {
display: inline-block;
margin-left: 8px;
padding: 2px 8px;
font-size: 0.65em;
font-weight: 600;
line-height: 1.4;
letter-spacing: 0.06em;
text-transform: uppercase;
color: #fff;
background-color: rgb(45,65,60);
vertical-align: middle;
white-space: nowrap;
}
.block-text-image-full {
--tif-container:   1312px;
--tif-max-width:   1920px;
--tif-color-title: #1a3a8c;
--tif-color-text:  #1a1a2e;
--tif-color-cta:   #1a6fd4;
--tif-gap:         0px;
--tif-section-py:  80px;
--tif-header-pb:   48px;
} .block-text-image-full {
margin-inline: calc(50% - 50vw);
width: 100vw;
overflow: hidden;
background-color: #F5F5F5;
} .tif__outer {
width: 100%;
max-width: var(--tif-max-width);
margin-inline: auto;
} .tif__container {
width: 100%;
max-width: var(--tif-container);
margin-inline: auto;
padding-inline: 1rem;
} .tif__header {
padding-bottom: var(--tif-header-pb);
}
.tif__title {
font-weight: 900;
color: var(--tif-color-title);
line-height: 1.15;
margin: 0;
} .tif__body {
display: flex;
align-items: stretch;
gap: var(--tif-gap);
} .tif__col-left {
flex: 0 0 50%;
width: 50%;
display: flex;
align-items: center;
}
.tif__col-left .tif__container {
max-width: calc(var(--tif-container) / 2); margin-inline: auto 0; padding-right: 36px;
padding-left: 36px; } .tif__content-row {
display: flex;
position: relative;
align-items: flex-start;
gap: 0;
}
.tif__text {
flex: 1;
z-index: 1;
}
.tif__wysiwyg {
@apply text-primary-dark;
font-size: 1.25rem;
line-height: 1.5;
}
.tif__wysiwyg h1 {
margin-bottom: 36px;
margin-top: 36px;
}
.tif__wysiwyg p {
margin-block: 0 24px;
}
.tif__wysiwyg p:last-child {
margin-bottom: 0;
}
.tif__cta {
display: inline-block;
margin-top: 1.5rem;
color: var(--tif-color-cta);
font-weight: 700;
font-size: 1rem;
text-decoration: none;
transition: opacity 0.2s ease;
}
.tif__cta:hover,
.tif__cta:focus-visible {
opacity: 0.75;
text-decoration: underline;
} .tif__col-right {
flex: 1 1 auto;
min-width: 0;
position: relative;
max-height: 600px;
}
.tif__image-wrap {
position: relative;
width: 100%;
height: 100%;
min-height: 420px;
@apply mt-20 lg:mt-0;
}
.tif__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover; object-position: bottom;
}
.tif__image-caption {
position: absolute;
right: 16px;
bottom: 12px;
z-index: 2;
margin: 0;
padding: 4px 12px;
background-color: rgba(0, 0, 0, 0.55);
color: #fff;
font-size: 0.75rem;
line-height: 1.4;
text-align: right;
} @media (min-width: 1920px) {
.tif__col-left {
flex: 0 0 50%;
width: 50%;
}
.tif__col-right {
flex: 0 0 50%;
width: 50%;
}
.tif__col-left .tif__container {
max-width: calc(var(--tif-container) / 2);
margin-inline: auto 0;
padding-right: 100px;
padding-left: 16px;
}
}
@media (min-width: 1280px) {
.tif__col-left .tif__container {
padding-left: 16px;
}
} @media (max-width: 1024px) {
.block-text-image-full {
--tif-section-py: 60px;
--tif-header-pb:  32px;
}
.tif__body {
flex-direction: column;
}
.tif__col-left,
.tif__col-right {
width: 100%;
flex: 0 0 auto;
}
.tif__col-left .tif__container {
max-width: var(--tif-container);
margin-inline: auto;
padding-inline: 36px;
}
.tif__image-wrap {
max-height: 400px;
min-height: 400px;
}
.tif__image {
display: block;
width: 100%;
height: 400px;
object-fit: cover;
object-position: bottom;
}
} @media (max-width: 640px) {
.block-text-image-full {
--tif-section-py: 48px;
--tif-header-pb:  24px;
}
.tif__content-row {
flex-direction: column;
gap: 24px;
}
.tif__image-wrap {
max-height: 250px;
min-height: 250px;
}
.tif__image {
height: 250px;
}
.tif__image-caption {
left: 16px;
}
}
.tif__content-row::before,
.tif__content-row::after {
position: absolute;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
z-index: 0;
}
@media (min-width: 1280px) {
.tif__content-row::after {
bottom: -112px;
left: 40px;
}
}
.block-text-carrousel-full {
--tcf-container:   1312px;
--tcf-max-width:   1920px;
--tcf-color-title: #1a3a8c;
--tcf-color-text:  #1a1a2e;
--tcf-color-cta:   #1a6fd4;
--tcf-gap:         0px;
--tcf-section-py:  80px;
--tcf-header-pb:   48px;
} .block-text-carrousel-full {
margin-inline: calc(50% - 50vw);
width: 100vw;
overflow: hidden;
background-color: #F5F5F5;
} .tcf__outer {
width: 100%;
max-width: var(--tcf-max-width);
margin-inline: auto;
} .tcf__container {
width: 100%;
max-width: var(--tcf-container);
margin-inline: auto;
padding-inline: 1rem;
} .tcf__header {
padding-bottom: var(--tcf-header-pb);
}
.tcf__title {
font-weight: 900;
color: var(--tcf-color-title);
line-height: 1.15;
margin: 0;
} .tcf__body {
display: flex;
align-items: stretch;
gap: var(--tcf-gap);
} .tcf__col-left {
flex: 0 0 50%;
width: 50%;
display: flex;
align-items: center;
}
.tcf__col-left .tcf__container {
max-width: calc(var(--tcf-container) / 2); margin-inline: auto 0; padding-right: 36px;
padding-left: 36px; } .tcf__content-row {
display: flex;
position: relative;
align-items: flex-start;
gap: 0;
}
.tcf__text {
flex: 1;
z-index: 1;
}
.tcf__wysiwyg {
@apply text-primary-dark;
font-size: 1.25rem;
line-height: 1.5;
}
.tcf__wysiwyg h1 {
margin-bottom: 36px;
margin-top: 36px;
}
.tcf__wysiwyg p {
margin-block: 0 24px;
}
.tcf__wysiwyg p:last-child {
margin-bottom: 0;
}
.tcf__cta {
display: inline-block;
margin-top: 1.5rem;
color: var(--tcf-color-cta);
font-weight: 700;
font-size: 1rem;
text-decoration: none;
transition: opacity 0.2s ease;
}
.tcf__cta:hover,
.tcf__cta:focus-visible {
opacity: 0.75;
text-decoration: underline;
} .tcf__col-right {
flex: 1 1 auto;
min-width: 0;
position: relative;
max-height: 600px;
}
.tcf__image-wrap {
position: relative;
width: 100%;
height: 100%;
min-height: 420px;
@apply mt-20 lg:mt-0;
aspect-ratio: 800 / 600;
}
.tcf__wysiwyg {
padding-bottom: 50px;
} .tcf__swiper {
width: 100%;
height: 100%;
position: absolute;
inset: 0;
}
.tcf__swiper .swiper-wrapper {
height: 100%;
}
.tcf__slide {
position: relative;
height: 100%;
} .tcf__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover; object-position: bottom;
}
.tcf__image-caption {
position: absolute;
right: 16px;
bottom: 12px;
z-index: 2;
margin: 0;
padding: 4px 12px;
background-color: rgba(0, 0, 0, 0.55);
color: #fff;
font-size: 0.75rem;
line-height: 1.4;
text-align: right;
} @media (min-width: 1920px) {
.tcf__col-left {
flex: 0 0 50%;
width: 50%;
}
.tcf__col-right {
flex: 0 0 50%;
width: 50%;
}
.tcf__col-left .tcf__container {
max-width: calc(var(--tcf-container) / 2);
margin-inline: auto 0;
padding-right: 100px;
padding-left: 16px;
}
}
@media (min-width: 1280px) {
.tcf__col-left .tcf__container {
padding-left: 16px;
}
} @media (max-width: 1024px) {
.tcf__wysiwyg {
padding-bottom: 0;
}
.block-text-carrousel-full {
--tcf-section-py: 60px;
--tcf-header-pb:  32px;
}
.tcf__body {
flex-direction: column;
}
.tcf__col-left,
.tcf__col-right {
width: 100%;
flex: 0 0 auto;
}
.tcf__col-left .tcf__container {
max-width: var(--tcf-container);
margin-inline: auto;
padding-inline: 36px;
}
.tcf__image-wrap {
max-height: 400px;
min-height: 400px;
}
.tcf__image {
display: block;
width: 100%;
height: 400px;
object-fit: cover;
object-position: bottom;
}
} @media (max-width: 640px) {
.block-text-carrousel-full {
--tcf-section-py: 48px;
--tcf-header-pb:  24px;
}
.tcf__content-row {
flex-direction: column;
gap: 24px;
}
.tcf__image-wrap {
max-height: 250px;
min-height: 250px;
}
.tcf__image {
height: 250px;
}
.tcf__image-caption {
left: 16px;
}
}
.tcf__content-row::before,
.tcf__content-row::after {
position: absolute;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
z-index: 0;
}
@media (min-width: 1280px) {
.tcf__content-row::after {
bottom: -112px;
left: 40px;
}
} @font-face {
font-family: "TT Norms";
src:
local("TT Norms Regular"),
local("TTNorms-Regular"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Regular.woff2) format("woff2"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Regular.woff) format("woff"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Regular.ttf) format("ttf");
font-weight: 400;
font-style: normal;
font-display: swap;
} @font-face {
font-family: "TT Norms";
src:
local("TT Norms Medium"),
local("TTNorms-Medium"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Medium.woff2) format("woff2"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Medium.woff) format("woff"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Medium.ttf) format("ttf");
font-weight: 500;
font-style: normal;
font-display: swap;
} @font-face {
font-family: "TT Norms";
src:
local("TT Norms Bold"),
local("TTNorms-Bold"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Bold.woff2) format("woff2"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Bold.woff) format("woff"),
url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/fonts/TTNorms-Bold.ttf) format("ttf");
font-weight: 700;
font-style: normal;
font-display: swap;
}
html {
overflow-x: hidden;
}
html, body {
@apply font-primary text-black bg-white;
}
body {
@apply text-base antialiased;
} img, svg, video {
@apply max-w-full h-auto;
}
a {
transition-duration: 0s !important;
} .container-ensa {  }
.section-ensa {
@apply py-10 md:py-16;
}   main h1 {
@apply font-primary text-[36px] leading-[36px] md:text-[60px] md:leading-[60px] font-normal uppercase; }
main h2 {
@apply font-primary text-[25px] leading-[32px] md:text-[36px] md:leading-[40px] font-bold uppercase; }
main h3 {
@apply font-primary text-[22px] leading-[28px] md:text-[32px] md:leading-[36px] font-bold;
}
#cmplz-document .cmplz-subtitle {
@apply font-primary text-[20px] leading-[26px] md:text-[24px] md:leading-[30px] mb-4 font-bold;
}
main h4 {
@apply font-primary text-[20px] leading-[26px] md:text-[24px] md:leading-[30px] font-normal mb-4 lg:mb-[50px];
}
.hero-breadcrumb + #primary #main h1 {
@apply py-8 lg:pt-[45px] lg:pb-[60px] text-[#2D413C] text-[36px] leading-[36px] md:text-[60px] md:leading-[60px];
} 
:where(.wp-block-columns) {
margin-bottom: 36px;
} #cmplz-document p,
#cmplz-document span,
#cmplz-document a,
#cmplz-document ul,
#cmplz-document ol,
#cmplz-document li,
#cmplz-document textarea,
#cmplz-document input,
#cmplz-document button,
#cmplz-document label,
#cmplz-document div,
main p,
main ul,
main ol,
main li,
main a,
main span,
main textarea,
main input,
main button,
main label,
main select,
main option {
@apply font-primary text-[16px] leading-[20px] md:text-[18px] md:leading-[22px] font-normal;
}
.chapeau {
@apply font-primary text-[22px] leading-[28px] md:text-[22px] md:leading-[28px] font-normal;
}
hr {
border-color: #707070;
border-width: 1px;
border-style: solid;
margin-top: 36px;
margin-bottom: 20px;
} main a {
@apply underline underline-offset-2;
}
a:focus {
outline: none !important;
box-shadow: none !important;
}
a:focus-visible {
outline: 2px solid #3b82f6 !important;
outline-offset: 2px !important;
}
#main * {
scroll-margin-top: 104px;
} .rte > *:first-child { margin-top: 0; }
.rte > *:last-child  { margin-bottom: 0; } .wp-block-column p,
.rte p { @apply my-4; } .rte ul,
.rte ol { @apply my-4 pl-6; }
.rte ul { list-style: disc; }
.rte ol { list-style: decimal; }
.rte li { @apply my-2; } .rte h1 { @apply font-primary text-[40px] leading-[46px] font-normal uppercase my-6; }
.rte h2 { @apply font-primary text-[40px] leading-[46px] font-medium my-6; }
.rte h3 { @apply font-primary text-[30px] leading-[36px] font-bold my-5; }
.rte h4 { @apply font-primary text-[24px] leading-[30px] font-normal my-4; } .rte strong { @apply font-bold; }
.rte em { @apply italic; }
main ul,
main ol {
list-style: disc;
list-style-position: inside;
margin: 0;
}
main li {
margin: 0.25rem 0;
} #site-header nav a {
@apply text-[15px] text-black uppercase no-underline m-0;
}
#site-header nav a.active {
@apply font-bold;
} .btn,
.btn:visited {
@apply inline-block w-fit max-w-full mt-4 px-[47px] py-[14px]
font-primary text-xs md:text-[18px] uppercase no-underline transition-colors;
} .btn--primary { @apply bg-vert-light text-black hover:bg-vert hover:!text-white; }
.btn--secondary { @apply bg-vert text-white hover:bg-white hover:text-black; }
.btn--tertiary { @apply bg-vert-light text-black hover:bg-white; } .cta-primary a { @apply btn btn--primary; }
.cta-secondary a { @apply btn btn--secondary; }
.cta-tertiary a { @apply btn btn--tertiary; } .btn--download {
@apply relative bg-[#BFCF5C] text-black hover:text-black;
padding: 16px 20px 16px 60px;
}
.btn--download a {
text-decoration: none;
@apply text-black hover:text-black;
font-size: 18px;
}
.btn--download::before {
content: '';
position: absolute;
left: 18px;
top: 20px;
width: 24px;
height: 20px;
background-size: contain;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.btn--download:hover::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.download-list-item .btn--download:hover::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
} .cta-download a { @apply btn btn--primary btn--download; }
.cta-download a::before {
top: 16px;
}
.cta-download a:hover::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
} .btn--arrow {
@apply inline-flex items-center justify-center min-w-[40px] w-[40px] h-[40px] p-0 border border-[#1a1818] rounded-full;
background: transparent;
background-repeat: no-repeat;
background-position: center;
background-size: 40px 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
} .btn--arrow:hover,
.btn--arrow:focus-visible {
@apply border-white;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
} .btn--arrow:focus-visible {
outline: 2px solid #fff; outline-offset: 3px;
}
.resource-card:hover .btn--download {
background: #2D413C;
}
.cta-arrow a { @apply btn btn--arrow; } input, textarea, select {
@apply w-full max-w-full;
}  .wp-block-create-block-bandeau-block {
@apply text-black;
}
.wp-block-create-block-bandeau-block > .container {
@apply px-9;
}
:where(.wp-block-columns.is-layout-flex) {
@apply gap-4 md:gap-8 xl:gap-[90px];
}
.wp-block-image.w-full img {
width: 100%;
}
.download-list-item {
@apply py-6 border-b border-black;
}
.download-list-item:last-child {
@apply border-b-0;
}
.download-list-item p.btn.btn--download {
margin: 0;
}
.download-list-2 {
@apply !gap-6 md:!gap-[45px] pb-6 md:pb-[46px];
}
.download-list-2:last-of-type {
@apply !border-b-0;
}
.btn--download a {
@apply text-[12px] sm:text-[15px];
}
main a {
text-decoration: none;
font-weight: inherit;
}
main a:hover {
color: inherit !important;
text-decoration: none;
font-weight: inherit;
}
.picto-tel,
.picto-insta,
.picto-linkedin,
.picto-facebook{
padding-left: 55px;
min-height: 36px;
background-size: 35px;
background-repeat: no-repeat;
background-position: left center;
}
.picto-tel {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='35' height='35' viewBox='0 0 35 35'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rectangle_78' data-name='Rectangle 78' width='20' height='20' transform='translate(-0.019 -0.019)' fill='%23fff'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Groupe_467' data-name='Groupe 467' transform='translate(-964 -1345)'%3E%3Ccircle id='Ellipse_99' data-name='Ellipse 99' cx='17.5' cy='17.5' r='17.5' transform='translate(964 1345)'/%3E%3Cg id='Groupe_250' data-name='Groupe 250' transform='translate(972.019 1351.737)'%3E%3Cg id='Groupe_85' data-name='Groupe 85' transform='translate(0 0.281)' clip-path='url(%23clip-path)'%3E%3Cpath id='Tracé_334' data-name='Tracé 334' d='M19.5,15l-3.862-2.315a1.48,1.48,0,0,0-1.843.255c-.373.382-.724.785-1.1,1.168a1.406,1.406,0,0,1-1.733.234,15.914,15.914,0,0,1-3.094-2.42A15.845,15.845,0,0,1,5.436,8.735,1.263,1.263,0,0,1,5.7,7.185L7.038,6.017A1.361,1.361,0,0,0,7.344,4.36l-2-3.588A1.513,1.513,0,0,0,3.24.22H3.218C.542,1.813-.95,3.914.674,7.886a21.8,21.8,0,0,0,4.981,7.219,19.849,19.849,0,0,0,6.276,4.353c3.094,1.38,5.442.658,6.934-1.146.329-.425.68-.828,1.01-1.252A1.39,1.39,0,0,0,19.5,15Z' transform='translate(0 -0.216)' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
.picto-insta {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34.205' height='35.436' viewBox='0 0 34.205 35.436'%3E%3Cg data-name='Groupe 468'%3E%3Cg data-name='Groupe 249'%3E%3Cpath d='M17.103 14.146a3.571 3.571 0 1 0 3.574 3.571 3.57 3.57 0 0 0-3.571-3.571' data-name='Tracé 439'/%3E%3Cpath d='M17.102-.001c-9.445 0-17.1 7.932-17.1 17.718s7.657 17.718 17.1 17.718 17.1-7.932 17.1-17.718S26.548-.001 17.102-.001m11.179 24.546a4.687 4.687 0 0 1-4.588 4.754H10.512a4.687 4.687 0 0 1-4.588-4.754V10.889a4.687 4.687 0 0 1 4.588-4.753h13.181a4.687 4.687 0 0 1 4.588 4.753Z' data-name='Tracé 440'/%3E%3Cpath d='M23.074 8.517H11.132a2.72 2.72 0 0 0-2.614 2.8v12.794a2.72 2.72 0 0 0 2.614 2.8h11.942a2.72 2.72 0 0 0 2.614-2.8v-12.8a2.72 2.72 0 0 0-2.614-2.8m-5.97 15.5a6.315 6.315 0 1 1 5.878-6.3 6.1 6.1 0 0 1-5.878 6.3m5.878-10.993a1.609 1.609 0 1 1 1.5-1.606 1.555 1.555 0 0 1-1.5 1.606' data-name='Tracé 441'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.picto-linkedin {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='35.062' viewBox='0 0 35 35.062'%3E%3Cpath d='M17.5 0A17.531 17.531 0 1 0 35 17.531 17.516 17.516 0 0 0 17.5 0m-5.246 27.413H7.411V12.932h4.843Zm-2.678-15.73A2.683 2.683 0 1 1 12.254 9a2.68 2.68 0 0 1-2.678 2.683m18.388 15.51h-3.681v-8.98a2.85 2.85 0 0 0-.743-2.142 2.49 2.49 0 0 0-1.792-.719 3.41 3.41 0 0 0-2.519 1.11 4.62 4.62 0 0 0-1.081 3.344v7.385h-3.684V12.82h3.358v3.33q1.759-3.628 4.94-3.629a5.78 5.78 0 0 1 3.673 1.2q1.526 1.2 1.526 4.2Z' data-name='Tracé 445'/%3E%3C/svg%3E");
}
.picto-facebook {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='36' viewBox='0 0 35 36'%3E%3Cg data-name='Groupe 469' transform='translate(-956 -1588)'%3E%3Ccircle cx='17.5' cy='17.5' r='17.5' data-name='Ellipse 98' transform='translate(956 1588)'/%3E%3Cpath fill='%23fff' d='M970.747 1623.961v-10.84a.215.215 0 0 0-.215-.215h-3.808a.215.215 0 0 1-.215-.215v-4.352a.215.215 0 0 1 .214-.215l3.811-.023a.215.215 0 0 0 .214-.215v-3.966s-.186-5.188 4.34-5.239 5.4 0 5.4 0v4.1l-3.15.017a1.233 1.233 0 0 0-1.306 1.119v3.931a.215.215 0 0 0 .217.215l4.022-.024a.215.215 0 0 1 .214.249l-.711 4.434a.215.215 0 0 1-.212.181h-3.31a.215.215 0 0 0-.215.215V1624' data-name='Tracé 444'/%3E%3C/g%3E%3C/svg%3E");
}
.encart .picto-tel,
.encart .picto-mail {
padding-left: 55px;
min-height: 28px;
background-size: 28px;
background-repeat: no-repeat;
background-position: left center;
}
.encart .picto-tel {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.087' height='28' viewBox='0 0 27.087 28'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' d='M0 0h27.087v28H0z' data-name='Rectangle 90'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' data-name='Groupe 96'%3E%3Cpath d='M5.412 1.042a.97.97 0 0 1 .853.52l2.672 4.964a.9.9 0 0 1-.184 1.057L6.956 9.2l-.021.019a2.84 2.84 0 0 0-.551 3.4v.019a23 23 0 0 0 3.424 4.625 22.4 22.4 0 0 0 4.352 3.518 2.8 2.8 0 0 0 1.51.436 2.9 2.9 0 0 0 2.132-.936c.258-.274.509-.554.749-.825s.477-.533.717-.789l.006-.006a.93.93 0 0 1 .687-.312.87.87 0 0 1 .467.136l5.207 3.21a.927.927 0 0 1 .231 1.341l-.006.006v.006c-.208.283-.429.556-.66.845s-.458.578-.685.879a5.44 5.44 0 0 1-4.4 2.184 8.8 8.8 0 0 1-3.653-.906 25.6 25.6 0 0 1-8.12-5.823 29.15 29.15 0 0 1-6.459-9.669C.942 8.216.793 6.322 1.41 4.776a7.58 7.58 0 0 1 3.207-3.43h.027L4.9 1.19a.96.96 0 0 1 .513-.15M5.408 0a2 2 0 0 0-1.057.305h-.03C.728 2.518-1.275 5.433.9 10.943a30.4 30.4 0 0 0 6.692 10.018A26.7 26.7 0 0 0 16.018 27a9.8 9.8 0 0 0 4.082 1 6.51 6.51 0 0 0 5.223-2.591c.442-.589.914-1.15 1.351-1.738a1.965 1.965 0 0 0-.5-2.858L21 17.6a1.9 1.9 0 0 0-1.021-.3 1.97 1.97 0 0 0-1.456.649c-.5.531-.973 1.09-1.473 1.621a1.87 1.87 0 0 1-1.371.6 1.77 1.77 0 0 1-.957-.276 21.4 21.4 0 0 1-4.153-3.359 22 22 0 0 1-3.272-4.418 1.8 1.8 0 0 1 .353-2.148l1.8-1.62a1.93 1.93 0 0 0 .416-2.3L7.179 1.074A2.01 2.01 0 0 0 5.412 0Z' data-name='Tracé 342'/%3E%3C/g%3E%3C/svg%3E");
}
.encart .picto-mail {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='20' viewBox='0 0 30 20'%3E%3Cpath d='M1 19.067V1.666L15 14.7l14-13v17.368Zm.833-18.033h26.334L15 13.3ZM0 20h30V0H0Z' data-name='Tracé 629' opacity='.611'/%3E%3C/svg%3E");
}
hr, .wp-block-separator {
border-bottom: 1px solid #707070;
width: calc(100% - 16px);
@apply my-8 md:my-[70px];
} .wp-block-table table th:first-child,
.wp-block-table table td:first-child {
width: 150px;
}
@media (min-width: 1024px) {
.wp-block-table table th:first-child,
.wp-block-table table td:first-child {
width: 300px;
}
}
.wp-block-table table th {
text-align: left;
}
.wp-block-table thead {
border-bottom: 1px solid !important;
}
.mobile-menu-toggle {
display: none;
flex-direction: column;
justify-content: space-around;
width: 30px;
height: 25px;
background: transparent;
border: none;
cursor: pointer;
padding: 0;
z-index: 1000;
}
.mobile-menu-toggle span {
width: 100%;
height: 3px;  transition: all 0.3s ease;
transform-origin: center;
} .mobile-menu-toggle.active span:nth-child(1) {
width: 100%; }
.mobile-menu-toggle.active span:nth-child(2) { }
.mobile-menu-toggle.active span:nth-child(3) { width: 100%;
} :root {
--header-height: 72px;
--secondary-menu-height: 48px;
}  .mobile-menu {
display: none;
position: fixed;
inset: 0;
width: 100%;
background-color: #2D413C !important;
z-index: 999;
transform: translateX(100%);
transition: transform 0.3s ease-in-out;
display: flex;
flex-direction: column;
overflow-y: scroll;
overflow-x: hidden;
}
.mobile-menu.active {
transform: translateX(0);
background-color: #2D413C !important;
}
.mobile-menu-scroll {
flex: 1;
height: 100%;
}
.mobile-menu-root {
height: 100%;
display: flex;
flex-direction: column;
width: 100%;
max-width: 100%;
}
.mobile-menu .mobile-nav {
flex: 1;
}
.mobile-menu-list {
list-style: none;
margin: 0;
padding: 32px 24px 16px;
height: 100%;
overflow-y: auto;
width: 100%;
}
.mobile-menu-list > li:not(:last-child) {
border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}
.mobile-menu-list > li > a {
display: block;
width: 100%;
padding: 18px 0;
color: #B2B2B1;
text-decoration: none;
font-size: 16px;
font-weight: 500;
text-transform: uppercase;
overflow-wrap: anywhere;
}
.mobile-menu-list > li > a:hover,
.mobile-menu-list > li > a:focus {
color: #ffffff;
} .mobile-menu-panel {
position: fixed;
inset: 0;
width: 100%;
max-width: 100%;
background-color: #2D413C;
transform: translateX(100%);
transition: transform 0.3s ease-in-out;
z-index: 10;
display: none;
flex-direction: column;
}
.mobile-menu-panel.is-open {
display: flex;
transform: translateX(0);
}
.mobile-menu-panel__header {
padding: 24px;
border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}
.mobile-menu-panel__body {
flex: 1;
padding: 8px 24px 24px;
overflow-y: auto;
}
.mobile-menu-back {
width: 100%;
text-align: left;
background: transparent;
border: none;
color: #B2B2B1;
font-size: 14px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.04em;
cursor: pointer;
}
.mobile-menu-back:hover,
.mobile-menu-back:focus {
color: #ffffff;
}
.mobile-menu .sub-menu {
list-style: none;
margin: 0;
padding: 0;
}
.mobile-menu .sub-menu li {
border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}
.mobile-menu .sub-menu a {
display: block;
width: 100%;
padding: 18px 0;
color: #B2B2B1;
text-decoration: none;
font-size: 16px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.04em;
overflow-wrap: anywhere;
}
.mobile-menu .sub-menu a:hover,
.mobile-menu .sub-menu a:focus {
color: #ffffff;
}
.mobile-menu-panel-footer {
padding: 16px 24px;
border-top: 1px solid rgba(178, 178, 177, 0.35);
}
.mobile-social-menu {
list-style: none;
margin: 0;
padding: 0;
display: flex;
gap: 12px;
align-items: center;
}
.mobile-social-item {
margin: 0;
} .quick-actions-rail {
position: fixed;
right: 1rem;
top: 50%;
transform: translateY(-50%);
z-index: 100;
display: flex;
flex-direction: column;
gap: 1rem;
}
.quick-action {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.5rem;
padding: 1rem;
background-color: white;
color: #374151;
text-decoration: none;
border-radius: 0.5rem;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
transition: all 0.2s ease;
min-width: 80px;
}
.quick-action:hover {
transform: translateY(-2px);
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
background-color: #f3f4f6;
}
.quick-action-icon {
font-size: 1.5rem;
}
.quick-action-label {
font-size: 0.75rem;
font-weight: 500;
text-align: center;
line-height: 1.2;
} .mobile-quick-actions {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin-top: 1rem;
}
.mobile-quick-action {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1rem;
background-color: rgba(255, 255, 255, 0.1);
color: white;
text-decoration: none;
border-radius: 0.5rem;
transition: background-color 0.2s ease;
}
.mobile-quick-action:hover {
background-color: rgba(255, 255, 255, 0.2);
}
.mobile-quick-action .quick-action-icon {
font-size: 1.25rem;
}
.mobile-quick-action .quick-action-label {
font-size: 0.875rem;
color: white;
} .mobile-menu .mobile-menu-footer {
padding-top: 2rem;
border-top: 1px solid rgba(255, 255, 255, 0.1);
} .mobile-menu .mobile-quick-actions {
display: flex;
flex-wrap: wrap;
gap: 1rem;
margin-top: 1rem;
}
.mobile-menu .mobile-quick-actions .quick-action {
display: inline-flex;
align-items: center;
gap: 0.5rem;
padding: 0.75rem 1rem;
background-color: rgba(255, 255, 255, 0.1);
color: white;
text-decoration: none;
border-radius: 0.5rem;
transition: background-color 0.2s ease;
}
.mobile-menu .mobile-quick-actions .quick-action:hover {
background-color: rgba(255, 255, 255, 0.2);
} body.menu-open {
overflow: hidden;
} #site-header.is-sticky {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
animation: slideDown 0.3s ease-out;
}
#site-header.header-hidden {
transform: translateY(-100%);
transition: transform 0.3s ease-in-out;
}
@keyframes slideDown {
from {
transform: translateY(-100%);
}
to {
transform: translateY(0);
}
} .desktop-nav {
display: flex;
align-items: center;
gap: 1.75rem;
}
.desktop-nav ul {
display: flex;
list-style: none;
margin: 0 !important;
padding: 0;
}
.desktop-nav ul#menu-menu-principal,
.desktop-nav ul#menu-reseaux-sociaux {
@apply gap-2;
}
.desktop-nav a {
color: inherit;
text-decoration: none;
font-weight: 400;
transition: color 0.2s ease;
position: relative;
}
.desktop-nav > ul > li > a {
display: block;
transition: all 0.3s ease-in-out;
transform: translateX(0);
}
#menu-menu-principal > li > a:focus-within,
#menu-menu-principal > li > a:hover,
#menu-menu-principal > li.current-menu-item > a,
#menu-menu-principal > li.current-menu-ancestor > a {
color:  #000000 !important;
font-weight: bold;
} .desktop-nav .menu-item-has-children {
position: relative;
}
.desktop-nav .sub-menu {
display: none;
position: absolute;
top: 100%;
left: 0;
min-width: 514px;
background-color: #F5F5F5 !important;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
padding: 0.5rem 0;
z-index: 100;
}
.desktop-nav .menu-item-has-children:hover > .sub-menu {
display: block;
} .desktop-nav .sub-menu .menu-item-has-children {
position: relative;
}
.desktop-nav .sub-menu .sub-menu {
display: none;
position: absolute;
top: 0;
left: 100%;
min-width: 200px;
background-color: #F5F5F5;
border-radius: 0.5rem;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
padding: 0.5rem 0;
z-index: 110;
}
.desktop-nav .sub-menu .sub-menu.clicked-open {
display: block;
transform: translateX(-100%);
}
.desktop-nav .sub-menu li {
margin: 0;
}
.desktop-nav .sub-menu a {
display: block;
padding: 0.75rem 1.5rem;
color: #374151;
transition: background-color 0.2s ease;
}
.desktop-nav .sub-menu .current_page_parent > a, 
.desktop-nav .sub-menu .current_page_ancestor > a, 
.desktop-nav .sub-menu .current-menu-item > a, 
.desktop-nav .sub-menu > li > a:hover {
background-color: #f3f4f6;
color: #BFCF5C !important;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a {
color: rgba(0, 0, 0, 0.59) !important;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a:hover {
color: #000000 !important;
}  #site-header {
height: 90px;
}
@media (max-width: 1280px) {
#site-header {
height: 72px;
}
}
#site-header > .container, 
#site-header > .container > .flex {
height: 100%;
}
body {
font-variant-ligatures: none;
font-feature-settings: "liga" 0, "clig" 0;
} p, li, a {
font-variant-ligatures: none;
font-feature-settings: "liga" 0, "clig" 0;
}
#menu-reseaux-sociaux-1 .icon-linkedin,
#menu-reseaux-sociaux .icon-linkedin {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17.322 17.322'%3E%3Cpath fill='%23c6c4bf' d='M8.664 0a8.661 8.661 0 1 0 8.661 8.661A8.66 8.66 0 0 0 8.664 0m-2.6 13.543h-2.4V6.389h2.4ZM4.738 5.772a1.325 1.325 0 1 1 1.326-1.326 1.325 1.325 0 0 1-1.326 1.325m9.1 7.662h-1.822V9a1.4 1.4 0 0 0-.368-1.058 1.23 1.23 0 0 0-.884-.357 1.7 1.7 0 0 0-1.247.548 2.28 2.28 0 0 0-.535 1.652v3.648H7.164v-7.1h1.662v1.646a2.69 2.69 0 0 1 2.438-1.793 2.86 2.86 0 0 1 1.818.591 2.49 2.49 0 0 1 .755 2.074Z' data-name='Tracé 332'/%3E%3C/svg%3E");
}
#menu-reseaux-sociaux-1 .icon-facebook,
#menu-reseaux-sociaux .icon-facebook {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.322' height='17.322' viewBox='0 0 17.322 17.322'%3E%3Cpath fill='%23c6c4bf' fill-rule='evenodd' d='M8.661,0 A8.661,8.661 0 1 0 8.661,17.322 A8.661,8.661 0 1 0 8.661,0 Z M7.506,7.160 C7.506,5.413 9.022,4.330 11.115,4.330 C11.765,4.330 12.270,4.388 12.558,4.511 C12.414,5.110 12.125,5.897 11.981,6.373 C11.765,6.315 11.476,6.258 11.115,6.258 C10.393,6.258 10.104,6.553 10.104,7.095 L10.104,8.423 L12.270,8.423 L12.053,10.408 L10.104,10.408 L10.104,15.157 L7.506,15.157 L7.506,10.408 L5.557,10.408 L5.557,8.423 L7.506,8.423 Z'/%3E%3C/svg%3E");
}
#menu-reseaux-sociaux-1 .icon-instagram,
#menu-reseaux-sociaux .icon-instagram {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.75 16.75'%3E%3Cg fill='%23c6c4bf' data-name='Groupe 438'%3E%3Cpath d='M8.371 6.627a1.749 1.749 0 1 0 1.749 1.749 1.75 1.75 0 0 0-1.749-1.749' data-name='Tracé 329'/%3E%3Cpath d='M8.375 0a8.375 8.375 0 1 0 8.375 8.375A8.375 8.375 0 0 0 8.375 0m5.474 11.6a2.254 2.254 0 0 1-2.247 2.247H5.147A2.253 2.253 0 0 1 2.9 11.6V5.147A2.253 2.253 0 0 1 5.147 2.9h6.455a2.253 2.253 0 0 1 2.247 2.247Z' data-name='Tracé 330'/%3E%3Cpath d='M11.299 4.171H5.453a1.284 1.284 0 0 0-1.28 1.28v5.847a1.284 1.284 0 0 0 1.28 1.28h5.846a1.284 1.284 0 0 0 1.28-1.28V5.451a1.284 1.284 0 0 0-1.28-1.28m-2.923 7.082a2.878 2.878 0 1 1 2.878-2.878 2.88 2.88 0 0 1-2.878 2.878m2.878-5.023a.734.734 0 1 1 .734-.734.734.734 0 0 1-.734.734' data-name='Tracé 331'/%3E%3C/g%3E%3C/svg%3E");
}
#menu-reseaux-sociaux-1 .icon-linkedin,
#menu-reseaux-sociaux .icon-linkedin,
#menu-reseaux-sociaux-1 .icon-facebook,
#menu-reseaux-sociaux-1 .icon-instagram,
#menu-reseaux-sociaux .icon-facebook,
#menu-reseaux-sociaux .icon-instagram {
width: 20px;
height: 20px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin: 0;
}
#menu-reseaux-sociaux-1 .icon-linkedin a,
#menu-reseaux-sociaux .icon-linkedin a,
#menu-reseaux-sociaux-1 .icon-facebook a,
#menu-reseaux-sociaux-1 .icon-instagram a,
#menu-reseaux-sociaux .icon-facebook a,
#menu-reseaux-sociaux .icon-instagram a {
text-indent: -9999px;
overflow: hidden;     
white-space: nowrap;  
display: block; 
}
.menu-legal-links a {
@apply text-[#F8F7F2] text-sm;
}
#site-footer .grid {
grid-template-columns: 2fr 260px 160px !important;
@apply gap-[32px] xl:gap-[90px];
}
#site-footer .footer-column a ,
#site-footer .footer-column p {
@apply text-[#F8F7F2] text-sm;
}
#site-footer .footer-content a:hover,
.menu-legal-links a:hover,
#site-footer .footer-column li:not(.cta-tertiary) a:hover {
color: #BFCF5C !important;
}
#menu-menu-footer-secondaire,
#menu-menu-footer-secondaire li {
@apply m-0;
}
#menu-menu-footer-secondaire .cta-tertiary a {
@apply w-full text-center py-2 px-[75px];
@apply !text-black w-fit;
}
.footer-column:last-child .footer-content p {
line-height: 1.75rem !important;
}
@media screen and (max-width: 1023px) {
#site-footer .grid {
grid-template-columns: 1fr 1fr !important;
gap: 16px;
}
#site-footer .footer-column {
grid-column: span 2;
}
#site-footer .footer-column:nth-child(3) {
margin-top: 0;
}
} @media (max-width: 1279px) {
.mobile-menu-toggle {
display: flex;
width: 100%;
}
#site-header .container {
padding-right: 0;
}
.site-logo a {
display: flex;
align-items: center;
}
.site-logo a img {
height: calc(100% - 20px);
}
.desktop-nav {
display: none;
}
.mobile-menu {
display: block;
}
.menu-mobile-btn-container {
display: flex;
flex-flow: column nowrap;
justify-content: flex-start;
align-items: start;
padding: 12px 16px;
}
.menu-mobile-btn-container p {
@apply text-white text-[10px] leading-[16px] font-medium;
}
.mobile-menu-toggle span {
@apply !bg-white;
}
.mobile-menu-toggle span:nth-child(1) {
width: 55%;
}
.mobile-menu-toggle span:nth-child(2) {
}
.mobile-menu-toggle span:nth-child(3) {
width: 55%;
text-align: right;
align-self: end;
}
#site-header {
@apply !bg-white;
} .mobile-menu-panel-footer,
.mobile-nav, 
.mobile-menu-root,
.menu-open #site-header {
@apply bg-vert;
}
.menu-open #site-header {
box-shadow: 5px 0px rgb(45, 65, 60, 1);
}
.mobile-nav a,
.menu-open .menu-item a:hover,
.menu-open .menu-item a:focus,
.menu-open .menu-item a:active,
.menu-open .menu-item a {
@apply !text-white;
}
#menu-reseaux-sociaux-1 .icon-linkedin, 
#menu-reseaux-sociaux .icon-linkedin, 
#menu-reseaux-sociaux-1 .icon-facebook, 
#menu-reseaux-sociaux-1 .icon-instagram, 
#menu-reseaux-sociaux .icon-facebook, 
#menu-reseaux-sociaux .icon-instagram {
width: 32px;
height: 32px;
}
.mobile-social-menu {
justify-content: center;
gap: 24px;
}
}
@media (min-width: 1280px) {
.menu-mobile-btn-container,
.mobile-menu-toggle {
display: none;
}
.desktop-nav {
display: flex;
}
.mobile-menu {
display: none;
}
.search-toggle-btn, 
.search-toggle-btn:hover,
.search-toggle-btn:focus,
.lang-switcher .glink,
.search-toggle-btn:hover,
.search-toggle-btn:focus,
.lang-switcher .glink:hover,
.lang-switcher .glink:focus,
.lang-switcher .glink.gt-current-lang {
color: #000000 !important;
}
} .mobile-menu-toggle:focus-visible,
.submenu-toggle:focus-visible {
outline: 2px solid #3b82f6;
outline-offset: 2px;
} .mobile-menu .mobile-nav li {
opacity: 0;
transform: translateX(-20px);
animation: slideInLeft 0.3s ease-out forwards;
}
.mobile-menu .mobile-nav li:nth-child(1) { animation-delay: 0.1s; }
.mobile-menu .mobile-nav li:nth-child(2) { animation-delay: 0.2s; }
.mobile-menu .mobile-nav li:nth-child(3) { animation-delay: 0.3s; }
.mobile-menu .mobile-nav li:nth-child(4) { animation-delay: 0.4s; }
.mobile-menu .mobile-nav li:nth-child(5) { animation-delay: 0.5s; }
@keyframes slideInLeft {
from {
opacity: 0;
transform: translateX(-20px);
}
to {
opacity: 1;
transform: translateX(0);
}
} @media screen and (min-width: 1280px) { #site-header > .container {
position: relative;
} .menu-item, 
.menu-item a {
position: initial !important;
}
.sub-menu {
transform: none !important;
} #menu-menu-principal {
height: var(--header-height);
}
#menu-menu-principal > li {
height: 100%;
display: block;
width: auto;
margin: 0;
}
#menu-menu-principal > li > a {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
min-width: 80px;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap {
--simple-col-1: 25%;
--simple-col-2: 35%;
--simple-col-3: 45%; opacity: 0;
position: absolute;
left: 0;
right: 0;
top: 100%;
color: #fff;
z-index: 1000;
width: calc(100% - 32px);
margin: 0 auto;
border-radius: 0;
box-shadow: 0 16px 40px rgba(0, 0, 0, 0.10);
min-height: 500px;
padding: 0;
overflow: hidden; opacity: 0;
transform: translateX(-2%);
transition: all .25s ease-in-out;
pointer-events: none;
max-width: calc(80rem + 72px);
padding-left: 1.25rem;
padding-right: 1.25rem;
box-shadow: none !important;
} #menu-menu-principal > li.menu-item-has-children:hover > .simple-submenu-wrap,
#menu-menu-principal > li.menu-item-has-children:focus-within > .simple-submenu-wrap {
opacity: 1;
transform: translateX(0);
pointer-events: auto;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu {
margin: 0;
list-style: none;
position: relative;
top: auto;
right: auto;
left: auto;
background: transparent;
box-shadow: none;
width: 100%;
min-width: 0;
z-index: 1;
display: grid;  grid-template-columns: var(--simple-col-1) var(--simple-col-2) var(--simple-col-3);
column-gap: 16px;
row-gap: 0;
align-items: start;
align-content: start;
grid-auto-rows: 60px;
padding: 80px;
min-height: 520px;
background-color: #FFF !important;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu * {
background-color: #FFF !important;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap .simple-submenu-media {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: calc(var(--simple-col-2) + var(--simple-col-3) - 180px);
overflow: hidden;
pointer-events: none;
transition: width 0.3s ease;
z-index: 1; background-size: cover;
background-position: right center;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap .simple-submenu-media img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap.has-active-submenu .simple-submenu-media {
width: calc(var(--simple-col-3) - 80px);
}  #menu-menu-principal > li.menu-item-has-children:focus-within > .simple-submenu-wrap {
display: block;
opacity: 1;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap.clicked-open {
display: block !important;
opacity: 1 !important;
visibility: visible !important;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li {
display: contents;
margin-bottom: 0;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > a {
@apply font-primary text-base font-bold text-black;
display: flex;
align-items: center;
padding: 16px 0;
text-decoration: none;
grid-column: 1;
position: relative;
z-index: 1;
align-self: start;
height: 100%;
border-bottom: 1px solid #707070; 
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > a:hover {
color: #BFCF5C;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li.is-active a {
color: #BFCF5C;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu {
position: static;
grid-column: 2;
grid-row: 1 / -1;
margin: 0;
padding: 0 90px 0 32px;
list-style: none;
border-left: 1px solid rgba(255, 255, 255, 0.2);
background: none;
box-shadow: none;
display: none;
min-width: 0;
z-index: 1;
height: 100%;
align-self: stretch;
align-content: start;
grid-auto-rows: 70px;
} #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li:focus-within > .sub-menu,
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li.is-active > .sub-menu {
display: block !important;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li {
margin: 0;
height: 100%;
border-left: 1px solid #707070;
padding-left: 32px;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a {
@apply font-primary text-[20px] leading-[20px] font-bold font-medium hover:text-black;
display: block;
color: rgba(0, 0, 0, 0.59);
text-decoration: none;
font-size: 0.875rem;
transition: color 0.2s ease;
height: 100%;
padding: 16px 0;
text-transform: initial;
align-content: center;
border-bottom: 1px solid #707070;
}
#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li:last-child a {
border-bottom: none;
}
} .lang-switcher {
@apply flex flex-row flex-nowrap items-center;
}
.lang-switcher .glink {
@apply inline-flex items-center justify-center text-center font-primary px-[8px] py-[10px] uppercase text-black rounded-full text-[12px] !leading-4 font-medium m-0 no-underline;
text-decoration: none !important;
font-weight: 500 !important;
border: 1px solid transparent;
}
.lang-switcher .glink:first-child {
@apply ml-4;
}
.lang-switcher .glink.gt-current-lang {
@apply border-[#707070];
}
.lang-switcher .glink img,
.lang-switcher .glink span {
display: none;
}
.lang-switcher--mobile .glink {
@apply h-8 w-8 text-white;
} .search-toggle-wrap {
position: relative;
display: flex;
align-items: center;
}
.search-toggle-btn {
display: flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
background: transparent;
border: none;
cursor: pointer;
color: inherit;
padding: 0;
flex-shrink: 0;
transition: opacity 0.2s ease;
}
.search-toggle-btn:hover,
.search-toggle-btn:focus-visible { outline: none;
}  body.search-modal-open {
overflow: hidden;
} .search-toggle-wrap.is-open::before {
content: "";
position: fixed;
inset: 0;
background: rgba(38, 38, 38, 0.85);
z-index: 9998;
animation: header-search-overlay-in 0.2s ease;
}
@keyframes header-search-overlay-in {
from { opacity: 0; }
to   { opacity: 1; }
} .header-search-form {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.97);
display: flex;
align-items: center;
gap: 8px;
width: min(560px, calc(100vw - 32px));
background: white;
border: 1px solid #707070;
border-radius: 4px;
padding: 8px 8px 8px 16px;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
white-space: nowrap;
z-index: 9999;
}
.search-toggle-wrap.is-open .header-search-form {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translate(-50%, -50%) scale(1); 
border-radius: 0;
}
.header-search-input {
flex: 1;
border: none;
outline: none;
padding: 10px 4px; font-size: 16px;
background: transparent;
color: #1a1a1a;
min-width: 0;
}
.header-search-input::placeholder {
color: #999;
}
.header-search-submit {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
background: #2D413C;
border: none;
cursor: pointer;
color: #fff;
flex-shrink: 0;
transition: background 0.2s ease;
}
.header-search-submit:hover,
.header-search-submit:focus-visible {
background: #1f2e2a;
outline: none;
} .mobile-search-wrap {
padding: 16px 24px;
border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}
.mobile-search-form {
display: flex;
align-items: center;
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(178, 178, 177, 0.35);
}
.mobile-search-input {
flex: 1;
background: transparent !important;
border: none !important;
outline: none;
padding: 10px 14px;
color: white !important;
font-size: 15px;
min-width: 0;
}
.mobile-search-input::placeholder {
color: #FFF;
}
.mobile-search-submit {
display: flex;
align-items: center;
justify-content: center;
background: transparent;
border: none;
padding: 10px 12px;
cursor: pointer; color: #FFF !important;
flex-shrink: 0;
transition: color 0.2s ease;
}
.mobile-search-submit:hover {
color: white;
}
.complex-menu-banner {
background-color: #234C9B;
color: white;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
height: 50px; z-index: 40; }
@media (max-width: 768px) {
.complex-menu-banner {
height: auto;
}
} .is-sticky-header-container.is-sticky {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 50;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
transition: transform 0.3s ease;
} .is-sticky-header-container.is-sticky #site-header {
position: relative;
z-index: 1;
} header#site-header.is-sticky {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 50;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
transition: transform 0.3s ease;
} .secondary-nav {
height: 100%;
margin: 0;
}
.secondary-nav ul {
height: 100%;
padding: 0;
list-style: none;
gap: 16px;
list-style: none;
justify-content: center;
align-items: center;
margin: auto;
row-gap: 0;
}
.secondary-menu-item {
display: inline-block;
margin: 0;
}
.secondary-menu-item a {
color: white;
text-decoration: none;
padding: 0.5rem 0;
display: block;
transition: opacity 0.2s ease;
}
.secondary-menu-item a:hover {
opacity: 0.8;
} .complex-menu-item {
position: relative;
}
.complex-submenu {
position: absolute;
top: 100%;
left: 0;
right: 0;
background: white;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: all 0.3s ease;
z-index: 100;
pointer-events: none;
padding: 32px 6%;
margin: 0;
list-style: none;
display: grid;
grid-template-columns: minmax(220px, 28%) minmax(240px, 34%) minmax(260px, 38%);
column-gap: 32px;
row-gap: 0;
min-height: 420px;
overflow: hidden;
}
.complex-submenu::after {
content: "";
grid-column: 3;
grid-row: 1 / -1;
background-image: var(--complex-menu-image, url(//www.lareunion-archi.fr/wp-content/themes/ensa-theme/resources/img/Bande_logo_Europe.png));
background-size: cover;
background-position: center;
border-left: 1px solid #e5e7eb;
pointer-events: none;
}
.complex-menu-item.is-open > .complex-submenu,
.complex-menu-item:focus-within > .complex-submenu {
opacity: 1;
visibility: visible;
transform: translateY(0);
pointer-events: auto;
}
.complex-submenu > li {
display: contents;
}
.complex-submenu > li > a {
grid-column: 1;
padding: 12px 0;
border-bottom: 1px solid #e5e7eb;
color: #111827;
text-decoration: none;
font-size: 0.875rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.02em;
display: block;
transition: color 0.2s ease;
position: relative;
z-index: 1;
}
.complex-submenu > li > a:hover,
.complex-submenu > li > a:focus,
.complex-submenu > li.is-active > a {
color: #234C9B;
}
.complex-submenu > li > .sub-menu {
grid-column: 2;
grid-row: 1 / -1;
margin: 0;
padding: 0 0 0 32px;
list-style: none;
border-left: 1px solid #e5e7eb;
display: none;
position: relative;
z-index: 1;
}
.complex-submenu > li.is-active > .sub-menu {
display: block;
}
.complex-submenu > li > .sub-menu > li {
margin: 0;
}
.complex-submenu > li > .sub-menu > li > a {
display: block;
padding: 8px 0;
color: #6b7280;
text-decoration: none;
font-size: 0.875rem;
transition: color 0.2s ease;
}
.complex-submenu > li > .sub-menu > li > a:hover,
.complex-submenu > li > .sub-menu > li > a:focus {
color: #234C9B;
} @media (max-width: 1023px) {
.complex-submenu {
grid-template-columns: 1fr;
padding: 24px;
min-height: auto;
}
.complex-submenu > li > .sub-menu {
grid-column: 1;
grid-row: auto;
padding: 12px 0 0;
border-left: none;
}
.complex-submenu::after {
display: none;
}
} .is-sticky-header-container.is-sticky,
header#site-header.is-sticky {
transition: transform 0.3s ease;
} .is-sticky-header-container.is-sticky.header-hidden,
header#site-header.is-sticky.header-hidden,
.is-sticky-header-container.is-sticky[style*="translateY(-100%)"],
header#site-header.is-sticky[style*="translateY(-100%)"] {
transform: translateY(-100%);
} .is-sticky-header-container.is-sticky.header-visible,
header#site-header.is-sticky.header-visible,
.is-sticky-header-container.is-sticky[style*="translateY(0)"],
header#site-header.is-sticky[style*="translateY(0)"] {
transform: translateY(0);
}
.blog-listing {
padding-top: 0;
} .blog-hero {
background-color: #111827; color: #ffffff;
padding: 3rem 0 2rem;
}
.blog-hero__container {
max-width: 1280px;
margin: 0 auto;
padding: 0 1.5rem;
}
.blog-hero__title {
font-size: 2.25rem; font-weight: 700; margin: 0 0 2rem 0;
text-align: center;
}
@media (min-width: 768px) {
.blog-hero__title {
text-align: left;
font-size: 3rem; }
} .blog-filters-wrapper {
margin-top: 1.5rem;
}
.blog-filters-container {
display: flex;
flex-direction: column;
gap: 1rem;
align-items: flex-start;
}
@media (min-width: 768px) {
.blog-filters-container {
flex-direction: row;
align-items: center;
gap: 1.5rem;
}
}
.blog-filters__label {
font-size: 0.875rem; font-weight: 500;
color: #d1d5db; white-space: nowrap;
}
.blog-filters {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
list-style: none;
margin: 0;
padding: 0;
}
.blog-filters .filtre {
cursor: pointer;
transition: all 0.2s ease;
}
.blog-filters .label-category {
display: inline-block;
padding: 0.5rem 1rem;
background-color: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 0.375rem;
font-size: 0.875rem;
font-weight: 500;
color: #ffffff;
transition: all 0.2s ease;
}
.blog-filters .filtre:hover .label-category {
background-color: rgba(255, 255, 255, 0.2);
border-color: rgba(255, 255, 255, 0.3);
}
.blog-filters .filtre.active .label-category {
background-color: var(--accent-color); border-color: var(--accent-color);
color: #ffffff;
}
.blog-filters .count {
opacity: 0.7;
font-size: 0.75rem;
} .blog-content {
padding: 4rem 0;
}
.blog-content__container {
max-width: 1280px;
margin: 0 auto;
padding: 0 1.5rem;
} .blog-grid {
display: grid;
gap: 2rem;
grid-template-columns: 1fr;
}
@media (min-width: 768px) {
.blog-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1024px) {
.blog-grid {
grid-template-columns: repeat(3, 1fr);
}
} .blog-card {
background-color: #ffffff;
border-radius: 1rem;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
border: 1px solid #e5e7eb;
overflow: hidden;
transition: all 0.2s ease;
height: fit-content;
}
.blog-card:hover {
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
transform: translateY(-4px);
}
.blog-card__image {
position: relative;
width: 100%;
height: 12rem;
overflow: hidden;
}
.blog-card__image-link {
display: block;
width: 100%;
height: 100%;
}
.blog-card__thumbnail {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.2s ease;
}
.blog-card:hover .blog-card__thumbnail {
transform: scale(1.05);
}
.blog-card__content {
padding: 1.5rem;
}
.blog-card__meta {
display: flex;
flex-direction: column;
gap: 0.5rem;
margin-bottom: 1rem;
}
@media (min-width: 640px) {
.blog-card__meta {
flex-direction: row;
justify-content: space-between;
align-items: center;
}
}
.blog-card__date {
font-size: 0.875rem;
color: #6b7280;
font-weight: 500;
}
.blog-card__categories {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.blog-card__category {
font-size: 0.75rem;
font-weight: 600;
color: var(--accent-color);
background-color: var(--accent-opacity-10);
padding: 0.25rem 0.5rem;
border-radius: 0.375rem;
}
.blog-card__title {
margin: 0 0 0.75rem 0;
}
.blog-card__title-link {
font-size: 1.25rem;
font-weight: 600;
color: #111827;
text-decoration: none;
line-height: 1.3;
transition: color 0.2s ease;
}
.blog-card__title-link:hover {
color: var(--accent-color);
text-decoration: none;
}
.blog-card__excerpt {
color: #4b5563;
line-height: 1.6;
margin-bottom: 1rem;
}
.blog-card__excerpt p {
margin: 0;
font-size: 0.875rem;
}
.blog-card__footer {
margin-top: auto;
}
.blog-card__read-more {
display: inline-flex;
align-items: center;
gap: 0.25rem;
font-size: 0.875rem;
font-weight: 600;
color: var(--accent-color);
text-decoration: none;
transition: all 0.2s ease;
}
.blog-card__read-more:hover {
color: var(--accent-hover);
text-decoration: none;
gap: 0.5rem;
} .blog-pagination {
margin-top: 3rem;
text-align: center;
}
.blog-pagination .page-numbers {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 2.5rem;
height: 2.5rem;
margin: 0 0.25rem;
padding: 0.5rem;
border: 1px solid #d1d5db;
border-radius: 0.375rem;
background-color: #ffffff;
color: #374151;
text-decoration: none;
font-weight: 500;
transition: all 0.2s ease;
}
.blog-pagination .page-numbers:hover {
background-color: #f3f4f6;
border-color: #9ca3af;
text-decoration: none;
}
.blog-pagination .page-numbers.current {
background-color: var(--accent-color);
border-color: var(--accent-color);
color: #ffffff;
}
.blog-pagination .page-numbers.prev,
.blog-pagination .page-numbers.next {
padding: 0.5rem 1rem;
font-weight: 600;
} .blog-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
}
.blog-loader {
background-color: #ffffff;
padding: 2rem;
border-radius: 0.5rem;
text-align: center;
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.spinner {
width: 2rem;
height: 2rem;
border: 2px solid #e5e7eb;
border-top: 2px solid var(--accent-color);
border-radius: 50%;
animation: spin 1s linear infinite;
margin: 0 auto 1rem;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
article.single-post {
padding-top: 50px;
}
@media (min-width: 1024px) { article.single-post {
display: grid;
grid-template-columns: 450px 1fr;
gap: 36px;
padding-top: 120px;
}
}
.single-post__breadcrumb {
background-color: #111827;
color: #ffffff;
padding: 1rem 0;
}
.single-post__breadcrumb-container {
max-width: 1280px;
margin: 0 auto;
padding: 0 1.5rem;
}
.single-post__back-link {
color: #ffffff;
text-decoration: none;
font-weight: 500;
transition: color 0.2s ease;
}
.single-post__back-link:hover {
color: #d1d5db;
text-decoration: none;
}
.single-post__meta-wrapper {
background-color: #f9fafb;
padding: 1rem 0;
}
.single-post__meta-container {
max-width: 800px;
margin: 0 auto;
padding: 0 1.5rem;
display: flex;
flex-direction: column;
gap: 0.5rem;
}
@media (min-width: 768px) {
.single-post__meta-container {
flex-direction: row;
justify-content: space-between;
align-items: center;
}
}
.single-post__categories {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.single-post__category {
font-size: 0.75rem;
font-weight: 600;
color: var(--accent-color);
background-color: var(--accent-opacity-10);
padding: 0.375rem 0.75rem;
border-radius: 0.375rem;
border: 1px solid var(--accent-opacity-30);
}
.single-post__date {
font-size: 20px;
color: #6b7280;
font-weight: 500;
text-transform: uppercase;
margin-top: 16px;
}
.single-post__header {
padding: 0 0 2rem;
}
.single-post__title {
font-size: 2rem;
font-weight: 700;
line-height: 1.2;
color: #111827;
margin: 0;
}
@media (min-width: 768px) {
.single-post__title {
font-size: 40px;
}
}
.single-post__featured-image {
margin-bottom: 3rem;
}
.single-post__thumbnail {
width: 100%;
height: auto;
border-radius: 0.75rem;
box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
.single-post__content {
margin-bottom: 3rem;
min-width: 0;
}
.single-post__content-container {
margin: 0 auto;
min-width: 0;
} .single-post__content-container > * {
margin-bottom: 1.5rem;
}
.single-post__content-container > *:last-child {
margin-bottom: 0;
}
.single-post__content-container h2,
.single-post__content-container h3,
.single-post__content-container h4 {
font-weight: 600;
color: #111827;
margin-top: 2rem;
margin-bottom: 1rem;
line-height: 1.3;
}
.single-post__content-container h2 {
font-size: 1.875rem;
}
.single-post__content-container h3 {
font-size: 1.5rem;
}
.single-post__content-container h4 {
font-size: 1.25rem;
}
.single-post__content-container ul,
.single-post__content-container ol {
padding-left: 1.5rem;
}
.single-post__content-container li {
margin-bottom: 0.5rem;
line-height: 1.6;
}
.single-post__content-container a {
color: var(--accent-color);
text-decoration: none !important;
}
.single-post__content-container a:hover {
color: var(--accent-hover);
}
.single-post__content-container .block-gallery-slider {
padding: 32px 0 0 0;
}
.single-post__content-container blockquote {
border-left: 4px solid #e5e7eb;
padding-left: 1rem;
margin: 2rem 0;
font-style: italic;
color: #6b7280;
} .single-post__share {
background-color: #f3f4f6;
padding: 2rem 0;
}
.single-post__share-container {
max-width: 1280px;
margin: 0 auto;
padding: 0 1.5rem;
}
.single-post__share-content {
display: flex;
flex-direction: column;
gap: 1rem;
align-items: center;
}
@media (min-width: 768px) {
.single-post__share-content {
flex-direction: row;
justify-content: center;
gap: 1.5rem;
}
}
.single-post__share-label {
font-weight: 600;
color: #374151;
}
.single-post__share-links {
display: flex;
gap: 1rem;
}
.single-post__share-link {
display: flex;
align-items: center;
justify-content: center;
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
background-color: #6b7280;
color: #ffffff;
text-decoration: none;
transition: all 0.2s ease;
}
.single-post__share-link:hover {
transform: translateY(-2px);
text-decoration: none;
}
.single-post__share-link--facebook:hover {
background-color: #1877f2;
}
.single-post__share-link--linkedin:hover {
background-color: #0a66c2;
}
.single-post__share-link--twitter:hover {
background-color: #1da1f2;
}
.single-post__share-icon {
width: 1.25rem;
height: 1.25rem;
} @media (max-width: 640px) {
.blog-hero {
padding: 2rem 0 1.5rem;
}
.blog-hero__title {
font-size: 1.875rem;
}
.blog-content {
padding: 2rem 0;
}
.blog-grid {
gap: 1.5rem;
}
.single-post__header {
padding: 2rem 0 1.5rem;
}
.single-post__title {
font-size: 1.75rem;
}
} @media (prefers-reduced-motion: reduce) {
.blog-card,
.blog-card__thumbnail,
.blog-card__read-more,
.single-post__share-link {
transition: none;
}
.blog-card:hover,
.single-post__share-link:hover {
transform: none;
}
.blog-card:hover .blog-card__thumbnail {
transform: none;
}
.spinner {
animation: none;
}
}
#site-header {
@apply bg-white shadow-md transition-all duration-300;
}
#site-header.sticky {
position: fixed;
top: 0;
z-index: 50;
}
#site-header.sticky + .mobile-menu + #main {
padding-top: 90px;
}
@media (max-width: 1280px) {
#site-header.sticky + .mobile-menu + #main {
padding-top: 72px;
}
} .site-logo {
@apply h-full;
}
.site-logo img {
@apply h-full w-auto object-contain;
}
.site-logo a {
@apply h-full block transition-opacity duration-200;
} .main-nav ul {
@apply flex items-center space-x-8;
}
.main-nav li {
@apply relative;
}
.main-nav a {
@apply text-gray-700 hover:text-primary transition-colors duration-200 font-medium py-2 block relative;
}
.main-nav a::after {
@apply absolute bottom-0 left-0 w-0 h-0.5 bg-primary transition-all duration-200;
content: '';
}
.main-nav a:hover::after {
@apply w-full;
} .main-nav .sub-menu {
@apply absolute top-full left-0 bg-white shadow-lg rounded-md py-2 min-w-48 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 z-50 border border-gray-100;
}
.main-nav .sub-menu li {
@apply block;
}
.main-nav .sub-menu a {
@apply px-4 py-2 text-sm hover:bg-gray-50;
}
.main-nav .sub-menu a::after {
@apply hidden;
} .main-nav .menu-item-has-children {
position: relative;
}
.main-nav .menu-item-has-children > a::after {
@apply ml-1 inline-block w-0 h-0 border-l-4 border-r-4 border-t-4 border-transparent border-t-gray-400 transition-transform duration-200;
content: '';
}
.main-nav .menu-item-has-children:hover > a::after {
@apply border-t-primary transform rotate-180;
} .legacy-mobile-menu-toggle {
@apply p-2 text-gray-700 hover:text-primary transition-colors rounded-md;
}
.legacy-mobile-menu {
@apply border-t border-gray-200 bg-white;
}
.legacy-mobile-menu ul {
@apply py-4 space-y-1;
}
.legacy-mobile-menu li {
@apply block;
}
.legacy-mobile-menu a {
@apply block py-3 px-4 text-gray-700 hover:text-primary hover:bg-gray-50 transition-colors duration-200 rounded-md mx-2;
} #site-footer {
@apply bg-gray-900 text-white;
}
.footer-column h3 {
@apply text-lg font-semibold mb-4 text-primary;
}
.footer-column ul {
@apply space-y-2;
}
.footer-column a {
@apply text-gray-300 hover:text-white transition-colors duration-200 block py-1;
}
.footer-column a:hover {
@apply text-white;
} .acces-rapide {
@apply block w-12 h-12 bg-primary hover:bg-primary-dark text-white rounded-full shadow-lg flex items-center justify-center transition-all duration-200 hover:scale-110;
}
.acces-rapide:hover {
@apply shadow-xl;
}
.acces-rapide img {
@apply w-6 h-6;
}
.acces-rapide svg {
@apply w-6 h-6;
}   .card {
@apply bg-white rounded-lg shadow-md overflow-hidden hover:shadow-lg transition-shadow duration-200;
}
.card-header {
@apply p-6 border-b border-gray-200 bg-gray-50;
}
.card-body {
@apply p-6;
}
.card-footer {
@apply p-6 border-t border-gray-200 bg-gray-50;
} .form-group {
@apply mb-4;
}
.form-label {
@apply block text-sm font-medium text-gray-700 mb-2;
}
.form-input {
@apply w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-primary focus:border-transparent transition-all duration-200;
}
.form-input:focus {
@apply outline-none;
}
.form-textarea {
@apply w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-primary focus:border-transparent transition-all duration-200 resize-y;
min-height: 100px;
}
.form-select {
@apply w-full px-4 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-primary focus:border-transparent transition-all duration-200;
}
.form-button {
@apply bg-primary hover:bg-primary-dark text-white font-semibold py-2 px-6 rounded transition-all duration-200;
} .container {
@apply mx-auto px-9;
max-width: calc(80rem + 72px);
}
.section-padding {
@apply py-16;
}
.text-gradient {
@apply bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent;
} @media (max-width: 768px) {
.main-nav {
@apply hidden;
}
.legacy-mobile-menu-toggle {
@apply block;
}
.container {
@apply px-9;
}
.section-padding {
@apply py-12;
}
}
@media (min-width: 769px) {
.legacy-mobile-menu-toggle {
@apply hidden;
}
.legacy-mobile-menu {
@apply hidden;
}
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes slideInRight {
from {
opacity: 0;
transform: translateX(30px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
.animate-fade-in-up {
animation: fadeInUp 0.6s ease-out;
}
.animate-slide-in-right {
animation: slideInRight 0.6s ease-out;
} .focus-visible:focus {
@apply outline-none ring-2 ring-primary ring-offset-2;
} ::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
@apply bg-gray-100;
}
::-webkit-scrollbar-thumb {
@apply bg-gray-400 rounded-full;
}
::-webkit-scrollbar-thumb:hover {
@apply bg-gray-500;
} @media print {
.legacy-mobile-menu-toggle,
.legacy-mobile-menu,
.acces-rapide {
@apply hidden;
}
#site-header {
@apply static shadow-none;
}
.btn-primary,
.btn-secondary,
.btn-outline {
@apply border border-gray-400 text-gray-800 bg-transparent;
}
} .paired-rows {
width: 100%;
} :root {
--pr-line: #707070;
--pr-stroke: 1px; --pr-inset-x: 36px; --pr-pad-y: 50px; --pr-mid-pad: 18px; --pr-cross-gap: 14px; --pr-pad-bottom: 50px;
} .paired-rows .wp-block-columns {
position: relative;
gap: 0;
margin: 0;
} .paired-rows .wp-block-columns > .wp-block-column {
position: relative;
margin: 0 !important;
min-width: 0;
} .paired-rows .wp-block-columns > .wp-block-column > .wp-block-group,
.paired-rows .wp-block-columns > .wp-block-column > .wp-block-group__inner-container {
height: 100%;
}
.paired-rows .wp-block-columns h3 {
@apply font-primary text-[15px] leading-[20px] md:text-[22px] md:leading-[28px] font-bold uppercase;
} @media (min-width: 768px) {
.paired-rows .wp-block-columns {
align-items: stretch;
}
.paired-rows .wp-block-columns > .wp-block-column {
padding-top: var(--pr-pad-y);
padding-bottom: var(--pr-pad-bottom);
} .paired-rows .wp-block-columns > .wp-block-column:first-child {
padding-left: 0;
padding-right: calc(var(--pr-inset-x) + var(--pr-mid-pad));
} .paired-rows .wp-block-columns > .wp-block-column:last-child {
padding-left: calc(var(--pr-inset-x) + var(--pr-mid-pad));
padding-right: 0;
} .paired-rows .wp-block-columns + .wp-block-columns > .wp-block-column::before {
content: "";
position: absolute;
top: 0; left: 0;
right: 36px;
height: var(--pr-stroke);
background: var(--pr-line);
pointer-events: none;
}
.paired-rows .wp-block-columns + .wp-block-columns > .wp-block-column + .wp-block-column::before {
left: 36px;
right: 0;
} .paired-rows .wp-block-columns > .wp-block-column:first-child::after {
content: "";
position: absolute;
right: 0;
top: var(--pr-pad-y);
bottom: var(--pr-pad-y);
width: var(--pr-stroke);
background: var(--pr-line);
pointer-events: none;
}
.paired-rows .wp-block-columns > .wp-block-column:last-child::after {
content: "";
position: absolute;
left: 0;
top: var(--pr-pad-y);
bottom: var(--pr-pad-y);
width: var(--pr-stroke);
background: var(--pr-line);
pointer-events: none;
} .paired-rows .wp-block-columns + .wp-block-columns > .wp-block-column::after {
top: calc(var(--pr-pad-y) + var(--pr-cross-gap));
} .paired-rows .wp-block-columns > .wp-block-column > *:first-child {
margin-top: 0;
}
.paired-rows .wp-block-columns > .wp-block-column > *:last-child {
margin-bottom: 0;
}
.paired-rows .wp-block-columns > .wp-block-column:last-child::after {
display: none;
}
} @media (max-width: 767px) {
.paired-rows .wp-block-columns {
gap: 0;
margin: 0;
}
.paired-rows .wp-block-columns > .wp-block-column {
padding: 36px 0 16px 0;
margin: 0 !important;
border-top: 1px solid var(--pr-line);
} .paired-rows .wp-block-columns > .wp-block-column::before,
.paired-rows .wp-block-columns > .wp-block-column::after {
content: none !important;
} .paired-rows .wp-block-columns.is-layout-flex {
gap: 0 !important;
}
.paired-rows .wp-block-columns.is-layout-grid {
gap: 0 !important;
}
.paired-rows .wp-block-columns > .wp-block-column > *:first-child {
margin-top: 0;
}
.paired-rows .wp-block-columns > .wp-block-column > *:last-child {
margin-bottom: 0;
}
}
.wp-block-embed-youtube iframe {
width: 100%;
aspect-ratio: 16 / 9;
height: auto;
}
.flex-vertical-center {
display: flex;
flex-flow: column nowrap;
justify-content: center;
}
.contact-block {
padding: 4rem 0;
background-color: #f9fafb;
} .contact-block .text-center h2 {
color: #111827;
font-size: 2.25rem;
font-weight: 700;
margin-bottom: 1rem;
line-height: 1.2;
}
.contact-block .text-center p {
color: #6b7280;
font-size: 1.25rem;
max-width: 42rem;
margin: 0 auto;
line-height: 1.6;
} .contact-block .grid {
display: grid;
gap: 3rem;
}
.contact-block .lg\\:grid-cols-2 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
@media (min-width: 1024px) {
.contact-block .lg\\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
} .contact-form {
width: 100%;
}
.contact-form .bg-white {
background: white;
border-radius: 0.5rem;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
padding: 2rem;
}
.contact-form h3 {
color: #111827;
font-size: 1.5rem;
font-weight: 600;
margin-bottom: 1.5rem;
line-height: 1.4;
} .contact-info {
width: 100%;
}
.contact-info .bg-white {
background: white;
border-radius: 0.5rem;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
padding: 2rem;
}
.contact-info h3 {
color: #111827;
font-size: 1.5rem;
font-weight: 600;
margin-bottom: 1.5rem;
line-height: 1.4;
} .contact-info .space-y-6 > div {
display: flex;
align-items: flex-start;
gap: 1rem;
margin-bottom: 1.5rem;
}
.contact-info .space-y-6 > div:last-child {
margin-bottom: 0;
}
.contact-info .flex-shrink-0 {
flex-shrink: 0;
font-size: 1.5rem;
width: 2rem;
text-align: center;
}
.contact-info .flex-1 h4 {
color: #111827;
font-weight: 500;
margin-bottom: 0.25rem;
line-height: 1.4;
}
.contact-info .flex-1 a {
color: #3b82f6;
font-weight: 500;
transition: color 0.2s ease;
text-decoration: none;
}
.contact-info .flex-1 a:hover {
color: #1d4ed8;
}
.contact-info .flex-1 p {
color: #6b7280;
line-height: 1.6;
margin: 0;
} .contact-info .border-t {
border-top: 1px solid #e5e7eb;
margin-top: 2rem;
padding-top: 1.5rem;
}
.contact-info .border-t h4 {
color: #111827;
font-weight: 500;
margin-bottom: 0.75rem;
line-height: 1.4;
}
.contact-info .border-t p {
color: #6b7280;
line-height: 1.6;
margin: 0;
} .contact-block .mt-12 {
margin-top: 3rem;
}
.contact-block .bg-white.rounded-lg.shadow-lg {
background: white;
border-radius: 0.5rem;
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
overflow: hidden;
}
.contact-block .aspect-w-16.aspect-h-9 {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56.25%; }
.contact-block .aspect-w-16.aspect-h-9 iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
} .contact-block .max-w-2xl {
max-width: 42rem;
margin: 0 auto;
}
.contact-block .max-w-4xl {
max-width: 56rem;
margin: 0 auto;
} .contact-form,
.contact-info {
opacity: 0;
animation: fade-in-up 0.6s ease-out forwards;
}
.contact-form {
animation-delay: 0.1s;
}
.contact-info {
animation-delay: 0.3s;
}
@keyframes fade-in-up {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
} @media (max-width: 768px) {
.contact-block .text-center h2 {
font-size: 2rem;
}
.contact-block .text-center p {
font-size: 1.125rem;
}
.contact-form .bg-white,
.contact-info .bg-white {
padding: 1.5rem;
}
.contact-form h3,
.contact-info h3 {
font-size: 1.25rem;
}
}
@media (max-width: 480px) {
.contact-block .text-center h2 {
font-size: 1.75rem;
}
.contact-block .text-center p {
font-size: 1rem;
}
.contact-form .bg-white,
.contact-info .bg-white {
padding: 1.25rem;
}
}
#site-footer {
margin-top: auto; } .footer-column {
display: flex;
flex-direction: column;
}
.footer-content {
color: #e5e7eb;
}
.footer-content h3 {
color: white;
font-size: 1.125rem;
font-weight: 600;
margin-bottom: 1rem;
}
.footer-content p {
color: #d1d5db;
line-height: 1.6;
} .footer-menu {
margin-top: 1rem;
}
.footer-menu-list {
list-style: none;
margin: 0;
padding: 0;
}
.footer-menu-item {
margin: 0;
}
.footer-menu-link {
color: #d1d5db;
text-decoration: none;
display: block;
padding: 0.25rem 0;
transition: color 0.2s ease;
}
.footer-menu-link:hover {
color: #3b82f6; } .footer-bandeau {
background-color: #111827; border-top: 1px solid #374151; }
.footer-bandeau-content {
color: #e5e7eb;
}
.footer-bandeau-content img {
max-height: 4rem;
width: auto;
}
.footer-bandeau-content .text-sm {
font-size: 0.875rem;
}
.footer-bandeau-content .text-xs {
font-size: 0.75rem;
}
.footer-bandeau-content .font-semibold {
font-weight: 600;
}
.footer-bandeau-content .text-blue-600 {
color: #2563eb;
} .footer-copyright {
border-top: 1px solid #222222; 
}
.footer-copyright p {
margin: 0;
} @media (max-width: 767px) {
.footer-bandeau-content .flex {
flex-direction: column;
align-items: center;
text-align: center;
}
.footer-bandeau-content .space-x-8 > * + * {
margin-left: 0;
margin-top: 1rem;
}
.footer-bandeau-content .space-x-4 > * + * {
margin-left: 0;
margin-top: 0.5rem;
}
#site-footer .footer-column:last-child .footer-content p {
font-size: 16px;
}
} .footer-column + .footer-column {
margin-top: 2rem;
}
@media (min-width: 768px) {
.footer-column + .footer-column {
margin-top: 0;
}
} .footer-content a {
text-decoration: none !important;
} .footer-content img {
height: auto;
width: auto;
justify-self: start;
}
@media screen and (max-width: 640px) {
.footer-content .grid img {
max-height: 80px;
margin: auto;
max-width: 120px;
}
}
@media screen and (min-width: 1024px) {
.footer-content img {
max-width: 88px;
}
.footer-content img:first-child {
max-width: 100px;
}
#site-footer hr {
display: none;
}
} .footer-content ul,
.footer-content ol {
margin: 0.5rem 0;
padding-left: 1.5rem;
}
.footer-content li {
margin: 0.25rem 0;
}
.encart {
padding: 55px 45px;
}
.encart:not([class*="bg-"]) {
background-color: #FFF;
}
.encart h3 {
@apply font-primary text-[22px] leading-[30px] font-normal mb-5 uppercase max-w-[354px];
}
.encart p {
line-height: 32px;
}
.post-410 h1 {
padding-bottom: 0 !important;
max-width: 612px;
}
.error404 main h1 {
font-size: 317px;
line-height: 348px;
color: #000;
margin: auto;
text-align: center;
}
.error404 main p {
font-size: 66px;
line-height: 66px;
color: #000;
margin: auto;
text-align: center;
}
.error404 main a {
@apply btn btn--primary text-center mx-auto !mt-[43px];
}
.main404 {
min-height: calc(100vh - 405px);
padding: 32px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
@media (max-width: 768px) {
.encart {
padding: 22px;
}
.encart p {
line-height: 20px;
}
.error404 main h1 {
font-size: 100px;
line-height: 120px;
} 
.error404 main p {
font-size: 30px;
line-height: 35px;
}
}
#cmplz-document h1,
.page-id-394 h1,
.page-id-396 h1,
.page-id-398 h1 {
@apply font-primary !text-[30px] !leading-[40px] md:!text-[36px] md:!leading-[50px] font-bold uppercase !py-0 !text-black;
}
#cmplz-document h2,
.page-id-394 h2,
.page-id-396 h2,
.page-id-398 h2 {
@apply font-primary text-[22px] leading-[28px] md:text-[32px] md:leading-[36px] font-bold;
text-transform: none;
}
#post-394, 
#post-396, 
#post-398 {
@apply py-8 md:pt-[120px] md:pb-[100px];
} .page-id-376 h1 {
padding-bottom: 24px !important;
}
.page-id-376 .col-ressources .resource-card {
margin-bottom: 55px; 
}
.page-id-376 .col-ressources .resource-card__inner,
.page-id-376 .col-ressources .resource-card {
min-height: 200px;
}
@media screen and (min-width: 768px) {
.page-id-376 .col-ressources .resource-card {
min-height: 335px;
}
} .page-id-412 h1 {
max-width: 661px;
@apply !pb-9 md:!pb-[70px];
} .page-id-384 h1 {
@apply !pb-7;
}
.page-id-434 h1.title {
display: none !important;
}
.page-id-434 .content h1.wp-block-heading {
padding: 0 !important;
}
.page-id-434 .content > div.wp-block-columns {
@apply py-8 md:py-[100px] gap-4;
}
.page-id-434 .content > div.wp-block-columns p {
margin: 0;
} .page-search #main {
padding-top: 72px;
padding-bottom: 50px;
} .page-search h1.title {
@apply pt-12 pb-2;
font-size: 32px;
line-height: 1.08;
}
.page-search h1.title span { color: #000;
} .page-search .content {
max-width: 820px;
margin-top: 24px;
} .page-search .search-form {
margin: 0 0 48px;
}
.page-search .search-block {
display: flex;
align-items: stretch;
border: 1px solid #707070;
background: #fff;
overflow: hidden;
}
.page-search .search-field {
flex: 1;
min-width: 0;
border: none;
outline: none;
padding: 16px 20px;
font-size: 18px;
line-height: 24px;
color: #1a1818;
background: transparent;
}
.page-search .search-field::placeholder {
color: #9a9a9a;
}
.page-search .search-submit {
flex-shrink: 0;
width: 62px;
border: none;
cursor: pointer;
background-color: #2D413C; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 22px;
transition: background-color 0.2s ease;
}
.page-search .search-submit:hover { }
.page-search .screen-reader-text {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
} .page-search .description > article {
padding: 26px 0;
border-bottom: 1px solid #e2e2e2;
}
.page-search .description > article:first-of-type {
border-top: 1px solid #e2e2e2;
}
.page-search .entry-header {
margin: 0 0 8px;
}
.page-search .entry-title {
@apply font-primary;
margin: 0;
font-size: 22px;
line-height: 28px;
font-weight: 500;
text-transform: none;
}
.page-search .entry-title a {
color: #2D413C; text-decoration: none;
transition: color 0.2s ease;
}
.page-search .entry-title a:hover {
color: #234C9B; text-decoration: underline;
}
.page-search .entry-summary,
.page-search .entry-summary p {
color: #4b5563;
font-size: 16px;
line-height: 24px;
}
.page-search .entry-summary p {
margin: 0;
} .page-search .search-no-results {
padding: 24px 0;
font-size: 18px;
color: #4b5563;
}
.page-search .search-no-results i {
color: #2D413C; font-style: italic;
} @media (max-width: 767px) {
.page-search .search-field {
padding: 13px 16px;
font-size: 16px;
}
.page-search .search-submit {
width: 54px;
}
.page-search .entry-title {
font-size: 20px;
line-height: 26px;
}
}
.mea-biat .deux-colonnes__media img {
max-height: 500px;
object-fit: contain;
}
@media (max-width: 1279px) { 
.col-politique-de-confidentialite {
flex-wrap: wrap !important;
}
.col-politique-de-confidentialite > .wp-block-column:first-child {
flex-basis: 100%;
}
}
.hero-breadcrumb {
width: 100%;
} .hero-breadcrumb__media {
width: 100%;
overflow: hidden;
}
.hero-breadcrumb__media img {
width: 100%;
height: clamp(220px, 28vw, 520px);
object-fit: cover;
display: block;
} .hero-breadcrumb__bar {
background: #2D413C;
}
.hero-breadcrumb__bar-inner {
display: flex;
align-items: center;
gap: 18px;
padding: 18px 0;
} .hero-breadcrumb__bar-inner {
max-width: calc(1280px + 72px);
margin: 0 auto;
padding-left: 36px;
padding-right: 36px;
}
.hero-breadcrumb__icon {
display: inline-flex;
align-items: center;
justify-content: center;
}
.hero-breadcrumb__icon svg {
width: 30.906px;
height: 30.906px;
display: block;
} .hero-breadcrumb__trail {
display: flex;
align-items: baseline;
gap: 12px;
min-width: 0;
} .hero-breadcrumb__parent {
text-transform: uppercase;
font-size: 40px;
line-height: 50px;
color: #fff;
text-decoration: none;
white-space: nowrap;
pointer-events: none;
}
.hero-breadcrumb__parent:hover {
color: #fff !important;
text-decoration: none;
font-weight: inherit;
}
.hero-breadcrumb__sep {
color: #fff;
opacity: 1;
font-size: 20px;
line-height: 1;
margin-right: -8px;
}
.hero-breadcrumb__current {
text-transform: uppercase;
font-size: 20px;
line-height: 26px;
color: #fff;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} @media (max-width: 767px) {
.hero-breadcrumb__bar-inner {
gap: 14px;
padding-top: 14px;
padding-bottom: 14px;
}
.hero-breadcrumb__parent {
font-size: 26px;
line-height: 32px;
}
.hero-breadcrumb__current {
font-size: 16px;
line-height: 20px;
}
} @tailwind base;
@tailwind components;
@tailwind utilities;
body {
overflow-x: hidden;
@apply h-auto;
}  .cta-centered--full-width,
.features-screenshot--full-width,
.hero-centered--full-width,
.testimonials-cards--full-width,
.newsletter-centered--full-width,
.cards-grid--full-width,
.tabs-simple--full-width {
width: 100vw;
position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
} @layer components { .container {
@apply mx-auto px-9;
max-width: calc(80rem + 72px);
}
.section-padding {
@apply py-16;
}
.text-gradient {
@apply bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent;
}
} @layer utilities {
.mobile-only {
@apply block lg:hidden;
}
.desktop-only {
@apply hidden lg:block;
}
.tablet-up {
@apply hidden md:block;
}
.mobile-up {
@apply block;
}
} @keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-fade-in-up {
animation: fadeInUp 0.6s ease-out;
} .focus-visible:focus {
@apply outline-none ring-2 ring-primary ring-offset-2;
} ::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
@apply bg-gray-100;
}
::-webkit-scrollbar-thumb {
@apply bg-gray-400 rounded-full;
}
::-webkit-scrollbar-thumb:hover {
@apply bg-gray-500;
}