/* Page L'agence (Qui sommes-nous ?) */

/* Filigrane « C » (valeurs propres à la page, différentes de .watermark) */
.agence__mark{position:absolute;aspect-ratio:.832;background:#fff;-webkit-mask:url(../../logos/mark-c-lg.png) center/contain no-repeat;mask:url(../../logos/mark-c-lg.png) center/contain no-repeat;pointer-events:none}
.agence__mark--hero{left:-10%;top:-30%;height:160%;opacity:.05}
.agence__mark--cta{right:-4%;top:-40%;height:180%;opacity:.06}

/* Bouton fantôme sur fond bleu (« Nous contacter ») */
.agence__ghost{padding:0 22px;border:1px solid rgba(255,255,255,.45);background:transparent;color:#fff}
.agence__ghost:hover{background:rgba(255,255,255,.1);color:#fff}

/* En-tête */
.agence__hero-sec{padding:12px var(--gutter-lg) 0}
.agence__hero{position:relative;overflow:hidden;max-width:1420px;margin:0 auto;border-radius:clamp(24px,3vw,36px);background:var(--bleu);color:#fff}
.agence__hero-in{position:relative;display:flex;flex-wrap:wrap;gap:clamp(12px,2vw,24px);padding:clamp(10px,1.4vw,18px)}
.agence__hero-txt{flex:1 1 420px;min-width:0;padding:clamp(20px,4vw,56px) clamp(12px,3vw,40px);display:flex;flex-direction:column;justify-content:center;gap:20px}
.agence__crumb{display:flex;gap:10px;align-items:center;font:400 13.5px/1 var(--sans);color:#fff}
.agence__crumb a{color:#fff;opacity:.8;transition:opacity .2s}
.agence__crumb a:hover{opacity:1;color:#fff}
.agence__crumb-dot{width:4px;height:4px;border-radius:50%;background:var(--sable)}
.agence__h1{font:400 clamp(40px,5.2vw,76px)/.98 var(--serif);letter-spacing:-.015em;color:#fff}
.agence__h1 em{font-style:italic;color:var(--sable)}
.agence__hero-p{max-width:500px;font:400 16.5px/1.6 var(--sans);color:#fff;opacity:.9;text-wrap:pretty}
.agence__hero-btns{display:flex;flex-wrap:wrap;gap:10px;padding-top:6px}
.agence__hero-photo{flex:1.1 1 380px;min-width:0;position:relative;min-height:clamp(260px,34vw,540px);border-radius:clamp(18px,2.2vw,26px);overflow:hidden;background:var(--encre)}
.agence__hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}

/* Histoire */
.agence__histoire{padding-top:clamp(56px,8vw,120px);padding-bottom:clamp(56px,8vw,120px);display:flex;flex-wrap:wrap;gap:clamp(32px,5vw,80px)}
.agence__histoire-txt{flex:1.2 1 420px;min-width:0;display:flex;flex-direction:column;gap:20px}
.agence__p{max-width:600px;font:400 16px/1.7 var(--sans);color:var(--encre-86);text-wrap:pretty}
.agence__timeline{--col:clamp(110px,11vw,160px);flex:1 1 360px;min-width:0;display:flex;flex-direction:column}
.agence__timeline li{display:flex;gap:24px;align-items:baseline;padding:24px 0;border-top:1px solid var(--sable)}
.agence__timeline li:last-child{border-bottom:1px solid var(--sable)}
.agence__year{flex:none;width:var(--col);font:400 clamp(36px,3.6vw,52px)/1 var(--serif);color:var(--bleu);font-variant-numeric:tabular-nums}
/* « Aujourd’hui » fait environ 5,2 fois sa taille de police en largeur : sa taille suit la colonne pour ne jamais déborder sur le texte */
.agence__year--now{font-size:calc(var(--col) / 5.5);line-height:1.1;white-space:nowrap}
.agence__tl-txt{font:400 15.5px/1.55 var(--sans);color:var(--encre)}

/* Têtes de section (équipe, avis) */
.agence__head-row{display:flex;flex-wrap:wrap;gap:20px 64px;align-items:flex-end;justify-content:space-between}
.agence__head-row--avis{gap:24px 64px}
.agence__head{max-width:720px}

/* Équipe */
.agence__equipe-sec{padding:0 var(--gutter-lg)}
.agence__equipe{max-width:1420px;margin:0 auto;border-radius:clamp(24px,3vw,36px);background:var(--creme);padding:clamp(40px,6vw,88px) var(--gutter)}
.agence__equipe-in{max-width:1320px;margin:0 auto}
.agence__call{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px;border-radius:999px;background:var(--encre);color:#fff;font:500 15px/1 var(--sans);white-space:nowrap;transition:background .2s}
.agence__call:hover{background:var(--bleu);color:#fff}
/* 4 colonnes au-delà de 1 000 px de conteneur, 2 entre 520 et 1 000 px, 1 en dessous (formule de la maquette) */
.agence__team{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(25% - 19px,(1000px - 100%) * 999,clamp(50% - 13px,(520px - 100%) * 999,100%)),1fr));gap:clamp(16px,2vw,24px);margin-top:clamp(24px,3.6vw,48px)}
.agence__member{display:flex;flex-direction:column;gap:16px}
.agence__face{position:relative;display:block;width:100%;aspect-ratio:4 / 5;padding:0;border:0;border-radius:24px;overflow:hidden;background:var(--lin);cursor:pointer;isolation:isolate}
.agence__face-in{position:absolute;inset:0;background-size:cover;background-position:50% 25%;transform:scale(1);transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.agence__face-color{position:absolute;inset:0;background-size:cover;background-position:50% 25%;opacity:0;transition:opacity .6s ease}
.agence__face:hover .agence__face-in,.agence__face[aria-pressed="true"] .agence__face-in{transform:scale(1.04)}
.agence__face[aria-pressed="true"] .agence__face-color{opacity:1}
@media (hover:hover){.agence__face:hover .agence__face-color{opacity:1}}
.agence__member-id{display:flex;flex-direction:column;gap:7px;padding:0 4px}
.agence__member-nom{font:400 26px/1.1 var(--serif);color:var(--encre)}
.agence__member-role{font:500 13.5px/1.3 var(--sans);color:var(--bleu)}
.agence__member-bio{padding:0 4px;font:400 14.5px/1.6 var(--sans);color:var(--encre-82);text-wrap:pretty}

/* Valeurs */
.agence__valeurs{padding-top:clamp(56px,8vw,120px)}
/* 3 colonnes au-delà de 780 px de conteneur, 1 en dessous */
.agence__valeurs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(33.33% - 27px,(780px - 100%) * 999,100%),1fr));gap:28px 40px;margin-top:clamp(24px,3.4vw,44px)}
.agence__valeur{display:flex;flex-direction:column;gap:14px;padding-top:24px;border-top:1px solid var(--sable)}
.agence__valeur-t{font:400 30px/1.1 var(--serif);color:var(--encre)}
.agence__valeur-p{font:400 15px/1.65 var(--sans);color:var(--encre-82)}

/* Avis */
.agence__avis{padding-top:clamp(56px,8vw,120px);padding-bottom:clamp(40px,6vw,88px)}
.agence__note{display:flex;align-items:center;gap:18px}
.agence__note-n{font:400 clamp(56px,6vw,84px)/.9 var(--serif);color:var(--encre);font-variant-numeric:tabular-nums}
.agence__note-txt{display:flex;flex-direction:column;gap:8px}
.agence__stars{display:flex;gap:3px;color:var(--bleu)}
.agence__note-l{font:400 14px/1.3 var(--sans);color:rgba(27,43,63,.8)}
.agence__avis-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(33.33% - 9px,(780px - 100%) * 999,100%),1fr));gap:12px;margin-top:clamp(24px,3.4vw,44px)}
.agence__avis-card{display:flex;flex-direction:column;gap:20px;padding:clamp(22px,2.4vw,30px);border-radius:26px;background:var(--creme)}
/* Avis seul sur la dernière ligne (7, 10… avis) : toute la largeur plutôt qu'une carte isolée à gauche */
.agence__avis-grid > :last-child:nth-child(3n+1){grid-column:1/-1}
.agence__avis-q{flex:none}
.agence__avis-card blockquote{margin:0;font:400 16.5px/1.6 var(--sans);color:var(--encre);text-wrap:pretty}
.agence__avis-auteur{margin-top:auto;font:500 14px/1.2 var(--sans);color:var(--bleu)}
.agence__avis-date{display:block;margin-top:5px;font:400 13px/1.3 var(--sans);color:var(--encre-78)}
.agence__avis-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;margin-top:14px}
.agence__avis-note p{flex:1 1 320px;font:400 13.5px/1.55 var(--sans);color:var(--encre-78)}
.agence__avis-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:12px;padding:18px 22px;border-radius:22px;border:1px solid var(--lin)}
.agence__avis-cta > span{flex:1 1 320px;font:400 15px/1.55 var(--sans);color:rgba(27,43,63,.84)}
.agence__btn-md{height:52px;padding:0 6px 0 22px}
.agence__btn-md .btn__circle{width:40px;height:40px}

/* Zone */
.agence__zone{padding-bottom:clamp(56px,8vw,120px)}
.agence__zone-row{display:flex;flex-wrap:wrap;gap:20px 48px;align-items:center;justify-content:space-between;padding-top:clamp(28px,3.4vw,44px);border-top:1px solid var(--lin)}
.agence__zone-t{font:400 clamp(24px,2.6vw,34px)/1.1 var(--serif);color:var(--encre)}
.agence__zone-chips{display:flex;flex-wrap:wrap;gap:8px}
.agence__chip{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--lin);font:400 14px/1 var(--sans);color:var(--encre);white-space:nowrap;transition:border-color .2s,background .2s}
.agence__chip:hover{border-color:var(--sable);background:var(--creme);color:var(--encre)}

/* Appel à l'action */
.agence__cta-sec{padding:0 var(--gutter-lg) var(--gutter-lg)}
.agence__cta{position:relative;overflow:hidden;max-width:1420px;margin:0 auto;border-radius:clamp(24px,3vw,36px);background:var(--bleu);color:#fff}
.agence__cta-in{position:relative;max-width:1320px;margin:0 auto;padding:clamp(40px,6vw,88px) clamp(24px,4vw,64px);display:flex;flex-wrap:wrap;gap:28px 56px;align-items:flex-end;justify-content:space-between}
.agence__cta-txt{flex:1 1 420px;max-width:680px;display:flex;flex-direction:column;gap:16px}
.agence__cta-h2{letter-spacing:-.01em;color:#fff}
.agence__cta-p{max-width:520px;font:400 16px/1.6 var(--sans);color:#fff;opacity:.88}
.agence__cta-btns{display:flex;flex-wrap:wrap;gap:10px}