/* =========================================================================
   Amanta Landing Pages — styles front (calés sur la maquette Figma)
   Tokens : bleu de marque #3998d2, texte #203e4b, police Montserrat (héritée
   du thème). Complète les classes du thème (container, btn_1, title, margin_*).
   Breakpoints : mobile <768, tablette 768–1024, desktop >=1024.
   ========================================================================= */

:root {
    /* Repris des options du thème (différentes par sous-site) au lieu de valeurs figées */
    --lp-blue: var(--secondary-text-color, #3998d2);
    --lp-text: var(--black-text-color, #203e4b);
    --lp-header-height: 96px; /* hauteur du nav fixe du thème (.fixed_header.small-header.sticky) */
}

/* Le nav du thème est en `position:fixed` (retiré du flux) : sur le single,
   le premier bloc démarre donc sous le nav sans compensation. On réserve
   la hauteur du nav en haut du premier bloc pour que son contenu ne soit
   pas masqué — le hero garde son image plein bleed (voir .lp-hero__inner). */
.lp-single > section:first-child:not(.lp-hero) {
    padding-top: var(--lp-header-height);
}

/* ---------------------------------------------------------------- Hero -- */
.lp-hero {
    position: relative;
    display: flex;
    align-items: center;          /* contenu centré verticalement (Figma) */
    min-height: 800px;
    max-height: 90vh;
    overflow: hidden;
    color: #fff;
}
.lp-hero__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.lp-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
}
.lp-hero__inner {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;      /* aligné à gauche (Figma) */
    gap: 20px;
    max-width: 640px;
    padding-top: var(--lp-header-height); /* passe sous le nav fixe, image plein bleed derrière */
}
.lp-hero__badge {
    display: inline-block;
    padding: .8em 2em;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #fff;
    background: var(--lp-blue);
    border-radius: 7px;
}
.lp-hero__title {
    margin: 0;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    font-size: clamp(2.2rem, 4.2vw, 3.2rem);
    line-height: 1.1;
    letter-spacing: -.03em;
}
.lp-hero__subtitle {
    margin: 0;
    font-weight: 300;
    font-size: clamp(1.25rem, 2.4vw, 2rem);
    line-height: 1.15;
}

/* -------------------------------------------------------------- Pictos -- */
.lp-pictos__grid {
    display: grid;
    grid-template-columns: repeat(var(--lp-cols-m, 2), 1fr);
    gap: 1.75rem 1.5rem;
}
@media (min-width: 768px) {
    .lp-pictos__grid { grid-template-columns: repeat(var(--lp-cols-t, 3), 1fr); }
}
@media (min-width: 1024px) {
    .lp-pictos__grid { grid-template-columns: repeat(var(--lp-cols-d, 4), 1fr); }
}
.lp-pictos__item {
    display: flex;
    align-items: center;          /* icône à gauche du texte (Figma) */
    gap: 10px;
}
.lp-pictos__icon {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
}
.lp-pictos__icon i { font-size: 26px; line-height: 1; color: var(--lp-blue); }
.lp-pictos__text { font-size: 1.125rem; line-height: 1.28; color: var(--lp-text); }
.lp-pictos__text > :last-child { margin-bottom: 0; }
.lp-pictos__text strong, .lp-pictos__text b { font-weight: 700; }

/* ------------------------------------------------------------ Texte+CTA -- */
.lp-textcta__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: center;
}
@media (min-width: 992px) {
    .lp-textcta__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
    .lp-textcta--right .lp-textcta__media   { order: 2; }
    .lp-textcta--right .lp-textcta__content { order: 1; }
    /* Hauteurs égales : l'image couvre toute la hauteur de la colonne texte. */
    .lp-textcta--equal .lp-textcta__grid { align-items: stretch; }
    .lp-textcta--equal .lp-textcta__media { height: 100%; }
    .lp-textcta--equal .lp-textcta__media img { height: 100%; object-fit: cover; }
}
.lp-textcta__media img { width: 100%; display: block; }
.lp-textcta__text { color: var(--lp-text); font-size: 1rem; line-height: 1.6; }
.lp-textcta__text h2, .lp-textcta__text h3, .lp-textcta__text h4 {
    color: var(--lp-blue);
    font-weight: 700;
    letter-spacing: -.02em;
}
.lp-textcta__cta { margin-top: 1.5rem; margin-bottom: 0; }

/* CTA : conserve la couleur du thème (btn_1) mais force le rendu uppercase Figma */
.lp-cta { text-transform: uppercase; }

/* -------------------------------------------------------------- Galerie -- */
/* Mosaïque : grande image à gauche + 2 images empilées à droite (Figma). */
.lp-gallery__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.lp-gallery__item {
    position: relative;
    display: block;
    overflow: hidden;
}
.lp-gallery__item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s ease;
}
.lp-gallery__item:hover img { transform: scale(1.04); }
.lp-gallery__item:nth-child(1) { grid-row: 1 / span 2; }
.lp-gallery__item:nth-child(2),
.lp-gallery__item:nth-child(3) { aspect-ratio: 670 / 411; }
.lp-gallery__item.hidden { display: none; }
@media (max-width: 767px) {
    .lp-gallery__grid { grid-template-columns: 1fr; }
    .lp-gallery__item:nth-child(1) { grid-row: auto; aspect-ratio: 4 / 3; }
}
.lp-gallery__more {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: 700;
    color: #fff;
    background: rgba(0, 0, 0, .45);
}
.lp-gallery__cta { margin-top: 2rem; text-align: center; }

