/*
 * Fondation Cœur & Santé Cameroun — feuille de style unique du site public (V7.0).
 * Ce fichier est la source : il se modifie directement.
 * Après une modification, créer un nouveau dossier de version (ex. v701) et mettre à jour
 * le lien <link href="/assets/css/v720/fcsc.css"> des pages HTML.
 */

/* FCSC V2.4.0 — couche foundation. */
@layer fcsc.foundation, fcsc.layout, fcsc.components, fcsc.pages, fcsc.hero-behaviour, fcsc.harmonisation, fcsc.engagement, fcsc.support-panels, fcsc.sheets-transitions, fcsc.article-sharing, fcsc.payment-states, fcsc.library;

@layer fcsc.foundation {
  /* Fondations : variables, normalisation et structure globale. */
  /*
 * Socle visuel : variables (couleurs, typographie, espacements), base, composants communs (en-tête, pied de page, boutons, cartes), mise en page de chaque page et adaptations mobiles d'origine.
 */

  :root {
    --fcsc-blue-900: #003d70;
    --fcsc-blue-800: #064f89;
    --fcsc-blue-700: #075d9f;
    --fcsc-green-800: #00713f;
    --fcsc-green-700: #007e49;
    --fcsc-green-600: #008f50;
    --fcsc-green-300: #72c69b;
    --fcsc-ink: #102738;
    --fcsc-muted: #5d6d77;
    --fcsc-line: #dce6e9;
    --fcsc-surface: #ffffff;
    --fcsc-soft-blue: #eef7fb;
    --fcsc-soft-green: #edf8f2;
    --fcsc-header-expanded: 74px;
    --fcsc-header-compact: 44px;
    --fcsc-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --fcsc-duration-fast: 180ms;
    --fcsc-font: "Avenir Next", Avenir, "Helvetica Neue", Arial, sans-serif;

    /* Alpha variants of the tokens above, for the borders/overlays repeated
     verbatim (as raw rgb(...)) across global.css. Only the values that were
     genuinely retyped 3+ times identically are named here — see the code
     audit notes for why the many bespoke box-shadow blur/spread values were
     deliberately left alone rather than force-fit into a rigid scale. */

    --fcsc-blue-900-a09: rgb(0 61 112 / 9%);
    --fcsc-blue-900-a10: rgb(0 61 112 / 10%);
    --fcsc-blue-900-a16: rgb(0 61 112 / 16%);
    --fcsc-blue-900-a18: rgb(0 61 112 / 18%);

    /* Consolidated from 5 near-identical one-off grays used for the same
     purpose (small caption/meta text) across different lots. */
    --fcsc-caption: #8a99a2;

    /* The dark hero-panel gradient, previously reinvented with slightly
     different stops in two places (.impact-model et les surfaces institutionnelles sombres). */

    /* Canonical primary-action button — previously 5 different colors
     (gradient, 2 shades of green, 2 shades of blue) stood in for "the
     main button" across different forms. This is now the one used
     everywhere a form's main action is the primary CTA. */
    --fcsc-cta-gradient: linear-gradient(90deg, var(--fcsc-green-600), var(--fcsc-blue-700));
    --fcsc-cta-shadow: 0 12px 28px rgb(0 92 100 / 20%);
  }

  * {
    box-sizing: border-box;
  }

  /* Global press feedback — most buttons on the site had zero tactile
   response on click. This gives every native button a quick, consistent
   press-down; elements that also animate on hover get a combined override
   just below so the press doesn't cancel the hover motion. */
  button:not(:disabled) {
    transition: transform 130ms ease;
  }
  button:not(:disabled):active {
    transform: scale(0.96);
  }
  .legal-page {
    margin: 0 auto;
    padding: calc(var(--fcsc-header-expanded) + 64px) 24px 96px;
  }
  .legal-page h1 {
    margin: 16px 0 0;
    color: var(--fcsc-blue-900);
    font-size: clamp(32px, 4.4vw, 50px);
    line-height: 1.05;
    letter-spacing: -0.04em;
  }
  .legal-page__updated {
    display: block;
    margin-top: 14px;
    color: var(--fcsc-caption);
    font-size: 13px;
  }
  .legal-page > p:first-of-type {
    margin-top: 26px;
  }
  .legal-page h2 {
    margin: 0 0 14px;
    color: var(--fcsc-blue-900);
  }
  .legal-page p {
    margin: 12px 0 0;
    color: var(--fcsc-muted);
    line-height: 1.65;
  }
  .legal-page p:first-child {
    margin-top: 0;
  }
  .legal-page ul {
    margin: 12px 0 0;
    padding-left: 20px;
    color: var(--fcsc-muted);
    line-height: 1.65;
  }
  .legal-page li {
    margin-top: 6px;
  }
  .legal-page a {
    color: var(--fcsc-blue-700);
  }
  .legal-page strong,
  .legal-page b {
    color: inherit;
  }
  .legal-page mark {
    padding: 1px 5px;
    border-radius: 4px;
    background: var(--fcsc-soft-blue);
    color: var(--fcsc-blue-900);
    font-style: normal;
  }
  .legal-document {
    border: 1px solid var(--fcsc-blue-900-a10);
    background: #fff;
    box-shadow: 0 20px 56px rgb(12 52 72 / 6%);
  }
  .legal-document__section + .legal-document__section {
    border-top: 1px solid rgb(6 71 95 / 8%);
  }
  .legal-document__section--contact .contact-page__email {
    margin-top: 18px;
  }
  .legal-page__contact-note {
    margin-top: 28px;
  }
  .contact-page__email {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 22px;
    border: 1px solid rgb(6 71 95 / 14%);
    border-radius: 12px;
    background: var(--fcsc-soft-blue);
    color: var(--fcsc-blue-800);
    font-weight: 400;
    text-decoration: none;
    box-shadow: 0 10px 24px rgb(12 52 72 / 7%);
    transition:
      border-color 180ms ease,
      background 180ms ease,
      transform 180ms ease;
  }
  .contact-page__email:hover,
  .contact-page__email:focus-visible {
    border-color: rgb(0 135 83 / 28%);
    background: #fff;
    transform: translateY(-1px);
  }
  .contact-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .contact-form__grid label {
    display: block;
  }
  .contact-form__grid label span {
    display: block;
  }
  .contact-form__grid input,
  .contact-form__grid textarea {
    width: 100%;
    font: inherit;
    outline: none;
    transition:
      border-color 180ms ease,
      box-shadow 180ms ease;
  }
  .contact-form__grid textarea {
    resize: vertical;
  }
  .contact-form__message {
    grid-column: 1 / -1;
  }
  .contact-form__consent {
    display: grid;
    align-items: start;
    line-height: 1.5;
    cursor: pointer;
  }
  .contact-form__consent input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }
  .contact-form__consent i {
    display: grid;
    place-items: center;
    margin-top: 1px;
    border: 1px solid var(--fcsc-blue-900-a18);
    color: transparent;
    font-size: 12px;
    transition:
      background 160ms ease,
      border-color 160ms ease,
      color 160ms ease;
  }
  .contact-form__consent input:checked + i {
    border-color: var(--fcsc-green-600);
    background: var(--fcsc-green-600);
    color: #fff;
  }
  .contact-form__trap {
    position: absolute;
    left: -9999px;
  }
  .contact-form > button {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    border: 0;
    color: #fff;
    cursor: pointer;
    transition:
      transform 160ms ease,
      opacity 160ms ease;
  }
  .contact-form > button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    box-shadow: none;
  }
  .contact-form__status {
    margin-top: 14px;
    font-size: 13px;
  }
  .contact-form__status[data-status="success"] {
    color: var(--fcsc-green-800);
  }
  .contact-form__status[data-status="error"] {
    color: #a23d38;
  }
  .contact-form__secure {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .team-member__portrait-button:active {
    transform: scale(0.98);
  }

  /* Staggered grid reveal — previously only the Library's book grid cascaded
   card-by-card; every other grid revealed as a single block. Each card gets
   its own short delay (via an --i / --data-index / --marker-index / --impact-step
   custom property already set per item) so the whole grid unfurls instead
   of popping in at once. Falls back to fully visible when JS hasn't run. */
  .act-why-v4__programme,
  .act-after__steps article {
    transition:
      opacity 560ms ease,
      transform 560ms cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 480ms var(--fcsc-ease),
      border-color 480ms var(--fcsc-ease);
  }
  html[data-act-motion-ready] .act-after__steps[data-reveal-pending] article {
    opacity: 0;
    transform: translateY(24px);
  }
  .act-after__steps[data-visible] article {
    transition-delay: calc(var(--i, 0) * 90ms);
  }

  .site-toast {
    position: fixed;
    z-index: 1300;
    left: 50%;
    bottom: clamp(24px, 6vh, 48px);
    transform: translateX(-50%);
    padding: 14px 24px;
    border-radius: 99px;
    background: var(--fcsc-blue-900);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 20px 50px rgb(0 38 70 / 25%);
    animation: site-toast-life 2600ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  @keyframes site-toast-life {
    0% {
      opacity: 0;
      transform: translateX(-50%) translateY(14px);
    }
    10% {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
    88% {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
    100% {
      opacity: 0;
      transform: translateX(-50%) translateY(8px);
    }
  }

  html {
    background: var(--fcsc-surface);
    color: var(--fcsc-ink);
    font-family: var(--fcsc-font);
    scroll-behavior: smooth;
  }

  body {
    margin: 0;
    min-width: 320px;
  }

  html[data-consent-open],
  html[data-profile-open],
  html[data-foundation-marker-open],
  html[data-sheet-open] {
    overflow: hidden;
  }

  a {
    color: inherit;
    text-decoration: none;
  }

  button,
  a {
    -webkit-tap-highlight-color: transparent;
  }

  img {
    user-select: none;
    -webkit-user-drag: none;
  }

  .skip-link {
    position: fixed;
    z-index: 1000;
    top: 8px;
    left: 8px;
    transform: translateY(-160%);
    padding: 10px 14px;
    border-radius: 8px;
    background: var(--fcsc-ink);
    color: #fff;
  }

  .skip-link:focus {
    transform: translateY(0);
  }

  .foundation-page {
    overflow: clip;
  }

  .page-section {
    padding: clamp(88px, 10vw, 148px) max(24px, calc((100vw - 1180px) / 2));
  }

  .section-eyebrow {
    display: inline-block;
    color: var(--fcsc-green-700);
    font-weight: 600;
    text-transform: uppercase;
  }

  .section-eyebrow--light {
    color: #aeeacb;
  }

  .foundation-reveal {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition:
      opacity 760ms ease,
      transform 980ms var(--fcsc-ease);
  }

  html[data-motion-ready] .foundation-reveal[data-reveal-pending] {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
  }

  .president-section {
    position: relative;
    overflow: hidden;
    padding: calc(var(--fcsc-header-expanded) + clamp(40px, 5vw, 72px)) max(24px, calc((100vw - 1180px) / 2))
      clamp(48px, 5vw, 78px);
    background: var(--fcsc-blue-900);
    color: #fff;
  }

  .president-section__background,
  .president-section__veil {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }

  .president-section__background {
    object-fit: cover;
    object-position: center;
    filter: saturate(0.9) contrast(1.04);
    transform: scale(1.04);
    animation: foundation-hero-reveal 1.5s var(--fcsc-ease) both;
    pointer-events: none;
  }

  .president-section__veil {
    background:
      linear-gradient(95deg, rgb(0 37 67 / 70%) 0%, rgb(0 48 82 / 78%) 48%, rgb(0 44 74 / 88%) 100%),
      linear-gradient(180deg, rgb(0 31 55 / 18%), rgb(0 34 57 / 48%));
  }

  @keyframes foundation-hero-reveal {
    from {
      opacity: 0;
      transform: scale(1.11);
    }
    to {
      opacity: 1;
      transform: scale(1.04);
    }
  }

  .president-section::before {
    position: absolute;
    top: 18%;
    right: -10%;
    width: 48vw;
    height: 48vw;
    border: 1px solid rgb(255 255 255 / 8%);
    border-radius: 50%;
    content: "";
  }

  .president-section::after {
    position: absolute;
    right: 7%;
    bottom: -32%;
    width: 38vw;
    height: 38vw;
    border: 1px solid rgb(174 234 203 / 12%);
    border-radius: 50%;
    content: "";
  }

  .president-section__glow {
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 18% 34%, rgb(0 143 80 / 18%), transparent 27%),
      radial-gradient(circle at 82% 76%, rgb(35 130 189 / 16%), transparent 32%);
    pointer-events: none;
  }

  .president-section__content {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(270px, 0.72fr) minmax(0, 1.55fr);
    align-items: center;
    gap: clamp(40px, 6vw, 88px);
    width: min(1180px, 100%);
    margin-inline: auto;
  }

  .president-section__portrait-column {
    display: grid;
    justify-items: center;
    align-content: center;
    text-align: center;
  }

  .portrait {
    --portrait-size: 214px;
    display: grid;
    place-items: center;
    width: var(--portrait-size);
    height: var(--portrait-size);
    padding: 8px;
    border-radius: 50%;
    background: var(--ring-start, var(--fcsc-green-600));
    box-shadow: 0 20px 46px rgb(8 40 58 / 12%);
    transition:
      background-color 520ms var(--fcsc-ease),
      box-shadow 520ms var(--fcsc-ease),
      transform 520ms var(--fcsc-ease);
  }

  .portrait[data-large] {
    padding: 9px;
    background: linear-gradient(145deg, #fff 0 50%, #aeeacb 100%);
    box-shadow: 0 26px 70px rgb(0 20 38 / 30%);
  }

  .portrait__inner {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border: 6px solid #fff;
    border-radius: 50%;
    background: #eef7fb;
    transition: transform 620ms var(--fcsc-ease);
  }

  .portrait[data-large] .portrait__inner {
    border-width: 7px;
    background: rgb(255 255 255 / 96%);
  }

  .portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
  }

  .portrait__placeholder {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 12px;
    width: 100%;
    height: 100%;
    background:
      radial-gradient(circle at 72% 22%, rgb(0 143 80 / 11%), transparent 30%),
      linear-gradient(145deg, #f9fcfd, #e8f4f7);
    color: var(--fcsc-blue-900);
  }

  .portrait__placeholder svg {
    font-size: clamp(42px, 5vw, 68px);
    opacity: 0.9;
  }

  .portrait__placeholder b {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.14em;
  }

  .president-section__identity {
    display: grid;
    gap: 5px;
    width: min(310px, 100%);
    margin-top: 24px;
  }

  .president-section__identity strong {
    font-weight: 600;
  }

  .president-section__identity span {
    color: rgb(255 255 255 / 80%);
    font-size: 14px;
  }

  .president-section__identity small {
    color: #aeeacb;
    font-size: 12px;
  }

  .president-section__message h1 {
    max-width: 760px;
    margin: 0;
    font-weight: 600;
    line-height: 1.02;
    letter-spacing: -0.05em;
    text-wrap: balance;
  }

  .president-section__copy {
    display: grid;
    gap: 10px;
    max-width: 700px;
    margin-top: 22px;
  }

  .president-section__copy p {
    margin: 0;
    color: rgb(255 255 255 / 77%);
    line-height: 1.5;
  }

  .president-section__signature {
    display: block;
    width: min(100%, 180px);
    height: auto;
    margin-top: 16px;
    opacity: 0.94;
    object-fit: contain;
    filter: brightness(0) invert(1) drop-shadow(0 8px 18px rgb(0 0 0 / 14%));
  }

  .governance-section__heading h2 {
    margin: 0;
    color: var(--fcsc-ink);
    font-weight: 600;
    line-height: 1.04;
    letter-spacing: -0.045em;
    text-wrap: balance;
  }

  .governance-section__heading p {
    max-width: 610px;
    margin: 24px 0 0;
    color: var(--fcsc-muted);
    line-height: 1.62;
  }

  .governance-section {
    min-height: 720px;
    background: #fff;
  }

  .governance-section__heading {
    max-width: 800px;
  }

  .team-hierarchy {
    display: grid;
    grid-template-columns: repeat(3, minmax(250px, 1fr));
    justify-items: center;
  }

  .team-hierarchy:has(> .team-member:only-child) {
    grid-template-columns: minmax(250px, 340px);
    justify-content: center;
  }

  .team-member {
    display: grid;
    justify-items: center;
    align-content: start;
    width: 100%;
    min-width: 0;
    text-align: center;
  }

  .team-member__portrait-button {
    display: grid;
    place-items: center;
    padding: 8px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    transition:
      box-shadow 520ms var(--fcsc-ease),
      transform 520ms var(--fcsc-ease);
  }

  .team-member__portrait-button:hover,
  .team-member__portrait-button:focus-visible {
    box-shadow: 0 23px 52px rgb(0 61 112 / 13%);
    transform: scale(1.025);
    outline: none;
  }

  .team-member__portrait-button:hover .portrait,
  .team-member__portrait-button:focus-visible .portrait {
    background-color: var(--ring-hover, var(--fcsc-blue-700));
    box-shadow: 0 21px 48px var(--fcsc-blue-900-a16);
  }

  .team-member__portrait-button:hover .portrait__inner,
  .team-member__portrait-button:focus-visible .portrait__inner {
    transform: scale(1.035);
  }

  .team-member__identity {
    display: grid;
    gap: 6px;
    width: min(100%, 290px);
  }

  .team-member__identity h3 {
    margin: 0;
    color: var(--fcsc-ink);
    font-weight: 600;
    line-height: 1.4;
  }

  .team-member__identity strong {
    color: var(--fcsc-blue-900);
    font-size: 13px;
    font-weight: 500;
  }

  .team-member__identity span {
    color: var(--fcsc-muted);
    font-size: 12px;
  }

  .profile-layer {
    position: fixed;
    z-index: 900;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 24px;
    background: rgb(255 255 255 / 58%);
    backdrop-filter: blur(10px) saturate(1.3);
    animation: profile-layer-in 320ms ease both;
  }

  .profile-dialog {
    position: relative;
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    align-items: center;
    gap: 46px;
    width: min(820px, calc(100vw - 48px));
    max-height: calc(100dvh - 48px);
    overflow: auto;
    padding: 52px;
    border: 1px solid var(--fcsc-blue-900-a09);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 32px 86px rgb(16 39 56 / 17%);
    animation: profile-dialog-in 540ms var(--fcsc-ease) both;
  }

  .profile-dialog__close {
    position: absolute;
    top: 18px;
    right: 18px;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid var(--fcsc-line);
    border-radius: 50%;
    background: #fff;
    color: var(--fcsc-blue-900);
    cursor: pointer;
    transition:
      background var(--fcsc-duration-fast),
      color var(--fcsc-duration-fast),
      transform var(--fcsc-duration-fast);
  }

  .profile-dialog__close:hover,
  .profile-dialog__close:focus-visible {
    background: var(--fcsc-blue-900);
    color: #fff;
    transform: rotate(4deg);
  }

  .profile-dialog__portrait {
    display: grid;
    place-items: center;
  }

  .profile-dialog__content {
    display: grid;
    gap: 8px;
  }

  .profile-dialog__content > span {
    color: var(--fcsc-green-600);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
  }

  .profile-dialog__content h2 {
    margin: 4px 0 0;
    color: var(--fcsc-ink);
    font-size: clamp(29px, 4vw, 44px);
    font-weight: 600;
    line-height: 1.06;
    letter-spacing: -0.04em;
  }

  .profile-dialog__content strong {
    color: var(--fcsc-blue-900);
    font-size: 15px;
    font-weight: 500;
  }

  .profile-dialog__content small {
    color: var(--fcsc-muted);
    font-size: 12px;
  }

  .profile-dialog__content p {
    margin: 18px 0 0;
    color: var(--fcsc-muted);
    font-size: 15px;
    line-height: 1.65;
  }

  @keyframes profile-layer-in {
    from {
      opacity: 0;
    }
  }

  @keyframes profile-dialog-in {
    from {
      opacity: 0;
      transform: translate3d(0, 18px, 0) scale(0.975);
    }
  }

  .profile-layer[data-closing="true"] {
    pointer-events: none;
    animation: profile-layer-out 340ms ease both;
  }

  .profile-dialog[data-closing="true"] {
    animation: profile-dialog-out 340ms cubic-bezier(0.4, 0, 1, 1) both;
  }

  @keyframes profile-layer-out {
    to {
      opacity: 0;
      backdrop-filter: blur(0) saturate(1);
    }
  }

  @keyframes profile-dialog-out {
    to {
      opacity: 0;
      transform: translate3d(0, 18px, 0) scale(0.97);
      filter: blur(5px);
    }
  }

  /* La page s'ouvre directement sur l'état des lieux sanitaire : aucun hero autonome. */

  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .hero-carousel {
    position: relative;
    height: 100dvh;
    overflow: hidden;
    background: var(--fcsc-blue-900);
    color: #fff;
    isolation: isolate;
    touch-action: pan-y;
  }

  .hero-carousel__slides,
  .hero-slide,
  .hero-slide__media,
  .hero-slide__veil {
    position: absolute;
    inset: 0;
  }

  .hero-slide {
    z-index: 0;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
      visibility 0s linear 1.15s,
      opacity 760ms ease;
  }

  .hero-slide[data-previous] {
    z-index: 1;
    visibility: visible;
    opacity: 1;
  }

  .hero-slide[data-active] {
    z-index: 2;
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
    transition-delay: 0s;
  }

  .hero-slide__media {
    overflow: hidden;
    background: #14344a;
    clip-path: inset(0 100% 0 0);
    transform: translateZ(0);
    transition: clip-path 1.25s var(--fcsc-ease);
    will-change: clip-path;
  }

  .hero-slide[data-previous] .hero-slide__media {
    clip-path: inset(0);
  }

  .hero-slide[data-active] .hero-slide__media {
    clip-path: inset(0);
  }

  .hero-slide__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--hero-focal-point, center);
    filter: saturate(0.9) contrast(1.03);
    transform: scale(1.105);
    transition: transform 8.2s cubic-bezier(0.18, 0.72, 0.2, 1);
    user-select: none;
    pointer-events: none;
    will-change: transform;
  }

  .hero-slide[data-active] .hero-slide__media img {
    transform: scale(1.025);
  }

  .hero-slide__veil {
    background:
      linear-gradient(
        90deg,
        rgb(2 35 60 / 74%) 0%,
        rgb(2 45 76 / 61%) 40%,
        rgb(3 62 78 / 27%) 68%,
        rgb(0 51 76 / 10%) 100%
      ),
      linear-gradient(180deg, rgb(0 35 63 / 24%) 0%, transparent 42%, rgb(0 30 52 / 45%) 100%);
  }

  .hero-slide__veil::after {
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 78% 42%, rgb(0 143 80 / 18%), transparent 32%),
      linear-gradient(115deg, transparent 45%, rgb(0 143 80 / 12%) 100%);
    content: "";
    opacity: 0;
    transform: scale(1.08);
    transition:
      opacity 1s 220ms ease,
      transform 1.6s var(--fcsc-ease);
  }

  .hero-slide[data-active] .hero-slide__veil::after {
    opacity: 1;
    transform: scale(1);
  }

  .hero-slide__content {
    position: absolute;
    z-index: 3;
    top: var(--fcsc-header-expanded);
    bottom: 112px;
    display: grid;
    align-content: center;
  }

  .hero-slide__eyebrow,
  .hero-slide :is(h1, h2),
  .hero-slide__body,
  .hero-slide__actions {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    transition:
      opacity 620ms ease,
      transform 820ms var(--fcsc-ease);
  }

  .hero-slide[data-active] .hero-slide__eyebrow,
  .hero-slide[data-active] :is(h1, h2),
  .hero-slide[data-active] .hero-slide__body,
  .hero-slide[data-active] .hero-slide__actions {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  .hero-slide[data-active] .hero-slide__eyebrow {
    transition-delay: 250ms;
  }
  .hero-slide[data-active] :is(h1, h2) {
    transition-delay: 340ms;
  }
  .hero-slide[data-active] .hero-slide__body {
    transition-delay: 440ms;
  }
  .hero-slide[data-active] .hero-slide__actions {
    transition-delay: 530ms;
  }

  .hero-slide__eyebrow {
    align-self: end;
    margin: 0;
    color: #b7ecd0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.13em;
    line-height: 1.3;
    text-transform: uppercase;
  }

  .hero-slide :is(h1, h2) {
    align-self: start;
    margin: 0;
    font-weight: 600;
    line-height: 0.99;
    letter-spacing: -0.052em;
    text-wrap: balance;
  }

  .hero-slide__body {
    align-self: start;
    margin: 0;
    color: rgb(255 255 255 / 84%);
    line-height: 1.48;
  }

  .hero-slide__actions {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .hero-button {
    border: 1px solid transparent;
    font-weight: 500;
    transition:
      background var(--fcsc-duration-fast),
      border-color var(--fcsc-duration-fast),
      color var(--fcsc-duration-fast),
      transform var(--fcsc-duration-fast),
      box-shadow var(--fcsc-duration-fast);
  }

  .hero-button svg {
    font-size: 12px;
    transition: transform var(--fcsc-duration-fast) var(--fcsc-ease);
  }

  .hero-button:hover,
  .hero-button:focus-visible {
    transform: translateY(-1px);
  }

  .hero-button:hover svg,
  .hero-button:focus-visible svg {
    transform: translateX(3px);
  }

  .hero-button--primary {
    background: #fff;
    color: var(--fcsc-blue-900);
    box-shadow: 0 12px 30px rgb(0 23 41 / 18%);
  }

  .hero-button--primary:hover,
  .hero-button--primary:focus-visible {
    background: #eefaf4;
    box-shadow: 0 15px 34px rgb(0 23 41 / 24%);
  }

  .hero-button--secondary {
    border-color: rgb(255 255 255 / 45%);
    background: rgb(255 255 255 / 7%);
    color: #fff;
    backdrop-filter: blur(8px);
  }

  .hero-button--secondary:hover,
  .hero-button--secondary:focus-visible {
    border-color: rgb(183 236 208 / 78%);
    background: rgb(255 255 255 / 12%);
  }

  .hero-carousel__controls {
    position: absolute;
    z-index: 5;
    right: max(138px, calc((100vw - 1180px) / 2 + 114px));
    bottom: 34px;
    left: max(24px, calc((100vw - 1180px) / 2));
    display: grid;
    align-items: end;
  }

  .hero-carousel__arrows {
    display: flex;
    gap: 8px;
  }

  .hero-carousel__arrows button,
  .hero-carousel__pause {
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgb(255 255 255 / 34%);
    border-radius: 50%;
    background: rgb(2 35 60 / 22%);
    color: #fff;
    cursor: pointer;
    backdrop-filter: blur(10px);
    transition:
      background var(--fcsc-duration-fast),
      border-color var(--fcsc-duration-fast),
      transform var(--fcsc-duration-fast);
  }

  .hero-carousel__arrows button:hover,
  .hero-carousel__arrows button:focus-visible,
  .hero-carousel__pause:hover,
  .hero-carousel__pause:focus-visible {
    border-color: #b7ecd0;
    background: rgb(0 143 80 / 34%);
    transform: scale(1.04);
  }

  .hero-carousel__arrows svg,
  .hero-carousel__pause svg {
    font-size: 12px;
  }

  .hero-carousel__pagination {
    display: grid;
    grid-template-columns: repeat(6, minmax(38px, 1fr));
    max-width: 650px;
  }

  .hero-carousel__pagination button {
    display: grid;
    gap: 0;
    padding: 5px 0 2px;
    border: 0;
    background: transparent;
    color: rgb(255 255 255 / 56%);
    text-align: left;
    cursor: pointer;
  }

  .hero-carousel__pagination i {
    position: relative;
    display: block;
    height: 2px;
    overflow: hidden;
    border-radius: 99px;
    background: rgb(255 255 255 / 27%);
  }

  .hero-carousel__pagination i::after {
    position: absolute;
    inset: 0;
    background: #b7ecd0;
    content: "";
    transform: scaleX(0);
    transform-origin: left;
  }

  .hero-carousel__pagination button[aria-current] {
    color: #fff;
  }

  .hero-carousel__pagination button[aria-current] i::after {
    animation: hero-progress 7.6s linear forwards;
  }

  .hero-carousel:has(.hero-carousel__pause[aria-pressed="true"])
    .hero-carousel__pagination
    button[aria-current]
    i::after,
  .hero-carousel:hover .hero-carousel__pagination button[aria-current] i::after,
  .hero-carousel:focus-within .hero-carousel__pagination button[aria-current] i::after {
    animation-play-state: paused;
  }

  @keyframes hero-progress {
    to {
      transform: scaleX(1);
    }
  }

  @media (max-height: 700px) and (min-width: 641px) {
    .hero-slide__content {
      grid-template-rows: 20px 150px 65px 52px;
      gap: 14px;
    }

    .hero-slide__eyebrow {
      font-size: 10px;
    }

    .hero-slide__body {
      font-size: 16px;
      line-height: 1.4;
    }
  }

  .cookie-card-layer {
    position: fixed;
    z-index: 1100;
    inset: auto 0 0;
    display: flex;
    justify-content: center;
    padding: 0 12px 14px;
    pointer-events: none;
    animation: cookie-card-layer-in 220ms ease both;
  }

  .cookie-card {
    position: relative;
    width: min(620px, calc(100vw - 24px));
    overflow: hidden;
    border: 1px solid rgb(0 65 113 / 12%);
    border-radius: 14px;
    background: #fff;
    box-shadow:
      0 18px 54px rgb(0 36 67 / 20%),
      0 4px 14px rgb(0 36 67 / 9%);
    outline: none;
    pointer-events: auto;
    animation: cookie-card-in 360ms var(--fcsc-ease) both;
  }

  .cookie-card__view {
    animation: cookie-card-view-in 240ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  .cookie-card-layer[data-closing="true"] {
    pointer-events: none;
    animation: cookie-card-layer-out 260ms ease both;
  }

  .cookie-card[data-closing="true"] {
    animation: cookie-card-out 260ms cubic-bezier(0.4, 0, 1, 1) both;
  }

  .cookie-card__body {
    position: relative;
    min-height: 0;
    overflow: hidden;
    background: #fff;
  }

  .cookie-card__art {
    position: absolute;
    z-index: 0;
    top: -28px;
    right: -20px;
    width: 222px;
    height: 162px;
    overflow: hidden;
    pointer-events: none;
  }

  .cookie-card__art::before {
    position: absolute;
    z-index: 0;
    inset: -14px -14px auto auto;
    width: 210px;
    height: 132px;
    border-radius: 0 0 0 62%;
    background: linear-gradient(135deg, rgb(0 82 145 / 9%), rgb(0 145 101 / 15%));
    content: "";
  }

  .cookie-card__art::after {
    position: absolute;
    z-index: 2;
    inset: 0;
    background: linear-gradient(
      90deg,
      #fff 0%,
      rgb(255 255 255 / 92%) 18%,
      rgb(255 255 255 / 22%) 48%,
      transparent 72%
    );
    content: "";
    pointer-events: none;
  }

  .cookie-card__art img {
    position: absolute;
    z-index: 1;
    top: -4px;
    right: -4px;
    width: 198px;
    max-width: none;
    filter: drop-shadow(0 10px 14px rgb(71 41 17 / 14%));
    user-select: none;
    animation: cookie-card-art-float 6.5s ease-in-out infinite;
  }

  .cookie-card__copy {
    position: relative;
    z-index: 1;
    padding: 30px 28px 24px;
  }

  .cookie-card__hello {
    width: max-content;
    max-width: calc(100% - 180px);
    margin: 0;
    color: var(--fcsc-ink);
    font-size: 21px;
    font-weight: 400;
    line-height: 1.2;
  }

  .cookie-card__copy h2 {
    width: max-content;
    max-width: calc(100% - 180px);
    margin: 2px 0 0;
    color: var(--fcsc-blue-900);
    font-size: 33px;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.035em;
  }

  .cookie-card__message {
    max-width: 470px;
    margin: 20px 0 0;
    color: #5f666b;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
  }

  .cookie-card__actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 48px;
    border-top: 1px solid rgb(0 43 76 / 11%);
    background: #fff;
  }

  .cookie-card__actions button {
    min-width: 0;
    min-height: 48px;
    padding: 8px 10px;
    border: 0;
    border-right: 1px solid rgb(0 43 76 / 11%);
    background: #fff;
    color: #666d72;
    font: 400 14px/1.15 var(--fcsc-font);
    cursor: pointer;
    transition:
      background-color 170ms ease,
      color 170ms ease,
      transform 170ms var(--fcsc-ease);
  }

  .cookie-card__actions button:last-child {
    border-right: 0;
  }
  .cookie-card__actions button:hover,
  .cookie-card__actions button:focus-visible {
    background: #f4f8fa;
    color: var(--fcsc-blue-800);
  }
  .cookie-card__actions button:active {
    transform: scale(0.985);
  }

  .cookie-card__actions .cookie-card__accept,
  .cookie-card__actions .cookie-card__accept:visited {
    background-color: var(--fcsc-blue-800);
    color: #fff;
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / 8%);
  }

  .cookie-card__actions .cookie-card__accept:hover,
  .cookie-card__actions .cookie-card__accept:focus-visible {
    background-color: var(--fcsc-blue-700);
    color: #fff;
    box-shadow:
      inset 0 0 0 1px rgb(255 255 255 / 14%),
      0 0 0 3px rgb(10 89 154 / 10%);
    transform: translateY(-1px);
  }

  .cookie-card__actions .cookie-card__accept:active {
    background-color: var(--fcsc-blue-900);
    color: #fff;
    box-shadow: inset 0 2px 6px rgb(0 25 50 / 24%);
    transform: translateY(1px) scale(0.985);
  }

  @keyframes cookie-card-layer-in {
    from {
      opacity: 0;
    }
  }
  @keyframes cookie-card-in {
    from {
      opacity: 0;
      transform: translate3d(0, 24px, 0) scale(0.985);
    }
  }
  @keyframes cookie-card-view-in {
    from {
      opacity: 0;
      transform: translate3d(0, 8px, 0);
    }
  }
  @keyframes cookie-card-layer-out {
    to {
      opacity: 0;
    }
  }
  @keyframes cookie-card-out {
    to {
      opacity: 0;
      transform: translate3d(0, 18px, 0) scale(0.985);
    }
  }
  @keyframes cookie-card-art-float {
    0%,
    100% {
      transform: translate3d(0, 0, 0) rotate(-1deg);
    }
    50% {
      transform: translate3d(-4px, 6px, 0) rotate(1.5deg);
    }
  }

  @media (max-width: 680px) {
    .cookie-card-layer {
      padding: 0 8px 8px;
    }
    .cookie-card {
      width: min(620px, calc(100vw - 16px));
      border-radius: 12px;
    }
    .cookie-card__art {
      opacity: 0.82;
    }
    .cookie-card__copy {
      padding: 24px 21px 20px;
    }
    .cookie-card__hello {
      max-width: calc(100% - 122px);
      font-size: 18px;
    }
    .cookie-card__copy h2 {
      max-width: calc(100% - 122px);
      font-size: 28px;
    }
    .cookie-card__message {
      max-width: calc(100% - 54px);
      margin-top: 17px;
      font-size: 13.5px;
      line-height: 1.48;
    }
    .cookie-card__actions {
      min-height: 44px;
    }
    .cookie-card__actions button {
      min-height: 44px;
      padding: 7px 5px;
      font-size: 12px;
    }
  }

  @media (max-width: 420px) {
    .cookie-card__art {
      opacity: 0.68;
    }
    .cookie-card__hello {
      max-width: calc(100% - 84px);
      font-size: 17px;
    }
    .cookie-card__copy h2 {
      max-width: calc(100% - 84px);
      font-size: 26px;
    }
    .cookie-card__message {
      max-width: calc(100% - 26px);
      font-size: 12.5px;
    }
    .cookie-card__actions button {
      font-size: 10.8px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .cookie-card-layer,
    .cookie-card,
    .cookie-card__view,
    .cookie-card__art img {
      animation: none;
    }
  }

  /* Mobile layout (≤ 980px), shared across pages — Fondation, Mission, Actions & impact, Agir avec nous */
  @media (max-width: 980px) {
    .hero-slide__content {
      bottom: 116px;
      width: min(720px, calc(100vw - 48px));
    }

    .hero-slide :is(h1, h2) {
      font-size: clamp(38px, min(7.2vw, 8.4vh), 68px);
    }

    .hero-slide__veil {
      background:
        linear-gradient(90deg, rgb(2 35 60 / 88%) 0%, rgb(2 45 76 / 70%) 58%, rgb(3 62 78 / 26%) 100%),
        linear-gradient(180deg, rgb(0 35 63 / 22%) 0%, transparent 40%, rgb(0 30 52 / 50%) 100%);
    }

    .hero-carousel__controls {
      grid-template-columns: 94px 1fr 40px;
      gap: 18px;
    }

    .president-section {
      min-height: 0;
    }

    .president-section__content {
      grid-template-columns: minmax(230px, 0.65fr) minmax(0, 1.35fr);
      gap: clamp(36px, 5vw, 56px);
    }

    .president-section__message h1 {
      font-size: clamp(36px, 4.8vw, 52px);
    }

    .team-hierarchy {
      grid-template-columns: repeat(2, minmax(240px, 1fr));
    }

    /* Actions & impact */

    /* Agir avec nous */
    .act-section {
      padding: 76px 20px;
    }
    .act-intro {
      min-height: 100dvh;
      padding-top: calc(var(--fcsc-header-expanded) + 54px);
    }
    .act-intro h1 {
      font-size: clamp(42px, 13.5vw, 62px);
    }
    .act-intro p {
      font-size: 15px;
    }
    .act-intro__content > div {
      flex-direction: column;
      align-items: stretch;
    }
    .act-intro__content a,
    .act-intro__content button {
      justify-content: center;
    }
    .act-intro__veil {
      background: linear-gradient(90deg, rgb(0 27 51 / 91%), rgb(0 39 66 / 54%));
    }

    .act-how__options {
      margin-top: 30px;
    }
    .act-how .act-world-map {
      left: -30%;
      bottom: -8%;
      width: 110vw;
    }
  }

  /* Small mobile (≤ 640px), shared across pages — Mission, Home & header & footer, Foundation, Contact, Actions & impact, Agir avec nous */
  @media (max-width: 640px) {
    .hero-carousel {
      height: 100dvh;
    }

    .hero-slide__media img {
      object-position: var(--hero-focal-point, center);
    }

    .hero-slide__veil {
      background: linear-gradient(
        180deg,
        rgb(1 30 52 / 50%) 0%,
        rgb(2 38 63 / 60%) 34%,
        rgb(2 37 60 / 86%) 72%,
        rgb(1 27 46 / 94%) 100%
      );
    }

    .hero-slide__content {
      top: var(--fcsc-header-expanded);
      bottom: 100px;
      left: 20px;
      grid-template-rows: 18px 190px 94px 80px;
      gap: clamp(9px, 1.8vh, 15px);
      width: calc(100vw - 40px);
    }

    .hero-slide__eyebrow {
      font-size: 9px;
      letter-spacing: 0.11em;
    }

    .hero-slide :is(h1, h2) {
      max-width: 94vw;
      font-size: clamp(31px, 9.4vw, 48px);
      line-height: 1.01;
      letter-spacing: -0.045em;
    }

    .hero-slide__body {
      display: -webkit-box;
      max-width: 92vw;
      overflow: hidden;
      font-size: clamp(13px, 3.7vw, 16px);
      line-height: 1.4;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 4;
    }

    .hero-slide__actions {
      align-items: flex-start;
      flex-direction: column;
      gap: 8px;
    }

    .hero-button {
      min-height: 40px;
      padding: 9px 13px;
      border-radius: 8px;
      font-size: 11px;
    }

    .hero-button--secondary {
      min-height: 32px;
      padding-block: 6px;
    }

    .hero-carousel__controls {
      right: 104px;
      bottom: 20px;
      left: 20px;
      grid-template-columns: 76px 1fr 34px;
      gap: 10px;
    }

    .hero-carousel__arrows {
      gap: 6px;
    }

    .hero-carousel__arrows button,
    .hero-carousel__pause {
      width: 34px;
      height: 34px;
    }

    .hero-carousel__pagination {
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 6px;
    }

    .hero-carousel__pagination button {
      align-self: end;
      padding: 12px 0 10px;
    }

    .hero-carousel__pause {
      position: static;
    }

    .page-section {
      padding: 74px 20px;
    }

    .president-section {
      padding: calc(var(--fcsc-header-expanded) + 38px) 20px 60px;
    }

    .president-section__content {
      grid-template-columns: 1fr;
      gap: 42px;
    }

    .president-section::before {
      top: 7%;
      right: -46%;
      width: 115vw;
      height: 115vw;
    }

    .president-section::after {
      right: -30%;
      bottom: -7%;
      width: 90vw;
      height: 90vw;
    }

    .portrait[data-large] {
      --portrait-size: min(250px, 68vw);
    }

    .president-section__identity strong {
      font-size: 17px;
    }

    .president-section__message h1 {
      font-size: clamp(32px, 9.4vw, 42px);
    }

    .president-section__copy {
      margin-top: 18px;
    }

    .president-section__copy p {
      font-size: 14px;
      line-height: 1.46;
    }

    .governance-section__heading h2 {
      font-size: clamp(34px, 10vw, 46px);
    }

    .governance-section__heading p {
      font-size: 15px;
    }

    .team-hierarchy {
      grid-template-columns: 1fr;
      gap: 62px;
      margin-top: 62px;
    }

    .team-member__portrait-button {
      width: 220px;
      height: 220px;
    }

    .profile-layer {
      padding: 16px;
    }

    .profile-dialog {
      grid-template-columns: 1fr;
      justify-items: center;
      gap: 30px;
      width: 100%;
      max-height: calc(100dvh - 32px);
      padding: 54px 24px 32px;
      border-radius: 16px;
      text-align: center;
    }

    .profile-dialog__portrait .portrait {
      --portrait-size: 176px;
    }

    .profile-dialog__content p {
      margin-top: 13px;
    }

    /* Contact */

    /* Actions & impact */

    /* Agir avec nous */
    .act-how__options,
    .act-after__steps {
      grid-template-columns: 1fr;
    }
  }
  .hero-carousel,
  .hero-carousel__slides,
  .hero-slide,
  .foundation-page > .president-section,
  .act-page > .act-intro,
  .act-page > .act-how {
    min-height: 100dvh;
  }

  @media (max-width: 640px) and (max-height: 680px) {
    .hero-slide__content {
      grid-template-rows: 16px 160px 72px 72px;
      gap: 8px;
    }

    .hero-slide :is(h1, h2) {
      font-size: clamp(29px, 8.7vw, 38px);
    }

    .hero-slide__body {
      font-size: 13px;
      -webkit-line-clamp: 3;
    }

    .hero-slide__actions {
      gap: 6px;
    }

    .hero-button {
      min-height: 36px;
      padding-block: 7px;
    }

    .hero-button--secondary {
      min-height: 30px;
    }
  }

  /* Lot 7 — Agir avec nous */
  .act-page {
    overflow: clip;
    background: #fff;
  }
  .act-section {
    padding: clamp(88px, 9vw, 138px) max(24px, calc((100vw - 1180px) / 2));
    scroll-margin-top: 54px;
  }
  .act-reveal {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition:
      opacity 720ms ease,
      transform 920ms var(--fcsc-ease);
  }
  html[data-act-motion-ready] .act-reveal[data-reveal-pending] {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
  }
  .act-intro {
    position: relative;
    display: grid;
    align-items: center;
    min-height: 100dvh;
    padding-top: calc(var(--fcsc-header-expanded) + 70px);
    overflow: hidden;
    background: var(--fcsc-blue-900);
  }
  .act-intro__image,
  .act-intro__veil {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .act-intro__image {
    object-fit: cover;
    object-position: center;
    pointer-events: none;
    animation: act-photo-in 1.4s var(--fcsc-ease) both;
  }
  @keyframes act-photo-in {
    from {
      opacity: 0;
      transform: scale(1.075);
    }
    to {
      opacity: 1;
      transform: scale(1);
    }
  }
  .act-intro__veil {
    background: linear-gradient(
      90deg,
      rgb(0 27 51 / 91%) 0%,
      rgb(0 39 66 / 76%) 42%,
      rgb(0 39 66 / 18%) 75%,
      rgb(0 39 66 / 28%) 100%
    );
  }
  .act-intro__content {
    position: relative;
    z-index: 1;
    max-width: 880px;
  }
  .act-intro h1 {
    margin: 18px 0 0;
    color: #fff;
    font-weight: 600;
    line-height: 0.98;
    letter-spacing: -0.055em;
  }
  .act-intro p {
    max-width: 700px;
    margin: 30px 0 0;
    color: rgb(255 255 255 / 78%);
    font-size: 18px;
    line-height: 1.65;
  }
  .act-intro .section-eyebrow {
    color: #aeeacb;
  }
  .act-intro__content > div {
    display: flex;
    gap: 12px;
    margin-top: 38px;
  }
  .act-intro__content button {
    cursor: pointer;
    font-family: inherit;
  }
  .act-intro__content a,
  .act-intro__content button {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    border: 0;
    border-radius: 8px;
    background: var(--fcsc-cta-gradient);
    color: #fff;
    font-weight: 600;
    box-shadow: var(--fcsc-cta-shadow);
    transition:
      transform 320ms var(--fcsc-ease),
      box-shadow 320ms ease;
  }
  .act-intro__content a:hover,
  .act-intro__content button:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgb(0 92 100 / 26%);
  }
  .act-world-map {
    position: absolute;
    z-index: 1;
    right: -8%;
    bottom: -6%;
    width: min(880px, 69vw);
    color: #fff;
    opacity: 0.24;
    pointer-events: none;
  }
  .act-world-map circle {
    fill: currentColor;
  }
  .act-how .act-world-map {
    right: auto;
    left: -10%;
    bottom: -18%;
    width: min(720px, 60vw);
    color: var(--fcsc-blue-900);
  }
  .act-why {
    scroll-margin-top: var(--fcsc-header-compact);
    background: var(--fcsc-blue-900);
    color: #fff;
  }
  .act-how {
    position: relative;
    overflow: hidden;
  }
  .act-how__heading h2 {
    margin: 18px 0 0;
    color: var(--fcsc-blue-900);
    line-height: 1.03;
    letter-spacing: -0.045em;
  }
  .act-how__heading p {
    max-width: 650px;
    margin: 22px 0 0;
    color: var(--fcsc-muted);
    line-height: 1.6;
  }
  .act-how__options {
    position: relative;
  }
  .act-how__option {
    text-decoration: none;
    color: inherit;
  }
  .act-how__option svg:first-child {
    color: var(--fcsc-green-600);
    font-size: 22px;
  }
  .act-form {
    border-radius: 19px;
    background: #fff;
    color: var(--fcsc-ink);
    box-shadow: 0 28px 80px rgb(0 20 38 / 26%);
  }
  .act-form fieldset {
    margin: 0;
    padding: 0;
    border: 0;
  }
  .act-form legend,
  .act-form label > span {
    display: block;
    margin-bottom: 12px;
    color: var(--fcsc-blue-900);
    font-size: 12px;
    font-weight: 600;
  }
  .act-form input {
    width: 100%;
    padding: 0 54px 0 15px;
    border: 1.5px solid rgb(11 73 120 / 18%);
    border-radius: 10px;
    background: #fbfdff;
    color: var(--fcsc-ink);
    font: inherit;
    outline: none;
    box-shadow: inset 0 0 0 1px rgb(255 255 255 / 65%);
    transition:
      border-color 180ms ease,
      box-shadow 180ms ease,
      background-color 180ms ease;
  }
  .act-form input:hover {
    border-color: rgb(11 73 120 / 28%);
  }
  .act-form input:focus {
    border-color: rgb(0 145 103 / 44%);
    background: #fff;
    box-shadow: 0 0 0 3px rgb(0 104 164 / 10%);
  }
  .act-form__hint {
    display: block;
    margin-top: 6px;
    color: #5f6b72;
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.4;
  }
  .act-form__trap {
    position: absolute;
    left: -10000px;
  }
  .act-form__status {
    min-height: 20px;
    margin: 9px 0 0;
    color: #a23d38;
    font-size: 11px;
    text-align: center;
  }
  .act-after__heading {
    max-width: 760px;
  }
  .act-after__heading .section-eyebrow {
    color: #d7f0e0;
  }
  .act-after__heading h2 {
    margin: 16px 0 0;
    color: #fff;
    font-size: clamp(32px, 3.8vw, 50px);
    line-height: 1.05;
    letter-spacing: -0.04em;
  }
  .act-after__steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
    margin-top: 48px;
  }
  .act-after__steps article {
    padding: 26px;
    border: 1px solid rgb(255 255 255 / 18%);
    border-radius: 16px;
    background: rgb(255 255 255 / 8%);
  }
  .act-after__steps i {
    display: block;
    color: #d7f0e0;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0.1em;
  }
  .act-after__steps h3 {
    margin: 14px 0 0;
    color: #fff;
    font-size: 18px;
  }
  .act-after__steps p {
    margin: 8px 0 0;
    color: rgb(255 255 255 / 78%);
    font-size: 14px;
    line-height: 1.55;
  }

  @media (prefers-reduced-motion: reduce) {
    /* Universal safety net: near-instant transitions/animations for anything not covered below. */
    *,
    *::before,
    *::after {
      scroll-behavior: auto;
      transition-duration: 0.01ms;
      animation-duration: 0.01ms;
      animation-iteration-count: 1;
    }

    /* Astro page transitions */
    ::view-transition-old(root),
    ::view-transition-new(root) {
      animation: none;
    }

    /* Staggered grid reveals — a near-zero duration still leaves a visible
     gap between items if the delay itself isn't also removed. */
    .act-why-v4__programme,
    .act-after__steps article {
      transition-delay: 0ms;
    }
    .site-toast {
      animation: none;
    }

    /* Actions & impact gauge arc */
  }

  /* Full-viewport section rule — every hero-style section below fills at
   least one screen on desktop (a floor, not a ceiling: content taller than
   one screen simply grows past it). Shared across every page that has this
   kind of section, rather than repeated per page. */
  @media (min-width: 981px) and (min-height: 700px) {
    .act-how {
      box-sizing: border-box;
      min-height: 100dvh;
      scroll-margin-top: var(--fcsc-header-compact);

      padding-top: calc(var(--fcsc-header-compact) + clamp(30px, 4vh, 54px));
      padding-bottom: clamp(34px, 4vh, 56px);

      align-content: center;
    }
  }

  /* Cancels the full-viewport floor above on short viewports too (not just
   narrow ones) — deliberately a wider condition than the general mobile
   block, since it only concerns the sections that opt into that floor. */
  @media (max-width: 980px), (max-height: 699px) {
    .act-how {
      min-height: auto;
    }
  }

  .act-how {
    background: #fff;
  }
  .act-how .act-world-map {
    opacity: 0.1;
  }
  .act-support-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
  }
  .act-support-panel {
    min-height: 100%;
  }
  .act-support-panel--ways {
    background: var(--fcsc-soft-blue);
  }
  .act-support-panel--after {
    background: var(--fcsc-green-700);
    color: #fff;
  }
  .act-how__heading {
    max-width: 600px;
  }
  .act-how__heading p {
    margin-top: 17px;
  }
  .act-how__options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 30px;
  }
  .act-how__option {
    position: relative;
    display: grid;
    gap: 16px;
    border: 1px solid rgb(8 61 104 / 10%);
    border-radius: 14px;
    background: rgb(255 255 255 / 92%);
    box-shadow: 0 10px 28px rgb(5 41 75 / 6%);
    transition:
      border-color 220ms ease,
      box-shadow 220ms ease,
      background 220ms ease;
  }
  .act-how__option:hover,
  .act-how__option:focus-visible {
    border-color: rgb(0 137 91 / 22%);
    background: #fff;
    box-shadow: 0 14px 34px rgb(5 41 75 / 9%);
  }
  .act-how__option > svg:first-of-type {
    display: block;
    background: rgb(5 96 163 / 7%);
    color: var(--fcsc-blue-700);
    box-shadow: inset 0 0 0 1px rgb(5 96 163 / 7%);
  }
  .act-how__option--link > svg:first-of-type {
    color: var(--fcsc-green-700);
    background: rgb(0 145 91 / 8%);
    box-shadow: inset 0 0 0 1px rgb(0 145 91 / 8%);
  }
  .act-how__option h3 {
    margin: 0;
    color: var(--fcsc-blue-800);
    font-size: 17px;
    line-height: 1.25;
  }
  .act-how__option p {
    margin: 6px 0 0;
    color: var(--fcsc-muted);
    font-size: 13px;
    line-height: 1.52;
  }
  .act-how__option--link span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 11px;
    color: var(--fcsc-blue-700);
    font-size: 13px;
    font-weight: 700;
  }
  .act-how__option--link span svg {
    color: var(--fcsc-green-700);
    font-size: 14px;
  }
  .act-how__option--link {
    text-decoration: none;
  }
  .act-support-panel--after .act-after__heading h2 {
    max-width: 430px;
  }
  .act-support-panel--after .act-after__steps {
    grid-template-columns: 1fr;
    gap: 10px;
    margin-top: 30px;
  }
  .act-support-panel--after .act-after__steps article {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 14px;
    min-height: 0;
    padding: 18px 19px;
    border-radius: 13px;
    align-items: start;
  }
  .act-support-panel--after .act-after__icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgb(255 255 255 / 10%);
    color: #d7f0e0;
    font-size: 17px;
  }
  .act-support-panel--after .act-after__steps h3 {
    margin: 0;
    font-size: 16px;
  }
  .act-support-panel--after .act-after__steps p {
    margin-top: 5px;
    font-size: 13px;
  }

  @media (max-width: 640px) {
    .act-support-panel {
      padding: 27px 21px;
      border-radius: 17px;
    }
    .act-how__option {
      grid-template-columns: 34px minmax(0, 1fr);
      padding: 18px 16px;
    }
    .act-how__option > svg:first-of-type {
      width: 22px;
      height: 22px;
      padding: 6px;
      border-radius: 9px;
    }
    .act-support-panel--after .act-after__steps article {
      grid-template-columns: 34px minmax(0, 1fr);
      padding: 16px;
    }
    .act-support-panel--after .act-after__icon {
      width: 34px;
      height: 34px;
      font-size: 15px;
    }
  }

  /* Donation modals */

  @keyframes act-donation-modal-in {
    from {
      opacity: 0;
    }
  }
  @keyframes act-donation-dialog-in {
    from {
      opacity: 0;
      transform: translateY(18px) scale(0.985);
    }
  }

  /* Finitions visuelles et stabilité des cartes */
  .act-why-v4__programme,
  .act-how__option,
  .act-support-panel--after .act-after__steps article {
    -webkit-font-smoothing: antialiased;
    backface-visibility: hidden;
  }

  .act-how__option,
  .act-support-panel,
  .act-why-v4__programme {
    overflow: hidden;
  }

  /* CTA principal, réseaux sociaux et actions compactes */

  /* Réseaux sociaux : Font Awesome uniquement, rendu homogène et contenu. */

  /* CTA principal de la page Agir : verre sobre, sans aplat saturé. */
  .act-intro__content button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 32%);
    background: linear-gradient(135deg, rgb(255 255 255 / 17%), rgb(255 255 255 / 7%));
    color: #fff;
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / 24%),
      0 16px 42px rgb(0 18 38 / 24%);
    backdrop-filter: blur(14px) saturate(125%);
    -webkit-backdrop-filter: blur(14px) saturate(125%);
    letter-spacing: -0.01em;
  }
  .act-intro__content button::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(105deg, transparent 20%, rgb(255 255 255 / 12%) 50%, transparent 80%);
    content: "";
    opacity: 0;
    transform: translateX(-35%);
    transition:
      opacity 320ms ease,
      transform 520ms var(--fcsc-ease);
  }
  .act-intro__content button svg {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    padding: 6px;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(145deg, rgb(35 172 108 / 100%), rgb(10 143 86 / 100%));
    color: #fff;
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / 18%),
      0 12px 24px rgb(8 74 54 / 30%);
    transition:
      transform 320ms var(--fcsc-ease),
      background 220ms ease,
      box-shadow 220ms ease;
  }
  .act-intro__content button:hover {
    border-color: rgb(255 255 255 / 52%);
    background: linear-gradient(135deg, rgb(255 255 255 / 22%), rgb(255 255 255 / 10%));
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / 30%),
      0 20px 48px rgb(0 18 38 / 30%);
  }
  .act-intro__content button:hover::before {
    opacity: 1;
    transform: translateX(35%);
  }
  .act-intro__content button:hover svg {
    transform: translateX(2px) scale(1.03);
    background: linear-gradient(145deg, rgb(44 190 120 / 100%), rgb(11 148 91 / 100%));
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / 22%),
      0 14px 26px rgb(8 74 54 / 36%);
  }

  /* Cartes de choix de paiement : icônes +35 %, centrées verticalement. */

  /* Cartes « Don récurrent / Achat solidaire » : icônes +35 %, centrage vertical. */
  .act-how__option {
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
  }
  .act-how__option > svg:first-of-type {
    align-self: center;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    padding: 9px;
    border-radius: 13px;
  }
  .act-how__link-label {
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }
  .act-how__next {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    margin: 0;
    border: 1px solid rgb(0 145 91 / 32%);
    border-radius: 50%;
    background: rgb(0 145 91 / 6%);
    transition:
      transform 220ms var(--fcsc-ease),
      background 220ms ease;
  }
  .act-how__next svg {
    width: 17px;
    height: 17px;
  }
  .act-how__option--link:hover .act-how__next {
    transform: translateX(3px);
    background: rgb(0 145 91 / 12%);
  }

  @media (max-width: 720px) {
    .act-how__option {
      grid-template-columns: 46px minmax(0, 1fr);
    }
    .act-how__option > svg:first-of-type {
      width: 29px;
      height: 29px;
      padding: 8px;
    }
  }

  /* Flèches de la modale de choix : axe vertical stable et espace réservé. */

  /* Fermeture explicite de la modale de choix du moyen de paiement. */
  @keyframes act-donation-modal-out {
    to {
      opacity: 0;
      backdrop-filter: blur(0);
    }
  }

  @keyframes act-donation-dialog-out {
    to {
      opacity: 0;
      transform: translateY(20px) scale(0.972);
      filter: blur(5px);
    }
  }

  /* Hiérarchie typographique globale : seuls les titres restent en graisse forte. */
  body
    :where(
      p,
      a,
      button,
      label,
      input,
      textarea,
      select,
      option,
      li,
      small,
      span,
      strong,
      b,
      em,
      i,
      blockquote,
      figcaption,
      dt,
      dd,
      th,
      td
    ) {
    font-weight: 400;
  }
  body :where(h1, h2, h3, h4, h5, h6) {
    font-weight: 600;
  }

  .legal-consent-button {
    cursor: pointer;
    font: inherit;
  }

  /* ==========================================================================
   — Normalisation proportionnelle de l’interface
   Réduction ciblée des éléments surdimensionnés, sans zoom CSS global.
   ========================================================================== */

  /* Pages légales : seul le titre principal conserve une forte emphase. */
  .legal-page h1 {
    font-weight: 600;
  }
  .legal-page .section-eyebrow,
  .legal-page .legal-page__updated,
  .legal-page h2,
  .legal-page h3,
  .legal-page h4,
  .legal-page button,
  .legal-page :where(p, li, a, small, span, strong, b, mark, em, i, dt, dd) {
    font-weight: 400;
  }
  .legal-page h2 {
    font-size: 18px;
    letter-spacing: -0.012em;
  }
  .legal-page {
    max-width: 840px;
    padding-top: calc(var(--fcsc-header-expanded) + 54px);
    padding-bottom: 78px;
  }
  .legal-document {
    margin-top: 26px;
    padding: clamp(22px, 3.2vw, 32px);
    border-radius: 18px;
  }
  .legal-document__section + .legal-document__section {
    margin-top: 24px;
    padding-top: 24px;
  }

  /* En-tête : proportions plus légères, hauteur validée inchangée. */

  /* Rythme général des pages. */
  .page-section {
    padding-block: clamp(78px, 8.6vw, 128px);
  }
  .section-eyebrow {
    margin-bottom: 14px;
    font-size: 10px;
    letter-spacing: 0.12em;
  }

  /* Accueil : hero, boutons et commandes. */
  .hero-slide__content {
    grid-template-rows: 22px 270px 80px 46px;
    gap: clamp(12px, 1.8vh, 19px);
    width: min(720px, calc(100vw - 48px));
  }
  .hero-slide :is(h1, h2) {
    max-width: 720px;
    font-size: clamp(36px, min(4.7vw, 7.6vh), 68px);
  }
  .hero-slide__body {
    max-width: 640px;
    font-size: clamp(15px, 1.3vw, 18px);
  }
  .hero-carousel__controls {
    grid-template-columns: 84px 1fr 36px;
    gap: 22px;
  }
  .hero-carousel__arrows button,
  .hero-carousel__pause {
    width: 36px;
    height: 36px;
  }
  .hero-carousel__pagination {
    gap: 8px;
  }

  /* La Fondation. */
  .president-section {
    min-height: min(820px, 100svh);
  }
  .portrait[data-large] {
    --portrait-size: clamp(230px, 21vw, 290px);
  }
  .president-section__message h1 {
    font-size: clamp(36px, 4.1vw, 56px);
  }
  .president-section__copy p {
    font-size: 14px;
  }
  .president-section__identity strong {
    font-size: 17px;
  }
  .governance-section__heading h2 {
    font-size: clamp(34px, 4vw, 56px);
  }
  .governance-section__heading p {
    font-size: 15px;
  }
  .team-hierarchy {
    gap: 58px 42px;
    margin-top: 64px;
  }
  .team-member__portrait-button {
    width: 208px;
    height: 208px;
  }
  .team-member__portrait-button .portrait {
    --portrait-size: 194px;
  }
  .team-member__identity {
    min-height: 104px;
    margin-top: 15px;
  }
  .team-member__identity h3 {
    min-height: 42px;
    font-size: 16px;
  }

  /* Mission Cœur 3000. */

  /* Actions & impact. */

  /* Agir avec nous. */
  .act-intro__content {
    width: min(760px, calc(100vw - 48px));
  }
  .act-intro h1 {
    max-width: 760px;
    font-size: clamp(42px, 5.55vw, 72px);
  }
  .act-intro__content > p {
    max-width: 650px;
    font-size: clamp(15px, 1.3vw, 18px);
  }
  .act-intro__content a,
  .act-intro__content button {
    min-height: 44px;
    padding: 10px 18px;
    font-size: 12px;
  }
  .act-section {
    padding-block: clamp(72px, 8vw, 114px);
  }

  .act-support-panel {
    padding: clamp(26px, 3.4vw, 42px);
    border-radius: 18px;
  }
  .act-how__heading h2,
  .act-support-panel--after .act-after__heading h2 {
    font-size: clamp(28px, 3.05vw, 41px);
  }
  .act-how__option {
    padding: 17px 18px;
  }
  .act-form {
    padding: clamp(24px, 3.3vw, 40px);
  }
  .act-form input {
    height: 48px;
  }

  /* Formulaires et fenêtres communes. */
  .contact-form > button,
  .contact-page__email {
    padding: 10px 15px;
  }
  .cookie-card__accept {
    min-height: 44px;
  }

  /* Bouton flottant : réduction de l'élément très visible. */

  @media (max-width: 900px) {
    .page-section,
    .act-section {
      padding-block: 66px;
    }

    .hero-slide__content {
      width: calc(100vw - 40px);
    }
    .hero-slide :is(h1, h2) {
      font-size: clamp(34px, 10.5vw, 54px);
    }
    .hero-slide__body {
      font-size: 16px;
    }
    .hero-button {
      min-height: 44px;
    }

    .president-section__message h1 {
      font-size: clamp(30px, 8.8vw, 40px);
    }
    .governance-section__heading h2 {
      font-size: clamp(30px, 8.8vw, 41px);
    }
    .team-member__portrait-button {
      width: 190px;
      height: 190px;
    }
    .team-member__portrait-button .portrait {
      --portrait-size: 176px;
    }

    .act-intro h1 {
      font-size: clamp(36px, 10.8vw, 54px);
    }
    .act-how__heading h2,
    .act-support-panel--after .act-after__heading h2 {
      font-size: clamp(27px, 7.8vw, 36px);
    }

    .legal-page {
      padding: calc(var(--fcsc-header-expanded) + 40px) 20px 64px;
    }
    .legal-page h1 {
      font-size: clamp(30px, 8.8vw, 40px);
    }
    .legal-page h2 {
      font-size: 17px;
    }
  }

  @media (max-width: 640px) {
    .page-section,
    .act-section {
      padding-block: 58px;
    }
    .section-eyebrow {
      margin-bottom: 11px;
    }
    .legal-document {
      padding: 20px 18px;
      border-radius: 15px;
    }
  }
}

