#a-propos,
#overlayRoot #a-propos {
  display: block;
  position: relative;
  background: #0A0A0D;          
  color: #1D1F24;
  font-family: Literata, Georgia, 'Times New Roman', serif;
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
#a-propos *, #a-propos *::before, #a-propos *::after { box-sizing: border-box; }

#a-propos {
  --h1: 32px;
  --h2: 18px;
  --corps: 18px;
  --marge: 15px;
  --sign: 24px;
  --pad-h: 24px;
  --pad-top: 96px;
  --pad-bot: 96px;
  --esp: 48px;                  
  --nav-h: 76px;
}
@media (min-width: 1140px) {
  #a-propos {
    --h1: 48px;
    --h2: 20px;
    --corps: 20px;
    --marge: 16px;
    --sign: 28px;
    --pad-top: 120px;
    --pad-bot: 120px;
    --esp: 64px;
  }
}

#a-propos .ap-feuille,
#overlayRoot #a-propos .ap-feuille {
  position: relative;
  min-height: 100vh;
  background: #EDEBE6;
  padding: var(--pad-top) var(--pad-h) var(--pad-bot);
  animation: ap-feuille 500ms ease-out both;
  overflow-x: clip;
}

#a-propos .ap-feuille::after,
#overlayRoot #a-propos .ap-feuille::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: .055;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)'/%3E%3C/svg%3E");
}
@keyframes ap-feuille { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  #a-propos .ap-feuille, #overlayRoot #a-propos .ap-feuille { animation: none; }
}

#a-propos .ap-main,
#overlayRoot #a-propos .ap-main { max-width: 1040px; margin: 0 auto; }
@media (min-width: 1140px) {
  #a-propos .ap-main, #overlayRoot #a-propos .ap-main { max-width: 1080px; }
}

#a-propos .ap-main > * + *,
#overlayRoot #a-propos .ap-main > * + * { margin-top: var(--esp); }

#a-propos .ap-partie,
#overlayRoot #a-propos .ap-partie {
  display: flex;
  flex-direction: column;
  gap: 12px;
  scroll-margin-top: calc(var(--nav-h) + 24px);
}
@media (min-width: 1140px) {
  #a-propos .ap-partie,
  #overlayRoot #a-propos .ap-partie {
    display: grid;
    grid-template-columns: 240px minmax(0, 620px) 220px;
    gap: 0;
    align-items: start;
  }
  #a-propos .ap-marge,  #overlayRoot #a-propos .ap-marge  { grid-column: 1; grid-row: 1; padding-right: 40px; }
  #a-propos .ap-corps,  #overlayRoot #a-propos .ap-corps  { grid-column: 2; grid-row: 1; }
  #a-propos .ap-droite, #overlayRoot #a-propos .ap-droite { grid-column: 3; }
}

#a-propos .ap-date,
#overlayRoot #a-propos .ap-date {
  margin: 0;
  font-size: var(--marge);
  font-style: italic;
  line-height: 1.5;
  color: #595C62;
}
@media (min-width: 1140px) {
  #a-propos .ap-date, #overlayRoot #a-propos .ap-date { padding-top: 14px; }
}

#a-propos .ap-h1,
#overlayRoot #a-propos .ap-h1 {
  margin: 0;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: var(--h1);
  line-height: 1.1;
  color: #1D1F24;
}

@media (min-width: 1140px) {
  #a-propos .ap-ouverture,  #overlayRoot #a-propos .ap-ouverture  { grid-column: 2; grid-row: 2; }
  #a-propos .ap-portrait-zone, #overlayRoot #a-propos .ap-portrait-zone {
    grid-column: 2; grid-row: 3; margin-top: 28px; margin-bottom: 24px;
  }
}

#a-propos .ap-portrait-zone,
#overlayRoot #a-propos .ap-portrait-zone { margin-top: 24px; }

#a-propos #portrait,
#overlayRoot #a-propos #portrait {
  width: 100%;
  max-width: 100%;
  background: #1D1F24;
  padding: 20px;
  font-size: var(--marge);
  font-style: normal;
  line-height: 1.5;
  color: #EDEBE6;              
}