/* ----------------------------------------------------------------- FAQ -- */
.lp-faq__title {
    color: var(--lp-blue);
    font-weight: 700;
    letter-spacing: -.03em;
    margin-bottom: 1.5rem;
}
.lp-faq__item { border-top: 1px solid #d9d9d9; }
.lp-faq__item:last-child { border-bottom: 1px solid #d9d9d9; }
.lp-faq__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.25rem 0;
    color: var(--lp-text);
    text-decoration: none;
    cursor: pointer;
}
.lp-faq__q:hover { color: var(--lp-text); }
.lp-faq__question { font-size: 1rem; font-weight: 500; line-height: 1.5; }
.lp-faq__indicator {
    flex: 0 0 auto;
    position: relative;
    width: 31px;
    height: 31px;
    background: var(--lp-blue);
}
.lp-faq__indicator::before,
.lp-faq__indicator::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
}
.lp-faq__indicator::before { width: 13px; height: 2px; }                 /* barre horizontale */
.lp-faq__indicator::after  { width: 2px; height: 13px; transition: transform .2s ease; } /* barre verticale (+) */
.lp-faq__q[aria-expanded="true"] .lp-faq__indicator::after { transform: translate(-50%, -50%) scaleY(0); } /* devient − */
.lp-faq__answer { padding: 0 0 1.25rem; color: var(--lp-text); font-size: .95rem; line-height: 1.6; }
.lp-faq__answer > :last-child { margin-bottom: 0; }

/* ------------------------------------------------------------- Archive -- */
.lp-archive__intro {
    margin: 0 0 2.5rem;
    color: var(--lp-text);
    font-size: 1rem;
    line-height: 1.6;
}
.lp-archive__intro > :last-child { margin-bottom: 0; }

/* Bandeau image (réglages archive) : par défaut le thème garde le nav
   transparent (logo et liens blancs) tant qu'on n'a pas scrollé
   (comportement global du site sur les pages à bandeau). On reproduit ici
   à l'identique tout ce que `header.fixed_header.sticky` applique au
   scroll, en permanence, pour un nav blanc opaque sur cette page. */
body.lp-archive-solid-nav header.fixed_header {
    background-color: #fff;
    border-bottom: 1px solid #d9e1e6;
}
body.lp-archive-solid-nav header.fixed_header nav ul li a {
    color: var(--black-text-color);
}
body.lp-archive-solid-nav header.fixed_header nav ul li a.animated_link:before {
    background-color: var(--black-text-color);
}
body.lp-archive-solid-nav header.fixed_header nav ul li a.btn_1 {
    color: #fff !important;
}
body.lp-archive-solid-nav header.fixed_header .hamburger__inner,
body.lp-archive-solid-nav header.fixed_header .hamburger__inner:after,
body.lp-archive-solid-nav header.fixed_header .hamburger__inner:before {
    background-color: var(--black-text-color);
}
body.lp-archive-solid-nav header.fixed_header .logo_normal {
    display: none;
}
body.lp-archive-solid-nav header.fixed_header .logo_sticky {
    display: inline-block;
}

.lp-archive__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}
@media (max-width: 991px) { .lp-archive__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .lp-archive__grid { grid-template-columns: 1fr; } }

.lp-card { display: flex; flex-direction: column; background: #fff; box-shadow: 0 6px 24px rgba(0, 0, 0, .08); }
.lp-card__link { display: block; flex: 1; color: inherit; text-decoration: none; }
.lp-card__media { position: relative; aspect-ratio: 3 / 2; overflow: hidden; }
/* get_the_post_thumbnail() peut sortir un <img> nu ou être enveloppé
   (<figure>/<picture> — webp/Imagify) : on force le wrapper direct à
   occuper tout le conteneur (reset des marges par défaut de <figure>)
   avant d'appliquer le cover sur l'<img> lui-même, quelle que soit sa
   profondeur d'imbrication. */
.lp-card__media > img,
.lp-card__media > figure,
.lp-card__media > picture { position: absolute; inset: 0; margin: 0; width: 100%; height: 100%; }
.lp-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lp-card__badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    padding: .3em .8em;
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
    background: var(--lp-blue);
}
.lp-card__body { padding: 1.25rem 1.5rem 1.75rem; }
.lp-card__title { margin: 0 0 .5rem; font-size: 1.25rem; color: var(--lp-text); }
.lp-card__dates { margin: 0 0 .5rem; font-weight: 600; color: var(--lp-blue); }
.lp-card__excerpt { margin: 0; font-size: .95rem; color: var(--lp-text); }
.lp-card__cta { display: block; margin: 0 1.5rem 1.5rem; text-align: center; }
.lp-archive__pagination { margin-top: 3rem; text-align: center; }

/* ---------------------------------------------------------- Lightbox -- */
.lp-lightbox {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, .9);
}
.lp-lightbox.is-open { display: flex; }
.lp-lightbox__img { max-width: 90vw; max-height: 85vh; object-fit: contain; }
.lp-lightbox__btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border: 0;
    background: rgba(255, 255, 255, .15);
    color: #fff;
    font-size: 1.5rem;
    cursor: pointer;
}
.lp-lightbox__btn:hover { background: rgba(255, 255, 255, .3); }
.lp-lightbox__prev { left: 2rem; }
.lp-lightbox__next { right: 2rem; }
.lp-lightbox__close { top: 1.5rem; right: 1.5rem; transform: none; }