/* PARTICULES VERSION 2026-10-29-C */
/*
 * Particules – page « À propos »
 * S’appuie sur home.css (variables, grille .ph-fr / .ph-row, boutons .ph-btn, annotations .ph-note).
 * Tout est préfixé « ap- ».
 */
.ap{--f:calc(min(100vw, 1784px) / 1440);--pink-strong:#E8559A;--lavender:#BFC0F5;--rose-soft:#FDD3DC}

/* Éléments communs */
.ap .ap-kicker{font-size:13px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;margin:0 0 18px!important}
.ap .ap-h1{font-family:var(--f-serif);font-style:italic;font-weight:500;letter-spacing:-.04em;line-height:1.08;font-size:calc(55 * min(1px, 100vw / 1440));margin:0}
.ap .ap-h2{font-family:var(--f-serif);font-style:italic;font-weight:500;letter-spacing:-.03em;line-height:1.15;font-size:clamp(26px,2.6vw,36px);margin:0 0 18px}
.ap p{margin:0 0 1em}

/* 1. Hero + équipe */
.ap-hero{padding:70px 0 100px;background:var(--page)}
.ap-hero__in{text-align:center}
.ap-hero .ap-h1{font-size:calc(55 * min(1px, 100vw / 1440));max-width:480px;margin:0 auto 34px}
.ap-hero__lead{color:var(--mint-line);font-size:18px;line-height:1.4;max-width:620px;margin:0 auto 22px!important}
.ap-hero__small{font-size:14px;font-weight:300;color:var(--ink-soft)}
.ap-team{list-style:none;padding:0;margin:44px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:calc(15 * var(--f))}
.ap-member{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:257/336;background:#dfe7ee;outline:none;transition-delay:var(--d,0ms)}
.ap-member img{width:100%;height:100%!important;object-fit:cover;display:block}
/* Bandeau : fin et translucide au repos, vert avec nom + fonction au survol */
.ap-member__band{position:absolute;left:0;right:0;bottom:0;height:19%;background:rgba(255,255,255,.38);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);padding:18px 18px 16px;transition:height .45s var(--ease),background .35s ease}
.ap-member__arrow{position:absolute;right:16px;bottom:14px;color:var(--navy);transition:opacity .25s ease}
.ap-member__name{font-family:var(--f-serif);font-style:italic;font-weight:600;font-size:18px;line-height:1.2;margin:0 0 8px!important;opacity:0;transform:translateY(8px);transition:opacity .3s ease .05s,transform .4s var(--ease) .05s}
.ap-member__role{font-size:14px;line-height:1.35;margin:0!important;opacity:0;transform:translateY(8px);transition:opacity .3s ease .1s,transform .4s var(--ease) .1s}
/* Ouvert : au survol sur ordinateur, au toucher sur mobile et tablette (classe .is-open), ou au clavier */
.ap-member.is-open .ap-member__band,.ap-member:focus-visible .ap-member__band{height:31%;background:var(--mint-cta);-webkit-backdrop-filter:none;backdrop-filter:none}
.ap-member.is-open .ap-member__arrow,.ap-member:focus-visible .ap-member__arrow{opacity:0}
.ap-member.is-open .ap-member__name,.ap-member.is-open .ap-member__role,.ap-member:focus-visible .ap-member__name,.ap-member:focus-visible .ap-member__role{opacity:1;transform:none}
@media (hover:hover){
  .ap-member:hover .ap-member__band{height:31%;background:var(--mint-cta);-webkit-backdrop-filter:none;backdrop-filter:none}
  .ap-member:hover .ap-member__arrow{opacity:0}
  .ap-member:hover .ap-member__name,.ap-member:hover .ap-member__role{opacity:1;transform:none}
}
.ap-member{cursor:pointer;-webkit-tap-highlight-color:transparent}
.ap-member:focus-visible{box-shadow:0 0 0 3px var(--navy)}

/* 2. Notre conviction */
.ap-conv{position:relative;background:var(--navy);color:#fff;padding:110px 0 170px;overflow:hidden}
.ap-conv .ap-kicker{color:#fff}
.ap-conv__text p{font-size:15.5px;font-weight:300;line-height:1.55}
.ap-conv__hl{color:var(--mint-cta)}
.ap-values{list-style:none;padding:0;margin:44px 0 0;display:grid;grid-template-columns:1fr 50px 50px 1fr;column-gap:8px;row-gap:12px;align-items:center;max-width:430px}
.ap-value{display:contents}
.ap-value__dot{width:50px;height:50px;border-radius:50%}
.ap-value__txt{font-size:11.5px;line-height:1.35;font-weight:300}
.ap-value__txt strong{display:block;font-size:15px;font-weight:700;margin-bottom:6px}
.ap-value--1 .ap-value__txt,.ap-value--3 .ap-value__txt{text-align:right;padding-right:16px}
.ap-value--2 .ap-value__txt,.ap-value--4 .ap-value__txt{padding-left:16px}
.ap-value--1 .ap-value__txt{grid-area:1/1}.ap-value--1 .ap-value__dot{grid-area:1/2}
.ap-value--2 .ap-value__dot{grid-area:1/3}.ap-value--2 .ap-value__txt{grid-area:1/4}
.ap-value--3 .ap-value__txt{grid-area:2/1}.ap-value--3 .ap-value__dot{grid-area:2/2}
.ap-value--4 .ap-value__dot{grid-area:2/3}.ap-value--4 .ap-value__txt{grid-area:2/4}
.ap-dot--pink{background:var(--pink-strong)}.ap-dot--lavender{background:var(--lavender)}
.ap-dot--mint{background:var(--mint-cta)}.ap-dot--rose{background:var(--rose-soft)}.ap-dot--navy{background:var(--navy);color:#fff}
.ap-conv__quote{font-family:var(--f-serif);font-style:italic;font-weight:600;font-size:clamp(26px,2.6vw,38px);line-height:1.12;letter-spacing:-.02em;margin:0;color:#fff}
.ap-conv__quote em{color:var(--mint-cta);font-style:italic}
.ap-conv__illu{position:absolute;bottom:0;left:calc(50% + 157 * var(--f));width:calc(410 * var(--f));height:auto;pointer-events:none}

/* 3. Le constat + méthode */
.ap-constat{background:#fff;padding:70px 0 110px}
.ap-constat .ph-note{margin-bottom:10px}
.ap-constat__row{align-items:center}
.ap-constat__text{align-self:center}
.ap-constat__text p{font-size:15.5px;font-weight:300}
.ap-constat .ap-h2{font-size:clamp(28px,2.6vw,38px);margin-top:36px}
.ap-method{background:var(--grey-card);border-radius:30px;padding:56px 50px 50px}
.ap-method .ap-method__title{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(22px,2vw,28px);color:var(--pink-strong);margin:0 0 22px!important}
.ap-method p{font-size:15.5px;font-weight:300}
.ap-method .ph-btn{margin-top:10px}

/* 4. La preuve par le geste */
.ap-preuve{background:#fff;padding:20px 0 150px}
.ap-preuve__card{position:relative;background:var(--navy);color:#fff;border-radius:30px;min-height:calc(515 * var(--f))}
.ap-preuve__text{width:calc(400 * var(--f));padding:calc(105 * var(--f)) 0 60px calc(64 * var(--f))}
.ap-preuve .ap-kicker{color:var(--mint-cta)}
.ap-preuve .ap-h2{color:#fff;font-size:clamp(28px,2.7vw,40px);margin-bottom:26px}
.ap-preuve__text p{font-size:15.5px;font-weight:300;margin-bottom:28px!important}
.ap-preuve__imgs{position:absolute;left:calc(506 / 1133 * 100%);width:calc(588 / 1133 * 100%);top:calc(64 * var(--f));display:grid;grid-template-columns:repeat(3,1fr);gap:calc(14 * var(--f))}
.ap-preuve__imgs img{width:100%;aspect-ratio:186/538;height:auto;object-fit:cover;border-radius:34px;display:block}

/* 5. Prestations clés en main */
.ap-presta{background:#fff;padding:0 0 30px}
.ap-presta__card{background:var(--page);padding:85px calc(92 * var(--f)) 80px}
.ap-presta__head{text-align:center;margin-bottom:60px}
.ap-presta__head .ap-h2{font-size:clamp(24px,2.2vw,32px)}
.ap-presta__head p{font-size:15.5px;font-weight:300}
.ap-presta__body{display:flex;align-items:flex-end}
.ap-presta__illu{width:calc(510 * var(--f));height:auto;flex:none}
.ap-tags{list-style:none;margin:0 0 0 calc(-32 * var(--f));padding:24px;background:#fff;border-radius:30px;display:grid;grid-template-columns:auto auto;gap:20px 24px;position:relative}
.ap-tags li{background:var(--mint-cta);border-radius:12px;padding:12px 10px;font-size:15px;font-weight:500;text-align:center;white-space:nowrap}

/* 6. Agence engagée + photo + partenaires */
.ap-engage{background:linear-gradient(180deg,#fff 0%,#fde3ef 45%,#FBB2D6 100%);padding:90px 0 0}
.ap-engage .ap-h2{font-size:clamp(26px,2.4vw,34px)}
.ap-engage__text p{font-size:15.5px;font-weight:300}
.ap-stats{margin:0}
.ap-stat{display:grid;grid-template-columns:128px 1fr;align-items:center;gap:12px;padding:16px 0 26px;border-bottom:1px solid #8b90d0}
.ap-stat dt{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:30px;line-height:1}
.ap-stat dd{margin:0;font-size:15px;line-height:1.2}
.ap-engage__noterow{margin-top:40px}
.ap-engage__noterow .ph-note{margin-bottom:8px}
.ap-engage__photo{width:100%;border-radius:34px;aspect-ratio:812/538;object-fit:cover;margin-bottom:calc(-458 * var(--f))!important;position:relative;z-index:1}
.ap-partners{background:var(--navy);color:#fff;padding:calc(458 * var(--f) + 80px) 0 110px;text-align:center}
.ap-partners .ap-kicker{color:#fff}
.ap-partners .ap-h2{color:#fff;font-size:clamp(24px,2.2vw,32px)}
.ap-partners p{font-size:15.5px;font-weight:300}
.ap-partners__list{list-style:none;padding:0;margin:30px 0 0;display:flex;justify-content:center;flex-wrap:wrap;gap:22px}
.ap-partner{display:inline-flex;align-items:center;gap:10px;background:#fff;color:var(--navy)!important;border-radius:999px;padding:10px 22px 10px 12px;font-size:16px;font-weight:500;text-decoration:none!important}
.ap-partner img{width:28px;height:28px!important;object-fit:contain;border-radius:50%}
.ap-partner__ini{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--navy)}
.ap-partner__ini.ap-dot--navy{color:#fff}
a.ap-partner:hover{box-shadow:0 0 0 2px var(--mint-cta)}

/* 7. Signature + audit gratuit */
.ap-end{background:var(--page);padding:110px 0 130px}
.ap-end .ph-row{align-items:stretch}
.ap-sign,.ap-audit{border-radius:30px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ap-sign{background:var(--navy);color:#fff;padding:56px calc(60 * var(--f))}
.ap-sign .ap-kicker{color:#fff}
.ap-sign .ap-sign__quote{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(22px,2vw,28px);line-height:1.25;margin:0 0 20px!important}
.ap-sign p{font-size:15.5px;font-weight:300}
.ap-audit{background:var(--rose-soft);padding:56px 40px}
.ap-audit .ap-audit__title{font-family:var(--f-serif);font-style:italic;font-weight:500;font-size:clamp(20px,1.8vw,25px);line-height:1.25;margin:0 0 18px!important}
.ap-audit p{font-size:15.5px;font-weight:300}
.ap-audit .ph-btn{background:#fff;padding:.8em 1.6em}

/* Mobile */
@media (max-width:980px){
  .ap{--f:1px}
  .ap-hero{padding:50px 0 70px}
  .ap-hero .ap-h1{font-size:38px}
  .ap-team{grid-template-columns:repeat(2,1fr);gap:12px}
  .ap-conv{padding:70px 0 160px}
  .ap-conv__quote{margin-top:44px}
  .ap-values{max-width:none}
  .ap-conv__illu{left:auto;right:0;width:260px}
  .ap-method{margin-top:40px;padding:40px 28px}
  .ap-preuve{padding-bottom:70px}
  .ap-preuve__card{min-height:0;padding-bottom:30px}
  .ap-preuve__text{width:auto;padding:50px 28px 10px}
  .ap-preuve__imgs{position:static;width:auto;padding:0 28px;gap:10px}
  .ap-presta__card{padding:50px 20px}
  .ap-presta__body{flex-direction:column;align-items:stretch}
  .ap-presta__illu{width:100%;max-width:420px}
  .ap-tags{margin:-20px 0 0;grid-template-columns:1fr 1fr}
  .ap-tags li{white-space:normal}
  .ap-engage{padding:60px 0 0}
  .ap-stats{margin-top:30px}
  .ap-engage__photo{margin-bottom:-120px!important}
  .ap-partners{padding:200px 0 80px}
  .ap-audit{margin-top:24px}
}
@media (max-width:560px){
  /* Petites cartes : bandeau ouvert plus haut et textes plus petits pour les fonctions sur 2 lignes */
  .ap-member__band{padding:12px 12px 10px}
  .ap-member.is-open .ap-member__band,.ap-member:focus-visible .ap-member__band{height:46%}
  .ap-member__name{font-size:15px;margin-bottom:4px!important}
  .ap-member__role{font-size:12px}
  .ap-member__arrow{right:12px;bottom:10px}
  .ap-values{grid-template-columns:1fr 40px 40px 1fr}
  .ap-value__dot{width:40px;height:40px}
  .ap-tags{grid-template-columns:1fr}
}