/* ═══ agence · couche propre à la page, sur les jetons du site ═══ */
.ouverture .scene .film{mix-blend-mode:normal;-webkit-mask-image:none;mask-image:none;filter:none}
.ouv-grille .scene{max-width:560px;margin-inline:auto 0}
/* le héros s’affiche tout de suite : pas de voile qui attend le script */
.ag-heros picture{display:contents}
.ag-heros .film{animation:ag-monte .6s var(--gravite) both}
@keyframes ag-monte{from{transform:translateY(10px)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.ag-heros .film{animation:none}}

/* récit : même grammaire que l’accueil (affirmation, sous, fil) */
.ag-recit{padding-block:var(--pas) 0}
.ag-bloc{display:grid;justify-items:center;padding-inline:var(--e-3);text-align:center}
.ag-bloc .imp-mk{display:block;margin-bottom:var(--e-3);color:var(--minium-txt)}
.affirmation{font-family:var(--bg);font-weight:800;line-height:1.02;letter-spacing:-.024em;text-align:center;font-size:clamp(34px,5.6vw,76px);color:var(--encre);text-wrap:balance;max-width:15ch;margin-inline:auto}
.affirmation .mot{display:inline-block}
html.imp-motion .affirmation.attend .mot{opacity:0;transform:translateY(.35em)}
.affirmation.joue .mot{animation:imp-levage-grand var(--d-5) var(--gravite) both;animation-delay:calc(var(--i) * 35ms)}
.ag-recit .affirmation{font-size:clamp(28px,3.9vw,54px);max-width:18ch}
.ag-recit .ag-grand{font-size:clamp(36px,5vw,72px);max-width:12ch}
.sous{font-family:var(--c);font-size:clamp(17px,1.6vw,21px);line-height:1.5;color:var(--encre-2);text-align:center;max-width:44ch;margin:var(--e-4) auto 0;text-wrap:balance}
.fil{display:grid;justify-items:center;margin-block:clamp(24px,4vw,56px)}
.fil .pt{display:block;width:13px;height:13px;border-radius:50%;background:var(--minium)}
.fil .trait{display:block;width:2px;height:clamp(48px,7vw,84px);background:var(--encre);transform-origin:50% 0}
html.imp-motion .fil.attend .trait{transform:scaleY(0)}
.fil.joue .trait{animation:imp-tracage-v var(--d-5) var(--gravite) both}
html.imp-motion .fil.attend .pt{opacity:0}
.fil.joue .pt{animation:imp-allume var(--d-3) linear both}
@keyframes imp-tracage-v{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* traversée : une scène qui tient pendant le scroll, le talent la traverse */
.ag-trav{position:relative}
.trav-piste{padding-block:0 var(--pas)}
.trav-grille{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(var(--e-4),5vw,88px);align-items:center}
.trav-plateau{position:relative}
.trav-plan{position:relative}
.trav-plan img{display:block;width:100%;height:auto}
.trav-plan .trav-chemin{display:none}
.trav-k{display:table;color:var(--encre-2);margin:0 0 var(--e-3)}
.trav-rail{display:none}
.trav-etapes{list-style:none;margin:0;padding:0;display:grid;gap:var(--e-5)}
.trav-relais{display:none}
.trav-relais-t{font-family:var(--bg);font-weight:800;font-size:clamp(24px,2.6vw,38px);line-height:1.1;letter-spacing:-.02em;color:var(--encre);max-width:16ch;text-wrap:balance}
.ag-num{display:block;font-family:var(--m);font-weight:700;font-size:12px;line-height:1;letter-spacing:.2em;color:var(--encre-2);margin-bottom:var(--e-2)}
.ag-t{font-family:var(--bg);font-weight:800;font-size:clamp(28px,3.4vw,48px);line-height:1.02;letter-spacing:-.022em;color:var(--encre);max-width:14ch;text-wrap:balance}
.ag-p{font-family:var(--c);font-size:var(--t-1);line-height:1.55;color:var(--encre-2);margin-top:var(--e-3);max-width:40ch;text-wrap:pretty}
.ag-oui{display:inline-block;margin-top:var(--e-3);font-family:var(--m);font-weight:700;font-size:11px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;color:var(--encre);border-top:2px solid var(--encre);padding-top:10px;max-width:40ch}

/* sans JS : les trois plans et les trois textes se suivent ; avec JS : la scène tient */
.ag-trav.trav-actif .trav-piste{height:380vh;padding:0}
.trav-actif .trav-scene{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;overflow:hidden;padding-top:72px}
.trav-actif .trav-grille{width:min(var(--wrap),100% - 2 * var(--e-4))}
.trav-actif .trav-plateau{aspect-ratio:1100/725}
.trav-actif .trav-plan{position:absolute;inset:0;display:flex;align-items:center;will-change:clip-path,transform,opacity}
.trav-actif .trav-plan .trav-chemin{display:block;position:absolute;left:0;top:50%;transform:translateY(-50%)}
.trav-actif .trav-rail{display:block;position:relative;height:24px;margin-bottom:var(--e-4);max-width:320px}
.trav-rail-fond,.trav-rail-plein{position:absolute;left:6px;right:6px;top:11px;height:2px;background:var(--filet-a)}
.trav-rail-plein{background:var(--encre);transform-origin:0 50%;transform:scaleX(0)}
.trav-rail i{position:absolute;top:5px;width:14px;height:14px;border-radius:50%;background:var(--chaux-h);border:2px solid var(--encre);transform:translateX(-50%);transition:background var(--d-2) var(--gravite),transform var(--d-2) var(--frappe)}
.trav-rail i[data-n="1"]{left:6px;transform:none}
.trav-rail i[data-n="2"]{left:50%}
.trav-rail i[data-n="3"]{left:auto;right:6px;transform:none}
.trav-rail i.passe{background:var(--encre)}
.trav-rail i.ici{background:var(--encre);border-color:var(--encre);box-shadow:0 0 0 3px var(--chaux-h),0 0 0 5px var(--encre)}
.trav-actif .trav-etapes{display:grid;gap:0}
.trav-actif .trav-etape,.trav-actif .trav-relais{grid-area:1/1;will-change:opacity,transform}
.trav-actif .trav-relais{display:block;align-self:center}
@media (max-width:860px){
  .trav-grille{grid-template-columns:1fr;gap:var(--e-3)}
  .ag-trav.trav-actif .trav-piste{height:360vh}
  .trav-actif .trav-scene{align-items:center;padding-top:56px}
  .trav-actif .trav-grille{width:calc(100% - 2 * var(--e-3));gap:var(--e-2)}
  .trav-actif .trav-plateau{width:100%;max-height:50svh;aspect-ratio:1100/725;margin-inline:auto}
  .trav-actif .trav-rail{margin-bottom:var(--e-2)}
  .trav-actif .trav-k{margin-bottom:var(--e-2)}
  .trav-actif .ag-num{margin-bottom:8px}
  .trav-actif .ag-t{font-size:clamp(24px,7vw,30px)}
  .trav-actif .ag-p{font-size:15.5px;margin-top:10px}
  .trav-actif .ag-oui{font-size:10px;margin-top:12px}
  .trav-actif .trav-relais-t{font-size:clamp(22px,6.4vw,28px)}
}
@media (max-width:860px) and (max-height:640px){
  .trav-actif .trav-plateau{max-height:32svh}
  .trav-actif .ag-p{font-size:14.5px}
}

/* viviers */
.ag-viviers{padding-block:var(--pas)}
.ag-viviers .chap-tete{display:grid;gap:var(--e-3);margin-bottom:var(--e-5)}
.ag-viviers .imp-mk{color:var(--minium-txt)}
.ag-cartes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:2px solid var(--encre);background:var(--chaux-h)}
.ag-carte{display:grid;align-content:space-between;gap:var(--e-4);min-height:clamp(150px,13vw,190px);padding:clamp(var(--e-3),2.4vw,var(--e-4))}
.ag-carte + .ag-carte{border-left:2px solid var(--encre)}
.ag-carte-k{font-family:var(--m);font-weight:700;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--minium-txt)}
.ag-carte-t{font-family:var(--bg);font-weight:800;font-size:clamp(22px,2.2vw,30px);line-height:1.06;letter-spacing:-.016em;color:var(--encre);text-wrap:balance}
.ag-carte-libre{background:var(--soir-0)}
.ag-carte-libre .ag-carte-k{color:var(--ocre)}
.ag-carte-libre .ag-carte-t{color:var(--chaux-h)}
.ag-carte-lien{font-family:var(--m);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--chaux-h);text-decoration:none;border-bottom:1.5px solid currentColor;justify-self:start;padding-bottom:4px}
.ag-carte-lien:hover,.ag-carte-lien:focus-visible{color:var(--ocre)}
.ag-note{font-family:var(--c);font-size:14px;color:var(--encre-2);margin-top:var(--e-3)}