#a-propos .ap-bref-t,
#overlayRoot #a-propos .ap-bref-t {
  margin: 0 0 14px;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .18em;
  line-height: 1;
  color: #31c7d2;              
}
#a-propos .ap-bref,
#overlayRoot #a-propos .ap-bref { margin: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px 20px; }
@media (max-width: 1139px) {
  #a-propos .ap-bref, #overlayRoot #a-propos .ap-bref { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 479px) {
  #a-propos .ap-bref, #overlayRoot #a-propos .ap-bref { grid-template-columns: 1fr; }
}
#a-propos .ap-bref div,
#overlayRoot #a-propos .ap-bref div { display: flex; flex-direction: column; gap: 2px; }
#a-propos .ap-bref dt,
#overlayRoot #a-propos .ap-bref dt {
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 500;
  font-size: 0.75rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #D8D5CE;              
}
#a-propos .ap-bref dd,
#overlayRoot #a-propos .ap-bref dd { margin: 0; font-size: 15px; line-height: 1.45; }

#a-propos .ap-filet,
#overlayRoot #a-propos .ap-filet {
  border: 0;
  border-top: 1px solid #D8D5CE;
  margin-bottom: 0;
}

#a-propos .ap-h2,
#overlayRoot #a-propos .ap-h2 {
  margin: 0;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: var(--h2);
  line-height: 1.3;
  color: #1D1F24;
}
@media (min-width: 1140px) {
  #a-propos .ap-h2, #overlayRoot #a-propos .ap-h2 { padding-top: 5px; }
}

#a-propos .ap-p,
#overlayRoot #a-propos .ap-p {
  margin: 0;
  font-size: var(--corps);
  line-height: 1.65;
  max-width: 62ch;
}

#a-propos .ap-p.ap-ouverture,
#overlayRoot #a-propos .ap-p.ap-ouverture { margin-top: 24px; }
@media (min-width: 1140px) {
  #a-propos .ap-p.ap-ouverture,
  #overlayRoot #a-propos .ap-p.ap-ouverture { margin-top: 32px; }
}

#a-propos .ap-bloc,
#overlayRoot #a-propos .ap-bloc {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 62ch;
}

#a-propos .ap-cle,
#overlayRoot #a-propos .ap-cle { font-weight: 500; }

#a-propos .ap-reperes,
#overlayRoot #a-propos .ap-reperes {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: var(--marge);
  font-style: italic;
  line-height: 1.5;
  color: #595C62;
}
@media (min-width: 1140px) {
  #a-propos .ap-reperes, #overlayRoot #a-propos .ap-reperes {
    grid-column: 1; grid-row: 2; margin-top: 20px; padding-right: 40px;
  }
  #a-propos .ap-travail .ap-corps,
  #overlayRoot #a-propos .ap-travail .ap-corps { grid-row: 1 / span 2; }
}

#a-propos .ap-signature,
#overlayRoot #a-propos .ap-signature {
  margin: 40px 0 0;
  font-size: var(--sign);
  font-style: italic;
  line-height: 1.3;
  color: #1D1F24;
  text-decoration: underline;
  text-decoration-color: #ff9a3c;   
  text-decoration-thickness: 3px;
  text-underline-offset: 6px;
}

#a-propos .ap-studio,
#overlayRoot #a-propos .ap-studio {
  margin: 14px 0 0;
  font-size: var(--marge);
  font-style: italic;
  line-height: 1.5;
  color: #595C62;
}

#a-propos .ap-sortie,
#overlayRoot #a-propos .ap-sortie {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 28px;
  margin-top: 48px;
}

#a-propos .ap-btn,
#overlayRoot #a-propos .ap-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 28px;
  background: #1D1F24;
  color: #ff9a3c;                   
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: .04em;
  line-height: 1;
  text-decoration: none;
}
#a-propos .ap-btn::after,
#overlayRoot #a-propos .ap-btn::after {
  content: '';
  position: absolute;
  inset: 4px;
  border: 1px solid #ff9a3c;
  transition: inset .18s ease;
}
#a-propos .ap-btn:hover::after,
#overlayRoot #a-propos .ap-btn:hover::after { inset: 2px; }
@media (prefers-reduced-motion: reduce) {
  #a-propos .ap-btn::after, #overlayRoot #a-propos .ap-btn::after { transition: none; }
}

#a-propos .ap-lien,
#overlayRoot #a-propos .ap-lien {
  color: #1D1F24;
  font-size: var(--corps);
  line-height: 1.65;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  text-decoration: underline;
  text-decoration-color: rgba(49, 199, 210, .6);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
#a-propos .ap-lien:hover,
#overlayRoot #a-propos .ap-lien:hover { text-decoration-color: #31c7d2; }

#a-propos .ap-lien:focus-visible,
#overlayRoot #a-propos .ap-lien:focus-visible {
  outline: none;
  text-decoration-color: #31c7d2;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}
