/* ═══════════ À propos : motion design ═══════════
   État final par défaut (sans JS, reduced-motion). Boucles en
   transform/opacity uniquement, jouées seulement à l'écran. */

/* ── Héros ── */
.ap-hero__grid{position:relative;display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(30px,5vw,80px);align-items:center}
.ap-title{font-size:clamp(40px,5vw,78px);line-height:1.04}
.ap-hero .page-hero__lead a{color:var(--yellow)}
.ap-stats{list-style:none;margin:clamp(26px,4vh,40px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ap-stats li{padding:16px 18px;border-radius:14px;border:1px solid var(--border);background:var(--surface)}
.ap-stats b{display:block;font-family:var(--font-display);font-size:clamp(26px,2.6vw,34px);letter-spacing:-0.03em;line-height:1.05;color:var(--yellow);font-variant-numeric:tabular-nums}
.ap-stats li>span{display:block;margin-top:6px;font-size:13px;line-height:1.4;color:var(--muted-2)}

.ap-portrait{position:relative;margin:0;max-width:480px;justify-self:end;width:100%}
.ap-portrait::before{content:"";position:absolute;inset:8% -6% -6% 10%;border-radius:28px;background:var(--yellow);transform:rotate(3deg)}
.ap-portrait__frame{position:relative;aspect-ratio:1;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,0.12);background:#151515}
.ap-portrait__frame img{display:block;width:100%;height:100%;object-fit:cover}
.ap-portrait__tag{position:absolute;left:18px;bottom:18px;display:flex;flex-direction:column;padding:10px 16px;border-radius:14px;background:rgba(10,10,10,0.86);border:1px solid rgba(255,255,255,0.1)}
.ap-portrait__tag b{font-family:var(--font-display);font-size:16px;color:var(--text)}
.ap-portrait__tag span{font-size:12.5px;color:var(--muted-2)}
.ap-portrait__chip{position:absolute;padding:8px 14px;border-radius:999px;background:#141414;border:1px solid rgba(250,181,18,0.5);color:var(--text);font-size:13px;font-weight:600;white-space:nowrap;box-shadow:0 12px 30px rgba(0,0,0,0.4)}
.ap-portrait__chip--1{top:8%;left:-8%}
.ap-portrait__chip--2{top:38%;right:-7%;color:var(--yellow)}
.ap-portrait__chip--3{bottom:22%;left:-12%}

/* ── Projets ── */
.ap-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2vw,22px)}
.ap-case{position:relative;display:flex;flex-direction:column;padding:clamp(26px,3vw,38px);border-radius:20px;border:1px solid var(--border);background:var(--surface);overflow:hidden;transition:border-color 0.35s var(--ease)}
.ap-case:hover{border-color:#3a3a3a}
.ap-case__brand{position:absolute;right:-0.06em;bottom:-0.22em;font-family:var(--font-display);font-weight:700;font-size:clamp(70px,8vw,120px);line-height:1;letter-spacing:-0.05em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,0.07);white-space:nowrap;pointer-events:none}
.ap-case__head{position:relative;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:14px}
.ap-case__head b{font-family:var(--font-display);font-size:15px;letter-spacing:0.02em;color:var(--yellow)}
.ap-case__head span{font-size:13px;color:var(--muted)}
.ap-case__title{position:relative;margin:0 0 12px;font-size:clamp(20px,1.9vw,26px);line-height:1.2;letter-spacing:-0.02em}
.ap-case__desc{position:relative;margin:0;font-size:15px;line-height:1.65;color:var(--muted-2)}
.ap-case__res{position:relative;display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:24px}
.ap-case__res>span{padding:10px 14px;border-radius:12px;background:#19160d;border:1px solid rgba(250,181,18,0.25);font-size:13.5px;color:var(--muted-2)}
.ap-case__res strong{display:block;font-family:var(--font-display);font-size:24px;letter-spacing:-0.03em;color:var(--text);font-variant-numeric:tabular-nums}

/* ── Le calcul ── */
.ap-calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:center}
.ap-eq{padding:clamp(24px,3vw,36px);border-radius:20px;background:#121212;border:1px solid rgba(255,255,255,0.1)}
.ap-eq__row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.ap-eq__n{display:flex;flex-direction:column}
.ap-eq__n b,.ap-eq__total b{font-family:var(--font-display);font-size:clamp(34px,3.6vw,52px);letter-spacing:-0.04em;line-height:1;color:var(--text)}
.ap-eq__n i,.ap-eq__total i{max-width:12ch;margin-top:6px;font-style:normal;font-size:13px;color:var(--muted-2)}
.ap-eq__op{font-family:var(--font-display);font-size:28px;color:var(--yellow)}
.ap-eq__total{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin-top:22px;padding-top:22px;border-top:1px solid rgba(255,255,255,0.1)}
.ap-eq__eq{font-family:var(--font-display);font-size:34px;color:var(--yellow)}
.ap-eq__total b{color:var(--yellow);font-size:clamp(42px,4.6vw,66px);font-variant-numeric:tabular-nums}
.ap-eq__total i{flex-basis:100%;max-width:none}

/* ── Manifeste ── */
.ap-mani{list-style:none;margin:0;padding:0;counter-reset:ap}
.ap-mani li{position:relative;padding:clamp(18px,2.6vw,28px) 0 clamp(18px,2.6vw,28px) clamp(54px,6vw,90px);border-top:1px solid var(--border);font-family:var(--font-display);font-weight:600;font-size:clamp(22px,3vw,40px);line-height:1.2;letter-spacing:-0.03em;color:var(--text);counter-increment:ap;transition:color 0.5s var(--ease)}
.ap-mani li:last-child{border-bottom:1px solid var(--border)}
.ap-mani li::before{content:counter(ap,decimal-leading-zero);position:absolute;left:0;top:clamp(24px,3.2vw,38px);font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:0.12em;color:var(--yellow)}
.ap-mani li::after{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--yellow);transform:scaleX(0);transform-origin:0 50%;transition:transform 0.8s var(--ease)}
.ap-mani[data-armed] li{color:var(--muted)}
.ap-mani[data-armed] li.is-lit{color:var(--text)}
.ap-mani[data-armed] li.is-lit::after{transform:none}

/* ── Territoire ── */
.ap-terr{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(30px,5vw,80px);align-items:center}
.ap-terr__p{margin-top:16px;font-size:16px;line-height:1.65;color:var(--muted-2)}
.ap-map{margin:0;justify-self:center;width:100%;max-width:440px}
.ap-map svg{display:block;width:100%;height:auto;overflow:visible}
.ap-map line{stroke:var(--yellow);stroke-opacity:0.45;stroke-width:1.2;stroke-dasharray:1;stroke-dashoffset:0}
.ap-map__ring{fill:none;stroke:var(--yellow);stroke-width:1.5;transform-box:fill-box;transform-origin:center;opacity:0}
.ap-city circle{fill:var(--text);transition:fill 0.3s var(--ease)}
.ap-city text{fill:var(--muted-2);font-family:var(--font-body,Inter,sans-serif);font-size:12px;font-weight:500;transition:fill 0.3s var(--ease)}
.ap-city--home circle{fill:var(--yellow)}
.ap-city--home text{fill:var(--yellow);font-family:var(--font-display);font-size:15px;font-weight:700}
.ap-city:hover circle,.ap-city:focus-visible circle{fill:var(--yellow)}
.ap-city:hover text,.ap-city:focus-visible text{fill:var(--text)}
.ap-city:focus-visible{outline:none}
.ap-city:focus-visible text{text-decoration:underline}

/* ── Avis ── */
.ap-quotes{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:auto auto;gap:clamp(14px,2vw,22px)}
.ap-quote{position:relative;margin:0;display:flex;flex-direction:column;justify-content:space-between;gap:20px;padding:clamp(24px,3vw,36px);border-radius:20px;border:1px solid var(--border);background:var(--surface)}
.ap-quote:first-child{grid-row:span 2;background:var(--yellow);border-color:var(--yellow)}
.ap-quote::before{content:"«";position:absolute;top:10px;right:22px;font-family:var(--font-display);font-size:72px;line-height:1;color:rgba(250,181,18,0.25)}
.ap-quote:first-child::before{color:rgba(10,10,10,0.18)}
.ap-quote p{margin:0;padding-right:44px;font-family:var(--font-display);font-weight:600;font-size:clamp(18px,1.6vw,22px);line-height:1.4;letter-spacing:-0.015em;color:var(--text)}
.ap-quote:first-child p{font-size:clamp(22px,2.3vw,32px);color:#141414}
.ap-quote footer{display:flex;flex-direction:column;gap:2px}
.ap-quote footer b{font-size:15px;color:var(--text)}
.ap-quote footer span{font-size:13px;color:var(--muted-2)}
.ap-quote:first-child footer b{color:#141414}
.ap-quote:first-child footer span{color:rgba(20,20,20,0.7)}
.ap-quotes__more{margin-top:22px}
.ap-quotes__more a{color:var(--yellow);font-weight:600}

/* ── Certifications ── */
.ap-cert{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(30px,5vw,80px);align-items:start}
.ap-cert__in{margin-top:12px}
.ap-cert__cols{display:grid;gap:30px}
.ap-cert__h{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted)}
.ap-badges,.ap-tools{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ap-badges li{position:relative;padding:14px 20px 14px 46px;border-radius:14px;border:1px solid rgba(250,181,18,0.45);background:rgba(250,181,18,0.07);font-family:var(--font-display);font-weight:600;font-size:17px;color:var(--text)}
.ap-badges li::before{content:"";position:absolute;left:18px;top:50%;width:8px;height:14px;margin-top:-9px;border:solid var(--yellow);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.ap-tools li{padding:10px 18px;border-radius:999px;border:1px solid var(--border);background:var(--surface);font-size:14px;font-weight:500;color:var(--text);transition:border-color 0.3s var(--ease),transform 0.3s var(--ease)}
.ap-tools li:hover{border-color:var(--yellow);transform:translateY(-2px)}

/* ── Animations ── */
@media (prefers-reduced-motion:no-preference){
  .ap-in{opacity:0;transform:translateY(16px);animation:apIn 0.75s var(--ease) var(--d,0s) forwards}
  .ap-portrait::before{transform:rotate(0deg) scale(0.9);animation:apTilt 1s var(--ease) 0.6s forwards}
  .ap-portrait__frame img{transform:scale(1.12);animation:apSettle 1.6s var(--ease) 0.25s forwards}
  .ap-portrait__chip{opacity:0;animation:apChip 0.6s var(--ease) forwards,apBob 4.5s ease-in-out infinite}
  .ap-portrait__chip--1{animation-delay:1s,1.6s}
  .ap-portrait__chip--2{animation-delay:1.15s,2.1s}
  .ap-portrait__chip--3{animation-delay:1.3s,2.6s}
  .ap-hero.is-paused .ap-portrait__chip{animation-play-state:paused}

  .ap-case .ap-case__brand{transform:translateX(18%);opacity:0}
  .ap-case.is-visible .ap-case__brand{transform:none;opacity:1;transition:transform 1.4s var(--ease) 0.2s,opacity 1s var(--ease) 0.2s}

  .ap-eq .ap-eq__n,.ap-eq .ap-eq__op,.ap-eq .ap-eq__total{opacity:0;transform:translateY(14px)}
  .ap-eq.is-visible .ap-eq__n,.ap-eq.is-visible .ap-eq__op,.ap-eq.is-visible .ap-eq__total{opacity:1;transform:none;transition:opacity 0.5s var(--ease),transform 0.5s cubic-bezier(0.34,1.4,0.5,1)}
  .ap-eq.is-visible .ap-eq__row>:nth-child(1){transition-delay:0.2s}
  .ap-eq.is-visible .ap-eq__row>:nth-child(2){transition-delay:0.45s}
  .ap-eq.is-visible .ap-eq__row>:nth-child(3){transition-delay:0.6s}
  .ap-eq.is-visible .ap-eq__row>:nth-child(4){transition-delay:0.85s}
  .ap-eq.is-visible .ap-eq__row>:nth-child(5){transition-delay:1s}
  .ap-eq.is-visible .ap-eq__total{transition-delay:1.35s}

  .ap-map line{stroke-dashoffset:1}
  .ap-map.is-visible line{stroke-dashoffset:0;transition:stroke-dashoffset 0.9s var(--ease);transition-delay:calc(0.3s + var(--n,0)*0.12s)}
  .ap-map .ap-city:not(.ap-city--home){opacity:0}
  .ap-map.is-visible .ap-city{opacity:1;transition:opacity 0.5s var(--ease);transition-delay:calc(0.9s + var(--n,0)*0.12s)}
  .ap-map.is-visible .ap-map__ring{animation:apRing 2.4s ease-out 1s infinite}
  .ap-map.is-paused .ap-map__ring{animation-play-state:paused}
}
@keyframes apIn{to{opacity:1;transform:none}}
@keyframes apTilt{to{transform:rotate(3deg)}}
@keyframes apSettle{to{transform:none}}
@keyframes apChip{to{opacity:1}}
@keyframes apBob{0%,100%{transform:none}50%{transform:translateY(-7px)}}
@keyframes apRing{0%{opacity:0.9;transform:scale(0.6)}100%{opacity:0;transform:scale(2.6)}}

/* ── Responsive ── */
@media (max-width:980px){
  .ap-hero__grid,.ap-calc,.ap-terr,.ap-cert{grid-template-columns:1fr}
  .ap-portrait{justify-self:center;max-width:420px}
  .ap-quotes{grid-template-columns:1fr}
  .ap-quote:first-child{grid-row:auto}
}
@media (max-width:760px){
  .ap-cases{grid-template-columns:1fr}
  .ap-stats{grid-template-columns:1fr 1fr}
  .ap-stats li:last-child{grid-column:span 2}
  .ap-portrait{max-width:min(340px,82vw)}
  .ap-portrait__chip{font-size:12px;padding:7px 12px}
  .ap-portrait__chip--1{left:-4%}
  .ap-portrait__chip--2{right:-4%}
  .ap-portrait__chip--3{left:-6%}
  .ap-mani li{padding-left:44px}
}
@media (max-width:520px){.ap-eq__row{gap:8px 10px}.ap-eq__n b{font-size:30px}.ap-eq__op{font-size:20px}.ap-eq__n i{font-size:12px}}