/* =========================================================
   PAGE À PROPOS — référence pixel : Page-APropos.dc.html
   ========================================================= */

/* ===================== HERO ===================== */
.ap-hero { padding: 40px 48px 56px; box-sizing: border-box; }
.ap-eyebrow-row { display: flex; justify-content: space-between; gap: 16px; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #8A8A8A; margin-bottom: 14px; }
.ap-h1 { margin: 0; overflow: hidden; font-family: 'Archivo', sans-serif; font-variation-settings: 'wdth' 100; font-weight: 400; line-height: .9; letter-spacing: -0.035em; white-space: nowrap; font-size: min(9vw, 150px); padding-bottom: .04em; }
.ap-h1__inner { display: inline-block; }
.ap-hero-grid { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 72px; margin-top: 40px; align-items: end; }
.ap-photo { margin: 0; overflow: hidden; width: min(360px, 34vw); max-width: 100%; }
.ap-photo img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.ap-hero-col { display: flex; flex-direction: column; gap: 30px; min-width: 0; }
.ap-lead { margin: 0; font-size: min(60px, 5.5vh); line-height: 1.02; letter-spacing: -0.04em; font-weight: 700; }
.ap-lead__it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; letter-spacing: -0.02em; color: #0136FE; }
.ap-bio { margin: 0; font-size: 19px; line-height: 1.5; color: #333333; max-width: 540px; }
@media (max-width: 699px) {
  .ap-hero { padding: 40px 16px 72px; }
  .ap-h1 { font-size: 13.5vw; }
  .ap-hero-grid { grid-template-columns: 1fr; gap: 32px; margin-top: 24px; }
  .ap-photo { width: 100%; }
  .ap-lead { font-size: 34px; }
}
@media (min-width: 700px) and (max-width: 999px) { .ap-hero { padding: 56px 48px 96px; } .ap-h1 { font-size: 10vw; } .ap-hero-grid { grid-template-columns: 1fr; } .ap-lead { font-size: 48px; } }

/* ===================== SECTIONS SOMBRES COMMUNES ===================== */
.ap-dark { background: #1C1C1C; color: #F2F2F2; padding: 96px 48px; box-sizing: border-box; display: grid; grid-template-columns: minmax(0,0.8fr) minmax(0,1.2fr); gap: 40px 80px; align-items: start; }
.ap-sticky-col { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 120px; align-self: start; }
.ap-kicker { margin: 0; display: inline-flex; align-items: center; gap: 8px; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #9A9A9A; }
.ap-dot { width: 8px; height: 8px; border-radius: 999px; background: #0136FE; display: inline-block; }
.ap-h2 { font-family: 'Archivo', sans-serif; font-variation-settings: 'wdth' 100; font-weight: 400; text-transform: uppercase; line-height: .88; letter-spacing: -0.035em; margin: 0; font-size: min(88px, 9vw); }
.ap-h2__it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -0.02em; color: #6E8CFF; }
.ap-h2--dark .ap-h2__it { color: #0136FE; }
@media (max-width: 999px) { .ap-dark { grid-template-columns: 1fr; padding: 80px 16px; } .ap-sticky-col { position: static; } .ap-h2 { font-size: 56px; } }
@media (min-width: 700px) and (max-width: 999px) { .ap-dark { padding: 110px 48px; } }

/* ===================== QUI SUIS-JE ===================== */
.ap-qui-text { display: flex; flex-direction: column; gap: 28px; max-width: 760px; }
.ap-p { margin: 0; font-size: min(28px, 1.8vw); line-height: 1.45; letter-spacing: -0.015em; color: #D6D6D6; }
.ap-p em { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; letter-spacing: -0.02em; color: #FFFFFF; font-size: 1.12em; }
@media (max-width: 699px) { .ap-p { font-size: 20px; } }
@media (min-width: 700px) and (max-width: 999px) { .ap-p { font-size: 24px; } }

/* ===================== CE QUE JE FAIS ===================== */
.srv-section { position: relative; box-sizing: border-box; background: #FFFFFF; color: #141414; }
.srv-inner {
  position: relative;
  min-height: var(--secMinH, auto);
  display: flex; flex-direction: column; justify-content: flex-start;
  padding: var(--srvSecPad, 80px 16px 0);
  box-sizing: border-box;
  overflow-x: clip;
}
.srv-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: var(--srvHeadMb, 48px); }
#srv-titre { font-family: 'Archivo', sans-serif; font-variation-settings: 'wdth' 100; font-weight: 400; text-transform: uppercase; line-height: .88; letter-spacing: -0.035em; margin: 0; font-size: var(--h2Size, 56px); }
#srv-titre .it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -0.02em; color: #0136FE; }
.srv-label { margin: 0; display: inline-flex; align-items: center; gap: 8px; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #8A8A8A; }
.srv-label .dot { width: 8px; height: 8px; border-radius: 999px; background: #0136FE; display: inline-block; }

.srv-list { list-style: none; padding: 0; margin: var(--srvBleed, 0 -16px); display: flex; flex-direction: column; flex: 1 1 auto; overflow: hidden; position: relative; }
.srv-list > li { position: relative; flex: 1 1 0; display: flex; flex-direction: column; }

.srv { transform-origin: 100% 0; border-top: 1px solid #E3E3E3; overflow: hidden; position: relative; will-change: transform; backface-visibility: hidden; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; transition: background .3s ease; }
.srv-grid { display: grid; grid-template-columns: var(--srvCols, 1fr); gap: var(--srvGap, 14px); align-items: var(--srvAlign, start); padding: var(--srvPad, 28px 16px 30px); }
.srv-num { font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #0136FE; padding-top: 4px; }
.srv-t { font-family: 'Archivo', sans-serif; font-variation-settings: 'wdth' 100; font-weight: 400; text-transform: uppercase; line-height: .92; letter-spacing: -0.035em; margin: 0; text-wrap: balance; font-size: var(--srvSize, 32px); color: #141414; }
.srv-p { margin: 0; font-size: var(--srvP, 17px); line-height: 1.45; color: #555555; max-width: 440px; }
.srv-shade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(0,0,0,.03) 0%, rgba(0,0,0,.26) 100%); opacity: 0; }

@media (prefers-reduced-motion: reduce) { .srv-t { transition: none; } }

/* ===================== MON PARCOURS ===================== */
.ap-tl-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); column-gap: 40px; row-gap: 20px; }
.ap-tl-item { display: flex; flex-direction: column; gap: 10px; padding: 26px 0; border-top: 1px solid rgba(255,255,255,.18); min-width: 0; }
.ap-tl-body, .ap-tl-body h3, .ap-tl-body p { min-width: 0; }
.ap-tl-tag { font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #9A9A9A; padding-top: 7px; overflow-wrap: break-word; }
.ap-tl-body { display: flex; flex-direction: column; gap: 8px; }
.ap-tl-body h3 { margin: 0; font-size: min(28px, 2vw); font-weight: 700; letter-spacing: -0.04em; line-height: 1.05; color: #FFFFFF; }
.ap-tl-body p { margin: 0; font-size: 16px; line-height: 1.45; color: #BDBDBD; max-width: 560px; }
@media (max-width: 999px) { .ap-tl-list { grid-template-columns: 1fr; row-gap: 0; } .ap-tl-body h3 { font-size: 24px; } }

/* ===================== MES UNIVERS ===================== */
.ap-univ { background: #FFFFFF; color: #141414; padding: 96px 0; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
.ap-univ-head { padding: 0 48px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 40px; }
.ap-univ-lead { margin: 0; font-size: 19px; line-height: 1.5; color: #555555; max-width: 420px; }
.ap-marq-wrap { overflow: hidden; padding: 10px 0; }
.ap-marq { font-size: min(88px, 7.5vw); font-weight: 700; letter-spacing: -0.04em; line-height: 1.1; }
.ap-marq-i { display: inline-flex; align-items: center; gap: 40px; padding-right: 40px; white-space: nowrap; }
.ap-marq-i em { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; letter-spacing: -0.02em; }
.ap-marq-dot { color: #0136FE; font-size: .5em; }
.ap-tools { padding: 0 48px; margin-top: 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.ap-tools-col { display: flex; flex-direction: column; gap: 16px; }
.ap-tools-label { margin: 0; font-family: 'JetBrains Mono', monospace; font-size: 12px; letter-spacing: .1em; color: #8A8A8A; }
.ap-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
@media (max-width: 699px) { .ap-univ { padding: 80px 0; } .ap-univ-head { padding: 0 16px; } .ap-marq { font-size: 44px; } .ap-tools { padding: 0 16px; grid-template-columns: 1fr; } }
@media (min-width: 700px) and (max-width: 999px) { .ap-marq { font-size: 72px; } }

/* ===================== ENCART CONTACT ===================== */
.ap-cta-section { align-content: center; background: #0136FE; color: #FFFFFF; padding: 96px 48px; box-sizing: border-box; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 32px; }
.ap-cta-title { margin: 0; font-size: min(104px, 9vw); line-height: .92; letter-spacing: -0.05em; font-weight: 700; }
.ap-cta-title__it { font-family: 'Instrument Serif', serif; font-style: italic; font-weight: 400; letter-spacing: -0.02em; }
@media (max-width: 699px) { .ap-cta-section { padding: 80px 16px; } .ap-cta-title { font-size: 44px; } }
@media (min-width: 700px) and (max-width: 999px) { .ap-cta-title { font-size: 72px; } }