#a-propos .ap-btn:focus-visible,
#overlayRoot #a-propos .ap-btn:focus-visible {
  outline: 2px solid #31c7d2;
  outline-offset: 2px;
}

#overlayRoot.ov-page:has(#a-propos) #overlayScrim { background: #0A0A0D; }
#overlayRoot.ov-page:has(#a-propos) #overlayPanel { background: transparent; }

body:has(.page-main #a-propos) #scrollTopBtn,
#overlayRoot.ov-page:has(#a-propos) ~ #scrollTopBtn {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 45;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
  background: #1D1F24;
  border: 1px solid #D8D5CE;
  border-radius: 0;
  color: #EDEBE6;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body:has(.page-main #a-propos) #scrollTopBtn.is-visible,
#overlayRoot.ov-page:has(#a-propos) ~ #scrollTopBtn.is-visible {
  opacity: 1; visibility: visible; transform: translateY(0);
  transition: opacity .25s ease, transform .25s ease;
}
body:has(.page-main #a-propos) #scrollTopBtn:hover,
body:has(.page-main #a-propos) #scrollTopBtn:focus-visible,
#overlayRoot.ov-page:has(#a-propos) ~ #scrollTopBtn:hover,
#overlayRoot.ov-page:has(#a-propos) ~ #scrollTopBtn:focus-visible {
  border-color: #31c7d2;
  box-shadow: none;
}
@media (max-width: 640px) {
  body:has(.page-main #a-propos) #scrollTopBtn,
  #overlayRoot.ov-page:has(#a-propos) ~ #scrollTopBtn { right: 14px; bottom: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  body:has(.page-main #a-propos) #scrollTopBtn,
  #overlayRoot.ov-page:has(#a-propos) ~ #scrollTopBtn { transition: opacity .01s linear, visibility 0s; }
}

body > #a-propos { min-height: 100vh; }
@media (max-width: 720px) { #a-propos { --close-w: 44px; } }


#a-propos .ap-topbar,
#overlayRoot #a-propos .ap-topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 20;
  height: var(--nav-h);
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 calc(var(--close-w, 250px) + 32px) 0 16px;
  background: #EDEBE6;
  border-bottom: 1px solid #D8D5CE;
}

#a-propos .ap-idx,
#overlayRoot #a-propos .ap-idx {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
#a-propos .ap-idx::-webkit-scrollbar { display: none; }

#a-propos .ap-idx a,
#overlayRoot #a-propos .ap-idx a {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 8px;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .06em;
  color: #595C62;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color .2s ease, border-color .2s ease;
}
#a-propos .ap-idx a:hover,
#overlayRoot #a-propos .ap-idx a:hover { color: #1D1F24; }

#a-propos .ap-idx a.is-current,
#overlayRoot #a-propos .ap-idx a.is-current { color: #1D1F24; border-bottom-color: #31c7d2; }

#a-propos .ap-idx a:focus-visible,
#overlayRoot #a-propos .ap-idx a:focus-visible { outline: 2px solid #31c7d2; outline-offset: -2px; }

#a-propos .ap-idx-l, #overlayRoot #a-propos .ap-idx-l { display: none; }
@media (min-width: 1140px) {
  #a-propos .ap-idx, #overlayRoot #a-propos .ap-idx { gap: 10px; justify-content: center; }
  #a-propos .ap-idx-l, #overlayRoot #a-propos .ap-idx-l { display: inline; }
}

#a-propos .ap-prog,
#overlayRoot #a-propos .ap-prog {
  position: absolute;
  left: 0; bottom: -1px;
  height: 2px;
  width: 0;
  background: #31c7d2;
  transition: width .15s linear;
}
@media (prefers-reduced-motion: reduce) {
  #a-propos .ap-prog, #overlayRoot #a-propos .ap-prog { transition: none; }
  #a-propos .ap-idx a, #overlayRoot #a-propos .ap-idx a { transition: none; }
}

#a-propos .ap-num,
#overlayRoot #a-propos .ap-num {
  display: block;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .18em;
  line-height: 1;
  color: #595C62;
  margin-bottom: 10px;
}
@media (min-width: 1140px) {
  #a-propos .ap-num, #overlayRoot #a-propos .ap-num {
    font-size: 44px;
    letter-spacing: 0;
    color: #D8D5CE;
    margin-bottom: 4px;
  }
  #a-propos .ap-h2, #overlayRoot #a-propos .ap-h2 { padding-top: 0; }
}

