:root {
  /* -------- PRIMITIVES (dédup) -------- */
  --ls-0: 0;                 /* letter-spacing: 0px */
  --fs-18: 1.125rem;         /* 18px */
  --fs-24: 1.5rem;           /* 24px */
  --fw-semibold: 600;        /* Semibold */
  --fw-bold: 700;            /* Bold */

  /* -------- DESIGN TOKENS -------- */
  /* Couleurs */
  --color-brand: #004c66;
  --color-brand-300: #008996;
  --color-btn-tertiary: #008996;
  --color-text: #222222;
  --color-muted: #888b97;
  --color-surface: #ffffff;
  --color-surface-muted: #f5f1e8;
  --border: #d9d9d9;

  /* Typo base */
  --fs-body: 1.125rem;     /* 18px */
  --lh-body: 1.625rem;     /* 26px */

  /* -------- TYPO TOKENS (composites `font:`) -------- */
  /* H2 — Big Caslon “medium” 48/normal
     (Big Caslon FB n’a pas de vraie graisse 500 → mappé) */
  --h2-font-family: "cormorant-infant", serif;
  --h2-font-weight: 500;
  --h2-font-size: 3rem;       /* 48px */
  --h2-line-height: normal;
  --h2-font:
    var(--h2-font-weight) var(--h2-font-size)/var(--h2-line-height) var(--h2-font-family);

  /* H3 — Big Caslon “medium” 40/normal */
  --h3-font-family: "cormorant-infant", serif;
  --h3-font-weight: 500;
  --h3-font-size: 2.5rem;     /* 40px */
  --h3-line-height: normal;
  --h3-font:
    var(--h3-font-weight) var(--h3-font-size)/var(--h3-line-height) var(--h3-font-family);

  /* H5 — Montserrat Bold 24/32, ls 0 */
  --h5-font-family: "Mulish", sans-serif;
  --h5-font-weight: var(--fw-bold);
  --h5-font-size: var(--fs-24); /* 24px */
  --h5-line-height: 2rem;       /* 32px */
  --h5-letter-spacing: var(--ls-0);
  --h5-font:
    var(--h5-font-weight) var(--h5-font-size)/var(--h5-line-height) var(--h5-font-family);

  /* Article — Montserrat Regular 18/26, ls 0 */
  --article-font-family: "Mulish", sans-serif;
  --article-font-weight: 400;
  --article-font-size: var(--fs-18);
  --article-line-height: 1.625rem;  /* 26px */
  --article-letter-spacing: var(--ls-0);
  --article-font:
    var(--article-font-weight) var(--article-font-size)/var(--article-line-height) var(--article-font-family);
}


/* ===========================
   STATS
   =========================== */

span.gris{
  color: gray;
  font-size: 2.2rem;
  font-weight: 100;
  position: relative;
  bottom: 5px;
}

/* =========================================
   ACCORDÉON
   ========================================= */

.acc__summary.black::after{
  color: var(--color-brand);
}

/* =========================================
   CTA DOUBLE (page vendre)
   ========================================= */

.cta-duo {
  position: relative;
  z-index: 1; /* ✅ au-dessus de articles */
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 40px; /* espace entre les 2 blocs */
  max-width: 1440px;
  margin: 7.5rem auto 0;
  padding: 0 1rem;
}

.cta-duo__item {
  position: relative;
  flex: 1 1 677px;
  height: 698px;
  border-radius: 24px;
  overflow: hidden;
  background: center/cover no-repeat var(--cta-url);
}

/* Ellipse décorative */
.cta-duo::before {
  content: "";
  position: absolute;
  width: 47rem;
  height: 47rem;
  top: 75%;        
  left: 96%;       
  transform: translate(-50%, -50%) rotate(-15deg);
  background: rgba(243, 204, 135, 0.6); /* #F3CC87 avec opacité */
  filter: blur(300px);
  border-radius: 50%;
  opacity: 0.8;
  z-index: 0;   /* ✅ au-dessus du bloc CTA mais sous son contenu */
  pointer-events: none;
}


.cta-duo__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,0.2) 40%,
    rgba(0,0,0,0) 100%
  );
}

.cta-duo__inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;  /* ✅ reste en bas */
  align-items: flex-start;    /* ✅ aligné à gauche */
  text-align: left;           /* ✅ texte aligné à gauche */
  padding: 3rem 2rem;
}

.cta-duo__title {
  margin: 0 0 1.5rem;
  color: #fff;
  font: var(--h2-font);
}

.cta-duo__text {
  margin: 0 0 1.5rem;
  color: #fff;
  max-width: 40rem;
  font: 400 16px/24px Montserrat, sans-serif;
}

.cta-duo__link {
  color: #fff;
  font: 600 18px Montserrat, sans-serif;
}
.cta-duo__link:hover {
  opacity: .9;
  color: white;
  text-decoration: underline;
}

/* ✅ Responsive */
@media (max-width: 1023.98px) {
  .cta-duo {
    flex-direction: column;
    gap: 24px;
    margin-top: 3rem;
  }

  .cta-duo__item {
    height: 320px;
  }
}

@media (max-width: 1680px) {
/* CTA IMAGE LARGE */
  .cta-duo {max-width: 1024px; margin: 4.5rem auto 0;}
  .cta-duo__item {flex: 1 1 498px; height: 498px; }
  .cta-duo__title {font-size: 2.063rem; } /* 33px */
}
@media (max-width: 1024px) {
/* CTA IMAGE LARGE */
  .cta-duo {gap: 1.75rem;}
}
@media (max-width: 768px) {
/* CTA IMAGE LARGE */
  .cta-duo {padding: 0 6rem;}
}
@media (max-width: 440px) {
/* CTA IMAGE LARGE */
  .cta-duo {padding: 0 1rem;}
  .cta-duo__title {font-size: 1.75rem; } /* 33px */
  .cta-duo__link {font-size: 0.875rem; } /* 14px */
}