/* questions */
.ag-faq{padding-block:var(--pas)}
.ag-faq-grille{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(var(--e-4),6vw,96px);align-items:start}
.ag-faq-tete{position:sticky;top:110px;display:grid;gap:var(--e-3)}
.ag-faq-tete .imp-mk{color:var(--minium-txt)}
.ag-q{border-top:2px solid var(--encre)}
.ag-q details{border-bottom:1px solid var(--filet-a)}
.ag-q summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:auto 1fr auto;gap:var(--e-3);align-items:baseline;padding:var(--e-3) 0;font-family:var(--bg);font-weight:800;font-size:clamp(18px,1.7vw,23px);line-height:1.2;letter-spacing:-.012em;color:var(--encre)}
.ag-q summary::-webkit-details-marker{display:none}
.ag-q summary::before{content:attr(data-n);font-family:var(--m);font-weight:700;font-size:10.5px;letter-spacing:.2em;color:var(--minium-txt)}
.ag-q summary::after{content:"+";font-family:var(--m);font-weight:500;font-size:22px;line-height:1;color:var(--encre);transition:transform var(--d-2) var(--gravite)}
.ag-q details[open] summary::after{transform:rotate(45deg)}
.ag-q summary:focus-visible{outline:2px solid var(--encre);outline-offset:4px}
.ag-q p{font-family:var(--c);font-size:var(--t-1);line-height:1.55;color:var(--encre-2);max-width:56ch;padding:0 0 var(--e-3) calc(var(--e-3) + 2.4ch);margin:0;text-wrap:pretty}