#a-propos .ap-reperes li,
#overlayRoot #a-propos .ap-reperes li {
  display: flex;
  align-items: baseline;
  gap: .7em;
}
#a-propos .ap-an,
#overlayRoot #a-propos .ap-an {
  flex: 0 0 auto;
  font-style: normal;
  font-variant-numeric: tabular-nums;
  color: #1D1F24;
}

#a-propos.ap-js .ap-partie,
#overlayRoot #a-propos.ap-js .ap-partie {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .55s ease-out, transform .55s ease-out;
}
#a-propos.ap-js .ap-partie.is-in,
#overlayRoot #a-propos.ap-js .ap-partie.is-in { opacity: 1; transform: none; }

#a-propos .ap-marge-img,
#overlayRoot #a-propos .ap-marge-img { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
  #a-propos.ap-js .ap-partie,
  #overlayRoot #a-propos.ap-js .ap-partie {
    opacity: 1; transform: none; transition: none;
  }
  #a-propos .ap-marge-img, #overlayRoot #a-propos .ap-marge-img { will-change: auto; }
}


#a-propos .ap-feuille,
#overlayRoot #a-propos .ap-feuille { transition: background-color .5s cubic-bezier(.2, .9, .2, 1); }

#a-propos .ap-h1, #a-propos .ap-ouverture,
#overlayRoot #a-propos .ap-h1, #overlayRoot #a-propos .ap-ouverture {
  transition: color .5s cubic-bezier(.2, .9, .2, 1);
}

#a-propos .ap-topbar, #a-propos .ap-date, #a-propos .ap-portrait-zone, #a-propos .ap-marge-img,
#overlayRoot #a-propos .ap-topbar, #overlayRoot #a-propos .ap-date,
#overlayRoot #a-propos .ap-portrait-zone, #overlayRoot #a-propos .ap-marge-img {
  transition: opacity .5s ease-out .25s;
}

#a-propos.ap-intro .ap-feuille,
#overlayRoot #a-propos.ap-intro .ap-feuille { background: #14171C; transition: none; }

#a-propos.ap-intro .ap-h1,
#overlayRoot #a-propos.ap-intro .ap-h1 { color: #EDEBE6; transition: none; }

#a-propos.ap-intro .ap-ouverture,
#overlayRoot #a-propos.ap-intro .ap-ouverture { color: #B9C6C8; transition: none; }

#a-propos.ap-intro .ap-topbar,
#a-propos.ap-intro .ap-date,
#a-propos.ap-intro .ap-portrait-zone,
#a-propos.ap-intro .ap-marge-img,
#overlayRoot #a-propos.ap-intro .ap-topbar,
#overlayRoot #a-propos.ap-intro .ap-date,
#overlayRoot #a-propos.ap-intro .ap-portrait-zone,
#overlayRoot #a-propos.ap-intro .ap-marge-img { opacity: 0; transition: none; }

#a-propos .ap-glyph,
#overlayRoot #a-propos .ap-glyph {
  display: inline-block;
  white-space: pre;
}

@media (prefers-reduced-motion: reduce) {
  #a-propos .ap-feuille, #a-propos .ap-h1, #a-propos .ap-ouverture,
  #a-propos .ap-topbar, #a-propos .ap-date, #a-propos .ap-portrait-zone,
  #overlayRoot #a-propos .ap-feuille, #overlayRoot #a-propos .ap-h1,
  #overlayRoot #a-propos .ap-ouverture, #overlayRoot #a-propos .ap-topbar,
  #overlayRoot #a-propos .ap-date, #overlayRoot #a-propos .ap-portrait-zone {
    transition: none;
  }
}


#a-propos .ap-partie--dark,
#overlayRoot #a-propos .ap-partie--dark { position: relative; color: #EDEBE6; }

#a-propos .ap-partie--dark::before,
#overlayRoot #a-propos .ap-partie--dark::before {
  content: '';
  position: absolute;
  z-index: 0;
  top: calc(-1 * var(--esp) / 2);
  bottom: calc(-1 * var(--esp) / 2);
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  background: #1D1F24;
}
#a-propos .ap-partie--dark > *,
#overlayRoot #a-propos .ap-partie--dark > * { position: relative; z-index: 1; }

#a-propos .ap-partie--dark .ap-h2,
#overlayRoot #a-propos .ap-partie--dark .ap-h2 { color: #31c7d2; }   
#a-propos .ap-partie--dark .ap-num,
#overlayRoot #a-propos .ap-partie--dark .ap-num { color: #595C62; }  
#a-propos .ap-partie--dark .ap-p,
#overlayRoot #a-propos .ap-partie--dark .ap-p { color: #EDEBE6; }    