/* FCSC V2.4.0 — couche layout. */
@layer fcsc.layout {
  /*
 * Mise en page et composants : librairie (cartes, fiche, panier), Mission Cœur 3000, choix du moyen de paiement, livre blanc, identité définitive du logo, corrections mobiles.
 */

  /* — alignement du bloc dons et cohérence des actions légales. */
  .legal-consent-button {
    border: 1px solid rgb(6 71 95 / 14%);
  }

  /* Mission Cœur 3000 — editorial refonte */

  /* — densification ciblée de Mission Cœur 3000.
   Le hero et le bloc historique des quatre cartes circulaires ne sont pas modifiés. */

  /* — Mission 3000 title refinement + Cameroon watermark */

  /* Actions & impact — epidemiological study model.
   Kept separate from global.css so this complex section has one canonical
   source of truth instead of version-stacked overrides. */

  /* One macro-card: both study workflow and disease scope share the same
   outer frame and therefore can never end on different baselines. */

  /* Mobile first-section header clearance.
   This rule lives after global.css and overrides generic section padding. */

  /* Closing subscription block — keeps the Cameroon map while avoiding any
   premature claims about impact before Mission Cœur 3000 is completed. */

  /* Foundation commitments — content-sized section.
   This section is intentionally exempt from the global full-viewport rule. */

  /*
 * Agir avec nous — bloc bleu sous le hero, .
 * Composition compacte corrigée : carte éditoriale et carte programmes
 * sur la même hauteur, puis bandeau paiement pleine largeur.
 */

  .act-page .act-why-v4 {
    position: relative;
    box-sizing: border-box;
    min-height: 0;
    height: auto;
    padding-top: clamp(36px, 3.8vw, 52px);
    padding-bottom: clamp(36px, 3.8vw, 52px);
    overflow: hidden;
    background:
      radial-gradient(circle at 3% 0%, rgb(141 221 179 / 14%), transparent 26%),
      radial-gradient(circle at 98% 2%, rgb(91 181 244 / 14%), transparent 25%),
      linear-gradient(158deg, #0a3b5f 0%, #08324f 53%, #06283f 100%);
    color: #fff;
    scroll-margin-top: calc(var(--fcsc-header-compact) + 18px);
  }

  .act-page .act-why-v4::before,
  .act-page .act-why-v4::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
    border-radius: 999px;
    filter: blur(46px);
  }

  .act-page .act-why-v4::before {
    top: -86px;
    right: -74px;
    width: 250px;
    height: 250px;
    background: rgb(141 221 179 / 15%);
  }

  .act-page .act-why-v4::after {
    bottom: -120px;
    left: -90px;
    width: 290px;
    height: 290px;
    background: rgb(87 172 235 / 13%);
  }

  .act-page .act-why-v4__layout {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1.6fr);
    align-items: stretch;
    width: 100%;
    min-width: 0;
  }

  .act-page .act-why-v4__story,
  .act-page .act-why-v4__programmes-panel,
  .act-page .act-why-v4__payment-panel {
    min-width: 0;
    border-radius: 24px;
  }

  .act-page .act-why-v4__story {
    display: grid;
    grid-template-rows: auto 1fr;
    align-content: stretch;
    gap: 14px;
    height: 100%;
    padding: clamp(18px, 1.65vw, 24px);
  }

  .act-page .act-why-v4__work {
    display: contents;
  }

  .act-page .act-why-v4__programmes-panel,
  .act-page .act-why-v4__payment-panel {
    padding: clamp(18px, 1.55vw, 22px);
  }

  .act-page .act-why-v4__programmes-panel {
    display: grid;
    align-content: start;
  }

  .act-page .act-why-v4__payment-panel {
    display: grid;
    grid-column: 1 / -1;
  }

  .act-page .act-why-v4__heading h2,
  .act-page .act-why-v4__heading h3 {
    margin: 10px 0 0;
    font-size: clamp(29px, 2.6vw, 42px);
    font-weight: 650;
    line-height: 1.02;
    letter-spacing: -0.045em;
    text-wrap: balance;
  }

  .act-page .act-why-v4__heading--compact h2 {
    max-width: 14ch;
    font-size: clamp(27px, 2.25vw, 37px);
  }

  .act-page .act-why-v4__heading--payment h3 {
    max-width: 12ch;
    font-size: clamp(25px, 2vw, 34px);
  }

  .act-page .act-why-v4__quote,
  .act-page .act-why-v4__programme {
    transition:
      transform 260ms cubic-bezier(0.22, 1, 0.36, 1),
      border-color 220ms ease,
      background 220ms ease,
      box-shadow 220ms ease;
  }

  .act-page .act-why-v4__quote {
    align-self: end;
    display: grid;
    gap: 13px;
    margin: 0;
    border-radius: 18px;
  }

  .act-page .act-why-v4__quote > svg {
    width: 20px;
    height: 20px;
  }

  .act-page .act-why-v4__quote > p {
    margin: 0;
    font-size: clamp(13.5px, 0.94vw, 14.5px);
    font-style: italic;
    line-height: 1.54;
  }

  .act-page .act-why-v4__quote footer {
    display: grid;
    gap: 3px;
  }

  .act-page .act-why-v4__quote footer strong {
    font-size: 13px;
  }

  .act-page .act-why-v4__quote footer span {
    font-size: 11px;
    line-height: 1.42;
  }

  .act-page .act-why-v4__programmes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
  }

  .act-page .act-why-v4__programme {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    min-width: 0;
    min-height: 98px;
    border-radius: 17px;
  }

  .act-page .act-why-v4__programme:hover,
  .act-page .act-why-v4__quote:hover {
    transform: translateY(-3px);
  }

  .act-page .act-why-v4__icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  .act-page .act-why-v4__icon svg {
    width: 18px;
    height: 18px;
  }

  .act-page .act-why-v4__copy {
    display: grid;
    align-content: start;
    gap: 4px;
    min-width: 0;
  }

  .act-page .act-why-v4__copy h3 {
    margin: 0;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.24;
  }

  .act-page .act-why-v4__copy p {
    margin: 0;
    font-size: 11px;
  }

  .act-page .act-why-v4__payments {
    display: grid;
    align-items: stretch;
  }

  .act-page .act-payment-choice {
    position: relative;
    width: 100%;
    min-width: 0;
    text-align: left;
    overflow: hidden;
    cursor: pointer;
    transition:
      transform 240ms var(--fcsc-ease),
      border-color 220ms ease,
      box-shadow 240ms ease,
      background 240ms ease;
  }

  .act-page .act-payment-choice::before {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgb(255 255 255 / 5%), transparent 42%, rgb(255 255 255 / 2%));
    pointer-events: none;
  }

  .act-page .act-payment-choice::after {
    position: absolute;
    inset: auto 18px 0;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: linear-gradient(90deg, rgb(141 221 179 / 95%), rgb(78 159 224 / 95%));
    opacity: 0.92;
  }

  .act-page .act-payment-choice[data-method="world"]::after {
    background: linear-gradient(90deg, rgb(88 176 230 / 95%), rgb(155 224 193 / 95%));
  }

  .act-page .act-payment-choice__meta {
    letter-spacing: 0.11em;
    text-transform: uppercase;
  }

  .act-page .act-payment-choice__cta {
    display: grid;
    place-items: center;
    border-radius: 999px;
    transition:
      transform 220ms ease,
      background 220ms ease,
      border-color 220ms ease;
  }

  .act-page .act-payment-choice__cta svg {
    width: 20px;
    height: 20px;
  }

  .act-page .act-payment-choice__copy {
    min-width: 0;
  }

  .act-page .act-payment-choice__copy h3 {
    margin: 0;
    max-width: 13ch;
    color: #fff;
    font-size: 16px;
    font-weight: 680;
    line-height: 1.05;
    letter-spacing: -0.025em;
    text-wrap: balance;
  }

  .act-page .act-payment-choice__copy p {
    margin: 0;
    max-width: 29ch;
    color: rgb(227 239 248 / 82%);
    font-size: 11.5px;
    line-height: 1.52;
  }

  .act-page .act-payment-choice:hover,
  .act-page .act-payment-choice[data-active] {
    border-color: rgb(174 234 203 / 46%);
  }

  .act-page .act-payment-choice:hover .act-payment-choice__cta,
  .act-page .act-payment-choice[data-active] .act-payment-choice__cta {
    transform: translateX(2px);
    border-color: rgb(174 234 203 / 28%);
  }

  @media (max-width: 1120px) {
    .act-page .act-why-v4__layout {
      grid-template-columns: 1fr;
    }

    .act-page .act-why-v4__story,
    .act-page .act-why-v4__programmes-panel,
    .act-page .act-why-v4__payment-panel {
      grid-column: auto;
      height: auto;
    }

    .act-page .act-why-v4__work {
      display: grid;
      gap: clamp(16px, 2vw, 24px);
    }

    .act-page .act-why-v4__payment-panel {
      grid-template-columns: minmax(220px, 0.6fr) minmax(0, 1.4fr);
    }
  }

  @media (max-width: 760px) {
    .act-page .act-why-v4 {
      padding-top: 38px;
      padding-bottom: 42px;
      scroll-margin-top: calc(var(--fcsc-header-expanded) + 16px);
    }

    .act-page .act-why-v4__programmes,
    .act-page .act-why-v4__payments {
      grid-template-columns: 1fr;
    }

    .act-page .act-why-v4__programme,
    .act-page .act-payment-choice {
      min-height: 0;
    }

    .act-page .act-payment-choice__copy h3 {
      max-width: 12ch;
    }
  }

  /* Le contenu du premier écran mobile commence toujours sous le header fixe. */
  @media (max-width: 900px) {
    .act-page .act-intro {
      box-sizing: border-box;
      align-items: start;
      min-height: 100dvh;
      padding-top: calc(var(--fcsc-header-expanded) + 34px);
      padding-bottom: 52px;
    }

    .act-page .act-intro__content {
      width: min(100%, calc(100vw - 40px));
      margin-top: 0;
    }
  }

  @media (max-width: 420px), (max-height: 700px) {
    .act-page .act-intro {
      min-height: auto;
      padding-top: calc(var(--fcsc-header-expanded) + 26px);
      padding-bottom: 44px;
    }
  }

  /* Sélecteur du moyen de paiement — implémentation isolée. */

  @keyframes donation-method-overlay-in {
    from {
      opacity: 0;
    }
  }

  @keyframes donation-method-overlay-out {
    to {
      opacity: 0;
    }
  }

  @keyframes donation-method-dialog-in {
    from {
      opacity: 0;
      transform: translateY(14px) scale(0.985);
    }
  }

  @keyframes donation-method-dialog-out {
    to {
      opacity: 0;
      transform: translateY(12px) scale(0.985);
    }
  }

  .payment-return {
    display: grid;
    place-items: center;
    min-height: 100dvh;
    padding: 140px 24px 80px;
    background: #fff;
  }
  .payment-return > div {
    max-width: 760px;
    text-align: center;
  }
  .payment-return h1 {
    margin: 18px 0 0;
    color: #003d70;
    font-size: clamp(42px, 6vw, 76px);
    line-height: 1;
    letter-spacing: -0.05em;
  }
  .payment-return p {
    margin: 26px auto 0;
    max-width: 620px;
    color: #627583;
    line-height: 1.65;
  }
  .payment-return small {
    display: block;
    margin-top: 22px;
    color: #7e8d96;
  }
  .payment-return a {
    display: inline-flex;
    margin-top: 34px;
    padding: 15px 20px;
    border-radius: 999px;
    background: #003d70;
    color: #fff;
  }

  /* runtime fallback, mobile alignment and floating-control collision safety. */

  /* Corrections mobiles vérifiées sur les mises en page livrées. */

  /* Defensive rule: even an obsolete cached header module cannot expose its
   former decorative 01–05 labels. The current header no longer emits them. */

  /* Cookie artwork: centre the complete illustration inside its reserved area
   instead of anchoring it to the right edge, where Safari could crop it. */
  @media (max-width: 680px) {
    .cookie-card__art {
      top: -8px;
      right: 10px;
      width: 184px;
      height: 138px;
    }

    .cookie-card__art img {
      top: 0;
      right: auto;
      left: 50%;
      width: 148px;
      margin-left: -74px;
    }
  }

  @media (max-width: 420px) {
    .cookie-card__art {
      top: -4px;
      right: 8px;
      width: 146px;
      height: 122px;
    }

    .cookie-card__art img {
      top: 0;
      right: auto;
      left: 50%;
      width: 132px;
      margin-left: -66px;
    }
  }

  /* Cameroon closing map: centre both the wrapper and the SVG itself on narrow
   screens; no desktop translation or inherited alignment can survive here. */

  /* — cookie artwork in smartphone landscape (mobile navigation remains active up to 980px). */
  @media (min-width: 681px) and (max-width: 980px) {
    .cookie-card__art {
      top: -8px;
      right: 0;
      width: 220px;
      height: 146px;
    }

    .cookie-card__art img {
      top: 0;
      right: auto;
      left: 50%;
      width: 180px;
      margin-left: -90px;
    }
  }

  /* The cookie body must never be wider than its card. A late legacy 720px rule
   displaced the artwork and made Safari crop it on narrow/landscape screens. */
  .cookie-card__body {
    width: 100%;
    max-width: 100%;
  }

  /* — identité officielle FCSC : logo horizontal définitif. */

  /* =========================================================
   Couche visuelle de production consolidée
   ========================================================= */
  :root {
    --v2-header-h: 88px;
  }
  body {
    background: #fbfcfc;
  }
  .v2-home {
    background: #fff;
  }
  .v2-manifesto {
    display: grid;
    place-items: center;
    text-align: center;
    min-height: 310px;
    padding: 72px 24px;
    background: linear-gradient(180deg, #fff, #f8fbfa);
  }
  .v2-manifesto span,
  .v2-section-head > span {
    color: var(--fcsc-green-700);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
  }
  .v2-manifesto h2 {
    max-width: 880px;
    margin: 16px 0 0;
    color: #0b3557;
    font-size: clamp(34px, 5vw, 64px);
    line-height: 0.98;
    letter-spacing: -0.055em;
  }
  .v2-manifesto p {
    max-width: 720px;
    margin: 22px 0 0;
    color: #5e7180;
    font-size: clamp(16px, 1.7vw, 20px);
    line-height: 1.65;
  }
}