/* formulaire */
.projet[data-chap="chaux-b"] .composer{background:#fff}
.projet .legende{margin-top:var(--e-3);margin-inline:auto;max-width:44ch}
.ag-form fieldset{border:0;margin:0;padding:var(--e-3);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e-3) var(--e-4)}
.ag-form fieldset + fieldset{border-top:1px solid var(--filet-a)}
.ag-form legend{float:left;width:100%;grid-column:1/-1;padding:0;margin:0 0 4px;color:var(--encre)}
.ag-form label{display:grid;gap:4px;min-width:0}
.ag-form input,.ag-form select{font-family:var(--c);font-size:16px;min-height:44px;padding:10px 0;border:0;border-bottom:1.5px solid var(--encre);border-radius:0;background:transparent;color:var(--encre);width:100%}
.ag-form select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:28px;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 6px) 55%;background-size:6px 6px;background-repeat:no-repeat}
.ag-form input:focus-visible,.ag-form select:focus-visible{outline:2px solid var(--encre);outline-offset:2px;border-bottom-color:var(--ocre);border-bottom-width:3px}
.ag-form input::placeholder{color:#6B665E}
.ag-form .composer-pied{border-top:1px solid var(--filet-a)}
.ag-demande .projet-note{max-width:60ch;margin-inline:auto}

@media (max-width:860px){
  .ag-cartes{grid-template-columns:1fr 1fr}
  .ag-carte:nth-child(3){border-left:0}
  .ag-carte:nth-child(n+3){border-top:2px solid var(--encre)}
  .ag-faq-grille{grid-template-columns:1fr}
  .ag-faq-tete{position:static}
  .ag-form fieldset{grid-template-columns:1fr}
}
@media (max-width:520px){
  .ag-cartes{grid-template-columns:1fr}
  .ag-carte + .ag-carte{border-left:0;border-top:2px solid var(--encre)}
  .ag-carte{min-height:0}
  .ag-q p{padding-left:0}
}

/* revue finale 16.10 */
body{overflow-x:clip}
.trav-plan picture{display:contents}
.trav-actif .trav-plan{background:var(--chaux-h)}
.ag-recit .fil-fin{margin-bottom:0}
/* le tampon (scale) d’un marqueur pleine largeur élargissait la page mobile */
.chap-tete .imp-mk,.ag-faq-tete .imp-mk{justify-self:start;width:max-content;max-width:100%}
.ag-bloc .imp-mk,.projet .imp-mk{display:table;margin-left:auto;margin-right:auto}
/* sans JS ou en mouvement réduit : chaque image face à son texte */
.ag-trav:not(.trav-actif) .trav-piste{padding-top:var(--e-5)}
.ag-trav:not(.trav-actif) .trav-grille{align-items:center;row-gap:var(--e-5)}
.ag-trav:not(.trav-actif) :is(.trav-plateau,.trav-texte,.trav-etapes){display:contents}
.ag-trav:not(.trav-actif) .trav-k{grid-column:1/-1;grid-row:1;margin:0}
.ag-trav:not(.trav-actif) .trav-relais{display:block;grid-column:1/-1;grid-row:4;justify-self:center;text-align:center;list-style:none}
.ag-trav:not(.trav-actif) .trav-relais-t{margin-inline:auto}
.ag-trav:not(.trav-actif) .trav-plan{grid-column:1}
.ag-trav:not(.trav-actif) .trav-etape{grid-column:2}
.ag-trav:not(.trav-actif) [data-plan="1"],.ag-trav:not(.trav-actif) [data-etape="1"]{grid-row:2}
.ag-trav:not(.trav-actif) [data-plan="2"],.ag-trav:not(.trav-actif) [data-etape="2"]{grid-row:3}
.ag-trav:not(.trav-actif) [data-plan="3"],.ag-trav:not(.trav-actif) [data-etape="3"]{grid-row:5}
@media (max-width:860px){
  .ag-trav:not(.trav-actif) .trav-grille{row-gap:var(--e-3)}
  .ag-trav:not(.trav-actif) :is(.trav-plan,.trav-etape){grid-column:1}
  .ag-trav:not(.trav-actif) [data-plan="1"]{grid-row:2}.ag-trav:not(.trav-actif) [data-etape="1"]{grid-row:3}
  .ag-trav:not(.trav-actif) [data-plan="2"]{grid-row:4}.ag-trav:not(.trav-actif) [data-etape="2"]{grid-row:5}
  .ag-trav:not(.trav-actif) .trav-relais{grid-row:6}
  .ag-trav:not(.trav-actif) [data-plan="3"]{grid-row:7}.ag-trav:not(.trav-actif) [data-etape="3"]{grid-row:8}
  .ag-trav:not(.trav-actif) .trav-etape{margin-bottom:var(--e-5)}
}

/* le talent qu’on vous présente : la triade et la comparaison */
.ag-triade span{display:block}
.ag-triade span:nth-child(3){color:var(--ocre)}
.ag-eng .diff-tete{align-items:end}
.ag-compare{margin-top:var(--e-5)}
.ag-compare table{width:100%;border-collapse:collapse;table-layout:fixed}
.ag-compare .diff-methode-k{color:var(--ocre);margin-bottom:var(--e-3)}
.ag-compare thead th{font-family:var(--m);font-weight:700;font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-align:left;padding:0 var(--e-3) 12px 0;color:var(--chaux-o)}
.ag-compare thead th:last-child{color:var(--chaux-h)}
.ag-compare tbody tr{border-top:1px solid var(--filet-a-soir)}
.ag-compare tbody tr:last-child{border-bottom:1px solid var(--filet-a-soir)}
.ag-compare tbody th{font-family:var(--m);font-weight:500;font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-align:left;color:var(--chaux-o);padding:var(--e-3) var(--e-3) var(--e-3) 0;vertical-align:top;width:24%}
.ag-compare tbody td{font-family:var(--c);font-size:var(--t-1);line-height:1.45;color:var(--chaux-o);padding:var(--e-3) var(--e-3) var(--e-3) 0;vertical-align:top;opacity:.75}
.ag-compare tbody td:last-child{font-family:var(--bg);font-weight:800;font-size:clamp(19px,1.8vw,24px);line-height:1.15;letter-spacing:-.012em;color:var(--chaux-h);opacity:1}
.ag-compare thead td{width:24%}
@media (max-width:860px){
  .ag-compare thead{display:none}
  .ag-compare table,.ag-compare tbody,.ag-compare tr,.ag-compare th,.ag-compare td{display:block;width:auto}
  .ag-compare tbody th{padding:var(--e-3) 0 8px;width:auto}
  .ag-compare tbody td{padding:0 0 8px}
  .ag-compare tbody td:last-child{padding-bottom:var(--e-3)}
  .ag-compare tbody td::before{display:block;font-family:var(--m);font-weight:700;font-size:10px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:4px;opacity:.8}
  .ag-compare tbody td:nth-of-type(1)::before{content:"Cabinet classique"}
  .ag-compare tbody td:nth-of-type(2)::before{content:"L’Agence";color:var(--ocre)}
}

/* formulaire simplifié : un poste, trois coordonnées */
.ag-form-champs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--e-3) var(--e-4);padding:var(--e-3)}
.ag-form-champs .ag-plein{grid-column:1/-1}
.ag-form-champs label{display:grid;gap:4px;min-width:0}
.ag-form-champs input{font-family:var(--c);font-size:16px;min-height:44px;padding:10px 0;border:0;border-bottom:1.5px solid var(--encre);border-radius:0;background:transparent;color:var(--encre);width:100%}
.ag-form-champs input:focus-visible{outline:2px solid var(--encre);outline-offset:2px;border-bottom-color:var(--ocre);border-bottom-width:3px}
.ag-form-champs input::placeholder{color:#6B665E}
@media (max-width:640px){.ag-form-champs{grid-template-columns:1fr}}