#a-propos .ap-partie--dalle .ap-p,
#overlayRoot #a-propos .ap-partie--dalle .ap-p {
  font-size: calc(var(--corps) + 2px);
  line-height: 1.6;
  max-width: 54ch;
}

#a-propos .ap-cite,
#overlayRoot #a-propos .ap-cite {
  position: relative;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding: clamp(40px, 6vw, 72px) var(--pad-h);
  background: #31c7d2;
  color: #1D1F24;
}
#a-propos .ap-cite p,
#overlayRoot #a-propos .ap-cite p {
  max-width: 24ch;
  margin: 0 auto;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 4.2vw, 40px);
  line-height: 1.15;
  text-wrap: balance;
}

@media (min-width: 1140px) {
  #a-propos .ap-partie--large,
  #overlayRoot #a-propos .ap-partie--large { grid-template-columns: 240px minmax(0, 1fr); }
  #a-propos .ap-partie--large .ap-large,
  #overlayRoot #a-propos .ap-partie--large .ap-large { grid-column: 2; grid-row: 1; }
}

#a-propos .ap-convictions,
#overlayRoot #a-propos .ap-convictions {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 2px;                     
  background: #D8D5CE;          
  border: 1px solid #D8D5CE;
}
@media (min-width: 760px) {
  #a-propos .ap-convictions,
  #overlayRoot #a-propos .ap-convictions { grid-template-columns: 1fr 1fr; }
  #a-propos .ap-convictions li:last-child,
  #overlayRoot #a-propos .ap-convictions li:last-child { grid-column: 1 / -1; }
}

#a-propos .ap-convictions li,
#overlayRoot #a-propos .ap-convictions li {
  background: #EDEBE6;
  padding: clamp(20px, 2.4vw, 28px);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#a-propos .ap-convictions .ap-cle,
#overlayRoot #a-propos .ap-convictions .ap-cle {
  display: block;
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.25;
  color: #1D1F24;
}
#a-propos .ap-convictions p,
#overlayRoot #a-propos .ap-convictions p {
  margin: 0;
  font-size: 17px;
  line-height: 1.6;
  max-width: none;
}

@media (min-width: 1140px) {
  #a-propos .ap-travail,
  #overlayRoot #a-propos .ap-travail { grid-template-columns: 240px minmax(0, 1fr); }
  #a-propos .ap-travail .ap-corps,
  #overlayRoot #a-propos .ap-travail .ap-corps { grid-column: 2; grid-row: 1; }
  #a-propos .ap-travail .ap-reperes,
  #overlayRoot #a-propos .ap-travail .ap-reperes {
    grid-column: 2; grid-row: 2; margin-top: 36px; padding-right: 0;
  }
}

#a-propos .ap-reperes,
#overlayRoot #a-propos .ap-reperes {
  display: grid;
  gap: 2px;
  background: #D8D5CE;
  border-top: 1px solid #D8D5CE;
  border-bottom: 1px solid #D8D5CE;
  font-style: normal;
  font-size: 16px;
  color: #1D1F24;
}
@media (min-width: 760px) {
  #a-propos .ap-reperes,
  #overlayRoot #a-propos .ap-reperes { grid-template-columns: repeat(4, 1fr); }
}
#a-propos .ap-reperes li,
#overlayRoot #a-propos .ap-reperes li {
  background: #EDEBE6;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 18px 16px;
  line-height: 1.35;
}
#a-propos .ap-an,
#overlayRoot #a-propos .ap-an {
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 1;
  color: #1D1F24;
}

#a-propos .ap-bandes,
#overlayRoot #a-propos .ap-bandes {
  height: 12px;
  border: 0;
  margin: 0 calc(50% - 50vw);
  background: linear-gradient(90deg,
    #1D1F24 0 20%, #23464B 20% 40%, #276E75 40% 60%,
    #2C9BA4 60% 80%, #31c7d2 80% 100%);
}


#a-propos .ap-marge-img,
#overlayRoot #a-propos .ap-marge-img { margin: 20px 0 0; width: 200px; max-width: 100%; }

#a-propos .ap-marge-img img,
#overlayRoot #a-propos .ap-marge-img img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

@media (min-width: 1140px) {
  #a-propos .ap-marge-img,
  #overlayRoot #a-propos .ap-marge-img {
    grid-column: 1; grid-row: 2 / 4;
    margin: 24px 40px 0 0;
  }
}