/* FCSC V2.4.0 — couche components. */
@layer fcsc.components {
  .v2-inner-hero {
    position: relative;
    display: flex;
    overflow: hidden;
    background: #0d2e44;
  }
  .v2-inner-hero > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;

    object-position: center;
  }
  .v2-inner-hero__veil {
    position: absolute;
    inset: 0;
    content: "";
  }
  .v2-inner-hero__copy {
    position: relative;
    z-index: 2;
    margin: 0 auto;
    color: #fff;
  }
  .v2-inner-hero__copy span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #d9efdf;
    /* Les libellés des CTA doivent hériter de la couleur du bouton, pas de l’eyebrow. */
  }
  .v2-inner-hero__copy .hero-button > span {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
  }
  .v2-inner-hero__copy h1 {
    margin: 14px 0 0;
    line-height: 0.93;
    letter-spacing: -0.06em;
  }
  .v2-inner-hero__copy p {
    margin: 22px 0 0;
    line-height: 1.55;
    color: rgb(255 255 255 / 86%);
  }
  .v2-section {
    padding: clamp(76px, 9vw, 128px) max(24px, calc((100vw - 1240px) / 2));
  }
  .v2-section-head {
    max-width: 800px;
    margin-bottom: 44px;
  }
  .v2-section-head h2 {
    margin: 13px 0 0;
    color: #0c3555;
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1;
    letter-spacing: -0.05em;
  }
  .v2-section-head p {
    margin: 18px 0 0;
    color: #607481;
    font-size: 16px;
    line-height: 1.7;
  }
  .v2-action-stack {
    display: grid;
    gap: 28px;
  }
  .v2-action-card {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
    align-items: stretch;
    min-height: 390px;
    overflow: hidden;
    border: 1px solid rgb(5 67 92 / 8%);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 22px 54px rgb(6 47 72 / 7%);
  }
  .v2-action-card:nth-child(even) {
    grid-template-columns: minmax(320px, 0.92fr) minmax(0, 1.08fr);
  }
  .v2-action-card:nth-child(even) > img {
    order: 2;
  }
  .v2-action-card > img {
    width: 100%;
    height: 100%;
    min-height: 390px;
    object-fit: cover;
  }
  .v2-action-card > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(30px, 5vw, 62px);
  }
  .v2-action-card small {
    display: flex;
    gap: 8px;
    align-items: center;
    color: var(--fcsc-green-700);
    font-size: 12px;
  }
  .v2-action-card h3 {
    margin: 16px 0 0;
    color: #103a58;
    font-size: clamp(27px, 3vw, 40px);
    line-height: 1.06;
    letter-spacing: -0.035em;
  }
  .v2-action-card p {
    margin: 16px 0 0;
    color: #647581;
    line-height: 1.65;
  }
  .v2-future {
    background: #071b2a;
    color: #fff;
  }
  .v2-future .v2-section-head h2 {
    color: #fff;
  }
  .v2-future .v2-section-head p {
    color: rgb(255 255 255 / 67%);
  }
  .v2-future-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
  .v2-future-card {
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 8%);
    border-radius: 26px;
    background: #0b2536;
    box-shadow: 0 20px 50px rgb(0 0 0 / 12%);
  }
  .v2-future-card img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
  }
  .v2-future-card > div {
    padding: 26px;
  }
  .v2-future-card span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #d7b565;
    font-size: 12px;
  }
  .v2-future-card h3 {
    margin: 13px 0 0;
    font-size: 25px;
    line-height: 1.08;
  }
  .v2-future-card p {
    margin: 12px 0 0;
    color: rgb(255 255 255 / 66%);
    line-height: 1.55;
  }
  .v2-news-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
  }
  .v2-news-card {
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    text-align: left;
    border: 1px solid rgb(5 61 85 / 8%);
    border-radius: 22px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 12px 30px rgb(4 45 68 / 5%);
    transition:
      transform 0.22s var(--fcsc-ease),
      box-shadow 0.22s ease;
  }
  .v2-news-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 38px rgb(4 45 68 / 10%);
  }
  .v2-news-card img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
  }
  .v2-news-card > span {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 18px;
  }
  .v2-news-card small {
    color: var(--fcsc-green-700);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
  }
  .v2-news-card strong {
    margin-top: 8px;
    color: #133c59;
    font-size: 16px;
    line-height: 1.25;
  }
  .v2-news-card em {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding-top: 22px;
    color: #6d7e88;
    font-size: 12px;
    font-style: normal;
  }
  .v2-reveal {
    opacity: 0;
    transform: translateY(20px);
    transition:
      opacity 0.7s var(--fcsc-ease),
      transform 0.7s var(--fcsc-ease);
  }
  .v2-action-card[data-side="left"] {
    transform: translateX(-26px);
  }
  .v2-action-card[data-side="right"] {
    transform: translateX(26px);
  }
  .v2-reveal[data-visible="true"] {
    opacity: 1;
    transform: none;
  }
  .v2-future-card:nth-child(2) {
    transition-delay: 0.08s;
  }
  .v2-future-card:nth-child(3) {
    transition-delay: 0.16s;
  }
  .v2-news-card:nth-child(2) {
    transition-delay: 0.05s;
  }
  .v2-news-card:nth-child(3) {
    transition-delay: 0.1s;
  }
  .v2-news-card:nth-child(4) {
    transition-delay: 0.15s;
  }
  .v2-news-card:nth-child(5) {
    transition-delay: 0.2s;
  }
  /* support spacing under floating header */
  .act-page .act-intro {
    padding-top: max(var(--v2-header-h), 72px);
  }
  @media (max-width: 980px) {
    .v2-future-grid {
      grid-template-columns: 1fr;
    }
    .v2-news-grid {
      grid-template-columns: repeat(2, 1fr);
    }
    .v2-action-card,
    .v2-action-card:nth-child(even) {
      grid-template-columns: 1fr;
    }
    .v2-action-card:nth-child(even) > img {
      order: 0;
    }
    .v2-action-card > img {
      min-height: 280px;
      aspect-ratio: 16/9;
    }
  }
  @media (max-width: 640px) {
    .v2-home .hero-carousel {
      min-height: 720px;
    }
    .v2-manifesto {
      min-height: 280px;
      padding: 58px 22px;
    }
    .v2-manifesto h2 {
      font-size: 38px;
    }
    .v2-inner-hero {
      min-height: 640px;
    }
    .v2-inner-hero__copy {
      padding: 160px 0 54px;
    }
    .v2-inner-hero__copy h1 {
      font-size: 50px;
    }
    .v2-section {
      padding: 68px 18px;
    }
    .v2-section-head {
      margin-bottom: 30px;
    }
    .v2-action-card {
      border-radius: 22px;
    }
    .v2-action-card > div {
      padding: 28px 24px;
    }
    .v2-future-card {
      border-radius: 21px;
    }
    .v2-news-grid {
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }
    .v2-news-card strong {
      font-size: 14px;
    }
    .v2-news-card > span {
      padding: 14px;
    }
    .act-page .act-intro {
      padding-top: 76px;
    }
  }
  @media (max-width: 420px) {
    .v2-news-grid {
      grid-template-columns: 1fr;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .v2-reveal,
    .v2-news-card {
      transition: none;
      animation: none;
    }
    .v2-reveal {
      opacity: 1;
      transform: none;
    }
  }
  .v2-future-card.v2-reveal {
    transform: translateY(24px) scale(0.975);
  }
  .v2-news-card.v2-reveal {
    transform: translateY(12px);
    clip-path: inset(0 0 22% 0 round 22px);
    transition:
      opacity 0.68s var(--fcsc-ease),
      transform 0.68s var(--fcsc-ease),
      clip-path 0.72s var(--fcsc-ease),
      box-shadow 0.22s ease;
  }
  .v2-future-card.v2-reveal[data-visible="true"],
  .v2-news-card.v2-reveal[data-visible="true"] {
    transform: none;
    clip-path: inset(0 round 22px);
  }
  @media (prefers-reduced-motion: reduce) {
    .v2-news-card.v2-reveal {
      clip-path: none;
    }
  }

  /* Transparence éditoriale et variantes responsive. */
  .v2-illustration-media {
    min-width: 0;
  }
  .v2-illustration-media > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  @media (max-width: 720px) {
    .president-section > picture,
    .act-intro > picture,
    .v2-inner-hero > picture {
      display: contents;
    }
  }
  /* Adaptation des cartes après ajout des mentions d’illustration. */
  .v2-action-card > .v2-illustration-media {
    padding: 0;
  }
  .v2-future-card > .v2-illustration-media {
    padding: 0;
  }
  .v2-future-card > .v2-illustration-media > img {
    aspect-ratio: 4/3;
  }
  .v2-news-card > .v2-illustration-media > img {
    aspect-ratio: 4/3;
  }
  @media (max-width: 980px) {
    .v2-action-card:nth-child(even) > .v2-illustration-media {
      order: 0;
    }
    .v2-action-card > .v2-illustration-media,
    .v2-action-card > .v2-illustration-media > img {
      min-height: 280px;
    }
    .v2-action-card > .v2-illustration-media > img {
      aspect-ratio: 16/9;
    }
  }
  .v2-inner-hero > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  /* Normalisation responsive finale des images. */
  .president-section > picture,
  .act-intro > picture {
    display: contents;
  }
  @media (max-width: 720px) {
    .v2-inner-hero > picture {
      display: block;
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
    }
  }

  /* =========================================================
   Finitions de l’en-tête, de la navigation, du pied de page et des actions
   ========================================================= */
  :root {
    --v2-shell: 1180px;
    --v2-gutter: max(24px, calc((100vw - var(--v2-shell)) / 2));
  }
  .hero-slide__content {
    left: var(--v2-gutter);
  }
  .v2-section {
    padding-left: var(--v2-gutter);
    padding-right: var(--v2-gutter);
  }

  /* Actions & Impact: picture layer and media wrappers */
  .v2-inner-hero > picture {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .v2-inner-hero > picture img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .v2-action-card > .v2-illustration-media {
    min-width: 0;
    min-height: 390px;
    overflow: hidden;
  }
  .v2-action-card > .v2-illustration-media > img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 390px;
    object-fit: cover;
  }
  .v2-action-card:nth-child(even) > .v2-illustration-media {
    order: 2;
  }
  .v2-action-card > .v2-action-card__copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(30px, 5vw, 62px);
  }
  .v2-future-card > .v2-illustration-media {
    aspect-ratio: 4/3;
    overflow: hidden;
  }
  .v2-future-card > .v2-illustration-media > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .v2-future-card > .v2-future-card__copy {
    padding: 26px;
  }
  .v2-news-card > .v2-illustration-media {
    aspect-ratio: 4/3;
    overflow: hidden;
  }
  .v2-news-card > .v2-illustration-media > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .v2-news-card > .v2-news-card__copy {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 18px;
  }
  .v2-illustration-media {
    position: relative;
  }

  /* Footer social icons: crisp SVG marks, restrained and consistent with FCSC. */

  /* Slightly earlier compact navigation prevents tablet/narrow desktop clipping. */
  @media (max-width: 640px) {
    :root {
      --v2-gutter: 16px;
    }
    .v2-action-card > .v2-illustration-media {
      min-height: 260px;
    }
    .v2-action-card > .v2-illustration-media > img {
      min-height: 260px;
      aspect-ratio: 16/10;
    }
    .v2-action-card:nth-child(even) > .v2-illustration-media {
      order: 0;
    }
    .v2-action-card > .v2-action-card__copy {
      padding: 28px 24px;
    }
  }

  /* =========================================================
   En-tête raffiné, héros plein écran et
   Foundation / Support visual refresh
   ========================================================= */
  :root {
    --v203-header-h: 84px;
    --v203-shell: 1180px;
    --v203-gutter: max(24px, calc((100vw - var(--v203-shell)) / 2));
    --v203-navy: #0a3658;
    --v203-gold: #d4ad5e;
  }

  /* Header: invisible container at the top of a hero. Only the controls float. */
  .v2-home .hero-carousel,
  .v2-inner-hero,
  .foundation-page .president-section,
  .act-page .act-intro {
    width: 100%;
    min-height: 100dvh;
  }
  .v2-inner-hero {
    height: 100dvh;
    align-items: center;
  }
  .v2-inner-hero__copy {
    width: min(var(--v203-shell), calc(100vw - 48px));
    margin-inline: auto;
    padding: clamp(116px, 15vh, 168px) 0 clamp(36px, 6vh, 70px);
    translate: 0 -3vh;
  }
  .v2-inner-hero__veil {
    background:
      linear-gradient(90deg, rgb(3 31 52 / 72%) 0%, rgb(3 31 52 / 28%) 58%, rgb(3 31 52 / 13%) 100%),
      linear-gradient(180deg, rgb(2 27 46 / 6%) 15%, rgb(3 31 52 / 74%) 100%);
  }
  .v2-inner-hero__copy h1 {
    font-size: clamp(58px, 7.6vw, 102px);
    max-width: 980px;
  }
  .v2-inner-hero__copy p {
    max-width: 760px;
    font-size: clamp(17px, 1.65vw, 21px);
  }

  /* Foundation — preserve the content and spirit, renew the visual language. */
  .foundation-page {
    background: #fff;
  }
  .foundation-page .president-section {
    display: flex;
    align-items: center;
    padding: calc(var(--v203-header-h) + 44px) var(--v203-gutter) 60px;
  }
  .foundation-page .president-section__background {
    transform: scale(1.015);
    filter: saturate(0.96) contrast(1.025);
  }
  .foundation-page .president-section__veil {
    background:
      linear-gradient(
        90deg,
        rgb(2 31 51 / 76%) 0%,
        rgb(3 39 64 / 69%) 42%,
        rgb(4 37 58 / 53%) 72%,
        rgb(4 30 49 / 46%) 100%
      ),
      linear-gradient(180deg, rgb(1 24 39 / 11%) 0%, rgb(1 25 42 / 31%) 100%);
  }
  .foundation-page .president-section::before,
  .foundation-page .president-section::after {
    display: none;
  }
  .foundation-page .president-section__glow {
    background:
      radial-gradient(circle at 18% 72%, rgb(70 185 129 / 13%), transparent 28%),
      radial-gradient(circle at 78% 22%, rgb(74 153 203 / 9%), transparent 31%);
  }
  .foundation-page .president-section__content {
    grid-template-columns: minmax(220px, 0.66fr) minmax(0, 1.34fr);
    gap: clamp(52px, 7vw, 96px);
    width: min(var(--v203-shell), 100%);
    align-items: center;
  }
  .foundation-page .portrait[data-large] {
    --portrait-size: clamp(210px, 20vw, 268px);
    padding: 3px;
    background: rgb(255 255 255 / 76%);
    box-shadow: 0 24px 64px rgb(0 17 31 / 28%);
  }
  .foundation-page .portrait[data-large] .portrait__inner {
    border: 2px solid rgb(255 255 255 / 72%);
  }
  .foundation-page .president-section__identity {
    gap: 3px;
    width: min(300px, 100%);
    margin-top: 18px;
    padding: 13px 16px;
    border: 1px solid rgb(255 255 255 / 13%);
    border-radius: 16px;
    background: rgb(4 33 51 / 27%);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
  }
  .foundation-page .president-section__identity strong {
    font-size: 16px;
  }
  .foundation-page .president-section__identity span {
    font-size: 12.5px;
  }
  .foundation-page .president-section__identity small {
    font-size: 11px;
  }
  .foundation-page .president-section__message {
    max-width: 760px;
  }
  .foundation-page .president-section__message .section-eyebrow {
    color: #aeeacb;
  }
  .foundation-page .president-section__message h1 {
    font-size: clamp(48px, 5.35vw, 74px);
    line-height: 0.98;
    letter-spacing: -0.058em;
  }
  .foundation-page .president-section__copy {
    gap: 9px;
    max-width: 690px;
    margin-top: 24px;
  }
  .foundation-page .president-section__copy p {
    font-size: 14px;
    line-height: 1.56;
    color: rgb(255 255 255 / 78%);
  }
  .foundation-page .president-section__signature {
    width: 150px;
    margin-top: 18px;
  }
  .foundation-page .governance-section__heading h2 {
    font-size: clamp(42px, 4.7vw, 64px);
    letter-spacing: -0.055em;
  }

  .foundation-page .governance-section {
    padding: clamp(94px, 10vw, 142px) var(--v203-gutter);
    background: linear-gradient(180deg, #fff, #f8faf9);
  }
  .foundation-page .team-hierarchy {
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 24px;
    margin-top: 56px;
  }
  .foundation-page .team-member {
    padding: 28px 22px 24px;
    border: 1px solid rgb(8 63 85 / 8%);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 16px 40px rgb(6 45 66 / 5%);
    transition:
      transform 0.25s var(--fcsc-ease),
      box-shadow 0.25s ease;
  }
  .foundation-page .team-member:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 50px rgb(6 45 66 / 9%);
  }
  .foundation-page .team-member__portrait-button {
    width: 176px;
    height: 176px;
    padding: 0;
  }
  .foundation-page .team-member__portrait-button .portrait {
    --portrait-size: 168px;
    padding: 3px;
    background: #e7f1ed;
    box-shadow: none;
  }
  .foundation-page .team-member__portrait-button .portrait__inner {
    border: 2px solid #fff;
  }
  .foundation-page .team-member__identity {
    min-height: 0;
    margin-top: 17px;
  }
  .foundation-page .team-member__identity h3 {
    min-height: 0;
    font-size: 16px;
  }

  /* Support — same content and checkout logic, cleaner editorial treatment. */
  .act-page .act-intro {
    padding: calc(var(--v203-header-h) + 40px) var(--v203-gutter) 64px;
    align-items: center;
  }
  .act-page .act-intro__veil {
    background:
      linear-gradient(
        90deg,
        rgb(2 31 52 / 83%) 0%,
        rgb(3 40 64 / 67%) 48%,
        rgb(3 34 55 / 22%) 78%,
        rgb(3 32 53 / 28%) 100%
      ),
      linear-gradient(180deg, rgb(2 26 43 / 5%), rgb(2 26 43 / 30%));
  }
  .act-page .act-intro__content {
    width: min(720px, 100%);
    max-width: 720px;
  }
  .act-page .act-intro h1 {
    font-size: clamp(54px, 6.5vw, 88px);
    letter-spacing: -0.06em;
  }
  .act-page .act-intro p {
    max-width: 640px;
    font-size: clamp(16px, 1.4vw, 19px);
    line-height: 1.62;
  }
  .act-page .act-intro__content button {
    background: linear-gradient(100deg, #0c6b4d, #0c5278);
    box-shadow: 0 14px 32px rgb(0 47 63 / 21%);
  }
  .act-page .act-why {
    background: linear-gradient(180deg, #f7faf9 0%, #fff 100%);
    color: #163a52;
  }
  .act-page .act-why-v4::before,
  .act-page .act-why-v4::after {
    opacity: 0.48;
  }
  .act-page .act-why-v4__story,
  .act-page .act-why-v4__programmes-panel,
  .act-page .act-why-v4__payment-panel {
    border: 1px solid rgb(8 64 86 / 8%);
    background: #fff;
    box-shadow: 0 18px 46px rgb(5 44 65 / 6%);
    backdrop-filter: none;
  }
  .act-page .act-why-v4__heading .section-eyebrow {
    color: #18815d;
  }
  .act-page .act-why-v4__heading h2,
  .act-page .act-why-v4__heading h3 {
    color: #0c3857;
  }
  .act-page .act-why-v4__quote,
  .act-page .act-why-v4__programme {
    border: 1px solid rgb(8 64 86 / 7%);
    background: #f7faf9;
    box-shadow: none;
  }
  .act-page .act-why-v4__quote:hover,
  .act-page .act-why-v4__programme:hover {
    background: #fff;
    border-color: rgb(17 107 77 / 20%);
    box-shadow: 0 13px 30px rgb(5 44 65 / 7%);
  }
  .act-page .act-why-v4__quote > svg {
    color: #177b59;
  }
  .act-page .act-why-v4__quote > p,
  .act-page .act-why-v4__quote footer strong,
  .act-page .act-why-v4__copy h3 {
    color: #153c57;
  }
  .act-page .act-why-v4__quote footer span,
  .act-page .act-why-v4__copy p {
    color: #6b7e8a;
  }
  .act-page .act-why-v4__icon {
    background: #eaf6f0;
    color: #116b4d;
    box-shadow: none;
  }
  .act-page .act-payment-choice {
    border-color: rgb(255 255 255 / 13%);
  }
  .act-page .act-how {
    background: #f6faf8;
  }
  .act-page .act-support-grid {
    gap: 20px;
  }
  .act-page .act-support-panel {
    border: 1px solid rgb(8 64 86 / 8%);
    border-radius: 26px;
    box-shadow: 0 18px 48px rgb(5 44 65 / 5%);
  }
  .act-page .act-support-panel--ways {
    background: #fff;
  }
  .act-page .act-support-panel--after {
    background: linear-gradient(145deg, #0a3858, #0e6c56);
  }
  .act-page .act-support-panel--after .act-after__steps article {
    border-color: rgb(255 255 255 / 13%);
  }

  /* Tablet/mobile: full-height hero, compact floating header, refreshed cards. */
  @media (max-width: 1080px) {
    .foundation-page .president-section {
      padding: calc(74px + 36px) 24px 54px;
    }
    .foundation-page .president-section__content {
      grid-template-columns: minmax(190px, 0.55fr) minmax(0, 1.45fr);
      gap: 38px;
    }
    .foundation-page .team-hierarchy {
      grid-template-columns: repeat(2, minmax(220px, 1fr));
    }
  }
  @media (max-width: 760px) {
    :root {
      --v203-gutter: 16px;
    }
    .v2-inner-hero {
      height: auto;
      min-height: 100dvh;
    }
    .v2-inner-hero__copy {
      width: calc(100vw - 32px);
      padding: 104px 0 34px;
      translate: 0 -2vh;
    }
    .v2-inner-hero__copy h1 {
      font-size: clamp(48px, 14vw, 68px);
    }
    .v2-inner-hero__copy p {
      font-size: 16px;
    }
    .foundation-page .president-section {
      align-items: end;
      padding: 104px 18px 44px;
    }
    .foundation-page .president-section__content {
      grid-template-columns: 1fr;
      gap: 28px;
    }
    .foundation-page .president-section__portrait-column {
      justify-items: start;
      text-align: left;
    }
    .foundation-page .portrait[data-large] {
      --portrait-size: 158px;
    }
    .foundation-page .president-section__identity {
      width: min(320px, 100%);
      margin-top: 12px;
    }
    .foundation-page .president-section__message h1 {
      font-size: clamp(42px, 12vw, 58px);
    }
    .foundation-page .president-section__copy p {
      font-size: 13px;
    }
    .foundation-page .governance-section {
      padding: 76px 18px;
    }
    .foundation-page .team-hierarchy {
      grid-template-columns: 1fr;
      gap: 14px;
      margin-top: 38px;
    }
    .foundation-page .team-member {
      grid-template-columns: 104px minmax(0, 1fr);
      justify-items: start;
      align-items: center;
      text-align: left;
      padding: 18px;
    }
    .foundation-page .team-member__portrait-button {
      width: 96px;
      height: 96px;
    }
    .foundation-page .team-member__portrait-button .portrait {
      --portrait-size: 92px;
    }
    .foundation-page .team-member__identity {
      width: 100%;
      margin-top: 0;
    }
    .act-page .act-intro {
      padding: 104px 18px 48px;
    }
    .act-page .act-intro h1 {
      font-size: clamp(46px, 13vw, 66px);
    }
    .act-page .act-why-v4__layout {
      grid-template-columns: 1fr;
    }
    .act-page .act-why-v4__work {
      display: grid;
      gap: 16px;
    }
    .act-page .act-support-grid {
      grid-template-columns: 1fr;
    }
  }
}

/* FCSC V2.4.0 — couche pages. */
@layer fcsc.pages {
  /*
 * Règles spécifiques aux pages : police Montserrat locale, logo blanc sur les héros, fenêtres natives, Actions & Impact (compteurs), Mission, Librairie, Soutenir, Contact, accordéons de la Fondation.
 */

  /* Ajustements ciblés des pages et composants restaurés. */
  @font-face {
    font-family: Montserrat;
    src:
      url("/assets/fonts/montserrat-latin-variable.v212.woff2") format("woff2"),
      url("/assets/fonts/montserrat-latin-variable.v205.woff") format("woff");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
  }
  :root {
    --fcsc-v205-font: Montserrat, "Helvetica Neue", Arial, sans-serif;
  }
  body[data-page="home"] #page-root,
  body[data-page="actions"] #page-root,
  body[data-page="mission"] #page-root,
  body[data-page="library"] #page-root,
  body[data-page="support"] #page-root,
  .legal-page--institution {
    font-family: var(--fcsc-v205-font);
  }

  /* Header: the original mark is rendered white over the hero, in colour over white. */

  /* Native top-layer dialogs preserve focus and keep the closing transition visible. */
  .fcsc-modal {
    position: fixed;
    inset: 0;
    max-width: none;
    height: auto;
    margin: auto;
    padding: 0;
    background: #fff;
    color: #173b52;
    font-family: var(--fcsc-v205-font);
    overflow: hidden;
    opacity: 0;
    transform: translateY(18px) scale(0.985);
    transition:
      opacity 0.22s ease,
      transform 0.22s var(--fcsc-ease);
  }
  .fcsc-modal[open] {
    display: flex;
    flex-direction: column;
  }
  .fcsc-modal[data-visible="true"] {
    opacity: 1;
    transform: none;
  }
  /* The native dialog receives focus on open; hide its browser outline while keeping control focus styles. */
  .fcsc-info-modal:focus {
    outline: none;
  }
  .fcsc-modal::backdrop {
    background: rgb(3 23 35 / 48%);
    opacity: 0;
    backdrop-filter: blur(6px);
    transition: opacity 0.22s ease;
  }
  .fcsc-modal[data-visible="true"]::backdrop {
    opacity: 1;
  }
  .fcsc-modal__scroll {
    flex: 1 1 auto;
    width: 100%;
    max-height: 100%;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: auto;
  }
  .fcsc-modal__close {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid #e4ebed;
    border-radius: 50%;
    color: #173b52;
    cursor: pointer;
  }
  .fcsc-modal__close:hover {
    background: #edf6f2;
  }
  .fcsc-modal__image {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16/8;
    object-fit: cover;
  }
  .fcsc-modal__body h2 {
    margin: 0 0 22px;
    color: #123b57;
  }
  .fcsc-modal__body p {
    color: #526674;
  }
  .fcsc-modal .fcsc-modal__body p {
    text-align: justify;
    hyphens: auto;
    overflow-wrap: break-word;
  }
  .fcsc-modal :focus-visible,
  .fcsc-mission :focus-visible {
    outline: 3px solid #bc994c;
    outline-offset: 4px;
  }
  .act-page .act-why-v4__layout {
    gap: clamp(20px, 3vw, 40px);
  }
  .act-page .act-why-v4__copy p {
    line-height: 1.75;
  }
  .act-page .act-why-v4__programme {
    padding: 24px;
  }
  .act-page .act-why-v4__quote {
    padding: clamp(24px, 3vw, 38px);
  }
  .act-page .act-after__steps article {
    padding: 24px;
  }

  /* Mission: equal-width text and image, followed by concise programme information. */
  .fcsc-mission {
    background: #fff;
    color: #173b52;
  }
  .fcsc-mission h1,
  .fcsc-mission h2,
  .fcsc-mission h3 {
    margin: 0;
  }
  .fcsc-mission p {
    line-height: 1.8;
  }
  .fcsc-mission__hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: 100svh;
    background: #0b344b;
  }
  .fcsc-mission__hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 140px clamp(32px, 5.8vw, 96px) 70px;
    color: #fff;
  }
  .fcsc-mission__tag {
    color: #d7bb75;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
  }
  .fcsc-mission__hero h1 {
    margin: 26px 0 24px;
    font-size: clamp(42px, 5.1vw, 78px);
    font-weight: 600;
    line-height: 1.02;
    letter-spacing: -0.055em;
  }
  .fcsc-mission__hero-copy .fcsc-mission__lead {
    color: #fff;
    font-size: clamp(19px, 1.7vw, 25px);
    line-height: 1.5;
    font-weight: 500;
    margin: 0 0 18px;
  }
  .fcsc-mission__hero-copy > p {
    color: #c9d9e2;
    font-size: 14px;
  }
  .fcsc-mission__hero-link {
    align-self: flex-start;
    margin-top: 24px;
    color: #fff;
    border-bottom: 1px solid #809eac;
  }
  .fcsc-mission__hero-media {
    min-width: 0;
    position: relative;
  }
  .fcsc-mission__hero-media img {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
    object-position: center;
  }
  .fcsc-mission__targets {
    padding: 30px max(24px, calc((100vw - 1180px) / 2));
    background: #f2f7f4;
  }
  .fcsc-mission__targets > p {
    margin: 0 0 20px;
    color: #637c70;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }
  .fcsc-mission__targets dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
  }
  .fcsc-mission__targets dl > div {
    display: flex;
    flex-direction: column-reverse;
    gap: 9px;
    padding: 0 32px;
    border-left: 1px solid #d6e2da;
  }
  .fcsc-mission__targets dl > div:first-child {
    padding-left: 0;
    border: 0;
  }
  .fcsc-mission__targets dt {
    color: #526b5f;
    font-size: 12px;
  }
  .fcsc-mission__targets dd {
    margin: 0;
    color: #174832;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.1;
    font-weight: 500;
    letter-spacing: -0.045em;
  }
  .fcsc-mission__section {
    padding: clamp(64px, 8vw, 112px) max(24px, calc((100vw - 1180px) / 2));
    scroll-margin-top: 90px;
  }
  .fcsc-mission__heading {
    max-width: 820px;
    margin-bottom: 46px;
  }
  .fcsc-mission h2 {
    color: #123b54;
    font-size: clamp(30px, 3.5vw, 48px);
    font-weight: 600;
    line-height: 1.16;
    letter-spacing: -0.04em;
  }
  .fcsc-mission__heading p,
  .fcsc-mission__field p {
    color: #5c717e;
    font-size: 15px;
    margin: 24px 0 0;
  }
  .fcsc-mission__pillars {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
  }
  .fcsc-mission__pillars article {
    border-top: 1px solid #dce6df;
    padding: 28px 12px 0 0;
  }
  .fcsc-mission__icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    background: #edf5ef;
    border-radius: 16px;
    color: #176d50;
    margin-bottom: 26px;
  }
  .fcsc-mission h3 {
    font-size: 21px;
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: -0.025em;
  }
  .fcsc-mission__pillars p,
  .fcsc-mission__pathway li p {
    color: #627781;
    font-size: 14px;
  }
  .fcsc-mission__pathway {
    background: #f7f9f8;
  }
  .fcsc-mission__pathway ol {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .fcsc-mission__pathway li {
    padding-top: 24px;
    border-top: 1px solid #ceddd5;
  }
  .fcsc-mission__pathway li > span {
    display: block;
    color: #31775f;
    font-size: 13px;
    margin-bottom: 24px;
  }
  .fcsc-mission__pathway li h3 {
    font-size: 18px;
  }
  .fcsc-mission__field {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 64px;
  }
  .fcsc-mission__field > img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4/4.2;
    border-radius: 22px;
    object-fit: cover;
  }
  .fcsc-mission__field .fcsc-mission__field-note {
    padding-left: 22px;
    border-left: 2px solid #c8ad69;
    font-size: 13px;
  }
  .fcsc-mission__whitepaper {
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: 82px 24px;
    text-align: center;
    background: #0b3b53;
    color: #dfc585;
  }
  .fcsc-mission__whitepaper h2 {
    margin-top: 24px;
    color: #fff;
  }
  .fcsc-mission__whitepaper p {
    max-width: 640px;
    color: #c4d7e0;
    font-size: 15px;
    margin: 22px auto 30px;
  }
  .fcsc-mission__whitepaper button,
  .fcsc-whitepaper-form > button,
  .fcsc-whitepaper-form__result a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 50px;
    padding: 14px 24px;
    border: 0;
    border-radius: 99px;
    font: 600 13px/1.5 var(--fcsc-v205-font);
    cursor: pointer;
  }
  .fcsc-mission__whitepaper button {
    background: #fff;
    color: #123c54;
  }
  .fcsc-mission__whitepaper button:hover {
    background: #e5f1ea;
  }
  .fcsc-whitepaper-modal {
    width: min(680px, calc(100% - 40px));
  }
  .fcsc-whitepaper-modal .fcsc-modal__body {
    padding-top: 60px;
  }
  .fcsc-whitepaper-form {
    margin-top: 24px;
  }
  .fcsc-whitepaper-form__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
  }
  .fcsc-whitepaper-form__grid label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    font-size: 12px;
    font-weight: 500;
  }
  .fcsc-whitepaper-form__grid label:last-child {
    grid-column: 1/-1;
  }
  .fcsc-whitepaper-form input:not([type="checkbox"]) {
    display: block;
    width: 100%;
    min-width: 0;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid #d3dfd9;
    border-radius: 10px;
    background: #fbfdfc;
    font: 16px var(--fcsc-v205-font);
    color: #123c54;
  }
  .fcsc-whitepaper-form__consent {
    display: grid;
    grid-template-columns: 20px 1fr;
    align-items: start;
    gap: 12px;
    margin-top: 24px;
    font-size: 12px;
    line-height: 1.7;
  }
  .fcsc-whitepaper-form__consent input {
    appearance: auto;
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: #176d50;
  }
  .fcsc-whitepaper-form__privacy {
    display: inline-block;
    font-size: 11px;
    margin: 10px 0 22px 32px;
    color: #266c58;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .fcsc-whitepaper-form__trap {
    position: absolute;
    width: 1px;
    height: 1px;
    clip-path: inset(50%);
    overflow: hidden;
  }
  .fcsc-whitepaper-form > button,
  .fcsc-whitepaper-form__result a {
    background: #166c50;
    color: #fff;
  }
  .fcsc-whitepaper-form > button {
    width: 100%;
  }
  .fcsc-whitepaper-form > button:disabled {
    opacity: 0.65;
    cursor: wait;
  }
  .fcsc-whitepaper-form__result:empty {
    display: none;
  }
  .fcsc-whitepaper-form__result {
    margin-top: 22px;
  }
  .fcsc-whitepaper-form__result[data-status="error"] p {
    color: #9a3541;
  }
  .fcsc-whitepaper-form__result[data-status="success"] {
    padding: 22px;
    background: #eef7f1;
    border-radius: 14px;
  }
  .fcsc-whitepaper-form__result p {
    margin-top: 0;
    font-size: 13px;
  }
  .legal-page__brand {
    display: block;
    width: min(240px, 70%);
    height: auto;
    margin-bottom: 36px;
    filter: none;
  }

  @media (max-width: 900px) {
    .fcsc-mission__hero-copy {
      padding: 116px 28px 56px;
    }
    .fcsc-mission__hero h1 {
      font-size: 46px;
    }
    .fcsc-mission__field {
      gap: 32px;
    }
    .fcsc-mission__pathway ol {
      grid-template-columns: 1fr 1fr;
      gap: 28px 36px;
    }
  }
  @media (max-width: 700px) {
    .fcsc-mission__hero {
      grid-template-columns: 1fr;
      min-height: auto;
    }
    .fcsc-mission__hero-copy {
      padding: 124px 24px 46px;
    }
    .fcsc-mission__hero h1 {
      font-size: clamp(44px, 11vw, 66px);
    }
    .fcsc-mission__hero-media {
      height: 55vw;
      min-height: 260px;
      max-height: 430px;
    }
    .fcsc-mission__hero-media img {
      object-position: center 43%;
    }
    .fcsc-mission__targets dl > div {
      padding: 0 14px;
    }
    .fcsc-mission__targets dt {
      font-size: 10px;
    }
    .fcsc-mission__targets dd {
      font-size: 34px;
    }
    .fcsc-mission__pillars,
    .fcsc-mission__field {
      grid-template-columns: 1fr;
    }
    .fcsc-mission__pillars {
      gap: 24px;
    }
    .fcsc-mission__field > img {
      aspect-ratio: 4/3;
    }
    .fcsc-mission__whitepaper {
      padding: 68px 24px;
    }
    .fcsc-mission__whitepaper button {
      border-radius: 18px;
    }
    .fcsc-modal {
      width: calc(100% - 24px);
      max-height: 90dvh;
      border-radius: 20px;
    }
    .fcsc-modal__body {
      padding: 26px 22px;
    }
    .fcsc-modal__body p {
      font-size: 14px;
      line-height: 1.8;
    }
  }
  @media (max-width: 420px) {
    .fcsc-whitepaper-form__grid {
      grid-template-columns: 1fr;
    }
    .fcsc-mission__pathway ol {
      grid-template-columns: 1fr;
      gap: 16px;
    }
    .fcsc-mission__pathway li {
      display: grid;
      grid-template-columns: 28px 1fr;
      gap: 0 12px;
    }
    .fcsc-mission__pathway li > span {
      grid-row: 1/3;
      margin: 2px 0 0;
    }
    .fcsc-mission__pathway li p {
      grid-column: 2;
      margin-bottom: 6px;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .fcsc-modal,
    .fcsc-modal::backdrop {
      transition: none;
    }
    .fcsc-modal {
      transform: none;
    }
  }

  /* Séquence éditoriale Fondation : introduction et engagements. */
  .foundation-editorial {
    background: #fbfcfa;
    color: #173b52;
    font-family: var(--fcsc-v205-font);
  }
  .foundation-editorial__intro,
  .foundation-editorial__commitments {
    max-width: 1180px;
    margin: 0 auto;
    padding: clamp(74px, 8vw, 120px) 28px;
  }
  .foundation-editorial__intro {
    padding-bottom: clamp(76px, 8vw, 116px);
  }
  .foundation-editorial__commitments {
    border-top: 1px solid #dce8e3;
  }
  .foundation-editorial__heading {
    max-width: 850px;
  }
  .foundation-editorial__heading h2 {
    max-width: 20ch;
    margin: 18px 0 0;
    color: #103c56;
    font-size: clamp(35px, 4.4vw, 62px);
    font-weight: 550;
    line-height: 1.12;
    letter-spacing: -0.045em;
    text-wrap: balance;
  }
  .foundation-editorial__text {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(24px, 5vw, 76px);
    margin-top: 40px;
  }
  .foundation-editorial__text p,
  .foundation-editorial__lede {
    margin: 0;
    color: #5a707a;
    font-size: clamp(15px, 1.4vw, 17px);
    line-height: 1.82;
  }
  .foundation-editorial__lede {
    max-width: 710px;
    margin-top: 30px;
  }
  .foundation-editorial__accordions {
    margin-top: clamp(50px, 7vw, 90px);
    border-top: 1px solid #cddbd5;
  }
  .foundation-editorial__item {
    border-bottom: 1px solid #cddbd5;
  }
  .foundation-editorial__item summary {
    display: grid;
    grid-template-columns: 76px 1fr 28px;
    gap: 22px;
    align-items: center;
    padding: 29px 4px;
    cursor: pointer;
    list-style: none;
    color: #123c54;
  }
  .foundation-editorial__item summary::-webkit-details-marker {
    display: none;
  }
  .foundation-editorial__item summary:focus-visible {
    outline: 2px solid #248468;
    outline-offset: 3px;
  }
  .foundation-editorial__index {
    color: #268466;
    font-size: 14px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
  }
  .foundation-editorial__label {
    font-size: clamp(19px, 2.1vw, 29px);
    font-weight: 500;
    line-height: 1.24;
    letter-spacing: -0.025em;
  }
  .foundation-editorial__toggle {
    width: 22px;
    height: 22px;
    position: relative;
    color: #2c765e;
  }
  .foundation-editorial__toggle::before,
  .foundation-editorial__toggle::after {
    content: "";
    position: absolute;
    top: 10px;
    left: 2px;
    width: 18px;
    height: 1.5px;
    background: currentColor;
    transition: transform 0.24s ease;
  }
  .foundation-editorial__toggle::after {
    transform: rotate(90deg);
  }
  .foundation-editorial__item[open] .foundation-editorial__toggle::after {
    transform: rotate(0);
  }
  .foundation-editorial__item[open] summary {
    color: #166b50;
  }
  .foundation-editorial__panel {
    max-width: 980px;
    padding: 0 46px 38px 102px;
    color: #516977;
  }
  .foundation-editorial__panel h3 {
    margin: 2px 0 14px;
    color: #174a59;
    font-size: clamp(22px, 2.5vw, 34px);
    font-weight: 500;
    line-height: 1.28;
  }
  .foundation-editorial__panel > p {
    max-width: 760px;
    margin: 0;
    font-size: 15px;
    line-height: 1.8;
  }
  .foundation-editorial__points {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px 50px;
    margin-top: 38px;
  }
  .foundation-editorial__points > div {
    padding-top: 16px;
    border-top: 1px solid #e1eae5;
  }
  .foundation-editorial__points h4 {
    margin: 0 0 8px;
    color: #16495b;
    font-size: 15px;
    font-weight: 600;
  }
  .foundation-editorial__points p {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
  }

  /* Impact présenté par des compteurs circulaires animés. */
  .fcsc-impact {
    padding: clamp(80px, 9vw, 126px) 28px;
    background: radial-gradient(circle at 50% 38%, #eff8f3, #fbfdfb 58%);
    color: #113d57;
  }
  .fcsc-impact__inner {
    max-width: 1240px;
    margin: auto;
  }
  .fcsc-impact__heading {
    max-width: 820px;
  }
  .fcsc-impact__heading h2 {
    margin: 0;
    font-size: clamp(44px, 6vw, 76px);
    line-height: 1;
    font-weight: 550;
    letter-spacing: -0.055em;
  }
  .fcsc-impact__heading p {
    max-width: 780px;
    margin: 24px 0 0;
    color: #5b737d;
    font-size: clamp(15px, 1.5vw, 18px);
    line-height: 1.7;
  }
  .fcsc-impact__figures {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(24px, 5vw, 80px);
    align-items: start;
    margin-top: clamp(55px, 7vw, 100px);
  }
  .fcsc-impact__gauge {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    margin: 0;
    text-align: center;
  }
  .fcsc-impact__dial {
    position: relative;
    width: min(100%, 300px);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: radial-gradient(circle, #fff 42%, #e8f7ef 100%);
    box-shadow: 0 18px 46px rgb(15 87 74 / 10%);
  }
  .fcsc-impact__dial::after {
    content: "";
    position: absolute;
    inset: 7%;
    border: 1px solid rgb(38 151 120 / 12%);
    border-radius: 50%;
    pointer-events: none;
  }
  .fcsc-impact__dial svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    transform: rotate(-90deg);
  }
  .fcsc-impact__track {
    fill: none;
    stroke: #dcebe5;
    stroke-width: 2;
  }
  .fcsc-impact__arc {
    fill: none;
    stroke-width: 2.7;
    stroke-linecap: round;
    stroke-dasharray: 405 135;
    stroke-dashoffset: 405;
  }
  .fcsc-impact__gauge[data-active="true"] .fcsc-impact__arc {
    animation: fcsc-impact-draw 1.5s cubic-bezier(0.2, 0.75, 0.3, 1) forwards;
    animation-delay: var(--gauge-delay);
    animation-play-state: paused;
  }
  .fcsc-impact__guide {
    fill: none;
    stroke: #ccdedb;
    stroke-width: 1;
    stroke-dasharray: 4 6;
    transform-box: view-box;
    transform-origin: center;
  }
  .fcsc-impact__markers {
    transform-box: view-box;
    transform-origin: center;
  }
  .fcsc-impact__marker {
    fill: #008f62;
    stroke: #fff;
    stroke-width: 3;
    filter: drop-shadow(0 0 5px rgb(0 143 98 / 52%));
  }
  .fcsc-impact__marker--second {
    fill: #1c7baa;
  }
  .fcsc-impact__gauge[data-active="true"] .fcsc-impact__markers {
    animation: fcsc-impact-orbit 15s linear infinite;
    animation-play-state: paused;
  }
  .fcsc-impact__gauge:nth-child(2)[data-active="true"] .fcsc-impact__markers {
    animation-duration: 18s;
    animation-direction: reverse;
  }
  .fcsc-impact__gauge:nth-child(3)[data-active="true"] .fcsc-impact__markers {
    animation-duration: 21s;
  }
  .fcsc-impact__gauge[data-active="true"] .fcsc-impact__guide {
    animation: fcsc-impact-guide 34s linear infinite;
    animation-play-state: paused;
  }
  .fcsc-impact__gauge:nth-child(2)[data-active="true"] .fcsc-impact__guide {
    animation-direction: reverse;
    animation-duration: 40s;
  }
  .fcsc-impact__gauge[data-active="true"] .fcsc-impact__marker {
    animation: fcsc-impact-pulse 3s ease-in-out infinite;
    animation-delay: var(--gauge-delay);
    animation-play-state: paused;
  }
  .fcsc-impact__gauge[data-active="true"] .fcsc-impact__marker--second {
    animation-delay: 0.9s;
  }
  .fcsc-impact__gauge[data-active="true"] .fcsc-impact__dial::after {
    animation: fcsc-impact-halo 4.5s ease-in-out infinite;
    animation-play-state: paused;
  }
  .fcsc-impact__gauge[data-in-view="true"] .fcsc-impact__arc,
  .fcsc-impact__gauge[data-in-view="true"] .fcsc-impact__markers,
  .fcsc-impact__gauge[data-in-view="true"] .fcsc-impact__guide,
  .fcsc-impact__gauge[data-in-view="true"] .fcsc-impact__marker,
  .fcsc-impact__gauge[data-in-view="true"] .fcsc-impact__dial::after {
    animation-play-state: running;
  }
  .fcsc-impact__number {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 20px;
  }
  .fcsc-impact__number strong {
    color: #0a4770;
    font-size: clamp(36px, 4vw, 57px);
    font-weight: 500;
    line-height: 1;
    letter-spacing: -0.06em;
    font-variant-numeric: tabular-nums;
  }
  .fcsc-impact__number span {
    max-width: 145px;
    color: #71828a;
    font-size: 13px;
    line-height: 1.35;
  }
  .fcsc-impact__gauge figcaption {
    max-width: 300px;
    padding-top: 28px;
  }
  .fcsc-impact__gauge h3 {
    margin: 0;
    font-size: clamp(20px, 2vw, 26px);
    font-weight: 550;
    letter-spacing: -0.025em;
  }
  .fcsc-impact__gauge p {
    margin: 12px 0 0;
    color: #5b737d;
    font-size: 13px;
    line-height: 1.65;
  }
  .fcsc-impact__next {
    display: grid;
    grid-template-columns: 0.8fr 1.25fr 1fr;
    gap: 30px;
    align-items: center;
    margin-top: clamp(70px, 9vw, 120px);
    padding-top: 30px;
    border-top: 1px solid #cbded4;
  }
  .fcsc-impact__next > span {
    color: #237d64;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.13em;
    text-transform: uppercase;
  }
  .fcsc-impact__next h3 {
    margin: 0;
    font-size: clamp(23px, 2.3vw, 32px);
    font-weight: 550;
  }
  .fcsc-impact__next p {
    margin: 8px 0 0;
    color: #5b737d;
    font-size: 13px;
    line-height: 1.6;
  }
  .fcsc-impact__next a {
    display: inline-flex;
    justify-self: end;
    align-items: center;
    gap: 12px;
    color: #14634e;
    font-size: 13px;
    font-weight: 650;
    text-decoration: none;
    border-bottom: 1px solid #97bba8;
    padding-bottom: 8px;
  }
  .fcsc-impact__next a:hover {
    color: #0d4839;
  }
  @keyframes fcsc-impact-draw {
    to {
      stroke-dashoffset: 0;
    }
  }
  @keyframes fcsc-impact-pulse {
    50% {
      opacity: 0.58;
      filter: drop-shadow(0 0 9px rgb(0 143 98 / 70%));
    }
  }
  @keyframes fcsc-impact-orbit {
    to {
      transform: rotate(360deg);
    }
  }
  @keyframes fcsc-impact-guide {
    to {
      transform: rotate(-360deg);
    }
  }
  @keyframes fcsc-impact-halo {
    50% {
      opacity: 0.45;
      scale: 1.045;
      box-shadow: 0 0 26px rgb(38 151 120 / 10%);
    }
  }

  /* Champs et retours du formulaire de contact. */
  .contact-form {
    margin-top: 44px;
    padding-top: 34px;
    border-top: 1px solid #dce8e3;
  }
  .contact-form__grid {
    gap: 24px 28px;
  }
  .contact-form__grid label span {
    margin-bottom: 10px;
    color: #365a68;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
  }
  .contact-form__grid input,
  .contact-form__grid textarea {
    min-height: 54px;
    padding: 15px 17px;
    border: 1px solid #d8e5df;
    border-radius: 14px;
    background: #f8fbf9;
    color: #133e55;
    box-shadow: none;
    font-size: 15px;
    line-height: 1.55;
  }
  .contact-form__grid textarea {
    min-height: 176px;
  }
  .contact-form__grid input:hover,
  .contact-form__grid textarea:hover {
    border-color: #a5c7b8;
  }
  .contact-form__grid input:focus,
  .contact-form__grid textarea:focus {
    border-color: #3c9677;
    box-shadow: 0 0 0 4px rgb(44 150 113 / 11%);
    background: #fff;
  }
  .contact-form__consent {
    grid-template-columns: 24px 1fr;
    gap: 14px;
    margin-top: 30px;
    color: #536d78;
    font-size: 13px;
  }
  .contact-form__consent i {
    width: 24px;
    height: 24px;
    border-radius: 7px;
    background: #f8fbf9;
  }
  .contact-form__consent input:focus-visible + i {
    outline: 2px solid #398e71;
    outline-offset: 3px;
  }
  .contact-form > button {
    min-height: 52px;
    margin-top: 28px;
    padding: 15px 26px;
    border-radius: 999px;
    background: #12694f;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 12px 24px rgb(12 93 70 / 15%);
  }
  .contact-form > button:hover:not(:disabled) {
    background: #0c533e;
    transform: translateY(-2px);
  }
  .contact-form__secure {
    margin-top: 24px;
    color: #748991;
    font-size: 12px;
  }
  .contact-form__status {
    padding: 15px 18px;
    border-radius: 12px;
    background: #eff8f1;
  }
  .contact-form__status[data-status="error"] {
    background: #fff3f2;
  }
  @media (max-width: 760px) {
    .foundation-editorial__intro,
    .foundation-editorial__commitments {
      padding: 72px 20px;
    }
    .foundation-editorial__text {
      grid-template-columns: 1fr;
      gap: 4px;
      margin-top: 30px;
    }
    .foundation-editorial__text p + p {
      margin-top: 16px;
    }
    .foundation-editorial__item summary {
      grid-template-columns: 34px 1fr 22px;
      gap: 14px;
      padding: 25px 0;
    }
    .foundation-editorial__panel {
      padding: 0 0 32px 48px;
    }
    .foundation-editorial__points {
      grid-template-columns: 1fr;
      gap: 20px;
    }
    .fcsc-impact__figures {
      grid-template-columns: 1fr;
      gap: 64px;
    }
    .fcsc-impact__next {
      grid-template-columns: 1fr;
      gap: 14px;
    }
    .fcsc-impact__next a {
      justify-self: start;
      margin-top: 12px;
    }
  }
  @media (max-width: 640px) {
    .contact-form__grid {
      gap: 20px;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .foundation-editorial__toggle::after,
    .fcsc-impact__arc,
    .fcsc-impact__marker,
    .fcsc-impact__markers,
    .fcsc-impact__guide,
    .fcsc-impact__dial::after {
      animation: none;
      transition: none;
    }
    .fcsc-impact__arc {
      stroke-dashoffset: 0;
    }
  }

  /* Moyens de paiement présentés comme un choix éditorial. */
  .act-page .act-why-v4__payment-panel {
    grid-template-columns: minmax(230px, 0.85fr) minmax(0, 1.4fr);
    gap: clamp(35px, 6vw, 100px);
    align-items: start;
    padding: clamp(54px, 7vw, 86px) clamp(26px, 6vw, 84px);
    border: 0;
    border-top: 1px solid #d5e3de;
    border-radius: 0;
    background: #f8fbf9;
    box-shadow: none;
    backdrop-filter: none;
  }
  .act-page .act-why-v4__payment-panel .section-eyebrow {
    color: #258267;
  }
  .act-page .act-why-v4__payment-panel h3 {
    max-width: 15ch;
    color: #103d57;
    font-size: clamp(31px, 3.2vw, 47px);
    font-weight: 550;
    line-height: 1.12;
  }
  .act-page .act-why-v4__payments {
    grid-template-columns: 1fr;
    gap: 0;
    border-top: 1px solid #cfdfd8;
  }
  .act-page .act-payment-choice,
  .act-page .act-payment-choice:hover,
  .act-page .act-payment-choice[data-active] {
    display: grid;
    grid-template-columns: 115px minmax(0, 1fr) 30px;
    grid-template-rows: auto;
    align-items: center;
    gap: clamp(18px, 3vw, 40px);
    min-height: 138px;
    padding: 26px 0;
    border: 0;
    border-bottom: 1px solid #cfdfd8;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #153f56;
    transform: none;
  }
  .act-page .act-payment-choice::before,
  .act-page .act-payment-choice::after {
    content: none;
  }
  .act-page .act-payment-choice:hover .act-payment-choice__copy strong,
  .act-page .act-payment-choice[data-active] .act-payment-choice__copy strong {
    color: #146d53;
  }
  .act-page .act-payment-choice:focus-visible {
    outline: 2px solid #258267;
    outline-offset: 4px;
  }
  .act-page .act-payment-choice__meta {
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    color: #2a826a;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.5;
  }
  .act-page .act-payment-choice__copy {
    display: grid;
    gap: 9px;
  }
  .act-page .act-payment-choice__copy strong {
    max-width: 27ch;
    color: #153f56;
    font-size: clamp(19px, 1.7vw, 24px);
    font-weight: 550;
    line-height: 1.25;
    transition: color 0.2s ease;
  }
  .act-page .act-payment-choice__copy > span {
    max-width: 48ch;
    color: #5d7580;
    font-size: 13px;
    line-height: 1.65;
  }
  .act-page .act-payment-choice__cta,
  .act-page .act-payment-choice:hover .act-payment-choice__cta,
  .act-page .act-payment-choice[data-active] .act-payment-choice__cta {
    width: 30px;
    height: 30px;
    border: 0;
    background: none;
    box-shadow: none;
    color: #2a826a;
  }
  @media (max-width: 760px) {
    .act-page .act-why-v4__payment-panel {
      grid-template-columns: 1fr;
      gap: 30px;
      padding: 56px 24px;
    }
    .act-page .act-payment-choice,
    .act-page .act-payment-choice:hover,
    .act-page .act-payment-choice[data-active] {
      grid-template-columns: 1fr 28px;
      gap: 12px 14px;
      min-height: 0;
      padding: 24px 0;
    }
    .act-page .act-payment-choice__meta {
      grid-column: 1;
    }
    .act-page .act-payment-choice__copy {
      grid-column: 1;
    }
    .act-page .act-payment-choice__cta {
      grid-column: 2;
      grid-row: 1 / 3;
    }
  }
}

/* FCSC V2.4.0 — couche hero-behaviour. */
@layer fcsc.hero-behaviour {
  /*
 * Comportement des héros : boutons du hero d'accueil fixes d'une diapositive à l'autre sur mobile et tablette.
 */

  /* Accueil, mobile et tablette : les boutons du hero restent au même
   endroit d'une diapositive à l'autre. Le bloc texte s'aligne au-dessus d'eux. */
  @media (max-width: 900px) {
    .hero-slide__content {
      grid-template-rows: minmax(0, 1fr) auto auto auto;
      align-content: stretch;
    }
    .hero-slide__eyebrow {
      align-self: end;
    }
  }

  /* Textes du hero : jamais tronqués sur mobile (les boutons étant fixes,
   le texte dispose de la hauteur nécessaire au-dessus d'eux). */
  @media (max-width: 900px) {
    .hero-slide__body {
      display: block;
      -webkit-line-clamp: unset;
      overflow: visible;
    }
  }
}

/* FCSC V2.4.0 — couche harmonisation. */
@layer fcsc.harmonisation {
  /*
 * Harmonisation transversale : même direction visuelle, finitions haut de gamme
 * et adaptations responsive. Cette couche ne fait que préciser les précédentes.
 */

  /* ── 1. Typographie unifiée ─────────────────────────────────────────────
   Montserrat (police de la charte, déjà hébergée localement) sur toutes les
   pages, y compris La Fondation, Contact et les pages légales. */
  :root {
    --fcsc-v21-font: Montserrat, "Helvetica Neue", Arial, sans-serif;
    --fcsc-v21-radius: 22px;
    --fcsc-v21-shadow: 0 18px 50px rgb(11 49 62 / 8%);
    --fcsc-v21-shadow-hover: 0 26px 64px rgb(11 49 62 / 14%);
    --fcsc-v21-ease: cubic-bezier(0.22, 1, 0.36, 1);
  }

  body,
  button,
  input,
  select,
  textarea {
    font-family: var(--fcsc-v21-font);
  }

  /* Aucun défilement horizontal parasite (cartes animées en entrée, images de héros). */
  html,
  body {
    overflow-x: clip;
  }

  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }

  h1,
  h2,
  h3 {
    text-wrap: balance;
  }

  p,
  li,
  figcaption {
    text-wrap: pretty;
  }

  ::selection {
    background: rgb(0 143 80 / 18%);
    color: #0b2d45;
  }

  /* ── 2. Accessibilité et navigation ──────────────────────────────────── */
  html {
    scroll-padding-top: 104px;
  }

  @media (prefers-reduced-motion: no-preference) {
    html {
      scroll-behavior: smooth;
    }
  }

  :where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
    outline: 3px solid rgb(0 143 80 / 45%);
    outline-offset: 3px;
  }

  /* ── 2 bis. Appels à l'action des héros ────────────────────────────────
   Même gabarit et même rythme sur l'accueil, Soutenir, Mission, Actions
   et Librairie. Les couleurs restent adaptées au contraste de chaque image. */
  .hero-button,
  .act-page .act-intro__content button,
  .fcsc-mission__hero-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    width: max-content;
    min-height: 52px;
    padding: 0 22px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
  }

  .hero-button svg,
  .act-page .act-intro__content button svg,
  .fcsc-mission__hero-link svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .fcsc-mission__hero-link {
    border: 1px solid rgb(255 255 255 / 42%);
    background: rgb(255 255 255 / 9%);
    box-shadow: 0 14px 32px rgb(0 20 38 / 18%);
    backdrop-filter: blur(10px);
  }

  .fcsc-mission__hero-link:hover,
  .fcsc-mission__hero-link:focus-visible {
    border-color: rgb(255 255 255 / 72%);
    background: rgb(255 255 255 / 15%);
  }

  .v2-hero-scroll {
    margin-top: clamp(22px, 3vh, 32px);
  }

  .v2-hero-scroll:hover svg,
  .v2-hero-scroll:focus-visible svg,
  .fcsc-mission__hero-link:hover svg,
  .fcsc-mission__hero-link:focus-visible svg {
    transform: translateY(3px);
  }

  /* ── 3. Cartes : relief discret au survol (souris uniquement) ─────────── */
  @media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .v2-action-card,
    .v2-future-card,
    .v2-news-card,
    .team-member,
    .act-payment-choice,
    .act-how__option {
      transition:
        translate 0.45s var(--fcsc-v21-ease),
        box-shadow 0.45s var(--fcsc-v21-ease);
    }
    .v2-action-card:hover,
    .v2-future-card:hover,
    .v2-news-card:hover,
    .act-payment-choice:hover,
    .act-how__option:hover {
      translate: 0 -4px;
      box-shadow: var(--fcsc-v21-shadow-hover);
    }

    .team-member:hover {
      translate: 0 -3px;
    }
    .v2-news-card img,
    .v2-future-card img,
    .v2-action-card img {
      transition: scale 0.8s var(--fcsc-v21-ease);
    }
    .v2-news-card:hover img,
    .v2-future-card:hover img,
    .v2-action-card:hover img {
      scale: 1.035;
    }
    .v2-news-card .v2-illustration-media,
    .v2-future-card .v2-illustration-media,
    .v2-action-card .v2-illustration-media {
      overflow: hidden;
    }
  }

  /* ── 4. Contact et pages légales : même écrin que le reste du site ────── */
  body[data-page="contact"],
  body[data-page="static"] {
    background:
      radial-gradient(70% 420px at 50% 0%, rgb(0 143 80 / 7%), transparent 70%),
      linear-gradient(180deg, #f2f8f5 0, #fbfcfc 560px);
  }

  body[data-page="contact"] .contact-form {
    margin-top: 30px;
    padding: clamp(24px, 4vw, 40px);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 20px 56px rgb(12 52 72 / 6%);
  }

  body[data-page="contact"] .legal-page > p:last-child {
    margin-top: 28px;
    padding: 20px 24px;
    border-radius: 16px;
    background: rgb(255 255 255 / 70%);
    border: 1px solid #e4ecee;
  }

  /* ── 6. Mobile ───────────────────────────────────────────────────────── */
  @media (max-width: 640px) {
    /* Impact : compteurs compacts, cadran et légende côte à côte. */
    .fcsc-impact__figures {
      gap: 14px;
    }

    .fcsc-impact__gauge {
      flex-direction: row;
      align-items: center;
      gap: 18px;
      padding: 14px 16px;
      border-radius: var(--fcsc-v21-radius);
      background: #fff;
      box-shadow: var(--fcsc-v21-shadow);
      text-align: left;
    }

    .fcsc-impact__dial {
      flex: 0 0 128px;
      width: 128px;
      height: 128px;
    }

    .fcsc-impact__number {
      gap: 3px;
      padding: 8px;
      text-align: center;
    }

    .fcsc-impact__number strong {
      font-size: 26px;
    }

    .fcsc-impact__number span {
      max-width: 84px;
      font-size: 9px;
    }

    .fcsc-impact__gauge figcaption {
      padding-top: 0;
      text-align: left;
    }

    .fcsc-impact__gauge figcaption h3 {
      margin-top: 0;
    }

    /* Contact : champs sur une colonne, cible tactile confortable. */
    .contact-form__grid {
      grid-template-columns: 1fr;
    }
    .contact-form input,
    .contact-form textarea,
    .fcsc-whitepaper-form input,
    .act-form input {
      font-size: 16px; /* évite le zoom automatique d'iOS */
    }
  }

  /* Bouton de don flottant : format compact (pictogramme seul) sur téléphone,
   pour ne jamais masquer les textes des héros. Le libellé reste lu par les
   lecteurs d'écran grâce à son aria-label. */
}

/* FCSC V2.4.0 — couche engagement. */
@layer fcsc.engagement {
  /*
 * Engagement et formulaires : don récurrent, bénévoles, actualités, conditions de vente
 * et renvoi des liens de la Librairie. Les couches 01 à 06 ne sont pas modifiées.
 */

  /* ── Cartes « D'autres façons de nous soutenir » devenues des boutons ─── */
  button.act-how__option {
    width: 100%;
    font: inherit;
    text-align: left;
    cursor: pointer;
    appearance: none;
  }

  /* ── Fréquence du don ─────────────────────────────────────────────────── */
  /* ── Case à cocher partagée (consentements, conditions de vente) ─────── */
  .fcsc-consent {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin-top: 16px;
    color: var(--fcsc-muted, #5d6d77);
    font-size: 12px;
    line-height: 1.5;
    cursor: pointer;
  }

  .fcsc-consent input {
    width: 18px;
    height: 18px;
    margin: 1px 0 0;
    accent-color: var(--fcsc-green-600);
    cursor: pointer;
  }

  .fcsc-consent a {
    color: var(--fcsc-blue-900);
    font-weight: 600;
    text-underline-offset: 2px;
  }

  /* ── Carte discrète « Actualités » (Actions & Impact) ───────────────────── */
  .fcsc-news-card {
    position: fixed;
    z-index: 1200;
    left: clamp(16px, 3vw, 32px);
    bottom: clamp(16px, 3vw, 32px);
    width: min(380px, calc(100vw - 32px));
    padding: 22px 22px 18px;
    border: 1px solid rgb(8 61 104 / 10%);
    border-radius: 22px;
    background: rgb(255 255 255 / 97%);
    box-shadow: 0 24px 60px rgb(5 41 75 / 16%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    font-family: var(--fcsc-v21-font, Montserrat, sans-serif);
    transition:
      opacity 320ms cubic-bezier(0.22, 1, 0.36, 1),
      translate 420ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .fcsc-news-card[data-state="entering"],
  .fcsc-news-card[data-state="leaving"] {
    opacity: 0;
    translate: 0 18px;
  }

  .fcsc-news-card__close {
    position: absolute;
    top: 12px;
    right: 12px;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f1f5f7;
    color: var(--fcsc-blue-900);
    cursor: pointer;
  }

  .fcsc-news-card__close svg {
    width: 13px;
    height: 13px;
  }

  .fcsc-news-card__eyebrow {
    display: block;
    color: var(--fcsc-green-700, #007e49);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }

  .fcsc-news-card h2 {
    margin: 8px 40px 6px 0;
    color: var(--fcsc-blue-900);
    font-size: 19px;
    font-weight: 600;
    line-height: 1.25;
  }

  .fcsc-news-card > p {
    margin: 0 0 14px;
    color: var(--fcsc-muted, #5d6d77);
    font-size: 13px;
    line-height: 1.55;
  }

  .fcsc-news-card__row {
    display: flex;
    gap: 8px;
  }

  .fcsc-news-card__field {
    flex: 1;
    min-width: 0;
  }

  .fcsc-news-card__field input {
    width: 100%;
    height: 44px;
    padding: 0 14px;
    border: 1.5px solid rgb(7 77 122 / 15%);
    border-radius: 99px;
    background: #fbfdff;
    font: inherit;
    font-size: 14px;
    outline: none;
  }

  .fcsc-news-card__field input:focus {
    border-color: rgb(0 145 103 / 42%);
    box-shadow: 0 0 0 3px rgb(0 145 103 / 8%);
  }

  .fcsc-news-card__row button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: 99px;
    background: var(--fcsc-green-600);
    color: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
  }

  .fcsc-news-card__row button svg {
    width: 13px;
    height: 13px;
  }

  .fcsc-news-card__consent {
    margin-top: 12px;
    font-size: 11px;
  }

  .fcsc-news-card__status {
    min-height: 0;
    margin: 8px 0 0;
    font-size: 12px;
    color: #a23d38;
  }

  .fcsc-news-card__status:empty {
    display: none;
  }

  .fcsc-news-card__status[data-status="success"] {
    color: var(--fcsc-green-800);
    font-size: 13px;
    line-height: 1.5;
  }

  @media (max-width: 640px) {
    /* Sur téléphone : bandeau compact en bas de l'écran, au-dessus du bouton de don. */
    .fcsc-news-card {
      left: 10px;
      right: 10px;
      bottom: 84px;
      width: auto;
      padding: 16px 16px 14px;
      border-radius: 18px;
    }

    .fcsc-news-card > p {
      display: none;
    }

    .fcsc-news-card h2 {
      font-size: 16px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .fcsc-news-card {
      transition: none;
    }
  }
}

/* FCSC V2.4.0 — couche support-panels. */
@layer fcsc.support-panels {
  /*
 * Panneaux de soutien : page Soutenir, panneaux
 * « D'autres façons de nous soutenir » (cartes) et « Ce qui se passe après votre don » (frise).
 * Version compacte : cartes à leur hauteur naturelle, frise resserrée.
 */

  /* ── Panneaux ──────────────────────────────────────────────────────────── */
  .act-page .act-support-panel {
    padding: clamp(24px, 2.6vw, 34px);
  }

  .act-page .act-how__heading h2,
  .act-page .act-support-panel--after .act-after__heading h2 {
    font-size: clamp(26px, 2.4vw, 34px);
    line-height: 1.1;
  }

  .act-page .act-how__heading p {
    margin-top: 12px;
    font-size: 15px;
    line-height: 1.6;
  }

  /* ── Cartes ────────────────────────────────────────────────────────────── */
  .act-page .act-how__options {
    gap: 10px;
    margin-top: 22px;
  }

  .act-page .act-how__option {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    column-gap: 14px;
    align-items: start;
    padding: 16px 18px;
    border: 1px solid rgb(8 61 104 / 9%);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgb(5 41 75 / 4%);
    transition:
      border-color 240ms ease,
      box-shadow 320ms cubic-bezier(0.22, 1, 0.36, 1),
      translate 320ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .act-page .act-how__option > svg:first-of-type {
    align-self: start;
    width: 34px;
    height: 34px;
    margin: 0;
    padding: 9px;
    border-radius: 10px;
    background: linear-gradient(145deg, #eaf7f0 0%, #e2f1f7 100%);
    color: var(--fcsc-green-700, #007e49);
  }

  .act-page .act-how__option > div {
    min-width: 0;
  }

  .act-page .act-how__option h3 {
    margin: 6px 0 0;
    color: var(--fcsc-blue-900);
    font-size: 16px;
    line-height: 1.3;
  }

  .act-page .act-how__option p {
    max-width: none;
    margin: 4px 0 0;
    font-size: 13.5px;
    line-height: 1.55;
  }

  .act-page .act-how__option .act-how__link-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 8px;
    padding: 0;
    color: var(--fcsc-green-700, #007e49);
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: 4px;
    transition: text-decoration-color 220ms ease;
  }

  .act-page .act-how__option .act-how__next {
    display: inline-flex;
    width: auto;
    height: auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    transition: transform 320ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .act-page .act-how__option .act-how__next svg {
    width: 12px;
    height: 12px;
  }

  .act-page .act-how__option:hover,
  .act-page .act-how__option:focus-visible {
    border-color: rgb(0 145 103 / 30%);
    background: #fff;
    box-shadow: 0 14px 32px rgb(5 41 75 / 8%);
  }

  .act-page .act-how__option:focus-visible {
    outline: 3px solid rgb(0 143 80 / 30%);
    outline-offset: 3px;
  }

  .act-page .act-how__option:hover .act-how__link-label,
  .act-page .act-how__option:focus-visible .act-how__link-label {
    text-decoration-color: currentColor;
  }

  .act-page .act-how__option:hover .act-how__next,
  .act-page .act-how__option:focus-visible .act-how__next {
    transform: translateX(4px);
  }

  /* ── Frise « Après votre don » ─────────────────────────────────────────── */
  .act-page .act-support-panel--after {
    display: flex;
    flex-direction: column;
  }

  .act-page .act-support-panel--after .act-after__steps {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 16px;
    /* L'écart restant, s'il y en a, est absorbé par les étapes 01 et 02 (90 px au maximum chacune). */
    margin-top: 26px;
    counter-reset: fcsc-step;
  }

  .act-page .act-support-panel--after .act-after__steps article {
    position: relative;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 14px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    counter-increment: fcsc-step;
  }

  .act-page .act-support-panel--after .act-after__steps article:not(:last-child) {
    flex: 1 1 auto;
    /* Contenu (~75 px) + 90 px d'écart au maximum. */
    max-height: 165px;
  }

  .act-page .act-support-panel--after .act-after__icon {
    display: none;
  }

  .act-page .act-support-panel--after .act-after__steps article::before {
    content: counter(fcsc-step, decimal-leading-zero);
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid rgb(255 255 255 / 34%);
    border-radius: 50%;
    background: rgb(8 58 80 / 55%);
    color: #d7f0e0;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.05em;
    font-variant-numeric: tabular-nums;
  }

  /* Ligne reliant chaque étape à la suivante, quelle que soit la distance. */
  .act-page .act-support-panel--after .act-after__steps article:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 42px;
    bottom: -10px;
    left: 17.5px;
    width: 1px;
    background: linear-gradient(180deg, rgb(215 240 224 / 45%), rgb(215 240 224 / 12%));
  }

  .act-page .act-support-panel--after .act-after__steps h3 {
    margin: 8px 0 0;
    font-size: 16px;
    line-height: 1.3;
  }

  .act-page .act-support-panel--after .act-after__steps p {
    max-width: 46ch;
    margin: 4px 0 0;
    font-size: 13.5px;
    line-height: 1.55;
  }
}

/* FCSC V2.4.0 — couche sheets-transitions. */
@layer fcsc.sheets-transitions {
  /*
 * Modales et transitions : modales « feuille » (bénévoles, renvoi des liens), modale du
 * livre blanc, pied de page, pictogrammes des moyens de paiement, transitions de page.
 */

  /* ── Modale « feuille » ─────────────────────────────────────────────────── */
  .fcsc-sheet {
    position: fixed;
    z-index: 1400;
    inset: 0;
    display: grid;
    place-items: center;
    background: rgb(6 30 48 / 52%);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    font-family: var(--fcsc-v21-font, Montserrat, sans-serif);
    opacity: 0;
    transition: opacity 260ms ease;
  }

  .fcsc-sheet[data-state="open"] {
    opacity: 1;
  }

  .fcsc-sheet__dialog {
    position: relative;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border: 1px solid rgb(8 61 104 / 8%);
    background: #fff;
    outline: none;
    translate: 0 14px;
    scale: 0.985;
    transition:
      translate 320ms cubic-bezier(0.22, 1, 0.36, 1),
      scale 320ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .fcsc-sheet[data-state="open"] .fcsc-sheet__dialog {
    translate: 0 0;
    scale: 1;
  }

  .fcsc-sheet__close {
    position: absolute;
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid #e4ebed;
    border-radius: 50%;
    color: #173b52;
    cursor: pointer;
    transition: background-color 200ms ease;
  }

  .fcsc-sheet__close:hover {
    background: #edf6f2;
  }

  .fcsc-sheet__close svg {
    width: 15px;
    height: 15px;
  }

  .fcsc-sheet__header {
    padding-right: 48px;
  }

  .fcsc-sheet__eyebrow {
    display: block;
    color: var(--fcsc-green-700, #007e49);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }

  .fcsc-sheet__header h2 {
    margin: 8px 0 0;
    color: #123b57;
    font-weight: 600;
    line-height: 1.15;
  }

  .fcsc-sheet__header p {
    margin: 8px 0 0;
    color: #526674;
  }

  .fcsc-grid {
    display: grid;
  }

  .fcsc-grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .fcsc-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .fcsc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
  }

  .fcsc-field--full {
    margin-bottom: 12px;
  }

  .fcsc-field__label {
    padding: 0;
    color: #123b57;
    font-size: 12px;
    font-weight: 600;
  }

  .fcsc-field__input {
    width: 100%;
    height: 44px;
    padding: 0 13px;
    border: 1.5px solid rgb(7 77 122 / 14%);
    border-radius: 11px;
    background: #fbfdfc;
    color: #123c54;
    font: inherit;
    font-size: 14px;
    outline: none;
    transition:
      border-color 180ms ease,
      box-shadow 180ms ease,
      background-color 180ms ease;
  }

  .fcsc-field__input:hover {
    border-color: rgb(7 77 122 / 24%);
  }

  .fcsc-field__input:focus {
    border-color: rgb(0 145 103 / 45%);
    background: #fff;
    box-shadow: 0 0 0 3px rgb(0 145 103 / 9%);
  }

  .fcsc-field__input--area {
    height: auto;
    min-height: 62px;
    padding: 11px 13px;
    line-height: 1.5;
    resize: vertical;
  }

  /* Pastilles de choix (boutons radio natifs). */
  .fcsc-choices {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }

  .fcsc-choices legend {
    margin-bottom: 6px;
  }

  .fcsc-choices__list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }

  .fcsc-choice {
    position: relative;
    cursor: pointer;
  }

  .fcsc-choice input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
  }

  .fcsc-choice span {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid rgb(7 77 122 / 14%);
    border-radius: 99px;
    background: #fbfdfc;
    color: #2f4a5c;
    font-size: 12.5px;
    font-weight: 500;
    transition:
      border-color 180ms ease,
      background-color 180ms ease,
      color 180ms ease;
  }

  .fcsc-choice:hover span {
    border-color: rgb(0 145 103 / 35%);
  }

  .fcsc-choice input:checked + span {
    border-color: var(--fcsc-green-600, #149164);
    background: #eef9f3;
    color: var(--fcsc-green-800, #0a5c3c);
    font-weight: 600;
  }

  .fcsc-choice input:focus-visible + span {
    outline: 3px solid rgb(0 143 80 / 28%);
    outline-offset: 2px;
  }

  /* Case de consentement. */
  .fcsc-check {
    position: relative;
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 4px 0 16px;
    cursor: pointer;
  }

  .fcsc-check input {
    position: absolute;
    width: 18px;
    height: 18px;
    margin: 0;
    opacity: 0;
    cursor: pointer;
  }

  .fcsc-check__box {
    width: 18px;
    height: 18px;
    margin-top: 1px;
    border: 1.5px solid rgb(7 77 122 / 30%);
    border-radius: 6px;
    background: #fff;
    transition:
      background-color 180ms ease,
      border-color 180ms ease;
  }

  .fcsc-check input:checked + .fcsc-check__box {
    border-color: var(--fcsc-green-600, #149164);
    background: var(--fcsc-green-600, #149164)
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E")
      center / 12px no-repeat;
  }

  .fcsc-check input:focus-visible + .fcsc-check__box {
    outline: 3px solid rgb(0 143 80 / 28%);
    outline-offset: 2px;
  }

  .fcsc-check__label {
    color: #526674;
    font-size: 12px;
    line-height: 1.55;
  }

  .fcsc-trap {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }

  /* Bouton principal : texte sur une ligne, flèche à droite. */
  .fcsc-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 48px;
    padding: 0 22px;
    border: 0;
    border-radius: 99px;
    background: linear-gradient(90deg, var(--fcsc-green-600, #149164), var(--fcsc-blue-700, #0b5f95));
    color: #fff;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 12px 26px rgb(0 92 100 / 18%);
    transition:
      box-shadow 240ms ease,
      translate 240ms ease;
  }

  .fcsc-submit svg {
    width: 15px;
    height: 15px;
    transition: transform 240ms ease;
  }

  .fcsc-submit:hover {
    box-shadow: 0 16px 32px rgb(0 92 100 / 24%);
  }

  .fcsc-submit:hover svg {
    transform: translateX(3px);
  }

  .fcsc-submit:disabled {
    opacity: 0.6;
    cursor: wait;
  }

  .fcsc-sheet__status {
    margin: 10px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    text-align: center;
  }

  .fcsc-sheet__status:empty {
    display: none;
  }

  .fcsc-sheet__status[data-status="error"] {
    color: #9a3541;
  }
  .fcsc-sheet__status[data-status="success"] {
    color: var(--fcsc-green-800, #0a5c3c);
  }

  .fcsc-sheet__done {
    padding: 22px;
    border-radius: 16px;
    background: #eef7f1;
    color: var(--fcsc-green-800, #0a5c3c);
    font-size: 14px;
    line-height: 1.6;
  }

  .fcsc-sheet__done p {
    margin: 0;
  }

  /* Étapes (téléphone uniquement) : masquées sur grand écran. */
  .fcsc-steps,
  .fcsc-step-next,
  .fcsc-step-back {
    display: none;
  }

  @media (max-width: 640px) {
    .fcsc-sheet {
      padding: 12px;
    }

    .fcsc-grid--2,
    .fcsc-grid--3 {
      grid-template-columns: 1fr;
      gap: 10px;
    }

    /* Deux étapes, chacune entièrement visible. */
    .fcsc-sheet--volunteer .fcsc-steps {
      display: block;
      margin: 0 0 12px;
      color: var(--fcsc-green-700, #007e49);
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }

    .fcsc-sheet--volunteer .fcsc-step-next {
      display: flex;
    }

    .fcsc-sheet--volunteer .fcsc-step-back {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      margin: 0 0 12px;
      padding: 0;
      border: 0;
      background: none;
      color: #123b57;
      font: inherit;
      font-size: 12.5px;
      font-weight: 600;
      cursor: pointer;
    }

    .fcsc-sheet--volunteer .fcsc-step-back svg {
      width: 12px;
      height: 12px;
    }

    .fcsc-sheet--volunteer [data-step="1"] [data-step-panel="2"],
    .fcsc-sheet--volunteer [data-step="2"] [data-step-panel="1"] {
      display: none;
    }

    .fcsc-sheet--volunteer [data-step="2"] ~ .fcsc-sheet__header p,
    .fcsc-sheet--volunteer .fcsc-sheet__dialog:has([data-step="2"]) .fcsc-sheet__header p {
      display: none;
    }
  }

  /* Petits écrans en hauteur (ex. 360 × 640) : tout reste visible sans défilement. */
  @media (max-width: 640px) and (max-height: 760px) {
    .fcsc-sheet__dialog {
      padding: 18px 16px 16px;
    }

    .fcsc-sheet__header h2 {
      font-size: 20px;
    }

    .fcsc-sheet__header p {
      display: none;
    }

    .fcsc-sheet__form {
      margin-top: 12px;
    }

    .fcsc-grid {
      gap: 8px;
      margin-bottom: 8px;
    }

    .fcsc-field {
      gap: 4px;
    }

    .fcsc-field__input {
      height: 40px;
    }

    .fcsc-field__input--area {
      min-height: 48px;
    }

    .fcsc-field--full {
      margin-bottom: 8px;
    }

    .fcsc-choice span {
      min-height: 28px;
      padding: 0 10px;
      font-size: 12px;
    }

    .fcsc-choices__list {
      gap: 5px;
    }

    .fcsc-check {
      margin: 2px 0 10px;
    }

    .fcsc-check__label {
      font-size: 11.5px;
    }

    .fcsc-submit {
      min-height: 44px;
    }

    .fcsc-sheet--volunteer .fcsc-steps,
    .fcsc-sheet--volunteer .fcsc-step-back {
      margin-bottom: 8px;
    }
  }

  /* ── Modale du livre blanc : hauteur ajustée au contenu ─────────────────── */
  .fcsc-whitepaper-modal {
    /* Le dialogue est centré par « inset: 0 » : sans hauteur explicite, il s'étirait
     sur toute la hauteur de l'écran. Il épouse désormais son contenu. */
    height: fit-content;
    min-height: 0;
  }

  .fcsc-whitepaper-modal .fcsc-modal__scroll {
    height: auto;
    min-height: 0;
  }

  .fcsc-whitepaper-modal .fcsc-modal__body {
    padding: 30px 34px 30px;
  }

  .fcsc-whitepaper-modal .fcsc-modal__body h2 {
    margin: 0 56px 8px 0;
    font-size: clamp(24px, 2.6vw, 30px);
    font-weight: 600;
  }

  .fcsc-whitepaper-modal .fcsc-modal__body > p {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.55;
    text-align: left;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form {
    margin-top: 20px;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form__grid {
    gap: 12px;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form__grid label:last-child {
    grid-column: auto;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form input:not([type="checkbox"]) {
    min-height: 44px;
    font-size: 14px;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form__consent {
    margin-top: 16px;
    line-height: 1.55;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form__consent input {
    appearance: none;
    width: 18px;
    height: 18px;
    border: 1.5px solid rgb(7 77 122 / 30%);
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form__consent input:checked {
    border-color: #149164;
    background: #149164
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E")
      center / 12px no-repeat;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form__privacy {
    margin: 6px 0 16px 32px;
  }

  .fcsc-whitepaper-modal .fcsc-whitepaper-form > button:disabled {
    cursor: not-allowed;
    opacity: 0.5;
  }

  @media (max-width: 640px) {
    .fcsc-whitepaper-modal .fcsc-modal__body {
      padding: 22px 18px 20px;
    }
  }

  /* ── Pied de page : « Cookies » aligné comme les liens ──────────────────── */

  /* ── Choix du moyen de paiement : pictogrammes sans fond, en vert ───────── */
  .act-page .act-payment-choice__meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .act-payment-choice__icon {
    display: block;
    width: 30px;
    height: 26px;
    color: #2a826a;
  }

  .act-payment-choice__icon svg {
    width: 26px;
    height: 26px;
  }

  /* Le logo Mobile Money (PNG blanc) sert de pochoir, rempli en vert. */
  .act-payment-choice__icon--mobile {
    width: 40px;
    background-color: #2a826a;
    -webkit-mask: url("/images/payment/mobile-money-mark-white.png") left center / contain no-repeat;
    mask: url("/images/payment/mobile-money-mark-white.png") left center / contain no-repeat;
  }

  /* ── Transitions fluides entre les pages (navigateurs compatibles) ──────── */
  @view-transition {
    navigation: auto;
  }

  ::view-transition-old(root) {
    animation: fcsc-page-out 150ms cubic-bezier(0.4, 0, 1, 1) both;
  }

  ::view-transition-new(root) {
    animation: fcsc-page-in 240ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  ::view-transition-group(fcsc-header),
  ::view-transition-group(fcsc-donation) {
    animation-duration: 0s;
  }

  @keyframes fcsc-page-out {
    to {
      opacity: 0;
    }
  }

  @keyframes fcsc-page-in {
    from {
      opacity: 0;
      transform: translateY(5px);
    }
  }

  @media (prefers-reduced-motion: reduce) {
    @view-transition {
      navigation: none;
    }

    ::view-transition-group(*),
    ::view-transition-old(*),
    ::view-transition-new(*) {
      animation: none;
    }
  }
}

/* FCSC V5.2.1 — partage compact et accessible des articles, sans dépendance externe. */
@layer fcsc.article-sharing {
  .fcsc-article-media {
    position: relative;
  }

  /* Le partage demeure dans l'image, sans masquer l'article ni le bouton fermer. */
  .fcsc-article-share {
    position: absolute;
    z-index: 4;
    top: 14px;
    left: 14px;
    display: block;
    max-width: calc(100% - 86px);
    font-family: var(--fcsc-v21-font, Montserrat, sans-serif);
  }

  .fcsc-article-share__toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 42px;
    padding: 9px 15px;
    border: 1px solid rgb(255 255 255 / 65%);
    border-radius: 999px;
    background: rgb(9 44 63 / 86%);
    color: #fff;
    font: 600 13px/1.25 var(--fcsc-v21-font, Montserrat, sans-serif);
    letter-spacing: 0.01em;
    cursor: pointer;
    box-shadow: 0 5px 18px rgb(4 30 43 / 14%);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    transition:
      background-color 170ms ease,
      border-color 170ms ease,
      box-shadow 170ms ease,
      transform 170ms ease;
  }
  .fcsc-article-share__toggle:hover,
  .fcsc-article-share[data-open="true"] .fcsc-article-share__toggle {
    background: rgb(5 87 90 / 96%);
    box-shadow: 0 8px 24px rgb(4 30 43 / 23%);
  }
  .fcsc-article-share__toggle > svg {
    flex: none;
    width: 18px;
    height: 18px;
  }

  /* Le conteneur est positionné, pas inséré dans le flux : aucun saut de contenu. */
  .fcsc-article-share__menu {
    position: absolute;
    z-index: 5;
    top: calc(100% + 9px);
    left: 0;
    width: min(268px, calc(100vw - 64px));
    max-width: none;
    padding: 10px;
    border: 1px solid rgb(255 255 255 / 32%);
    border-radius: 18px;
    background: rgb(9 44 63 / 94%);
    color: #fff;
    box-shadow: 0 16px 40px rgb(3 24 37 / 26%);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    transform-origin: top left;
    transition:
      opacity 180ms ease,
      transform 210ms cubic-bezier(0.2, 0.75, 0.25, 1.1);
  }
  .fcsc-article-share__menu[hidden] {
    display: none;
  }
  .fcsc-article-share__menu[data-state="closed"] {
    opacity: 0;
    transform: translateY(-7px) scale(0.96);
    pointer-events: none;
  }
  .fcsc-article-share__menu[data-state="open"] {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  .fcsc-article-share__options {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: center;
    gap: 6px;
  }
  .fcsc-article-share__option {
    display: inline-grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 1;
    min-width: 0;
    min-height: 38px;
    margin: 0;
    padding: 0;
    border: 1px solid rgb(255 255 255 / 20%);
    border-radius: 50%;
    background: rgb(255 255 255 / 8%);
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    transition:
      transform 160ms ease,
      background-color 160ms ease,
      border-color 160ms ease;
  }
  .fcsc-article-share__option svg {
    width: 19px;
    height: 19px;
  }
  .fcsc-article-share__option:hover {
    background: rgb(255 255 255 / 20%);
    border-color: rgb(255 255 255 / 55%);
    transform: translateY(-2px);
  }
  .fcsc-article-share__option:active {
    transform: scale(0.95);
  }
  .fcsc-article-share__status {
    display: block;
    margin-top: 9px;
    color: #fff;
    font: 500 11px/1.5 var(--fcsc-v21-font, Montserrat, sans-serif);
    overflow-wrap: anywhere;
  }
  .fcsc-article-share__status:empty {
    display: none;
  }

  @media (max-width: 560px) {
    .fcsc-article-share {
      top: 10px;
      left: 10px;
    }
    .fcsc-article-share__toggle {
      min-height: 38px;
      padding: 8px 12px;
      font-size: 12px;
      gap: 7px;
    }
    .fcsc-article-share__menu {
      padding: 9px;
    }
    .fcsc-article-share__option {
      min-height: 36px;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .fcsc-article-share__toggle,
    .fcsc-article-share__menu,
    .fcsc-article-share__option {
      transition: none;
    }
  }
}

/*
 * Librairie FCSC V2.4.0
 * Source native unique : hero, catalogue, cartes, recherche, panier et achat.
 * Aucune règle de la librairie ne doit être définie dans une autre source.
 */
@layer fcsc.library {
  .v2-library-hero {
    position: relative;
    display: grid;
    align-items: center;
    min-height: 100svh;
    overflow: hidden;
    isolation: isolate;
    background: #062f4d;
    color: #fff;
  }

  .v2-library-hero picture,
  .v2-library-hero picture::after {
    position: absolute;
    inset: 0;
  }

  .v2-library-hero picture {
    z-index: -2;
  }

  .v2-library-hero picture::after {
    content: "";
    background:
      linear-gradient(90deg, rgb(1 31 53 / 82%) 0%, rgb(3 47 73 / 62%) 48%, rgb(2 46 61 / 20%) 78%),
      linear-gradient(180deg, rgb(0 31 55 / 12%) 0%, rgb(0 29 49 / 45%) 100%);
  }

  .v2-library-hero img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .v2-library-hero__copy {
    width: min(760px, calc(100% - 48px));
    margin-left: max(24px, calc((100vw - 1180px) / 2));
    padding-block: calc(var(--fcsc-header-expanded, 96px) + 56px) 80px;
  }

  .v2-library-hero__copy h1 {
    max-width: 720px;
    margin: 0;
    font-size: clamp(58px, 7.6vw, 102px);
    font-weight: 600;
    line-height: 0.92;
    letter-spacing: -0.065em;
    text-wrap: balance;
  }

  .v2-library-hero__copy p {
    max-width: 650px;
    margin: 28px 0 0;
    color: rgb(255 255 255 / 84%);
    font-size: clamp(17px, 1.65vw, 21px);
    line-height: 1.58;
  }

  .v2-library-hero__copy .hero-button {
    margin-top: 31px;
  }

  .library-page {
    --library-width: 1180px;
    background: #f8faf9;
    color: var(--fcsc-blue-900, #003d70);
  }

  .library-catalog {
    width: min(var(--library-width), calc(100% - 48px));
    margin-inline: auto;
    padding-block: clamp(86px, 9vw, 132px);
    scroll-margin-top: 90px;
  }

  .library-catalog__heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 32px;
    margin-bottom: 42px;
  }

  .library-catalog__heading h2 {
    margin: 0;
    font-size: clamp(36px, 4.4vw, 62px);
    font-weight: 560;
    line-height: 1;
    letter-spacing: -0.052em;
  }

  .library-catalog__heading p {
    max-width: 710px;
    margin: 18px 0 0;
    color: #657b85;
    font-size: clamp(15px, 1.35vw, 18px);
    line-height: 1.72;
  }

  .library-catalog__tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
  }

  .library-search {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 46px;
  }

  .library-search__toggle,
  .library-cart-toggle,
  .library-search__clear {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    padding: 0;
    border: 1px solid #d8e4e0;
    border-radius: 50%;
    background: #fff;
    color: #174b63;
    box-shadow: 0 7px 22px rgb(15 60 68 / 6%);
  }

  .library-search__toggle svg,
  .library-cart-toggle svg {
    width: 18px;
    height: 18px;
  }

  .library-search__icon--close {
    display: none;
  }

  .library-search.is-open .library-search__icon--glass {
    display: none;
  }

  .library-search.is-open .library-search__icon--close {
    display: block;
  }

  .library-search__field {
    width: 0;
    overflow: hidden;
    opacity: 0;
    transition:
      width 260ms ease,
      opacity 180ms ease;
  }

  .library-search.is-open .library-search__field {
    width: min(330px, 34vw);
    margin-right: 8px;
    opacity: 1;
  }

  .library-search__field input {
    width: 100%;
    height: 46px;
    padding: 0 44px 0 16px;
    border: 1px solid #d8e4e0;
    border-radius: 999px;
    outline: 0;
    background: #fff;
    color: #133f56;
  }

  .library-search__field input:focus {
    border-color: #16845f;
    box-shadow: 0 0 0 3px rgb(22 132 95 / 10%);
  }

  .library-search__clear {
    position: absolute;
    top: 7px;
    right: 55px;
    width: 32px;
    height: 32px;
    border: 0;
    box-shadow: none;
  }

  .library-search__clear svg {
    width: 13px;
    height: 13px;
  }

  .library-cart-toggle {
    position: relative;
  }

  .library-cart-toggle__badge {
    position: absolute;
    top: -5px;
    right: -4px;
    display: grid;
    place-items: center;
    min-width: 20px;
    height: 20px;
    padding-inline: 5px;
    border: 2px solid #f8faf9;
    border-radius: 999px;
    background: #008f50;
    color: #fff;
    font-size: 9px;
    font-weight: 750;
  }

  .library-catalog__count,
  .library-catalog__empty {
    margin: -18px 0 28px;
    color: #667c84;
    font-size: 13px;
  }

  .library-catalog__empty {
    padding: 50px 24px;
    border-block: 1px solid #dce7e3;
    text-align: center;
  }

  .library-catalog__more {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 42px;
  }

  .library-catalog__more button,
  .library-resend__open,
  .library-return__resend {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 43px;
    padding: 10px 17px;
    border: 1px solid #ceded8;
    border-radius: 999px;
    background: #fff;
    color: #0a6048;
    font: inherit;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
  }

  .library-catalog__more button:disabled {
    cursor: wait;
    opacity: 0.55;
  }

  .library-catalog__more svg {
    width: 13px;
    height: 13px;
  }

  .library-resend {
    margin: 28px 0 0;
    color: #6a7f86;
    font-size: 12px;
    text-align: center;
  }

  .library-resend__open {
    min-height: auto;
    padding: 0;
    border: 0;
    background: transparent;
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  .library-resend__links {
    display: grid;
    gap: 8px;
    margin: 14px 0 0;
    padding: 0;
    list-style: none;
  }

  .library-resend__links a {
    color: #08745b;
    font-weight: 650;
  }

  .library-support {
    border-top: 1px solid #dfe9e5;
    background: #eef5f1;
  }

  .library-support__shell {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
    align-items: end;
    gap: clamp(34px, 7vw, 100px);
    width: min(var(--library-width), calc(100% - 48px));
    margin-inline: auto;
    padding-block: clamp(72px, 8vw, 112px);
  }

  .library-support__intro h2 {
    max-width: 740px;
    margin: 14px 0 0;
    color: #0a3d58;
    font-size: clamp(34px, 4vw, 56px);
    font-weight: 560;
    line-height: 1.04;
    letter-spacing: -0.048em;
  }

  .library-support__text {
    margin: 0;
    color: #60777f;
    font-size: 15px;
    line-height: 1.75;
  }

  @keyframes library-overlay-in {
    from {
      opacity: 0;
    }
  }

  @keyframes library-overlay-out {
    to {
      opacity: 0;
    }
  }

  @keyframes library-dialog-in {
    from {
      opacity: 0;
      transform: translateY(18px) scale(0.985);
    }
  }

  @keyframes library-content-in {
    from {
      opacity: 0;
      transform: translateY(8px);
    }
  }

  @keyframes library-cart-in {
    from {
      transform: translateX(38px);
      opacity: 0;
    }
  }

  @media (max-width: 980px) {
    .v2-library-hero__copy {
      padding-top: calc(var(--fcsc-header-compact, 76px) + 44px);
    }
  }

  @media (max-width: 720px) {
    .v2-library-hero {
      align-items: end;
    }

    .v2-library-hero picture::after {
      background: linear-gradient(
        180deg,
        rgb(2 35 58 / 28%) 0%,
        rgb(2 38 62 / 88%) 78%,
        rgb(1 31 52 / 96%) 100%
      );
    }

    .v2-library-hero__copy {
      width: calc(100% - 36px);
      margin: 0 18px;
      padding: 120px 0 72px;
    }

    .v2-library-hero__copy h1 {
      font-size: clamp(48px, 14vw, 68px);
    }

    .v2-library-hero__copy p {
      margin-top: 22px;
      font-size: 16px;
    }

    .library-catalog {
      width: calc(100% - 32px);
      padding-block: 72px;
    }

    .library-catalog__heading {
      grid-template-columns: 1fr;
      align-items: start;
      gap: 24px;
      margin-bottom: 30px;
    }

    .library-catalog__tools {
      justify-content: flex-start;
      width: 100%;
    }

    .library-search {
      flex: 1;
      justify-content: flex-start;
    }

    .library-search.is-open .library-search__field {
      width: calc(100% - 54px);
      order: -1;
    }

    .library-search__clear {
      right: 55px;
    }

    .library-support__shell {
      grid-template-columns: 1fr;
      width: calc(100% - 36px);
    }
  }
}

/* FCSC V2.4.0 — couche payment-states. */
@layer fcsc.payment-states {
  .act-payment-choice:disabled {
    opacity: 0.68;
    cursor: not-allowed;
  }
  .act-payment-choice:disabled:hover {
    transform: none;
  }
}

/* FCSC V2.4.0 — utilitaires globaux d’accessibilité. */

/* La priorité fait partie du contrat fonctionnel de ces utilitaires. */
[hidden] {
  display: none !important;
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.contact-form__trap {
  position: absolute !important;
  left: -9999px !important;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto !important;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
}

/* FCSC V4.3 — Panier Librairie : finition visuelle cohérente avec la Fondation */

/* V4.3.5 — catalogue métier : chargement neutre et indisponibilité réelle des actifs. */
.library-catalog__loading {
  min-height: 18rem;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 0.8rem;
  color: var(--muted, #64748b);
  text-align: center;
}
.library-catalog__loading-spinner {
  width: 2rem;
  height: 2rem;
  border: 0.18rem solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: fcscLibrarySpin 0.8s linear infinite;
}
@keyframes fcscLibrarySpin {
  to {
    transform: rotate(360deg);
  }
}
@media (prefers-reduced-motion: reduce) {
  .library-catalog__loading-spinner {
    animation: none;
  }
}

/* FCSC V6.6 — design de dialogues commun, sans dimensions artificielles. */
@layer fcsc.pages {
  .fcsc-modal {
    width: min(600px, calc(100vw - 28px));
    max-height: calc(100dvh - 36px);
    border-radius: 23px;
    border: 1px solid #e5ebe8;
    box-shadow: 0 26px 82px rgb(0 27 37 / 20%);
  }
  .fcsc-modal:has(.fcsc-modal__image) {
    width: min(720px, calc(100vw - 28px));
  }
  .fcsc-modal:has(form) {
    width: min(560px, calc(100vw - 28px));
  }
  .fcsc-modal__scroll {
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    overscroll-behavior: contain;
  }
  .fcsc-modal__body {
    padding: clamp(18px, 3vw, 27px);
  }
  .fcsc-modal__body h2 {
    font-size: clamp(20px, 2.5vw, 27px);
    margin-bottom: 12px;
    line-height: 1.3;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
  }
  .fcsc-modal__body p {
    font-size: clamp(13px, 1.2vw, 14px);
    line-height: 1.65;
  }
  .fcsc-modal__close {
    width: 39px;
    height: 39px;
    top: 12px;
    right: 12px;
    box-shadow: none;
    background: #f4f6f5;
  }
  .fcsc-modal button,
  .fcsc-modal a,
  .fcsc-sheet button,
  .fcsc-sheet a {
    touch-action: manipulation;
  }
  @media (max-width: 640px) {
    .fcsc-modal {
      width: calc(100vw - 18px);
      max-height: calc(100dvh - max(14px, env(safe-area-inset-top)) - max(14px, env(safe-area-inset-bottom)));
      border-radius: 18px;
    }
    .fcsc-modal__body {
      padding: 17px 15px;
    }
    .fcsc-modal__image {
      max-height: 180px;
      object-fit: cover;
    }
    .fcsc-modal__body h2 {
      font-size: 21px;
      padding-right: 18px;
    }
    .fcsc-modal input,
    .fcsc-modal textarea,
    .fcsc-modal select {
      font-size: 16px;
      max-width: 100%;
    }
  }
}
@layer fcsc.sheets-transitions {
  .fcsc-sheet {
    padding: clamp(9px, 2vw, 20px);
  }
  .fcsc-sheet__dialog {
    width: min(590px, 100%);
    max-height: calc(100dvh - max(18px, env(safe-area-inset-top)) - max(18px, env(safe-area-inset-bottom)));
    height: auto;
    padding: clamp(17px, 3vw, 27px);
    border-radius: 23px;
    box-shadow: 0 28px 82px rgb(0 30 45 / 20%);
    overflow-y: auto;
    overflow-x: hidden;
  }
  .fcsc-sheet--compact .fcsc-sheet__dialog {
    width: min(460px, 100%);
  }
  .fcsc-sheet--volunteer .fcsc-sheet__dialog {
    width: min(640px, 100%);
  }
  .fcsc-sheet__header h2 {
    font-size: clamp(20px, 2.6vw, 25px);
    letter-spacing: -0.025em;
  }
  .fcsc-sheet__header p {
    font-size: 12.5px;
    line-height: 1.55;
  }
  .fcsc-sheet__form {
    margin-top: 16px;
  }
  .fcsc-grid {
    gap: 10px;
    margin-bottom: 10px;
  }
  .fcsc-sheet__close {
    top: 13px;
    right: 13px;
    background: #f4f6f5;
  }
  @media (max-width: 640px) {
    .fcsc-sheet__dialog {
      padding: 16px 15px 18px;
      border-radius: 18px;
    }
    .fcsc-sheet__header h2 {
      font-size: 21px;
    }
  }
}
/* Limites intrinsèques : pas de coupure accidentelle des éléments sur smartphone/tablette. */
@layer fcsc.layout {
  .library-page,
  .act-page,
  .fcsc-mission,
  .foundation-page {
    min-width: 0;
  }
  picture,
  img,
  svg,
  video {
    max-width: 100%;
  }
  @media (max-width: 700px) {
    form input:not([type="checkbox"]):not([type="radio"]),
    form select,
    form textarea {
      max-width: 100%;
    }
    .fcsc-modal form,
    .fcsc-sheet form {
      min-width: 0;
    }
  }
}

/* FCSC V6.6 — les fiches et achats Librairie ne sont plus des fenêtres à hauteur fixe. */

/* V6.6 — révélation verticale sur les écrans tactiles / tablettes :
   aucun déplacement latéral temporaire hors du viewport. */
@layer fcsc.components {
  @media (max-width: 1100px) {
    .v2-reveal.v2-action-card[data-side="left"],
    .v2-reveal.v2-action-card[data-side="right"] {
      transform: translateY(16px);
    }
    .v2-reveal.v2-action-card[data-side][data-visible="true"] {
      transform: none;
    }
  }
}

/* FCSC V6.7 — librairie : valoriser les couvertures, retirer les cadres inutiles.
   Les cartes conservent UNE séparation discrète ; aucun double encadrement. */

/* ===== Ajustements (anciennement fcsc.degrease.v310.css) ===== */
/* FCSC V3.1 — cure typographique. Les H1 des heroes sont volontairement exclus. */
:root {
  --fcsc-ui-weight: 450;
  --fcsc-ui-medium: 520;
  --fcsc-ui-strong: 600;
}
body {
  font-weight: 400;
}
.site-header,
.site-header a,
.site-footer,
.site-footer a,
.hero-button,
.button,
button,
input,
select,
textarea {
  font-weight: var(--fcsc-ui-medium) !important;
}
.hero-slide__eyebrow,
.section-eyebrow,
.eyebrow,
.label,
.meta,
.tag,
.badge {
  font-weight: var(--fcsc-ui-medium) !important;
}
main p,
main li,
.modal p,
.modal li,
.site-footer p {
  font-weight: 400 !important;
}
main h2:not(.hero-slide h2),
main h3,
main h4,
.modal h2,
.modal h3 {
  font-weight: var(--fcsc-ui-strong) !important;
}
.hero-slide :is(h1, h2) {
  font-weight: var(--fcsc-ui-strong) !important;
}
.card strong,
.stat strong {
  font-weight: var(--fcsc-ui-strong) !important;
}

/* ==========================================================================
   V7.2 — Actualités, Agenda, Transparence (contenus publiés depuis l'espace des membres)
   ========================================================================== */
.pub-page { max-width: 1120px; margin: 0 auto; padding: calc(var(--fcsc-header-expanded) + 56px) 24px 96px; font-family: var(--fcsc-v21-font, Montserrat, sans-serif); color: var(--fcsc-ink); }
.pub-head { max-width: 760px; margin-bottom: 40px; }
.pub-head h1 { margin: 14px 0 0; color: var(--fcsc-blue-900); font-size: clamp(34px, 4.6vw, 54px); line-height: 1.05; letter-spacing: -0.04em; }
.pub-head p { margin: 18px 0 0; color: var(--fcsc-muted); font-size: 18px; line-height: 1.6; }
.pub-root { min-height: 240px; }
.pub-skeleton { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px; }
.pub-skeleton span { height: 280px; border-radius: 22px; background: linear-gradient(90deg, #eef3f5 0%, #f7fafb 50%, #eef3f5 100%); background-size: 200% 100%; animation: pub-shine 1.4s linear infinite; }
@keyframes pub-shine { to { background-position: -200% 0; } }
.pub-empty { display: grid; justify-items: center; gap: 16px; padding: 56px 24px; border: 1px dashed var(--fcsc-line); border-radius: 22px; text-align: center; color: var(--fcsc-muted); font-size: 17px; }
.pub-button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 22px; border: 0; border-radius: 999px; background: var(--fcsc-cta-gradient); color: #fff; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; box-shadow: var(--fcsc-cta-shadow); }
.pub-button--ghost { background: #fff; color: var(--fcsc-blue-900); box-shadow: inset 0 0 0 1.5px var(--fcsc-line); }
.pub-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.pub-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 22px; background: #fff; box-shadow: var(--fcsc-v21-shadow, 0 18px 50px rgb(11 49 62 / 8%)); color: inherit; text-decoration: none; transition: transform 0.35s var(--fcsc-ease), box-shadow 0.35s var(--fcsc-ease); }
.pub-card:hover { transform: translateY(-4px); box-shadow: var(--fcsc-v21-shadow-hover, 0 26px 64px rgb(11 49 62 / 14%)); }
.pub-card__media { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--fcsc-soft-blue); }
.pub-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--fcsc-ease); }
.pub-card:hover .pub-card__media img { transform: scale(1.04); }
.pub-card__placeholder { display: block; width: 100%; height: 100%; background: radial-gradient(circle at 30% 30%, #d9f0e4, transparent 60%), linear-gradient(135deg, #e7f3fa, #eef7f1); }
.pub-card__body { display: grid; gap: 10px; padding: 22px 24px 26px; }
.pub-card time, .pub-article > time { color: var(--fcsc-green-700); font-size: 13px; font-weight: 600; letter-spacing: 0.02em; text-transform: uppercase; }
.pub-card h2, .pub-card h3 { margin: 0; color: var(--fcsc-blue-900); font-size: 20px; line-height: 1.25; letter-spacing: -0.02em; }
.pub-card p { margin: 0; color: var(--fcsc-muted); font-size: 15px; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pub-card__more { color: var(--fcsc-blue-700); font-weight: 600; font-size: 14px; }
.pub-card--lead { display: grid; grid-template-columns: 1.25fr 1fr; margin-bottom: 28px; }
.pub-card--lead .pub-card__media { aspect-ratio: auto; min-height: 340px; }
.pub-card--lead .pub-card__body { align-content: center; padding: 36px 40px; }
.pub-card--lead h2 { font-size: clamp(24px, 2.6vw, 32px); }
.pub-pager { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; color: var(--fcsc-muted); }
.pub-pager a { color: var(--fcsc-blue-700); font-weight: 600; text-decoration: none; }
.pub-article { max-width: 760px; margin: 0 auto; display: grid; gap: 14px; }
.pub-back { color: var(--fcsc-blue-700); font-weight: 600; text-decoration: none; font-size: 14px; margin-bottom: 18px; }
.pub-article h1 { margin: 0; color: var(--fcsc-blue-900); font-size: clamp(32px, 4.4vw, 50px); line-height: 1.08; letter-spacing: -0.035em; }
.pub-article__lead { margin: 6px 0 0; color: var(--fcsc-muted); font-size: 20px; line-height: 1.55; }
.pub-note { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--fcsc-soft-blue); color: var(--fcsc-blue-800); font-size: 14px; }
.pub-article__figure { margin: 18px 0 8px; border-radius: 22px; overflow: hidden; }
.pub-article__figure img { width: 100%; display: block; }
.pub-article__body { font-size: 18px; line-height: 1.75; color: #1f3443; }
.pub-article__body p { margin: 0 0 1.1em; }
.pub-article__body ul, .pub-article__body ol { margin: 0 0 1.1em; padding-left: 1.3em; }
.pub-article__body a { color: var(--fcsc-blue-700); text-decoration: underline; text-underline-offset: 3px; }
.pub-article__foot { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--fcsc-line); color: var(--fcsc-muted); font-size: 15px; }
.pub-more { margin-top: 72px; }
.pub-more h2, .pub-section-title { margin: 0 0 22px; color: var(--fcsc-blue-900); font-size: 26px; letter-spacing: -0.02em; }
.pub-section-title:not(:first-child) { margin-top: 56px; }
.pub-events { display: grid; gap: 16px; }
.pub-event { display: grid; grid-template-columns: 88px 1fr; gap: 22px; align-items: start; padding: 24px; border-radius: 22px; background: #fff; box-shadow: var(--fcsc-v21-shadow, 0 18px 50px rgb(11 49 62 / 8%)); }
.pub-event.is-past { opacity: 0.72; box-shadow: none; border: 1px solid var(--fcsc-line); }
.pub-event__date { display: grid; place-items: center; padding: 14px 0; border-radius: 18px; background: var(--fcsc-cta-gradient); color: #fff; }
.pub-event.is-past .pub-event__date { background: var(--fcsc-soft-blue); color: var(--fcsc-blue-900); }
.pub-event__date strong { font-size: 32px; line-height: 1; font-weight: 600; }
.pub-event__date span { margin-top: 4px; font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; }
.pub-event__body h3 { margin: 0 0 8px; color: var(--fcsc-blue-900); font-size: 21px; letter-spacing: -0.02em; }
.pub-event__body p { margin: 0 0 6px; color: #33495a; line-height: 1.55; }
.pub-event__meta { color: var(--fcsc-muted) !important; font-size: 15px; }
.pub-event__meta:first-letter { text-transform: uppercase; }
.pub-link { display: inline-block; margin-top: 8px; color: var(--fcsc-blue-700); font-weight: 600; font-size: 14px; }
.pub-docs { display: grid; gap: 12px; }
.pub-doc { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; padding: 18px 22px; border-radius: 18px; background: #fff; box-shadow: 0 10px 30px rgb(11 49 62 / 6%); color: inherit; text-decoration: none; transition: transform 0.3s var(--fcsc-ease); }
.pub-doc:hover { transform: translateY(-2px); }
.pub-doc__badge { display: grid; place-items: center; width: 46px; height: 54px; border-radius: 10px; background: #fdecea; color: #b2321c; font-size: 12px; font-weight: 700; }
.pub-doc__body { display: grid; gap: 4px; }
.pub-doc__body strong { color: var(--fcsc-blue-900); font-size: 17px; }
.pub-doc__body span { color: var(--fcsc-muted); font-size: 14px; }
.pub-doc__cta { color: var(--fcsc-blue-700); font-weight: 600; font-size: 14px; white-space: nowrap; }
@media (max-width: 860px) {
  .pub-page { padding: calc(var(--fcsc-header-expanded) + 32px) 18px 72px; }
  .pub-card--lead { grid-template-columns: 1fr; }
  .pub-card--lead .pub-card__media { min-height: 0; aspect-ratio: 16 / 9; }
  .pub-card--lead .pub-card__body { padding: 22px 24px 26px; }
  .pub-event { grid-template-columns: 64px 1fr; gap: 16px; padding: 18px; }
  .pub-event__date strong { font-size: 24px; }
  .pub-doc { grid-template-columns: auto 1fr; }
  .pub-doc__cta { grid-column: 2; }
  .pub-article__body { font-size: 17px; }
}
@media (prefers-reduced-motion: reduce) { .pub-card, .pub-card__media img, .pub-doc { transition: none; } .pub-skeleton span { animation: none; } }
.cookie-card__actions.cookie-card__actions--info { grid-template-columns: 1fr 1fr; }
.cookie-card__link { display: grid; place-items: center; min-height: 48px; color: var(--fcsc-blue-900); font-weight: 600; font-size: 14px; text-decoration: none; border-right: 1px solid rgb(0 43 76 / 11%); }

/* ==========================================================================
   V7.3 — En-tête : barre de verre, capsule glissante, CTA « Soutenir »
   ========================================================================== */
:root { --fcsc-header-expanded: 74px; --v203-header-h: 74px; --hdr-ease: cubic-bezier(.2,.8,.2,1); }
.v2-header {
  position: fixed; inset: 0 0 auto; z-index: 60;
  display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 16px;
  height: 74px; padding: env(safe-area-inset-top) max(var(--v203-gutter, 24px), env(safe-area-inset-right)) 0 max(var(--v203-gutter, 24px), env(safe-area-inset-left));
  font-family: var(--fcsc-v205-font); color: var(--fcsc-blue-900);
  transition: transform .3s var(--hdr-ease);
}
.v2-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: rgb(255 255 255 / 86%); -webkit-backdrop-filter: saturate(1.6) blur(14px); backdrop-filter: saturate(1.6) blur(14px);
  box-shadow: 0 1px 0 rgb(0 43 76 / 8%); opacity: 1; transition: opacity .25s ease;
}
.v2-header[data-on-hero]::before { opacity: 0; }
.v2-header[data-hidden] { transform: translateY(-110%); }
.v2-brand { justify-self: start; display: flex; align-items: center; min-height: 44px; }
.v2-brand img { display: block; width: clamp(150px, 15vw, 210px); height: auto; transition: filter .25s ease, transform .25s var(--hdr-ease); transform-origin: left center; }
.v2-header[data-scrolled] .v2-brand img { transform: scale(.9); }
.v2-header[data-on-hero] .v2-brand img { filter: brightness(0) invert(1); }

.v2-nav { display: flex; align-items: center; gap: 10px; }
.nav-track {
  position: relative; display: flex; align-items: center; gap: 2px; padding: 4px; border-radius: 999px;
  background: rgb(0 43 76 / 5%); box-shadow: inset 0 0 0 1px rgb(0 43 76 / 7%);
  transition: background-color .25s ease, box-shadow .25s ease;
}
.nav-track > a {
  position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-height: 38px; padding: 0 16px; border-radius: 999px; white-space: nowrap;
  font-size: 14.5px; font-weight: 600; letter-spacing: -.005em; color: rgb(16 39 56 / 72%); text-decoration: none;
  transition: color .2s ease;
}
.nav-track > a.v2-home-link { padding: 0; width: 38px; }
.nav-track > a:hover, .nav-track > a[aria-current="page"] { color: var(--fcsc-blue-900); }
.nav-track > a:focus-visible { outline: 2px solid var(--fcsc-green-600); outline-offset: 2px; }
.nav-pill {
  position: absolute; top: 4px; bottom: 4px; left: 0; width: 0; z-index: 0; border-radius: 999px; pointer-events: none;
  background: #fff; box-shadow: 0 1px 2px rgb(0 43 76 / 10%), 0 4px 14px rgb(0 43 76 / 8%);
  opacity: 0; transition: transform .26s var(--hdr-ease), width .26s var(--hdr-ease), opacity .2s ease, background-color .25s ease;
}
.nav-pill[data-ready] { opacity: 1; }
.nav-pill[data-instant] { transition: none; }
.v2-header[data-on-hero] .nav-track { background: rgb(255 255 255 / 12%); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 22%); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.v2-header[data-on-hero] .nav-track > a { color: rgb(255 255 255 / 82%); }
.v2-header[data-on-hero] .nav-track > a:hover { color: #fff; }
.v2-header[data-on-hero] .nav-track > a[aria-current="page"] { color: var(--fcsc-blue-900); }

.v2-support-link {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 46px; padding: 0 20px; border-radius: 999px;
  background: var(--fcsc-cta-gradient); color: #fff; font-size: 14.5px; font-weight: 700; white-space: nowrap; text-decoration: none;
  box-shadow: 0 6px 18px rgb(0 110 80 / 22%); transition: transform .2s var(--hdr-ease), box-shadow .2s ease;
}
.v2-support-link:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgb(0 110 80 / 28%); }
.v2-support-link:active { transform: scale(.97); }
.v2-support-icon { flex: none; }
.v2-support-link[aria-current="page"] { box-shadow: 0 0 0 3px rgb(255 255 255 / 70%), 0 6px 18px rgb(0 110 80 / 22%); }

.v2-header-actions { justify-self: end; display: flex; align-items: center; gap: 6px; }
.v2-lang, .v2-menu-button {
  display: inline-grid; place-items: center; min-width: 44px; height: 44px; padding: 0 10px; border: 0; border-radius: 999px; background: transparent;
  color: inherit; font: 700 13px/1 var(--fcsc-v205-font); letter-spacing: .04em; text-decoration: none; cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.v2-lang:hover, .v2-menu-button:hover { background: rgb(0 43 76 / 6%); }
.v2-header[data-on-hero] .v2-lang, .v2-header[data-on-hero] .v2-menu-button { color: #fff; }
.v2-header[data-on-hero] .v2-lang:hover, .v2-header[data-on-hero] .v2-menu-button:hover { background: rgb(255 255 255 / 14%); }
.v2-menu-button { display: none; padding: 0; }

/* Panneau mobile : feuille qui monte du bas */
.v2-header::after {
  content: ""; position: fixed; inset: 0; z-index: -2; background: rgb(6 24 40 / 42%);
  opacity: 0; pointer-events: none; transition: opacity .25s ease;
}
html[data-navigation-open] .v2-header::after { opacity: 1; pointer-events: auto; }
.v2-mobile-menu {
  position: fixed; left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); z-index: 2;
  padding: 10px; border-radius: 26px; background: #fff; box-shadow: 0 20px 60px rgb(6 24 40 / 28%);
  transform: translateY(calc(100% + 24px)); visibility: hidden;
  transition: transform .3s var(--hdr-ease), visibility 0s linear .3s;
}
.v2-mobile-menu::before { content: ""; display: block; width: 38px; height: 4px; margin: 2px auto 8px; border-radius: 4px; background: rgb(0 43 76 / 14%); }
.v2-mobile-menu[data-open] { transform: none; visibility: visible; transition: transform .3s var(--hdr-ease), visibility 0s; }
.v2-mobile-menu nav { display: grid; gap: 2px; }
.v2-mobile-menu nav a {
  display: flex; align-items: center; min-height: 52px; padding: 0 18px; border-radius: 16px;
  color: var(--fcsc-ink); font: 600 16px/1.2 var(--fcsc-v205-font); text-decoration: none; transition: background-color .15s ease;
}
.v2-mobile-menu nav a:hover, .v2-mobile-menu nav a:focus-visible { background: rgb(0 43 76 / 5%); outline: none; }
.v2-mobile-menu nav a[aria-current="page"] { background: rgb(0 61 112 / 8%); color: var(--fcsc-blue-900); }
.v2-mobile-menu nav a.v2-support-link { justify-content: center; margin-top: 8px; min-height: 52px; color: #fff; background: var(--fcsc-cta-gradient); }

@media (max-width: 1180px) {
  .nav-track > a { padding: 0 12px; font-size: 14px; }
  .v2-support-link { padding: 0 16px; font-size: 14px; }
}
@media (max-width: 960px) {
  .v2-header { grid-template-columns: minmax(0,1fr) auto; }
  .v2-nav { display: none; }
  .v2-menu-button { display: inline-grid; }
}
@media (min-width: 961px) { .v2-mobile-menu, .v2-header::after { display: none; } }
@media (max-width: 420px) { .v2-brand img { width: 148px; } }

/* ==========================================================================
   V7.3 — Pied de page symétrique : réseaux | marque | liens
   ========================================================================== */
.v2-footer {
  display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 22px 32px;
  padding: 44px var(--v203-gutter, 24px) calc(22px + env(safe-area-inset-bottom));
  background: #fff; border-top: 1px solid rgb(0 43 76 / 8%); font-family: var(--fcsc-v205-font); color: var(--fcsc-ink);
}
.v2-footer-social { justify-self: start; display: flex; align-items: center; gap: 10px; }
.v2-social-button {
  display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  color: var(--fcsc-blue-900); background: rgb(0 61 112 / 6%); text-decoration: none;
  transition: background-color .2s ease, color .2s ease, transform .2s var(--hdr-ease);
}
a.v2-social-button:hover { background: var(--fcsc-blue-900); color: #fff; transform: translateY(-2px); }
.v2-social-button--pending { opacity: .55; cursor: default; }
.v2-social-button svg { width: 19px; height: 19px; }
.v2-footer-brand { display: grid; justify-items: center; gap: 8px; text-align: center; }
.v2-footer-brand img { display: block; width: 172px; height: auto; }
.v2-footer-brand p { margin: 0; max-width: 34ch; font-size: 13px; line-height: 1.5; color: var(--fcsc-muted); text-wrap: balance; }
.v2-footer-links { justify-self: end; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.v2-footer-links a {
  display: inline-flex; align-items: center; min-height: 40px; padding: 0 12px; border-radius: 999px; white-space: nowrap;
  color: var(--fcsc-ink); font-size: 14px; font-weight: 600; text-decoration: none; transition: background-color .2s ease, color .2s ease;
}
.v2-footer-links a:hover { background: rgb(0 61 112 / 6%); color: var(--fcsc-blue-900); }
.v2-footer-copy { grid-column: 1 / -1; padding-top: 18px; border-top: 1px solid rgb(0 43 76 / 7%); text-align: center; font-size: 12.5px; color: var(--fcsc-muted); }
@media (max-width: 860px) {
  .v2-footer { grid-template-columns: 1fr; justify-items: center; gap: 20px; padding-top: 36px; }
  .v2-footer-brand { order: -1; }
  .v2-footer-social, .v2-footer-links { justify-self: center; justify-content: center; }
}

/* ==========================================================================
   V7.3 — Pages fusionnées : onglets Actualités · Agenda · Transparence, sommaire légal
   ========================================================================== */
.pub-tabs {
  position: relative; display: inline-flex; gap: 2px; margin: 0 0 28px; padding: 4px; max-width: 100%; overflow-x: auto; scrollbar-width: none;
  border-radius: 999px; background: rgb(0 43 76 / 5%); box-shadow: inset 0 0 0 1px rgb(0 43 76 / 7%);
}
.pub-tabs::-webkit-scrollbar { display: none; }
.pub-tabs a {
  position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border-radius: 999px; white-space: nowrap;
  color: rgb(16 39 56 / 70%); font-weight: 600; font-size: 14.5px; text-decoration: none; transition: color .2s ease;
}
.pub-tabs a[aria-selected="true"] { color: var(--fcsc-blue-900); }
.pub-tabs__pill {
  position: absolute; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 999px; background: #fff; opacity: 0;
  box-shadow: 0 1px 2px rgb(0 43 76 / 10%), 0 4px 14px rgb(0 43 76 / 8%);
  transition: transform .26s var(--hdr-ease), width .26s var(--hdr-ease), opacity .2s ease;
}
.pub-tabs__pill[data-ready] { opacity: 1; }
[data-pub-root][data-switching] { opacity: 0; transform: translateY(6px); }
[data-pub-root] { transition: opacity .22s ease, transform .22s var(--hdr-ease); }
.legal-toc {
  position: sticky; top: 72px; z-index: 5; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; width: fit-content; max-width: 100%;
  margin: 8px 0 36px; padding: 4px; border-radius: 999px; background: rgb(255 255 255 / 88%);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: inset 0 0 0 1px rgb(0 43 76 / 8%), 0 6px 18px rgb(0 43 76 / 6%);
}
.legal-toc a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; border-radius: 999px; white-space: nowrap; color: var(--fcsc-blue-900); font-weight: 600; font-size: 14px; text-decoration: none; }
.legal-toc a:hover, .legal-toc a[aria-current="true"] { background: rgb(0 61 112 / 8%); }
.legal-hub__part { scroll-margin-top: 140px; padding-top: 12px; }
.legal-hub__part + .legal-hub__part { margin-top: 56px; padding-top: 40px; border-top: 1px solid rgb(0 43 76 / 9%); }
.legal-hub__title { margin: 0 0 6px; font-size: clamp(24px, 3vw, 32px); line-height: 1.2; color: var(--fcsc-blue-900); text-wrap: balance; }
#cookies { scroll-margin-top: 140px; }

/* ==========================================================================
   V7.3 — Bouton de don flottant : transform/opacity uniquement
   ========================================================================== */
.v2-header { view-transition-name: fcsc-header; }
.floating-donation {
  position: fixed; z-index: 55; right: max(16px, env(safe-area-inset-right)); bottom: max(24px, calc(env(safe-area-inset-bottom) + 16px));
  display: grid; place-items: center; align-content: center; gap: 6px; width: 96px; height: 96px; padding: 12px; border-radius: 50%;
  background: linear-gradient(145deg, #064b80 0%, #075f9f 58%, #0875a8 100%); color: #fff; text-align: center; text-decoration: none;
  box-shadow: 0 10px 22px rgb(0 35 67 / 22%), inset 0 1px 0 rgb(255 255 255 / 16%);
  transform-origin: 100% 100%; view-transition-name: fcsc-donation;
  transition: transform .28s var(--hdr-ease), opacity .22s ease, box-shadow .2s ease;
}
.floating-donation svg { width: 24px; height: 24px; transition: transform .28s var(--hdr-ease); }
.floating-donation span { max-width: 74px; font-size: 10px; font-weight: 700; line-height: 1.15; letter-spacing: .05em; text-transform: uppercase; transition: opacity .18s ease; }
.floating-donation:hover, .floating-donation:focus-visible { transform: translateY(-2px); box-shadow: 0 14px 28px rgb(0 35 67 / 28%), inset 0 1px 0 rgb(255 255 255 / 18%); }
.floating-donation:active { transform: scale(.96); }
.floating-donation[data-compact] { transform: scale(.66); }
.floating-donation[data-compact] span { opacity: 0; }
.floating-donation[data-compact] svg { transform: translateY(9px) scale(1.25); }
.floating-donation[data-footer-hidden], .floating-donation[data-clearance-hidden], html[data-navigation-open] .floating-donation {
  opacity: 0; pointer-events: none; transform: translateY(16px) scale(.6);
}
@media (max-width: 900px) {
  .floating-donation { width: 60px; height: 60px; padding: 0; gap: 0; }
  .floating-donation span { display: none; }
  .floating-donation svg, .floating-donation[data-compact] svg { width: 22px; height: 22px; transform: none; }
  .floating-donation[data-compact] { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .floating-donation, .floating-donation * { transition-duration: 1ms !important; } }

/* ==========================================================================
   V7.3 — Moteur d'animation : durées courtes (200–480 ms), transform/opacity seulement
   ========================================================================== */
:root { --m-fast: 200ms; --m-base: 280ms; --m-slow: 420ms; --m-ease: cubic-bezier(.2,.8,.2,1); }
.foundation-reveal, .act-reveal, .v2-reveal { transition: opacity var(--m-slow) ease, transform var(--m-slow) var(--m-ease); }
html[data-actions-motion-ready] .v2-reveal:not([data-visible="true"]) { transform: translateY(14px); }
.v2-news-card.v2-reveal, .v2-future-card.v2-reveal { clip-path: none; transition: opacity var(--m-slow) ease, transform var(--m-slow) var(--m-ease), box-shadow var(--m-base) ease; }
.v2-news-card.v2-reveal:not([data-visible="true"]), .v2-future-cardhtml[data-actions-motion-ready] .v2-reveal:not([data-visible="true"]) { transform: translateY(14px); }
.act-why-v4__programme, .act-after__steps article { transition: opacity var(--m-slow) ease, transform var(--m-slow) var(--m-ease), box-shadow var(--m-base) ease; }
.president-section__background { animation-duration: 600ms; }
.act-intro__image { animation-duration: 600ms; }
.portrait, .team-member__portrait-button { transition: transform var(--m-base) var(--m-ease), box-shadow var(--m-base) ease, background-color var(--m-base) ease; }
.portrait__inner { transition: transform var(--m-base) var(--m-ease); }
.profile-dialog { animation-duration: 300ms; }
.act-intro__content button::before { transition: opacity var(--m-fast) ease, transform var(--m-base) var(--m-ease); }
.v2-action-card, .v2-future-card, .v2-news-card, .team-member { transition: translate var(--m-base) var(--m-ease), box-shadow var(--m-base) ease; }
.v2-news-card img, .v2-future-card img, .v2-action-card img, .pub-card__media img { transition: scale 350ms var(--m-ease), transform 350ms var(--m-ease); }
/* Hero : fondu enchaîné (plus de balayage clip-path coûteux) */
.hero-slide { transition: visibility 0s linear 500ms, opacity 500ms ease; }
.hero-slide[data-active] { transition: visibility 0s, opacity 500ms ease; }
.hero-slide__media { clip-path: none !important; transition: none; will-change: auto; }
.hero-slide__veil::after { transition: opacity 500ms ease, transform 700ms var(--m-ease); }
.hero-slide__eyebrow, .hero-slide :is(h1, h2), .hero-slide__body, .hero-slide__actions { transform: translate3d(0, 12px, 0); transition: opacity 380ms ease, transform 420ms var(--m-ease); }
.hero-slide[data-active] :is(.hero-slide__eyebrow, h1, h2, .hero-slide__body, .hero-slide__actions) { transform: none; }
.hero-slide[data-active] .hero-slide__eyebrow { transition-delay: 80ms; }
.hero-slide[data-active] :is(h1, h2) { transition-delay: 140ms; }
.hero-slide[data-active] .hero-slide__body { transition-delay: 200ms; }
.hero-slide[data-active] .hero-slide__actions { transition-delay: 260ms; }
.library-search__field { transition: opacity 180ms ease; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}
html[data-motion-ready] .foundation-reveal[data-reveal-pending], html[data-act-motion-ready] .act-reveal[data-reveal-pending] { transform: translate3d(0, 14px, 0); }

/* ==========================================================================
   V7.3 — Librairie : cartes épurées, fenêtre unique livre → panier → paiement
   ========================================================================== */
.library-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3vw, 40px) clamp(16px, 2.4vw, 28px);
  transition: opacity .2s ease, transform .2s var(--m-ease);
}
.library-grid.is-morphing { opacity: 0; transform: translateY(8px); }
.lib-card { display: grid; grid-template-rows: auto 1fr; gap: 12px; min-width: 0; animation: lib-in .36s var(--m-ease) both; animation-delay: calc(var(--i, 0) * 40ms); }
@keyframes lib-in { from { opacity: 0; transform: translateY(10px); } }
.lib-card__cover {
  position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; padding: 0; border: 0; border-radius: 14px; overflow: hidden; cursor: pointer;
  background: #eef3f6; box-shadow: 0 1px 2px rgb(0 43 76 / 8%), 0 10px 26px rgb(0 43 76 / 10%);
  transition: transform .25s var(--m-ease), box-shadow .25s ease;
}
.lib-card__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lib-card__cover:hover { transform: translateY(-3px); box-shadow: 0 2px 4px rgb(0 43 76 / 8%), 0 16px 34px rgb(0 43 76 / 16%); }
.lib-card__cover:focus-visible { outline: 3px solid var(--fcsc-green-600); outline-offset: 3px; }
.lib-card__flag { position: absolute; left: 10px; top: 10px; padding: 4px 10px; border-radius: 999px; background: rgb(16 39 56 / 78%); color: #fff; font-size: 12px; font-weight: 600; white-space: nowrap; }
.lib-card.is-unavailable .lib-card__cover { cursor: default; }
.lib-card.is-unavailable .lib-card__cover img { filter: grayscale(.6); opacity: .7; }
.lib-card__meta { display: grid; grid-template-rows: 1fr auto; gap: 8px; min-width: 0; }
.lib-card__meta h3 { margin: 0; font-size: 15.5px; line-height: 1.3; font-weight: 700; text-wrap: balance; }
.lib-card__meta h3 button { all: unset; cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--fcsc-ink); }
.lib-card__meta h3 button:hover { color: var(--fcsc-blue-900); }
.lib-card__meta h3 button:focus-visible { outline: 2px solid var(--fcsc-green-600); outline-offset: 2px; border-radius: 4px; }
.lib-card__row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.lib-card__price { font-size: 15px; font-weight: 700; color: var(--fcsc-blue-900); white-space: nowrap; }
.lib-card__cart {
  flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; cursor: pointer;
  background: rgb(0 61 112 / 7%); color: var(--fcsc-blue-900); transition: background-color .2s ease, color .2s ease, transform .2s var(--m-ease);
}
.lib-card__cart:hover { background: var(--fcsc-blue-900); color: #fff; }
.lib-card__cart:active { transform: scale(.92); }
.lib-card__cart.is-in { background: var(--fcsc-green-600); color: #fff; }

/* Fenêtre */
.lib-dialog {
  position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
  background: rgb(6 24 40 / 46%); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); font-family: var(--fcsc-v205-font);
}
.lib-dialog__panel {
  position: relative; overflow: hidden; width: min(var(--lib-w, 460px), 100%); max-height: calc(100dvh - 32px);
  border-radius: 24px; background: #fff; box-shadow: 0 30px 80px rgb(6 24 40 / 30%); color: var(--fcsc-ink);
}
.lib-dialog__panel[data-view="book"] { --lib-w: 600px; }
.lib-dialog__panel[data-view="cart"] { --lib-w: 460px; }
.lib-dialog__panel[data-view="checkout"], .lib-dialog__panel[data-view="free"] { --lib-w: 520px; }
.lib-view { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; padding: 22px; }
.lib-view.is-leaving { position: absolute; top: 0; left: 0; pointer-events: none; }
.lib-head { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: 8px; margin: -6px -6px 14px; }
.lib-head h2 { margin: 0; text-align: center; font-size: 17px; font-weight: 700; line-height: 1.3; text-wrap: balance; color: var(--fcsc-blue-900); }
.lib-icon-btn {
  display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
  background: transparent; color: var(--fcsc-ink); transition: background-color .18s ease;
}
.lib-icon-btn:hover { background: rgb(0 43 76 / 7%); }
.lib-icon-btn:focus-visible { outline: 2px solid var(--fcsc-green-600); outline-offset: 1px; }
.lib-icon-btn--float { position: absolute; top: 10px; right: 10px; z-index: 2; background: rgb(255 255 255 / 86%); }
.lib-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 50px; padding: 0 22px; border: 0; border-radius: 999px;
  font: 700 15px/1 var(--fcsc-v205-font); white-space: nowrap; cursor: pointer; transition: transform .18s var(--m-ease), box-shadow .2s ease, opacity .2s ease;
}
.lib-btn--primary { background: var(--fcsc-cta-gradient); color: #fff; box-shadow: 0 8px 20px rgb(0 110 80 / 22%); }
.lib-btn--primary:hover:not([disabled]) { transform: translateY(-1px); }
.lib-btn--primary:active:not([disabled]) { transform: scale(.98); }
.lib-btn[disabled] { opacity: .45; cursor: not-allowed; box-shadow: none; }

/* Vue livre */
.lib-view--book { display: grid; grid-template-columns: 200px 1fr; gap: 24px; align-items: center; padding: 24px; }
.lib-book__cover img { display: block; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 12px; box-shadow: 0 12px 30px rgb(0 43 76 / 18%); }
.lib-book__info { display: grid; gap: 12px; align-content: center; min-width: 0; padding-right: 8px; }
.lib-book__info h2 { margin: 0; padding-right: 36px; font-size: clamp(20px, 2.4vw, 24px); line-height: 1.2; color: var(--fcsc-blue-900); text-wrap: balance; }
.lib-book__info p { margin: 0; color: var(--fcsc-muted); font-size: 15px; line-height: 1.5; text-wrap: pretty; }
.lib-book__price { font-size: 22px; font-weight: 800; color: var(--fcsc-ink); }
.lib-book__info .lib-btn { margin-top: 4px; }
.lib-note { margin: 0; color: var(--fcsc-muted); font-size: 14px; text-align: center; }

/* Vue panier */
.lib-lines { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.lib-line { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto 44px; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgb(0 43 76 / 7%); }
.lib-line img { width: 44px; height: 58px; object-fit: cover; border-radius: 6px; box-shadow: 0 2px 8px rgb(0 43 76 / 14%); }
.lib-line__title { font-size: 14.5px; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.lib-line strong { font-size: 14.5px; white-space: nowrap; }
.lib-line .lib-icon-btn { color: var(--fcsc-muted); }
.lib-line .lib-icon-btn:hover { color: #b42318; background: rgb(180 35 24 / 8%); }
.lib-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 16px 2px 18px; font-size: 15px; }
.lib-total strong { font-size: 22px; font-weight: 800; white-space: nowrap; }
.lib-total--top { margin: 0 2px 16px; padding: 14px 16px; border-radius: 16px; background: rgb(0 61 112 / 5%); }
.lib-empty { display: grid; justify-items: center; gap: 10px; padding: 18px 0 10px; color: var(--fcsc-muted); }
.lib-empty p { margin: 0; }

/* Vue paiement */
.lib-pay { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 16px; }
.lib-pay button {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 64px; padding: 8px; border: 1.5px solid rgb(0 43 76 / 12%); border-radius: 16px;
  background: #fff; color: var(--fcsc-ink); font: 600 13px/1.1 var(--fcsc-v205-font); white-space: nowrap; cursor: pointer; transition: border-color .18s ease, background-color .18s ease;
}
.lib-pay button img { width: 20px; height: 20px; border-radius: 5px; background: #f28c00; padding: 2px; }
.lib-pay button[data-provider="mtn_momo"] img { background: #ffcb05; }
.lib-pay button[aria-checked="true"] { border-color: var(--fcsc-green-600); background: rgb(0 143 80 / 6%); color: var(--fcsc-blue-900); }
.lib-pay button[disabled] { opacity: .4; cursor: not-allowed; }
.lib-form { display: grid; gap: 12px; }
.lib-form label:not(.lib-check):not(.library-checkout__trap) { display: grid; gap: 6px; }
.lib-form label > span { font-size: 13px; font-weight: 600; color: var(--fcsc-muted); }
.lib-form input:not([type="checkbox"]) {
  width: 100%; min-height: 48px; padding: 0 14px; border: 1.5px solid rgb(0 43 76 / 14%); border-radius: 14px; background: #fff;
  font: 500 16px/1.2 var(--fcsc-v205-font); color: var(--fcsc-ink); transition: border-color .18s ease, box-shadow .18s ease;
}
.lib-form input:focus { outline: none; border-color: var(--fcsc-blue-700, #075f9f); box-shadow: 0 0 0 4px rgb(7 95 159 / 12%); }
.lib-form__pair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lib-check { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; font-size: 13px; line-height: 1.45; color: var(--fcsc-muted); }
.lib-check input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--fcsc-green-600); }
.lib-check a { color: var(--fcsc-blue-900); font-weight: 600; }
.library-checkout__trap { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.lib-secure { display: flex; align-items: center; justify-content: center; gap: 6px; color: var(--fcsc-muted); font-size: 12px; text-align: center; }
.lib-error { margin: 0; color: #b42318; font-size: 13.5px; text-align: center; }

@media (min-width: 1180px) { .library-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .lib-dialog { place-items: end stretch; padding: 0; }
  .lib-dialog__panel { width: 100%; border-radius: 24px 24px 0 0; max-height: calc(100dvh - 24px); }
  .lib-view { max-height: calc(100dvh - 24px); padding: 20px 18px max(20px, env(safe-area-inset-bottom)); }
  .lib-view--book { grid-template-columns: 112px 1fr; gap: 12px 16px; align-items: start; }
  .lib-book__info { display: contents; }
  .lib-book__cover { grid-column: 1; grid-row: 1 / 3; }
  .lib-book__info h2 { grid-column: 2; grid-row: 1; align-self: end; padding-right: 40px; font-size: 19px; }
  .lib-book__price { grid-column: 2; grid-row: 2; align-self: start; }
  .lib-book__info p { grid-column: 1 / -1; grid-row: 3; }
  .lib-book__info > .lib-btn, .lib-book__info > .lib-note { grid-column: 1 / -1; grid-row: 4; margin-top: 4px; }
  .lib-form__pair { grid-template-columns: 1fr; }
  .library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
[data-morph-in] { animation: none !important; }

/* ==========================================================================
   V7.3 — Parcours de don : une fenêtre compacte qui grandit (choix → formulaire)
   ========================================================================== */
.donation-method-modal, .act-donation-modal {
  position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
  background: rgb(6 24 40 / 46%); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); font-family: var(--fcsc-v205-font);
  animation: dlg-fade .2s ease both;
}
.donation-method-dialog, .act-donation-dialog {
  position: relative; width: min(500px, 100%); max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain;
  padding: 22px; border-radius: 24px; background: #fff; color: var(--fcsc-ink); box-shadow: 0 30px 80px rgb(6 24 40 / 30%);
  animation: dlg-in .3s var(--m-ease) both; outline: none;
}
.act-donation-dialog { width: min(540px, 100%); }
[data-closing="true"].donation-method-modal, [data-closing="true"].act-donation-modal { animation: dlg-fade .24s ease reverse both; }
[data-closing="true"].donation-method-dialog, [data-closing="true"].act-donation-dialog { animation: dlg-out .24s ease-in both; }
@keyframes dlg-fade { from { opacity: 0; } }
@keyframes dlg-in { from { opacity: 0; transform: translateY(18px) scale(.97); } }
@keyframes dlg-out { to { opacity: 0; transform: translateY(14px) scale(.97); } }
.dlg-icon-btn, .donation-method-dialog__close {
  display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
  background: transparent; color: var(--fcsc-ink); transition: background-color .18s ease;
}
.dlg-icon-btn:hover, .donation-method-dialog__close:hover { background: rgb(0 43 76 / 7%); }
.dlg-icon-btn svg, .donation-method-dialog__close svg { width: 18px; height: 18px; }
.donation-method-dialog__close { position: absolute; top: 12px; right: 12px; }

/* Choix du moyen */
.donation-method-dialog__header { display: grid; gap: 6px; padding: 6px 48px 16px 4px; }
.donation-method-dialog__header span { color: var(--fcsc-green-700, #007a45); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.donation-method-dialog__header h2 { margin: 0; color: var(--fcsc-blue-900); font-size: 22px; line-height: 1.2; text-wrap: balance; }
.donation-method-dialog__header p { margin: 0; color: var(--fcsc-muted); font-size: 14.5px; line-height: 1.5; text-wrap: pretty; }
.donation-method-dialog__options { display: grid; gap: 8px; }
.donation-method-option {
  display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; width: 100%; min-height: 72px; padding: 12px 14px;
  border: 1.5px solid rgb(0 43 76 / 10%); border-radius: 18px; background: #fff; color: var(--fcsc-ink); text-align: left; font: inherit; cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, transform .18s var(--m-ease);
}
.donation-method-option:hover:not([disabled]) { border-color: var(--fcsc-green-600); background: rgb(0 143 80 / 4%); }
.donation-method-option:active:not([disabled]) { transform: scale(.99); }
.donation-method-option[disabled] { cursor: not-allowed; opacity: .55; }
.donation-method-option__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: linear-gradient(145deg, #064b80, #0875a8); color: #fff; }
.donation-method-option[data-provider] .donation-method-option__icon { background: linear-gradient(145deg, #0e7a5e, #1e8fb0); }
.donation-method-option__icon img { width: 24px; height: 24px; object-fit: contain; }
.donation-method-option__icon svg { width: 20px; height: 20px; }
.donation-method-option__copy { display: grid; gap: 2px; min-width: 0; }
.donation-method-option__copy small { color: var(--fcsc-muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.donation-method-option__copy strong { font-size: 15.5px; line-height: 1.25; }
.donation-method-option__copy > span { color: var(--fcsc-muted); font-size: 13px; line-height: 1.4; }
.donation-method-option__pill {
  display: inline-flex; align-items: center; gap: 4px; min-height: 32px; padding: 0 12px; border-radius: 999px; white-space: nowrap;
  background: rgb(0 143 80 / 9%); color: var(--fcsc-green-700, #007a45); font-size: 13px; font-weight: 700;
}
.donation-method-option[disabled] .donation-method-option__pill { background: rgb(0 43 76 / 6%); color: var(--fcsc-muted); }
.donation-method-option__pill svg { width: 14px; height: 14px; }
.donation-method-option[disabled] .donation-method-option__pill svg { display: none; }

/* Formulaire */
.act-donation__head { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 8px; margin: -8px -8px 14px; }
.act-donation__title { display: grid; justify-items: center; gap: 2px; text-align: center; min-width: 0; }
.act-donation__title h2 { margin: 0; color: var(--fcsc-blue-900); font-size: 17px; line-height: 1.25; text-wrap: balance; }
.act-donation__title small { color: var(--fcsc-muted); font-size: 12.5px; white-space: nowrap; }
.act-donation-dialog .act-form { display: grid; gap: 14px; padding: 0; border-radius: 0; box-shadow: none; background: none; }
.act-donation-dialog .act-form legend, .act-donation-dialog .act-form label > span { margin-bottom: 6px; font-size: 13px; color: var(--fcsc-muted); }
.act-donation-dialog .act-form input { min-height: 48px; padding: 0 14px; border-radius: 14px; font-size: 16px; }
.act-amounts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.act-amounts button {
  min-height: 48px; padding: 0 6px; border: 1.5px solid rgb(0 43 76 / 12%); border-radius: 14px; background: #fff; cursor: pointer; white-space: nowrap;
  color: var(--fcsc-blue-900); font: 700 14.5px/1 var(--fcsc-v205-font); transition: border-color .18s ease, background-color .18s ease, color .18s ease;
}
.act-amounts button:hover { border-color: var(--fcsc-green-600); }
.act-amounts button[data-active="true"] { border-color: var(--fcsc-green-600); background: var(--fcsc-green-600); color: #fff; }
.act-form__amount { position: relative; display: block; }
.act-form__amount i { position: absolute; right: 14px; bottom: 15px; color: var(--fcsc-muted); font-size: 13px; font-style: normal; font-weight: 600; }
.act-form__amount input { padding-right: 56px !important; }
.act-form__tier { margin: 10px 0 0; padding: 10px 14px; border-radius: 12px; background: rgb(0 143 80 / 7%); color: var(--fcsc-green-700, #007a45); font-size: 13.5px; line-height: 1.45; }
.act-form__identity { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.act-form__identity [data-full="true"] { grid-column: 1 / -1; }
.act-form__submit {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; padding: 0 22px; border: 0; border-radius: 999px;
  background: var(--fcsc-cta-gradient); color: #fff; font: 700 15px/1 var(--fcsc-v205-font); white-space: nowrap; cursor: pointer;
  box-shadow: 0 8px 20px rgb(0 110 80 / 22%); transition: transform .18s var(--m-ease), opacity .2s ease;
}
.act-form__submit:hover:not(:disabled) { transform: translateY(-1px); }
.act-form__submit:disabled { opacity: .55; cursor: wait; }
.act-form__submit svg { width: 18px; height: 18px; }
.act-form__submit .act-mobile-money-mark { width: 20px; height: 20px; }
.act-form__security { display: flex; align-items: center; justify-content: center; gap: 6px; margin: -4px 0 0; color: var(--fcsc-muted); font-size: 12px; text-align: center; }
.act-form__security svg { flex: none; width: 14px; height: 14px; }
.act-donation-dialog .act-form__status:empty { display: none; }
@media (max-width: 640px) {
  .donation-method-modal, .act-donation-modal { place-items: end stretch; padding: 0; }
  .donation-method-dialog, .act-donation-dialog { width: 100%; max-height: calc(100dvh - 24px); border-radius: 24px 24px 0 0; padding: 20px 18px max(20px, env(safe-area-inset-bottom)); }
  .act-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .act-form__identity { grid-template-columns: 1fr; }
  .donation-method-option__copy > span { display: none; }
}
/* Règle d'or côté site : un bouton tient sur une ligne ; sinon ses deux lignes sont équilibrées. */
button, .hero-button, [class*="__cta"] { text-wrap: balance; }

/* Sans JavaScript (ou module en échec) : le contenu d'« Actions & Impact » reste visible. */
html:not([data-actions-motion-ready]) .v2-reveal { opacity: 1; transform: none; clip-path: none; }

/* ==========================================================================
   V7.3 — Audit : symétrie, centrage et disposition
   ========================================================================== */
/* « À la une » : une rangée de 5 sur ordinateur ; sur tablette et téléphone, un défilement
   horizontal (fini la carte orpheline et la colonne interminable). */
@media (max-width: 1100px) {
  .v2-news-grid {
    display: grid; grid-auto-flow: column; grid-template-columns: none; grid-auto-columns: minmax(240px, 42%);
    gap: 14px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--v203-gutter, 20px);
    margin-inline: calc(-1 * var(--v203-gutter, 20px)); padding: 4px var(--v203-gutter, 20px) 12px; scrollbar-width: none;
  }
  .v2-news-grid::-webkit-scrollbar { display: none; }
  .v2-news-grid > * { scroll-snap-align: start; }
}
@media (max-width: 640px) { .v2-news-grid { grid-auto-columns: 78%; } }
.fcsc-impact__next a { white-space: nowrap; }

/* Soutenir : sur tablette, les moyens de paiement passent sous le titre (comme sur téléphone). */
@media (min-width: 761px) and (max-width: 1024px) {
  .act-page .act-why-v4__payment-panel { grid-template-columns: 1fr; gap: 28px; }
  .act-page .act-payment-choice, .act-page .act-payment-choice:hover, .act-page .act-payment-choice[data-active] {
    grid-template-columns: 120px minmax(0, 1fr) 28px; gap: 14px 24px; min-height: 0; padding: 22px 0;
  }
}

/* Boutons de formulaires centrés (contact, renvoi des liens, retour de commande). */
.contact-form > button { display: flex; width: fit-content; justify-self: center; justify-content: center; margin-inline: auto; }
.contact-form__secure, .contact-form__status { justify-content: center; text-align: center; }
.library-return__resend {
  display: block; width: auto; min-height: 0; margin: 18px auto 0; padding: 0; border: 0; border-radius: 0; background: none;
  color: var(--fcsc-muted); font-size: 14px; line-height: 1.6; text-align: center; text-wrap: balance;
}
.library-return__resend a { display: inline; min-height: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--fcsc-blue-900); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }

/* Héros sur téléphone : boutons empilés de même largeur, centrés. */
@media (max-width: 560px) {
  .hero-slide__actions { flex-direction: column; align-items: stretch; width: 100%; max-width: 360px; }
  .hero-slide__actions .hero-button { justify-content: center; width: 100%; }
}

/* Sommaire légal : une seule ligne sur téléphone (défilement si nécessaire). */
@media (max-width: 560px) {
  .legal-toc { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; margin-inline: 0; }
  .legal-toc::-webkit-scrollbar { display: none; }
  .legal-toc a { padding: 0 10px; font-size: 12.5px; }
}

/* Fenêtre « actualités » et bouton de don : alignés sur la marge du site, jamais superposés. */
.fcsc-news-card { left: max(16px, var(--v203-gutter, 16px)); }
@media (max-width: 900px) {
  body:has(.fcsc-news-card) .floating-donation { opacity: 0; pointer-events: none; transform: translateY(16px) scale(.6); }
  /* Sur téléphone, le bouton s'efface pendant la lecture (défilement vers le bas) et revient en remontant. */
  .floating-donation[data-compact] { opacity: 0; pointer-events: none; transform: translateY(16px) scale(.6); }
}
.lib-dialog.is-closing { pointer-events: none; }
@media (max-width: 400px) { .fcsc-mission__whitepaper button { font-size: 13px; padding-inline: 18px; white-space: nowrap; } }
.lib-book__lang { margin: 0; color: var(--fcsc-green-700, #007a45); font-size: 13px; font-weight: 600; }
@media (max-width: 640px) { .lib-book__lang { grid-column: 1 / -1; grid-row: 5; } }