/* Section « agents » de la home Growth (2026-10-06, agents-integrations/construction.md).
   Feuille externe chargée dans le body, juste avant la section : hors chemin du H1 (LCP), hors budget
   « home CSS inline ». Jetons du design system « Signal clair » (css/base.css). */
.agt-head{display:grid;gap:var(--s-3);max-width:62ch;margin-bottom:var(--stack)}
.agt-grid{display:grid;gap:var(--s-6) var(--s-5);grid-template-columns:minmax(0,1fr)}
.agt-fam-h{font-family:var(--f-mono);font-size:var(--t-meta);font-weight:400;letter-spacing:.02em;text-transform:uppercase;
  color:var(--brand-ink);padding-bottom:var(--s-2);margin-bottom:var(--s-2);border-bottom:1px solid var(--line)}
.agt-fam ul{display:grid;gap:var(--s-1)}
.agt-it{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:var(--s-3);row-gap:2px;align-items:start;
  padding:var(--s-3);margin-inline:calc(-1 * var(--s-3));border-radius:var(--r-3);
  transition:background-color var(--dur-micro,160ms) ease}
.agt-ic{grid-row:1/3;width:40px;height:40px;padding:9px;border-radius:var(--r-3);background:var(--surface);
  border:1px solid var(--line);fill:none;stroke:var(--brand-ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;
  transition:stroke var(--dur-micro,160ms) ease,border-color var(--dur-micro,160ms) ease,transform 200ms ease}
.agt-it b{font-weight:600;font-size:var(--t-4);line-height:1.3;color:var(--ink)}
.agt-it span{font-size:var(--t-5);line-height:1.45;color:var(--ink-2);text-wrap:pretty}
.agt-it:hover{background:var(--surface)}
.agt-it:hover .agt-ic{stroke:var(--brand);border-color:var(--brand);transform:translateY(-1px)}
.agt-rule{margin-top:var(--block);padding-top:var(--s-4);
  border-top:1px solid var(--line);font-size:var(--t-5);color:var(--ink-2)}
.agt-rule .g-ic{display:inline-block;color:var(--brand);margin-right:6px}
.agt-rule a{color:var(--brand-ink);font-weight:600;text-underline-offset:3px}
@media (min-width:600px){.agt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 2026-10-06 (option 2) : ancienne règle 3 colonnes dès 1024 px, remplacée par 2×2 jusqu'à 1199 px :
   @media (min-width:1024px){.agt-grid{grid-template-columns:repeat(3,minmax(0,1fr))}} */
@media (min-width:1200px){
  /* 2026-10-06 (option 2) : ancien repeat(5, ...) pour 5 familles inégales */
  .agt-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-6) var(--s-5)}
  .agt-it{grid-template-columns:minmax(0,1fr);row-gap:var(--s-2);padding:var(--s-3) var(--s-2);margin-inline:calc(-1 * var(--s-2))}
  .agt-ic{grid-row:auto}
}
/* Apparition au scroll, CSS seul (aucun JS) : porte html.motion (posée par le head, absente en
   reduced-motion, saveData, ?static), navigateurs à animation-timeline seulement ; ailleurs, statique.
   Deux éléments en mouvement (en-tête, grille), transform/opacity seulement : CLS 0. */
@keyframes agt-in{from{opacity:0;transform:translateY(16px)}}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){
  .motion .agt-head,.motion .agt-grid{animation:agt-in linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
}}

/* Passe finale (revues design P1-2, P1-3, P3-7) : pictos teintés --brand-ink au repos (ancien : --ink-2) ;
   bouton d'action sous la règle ; sous 600 px, chaque famille devient une rangée qui défile à
   l'horizontale (scroll-snap, aucun JS) : la section passe d'environ 2 250 px à moins de 1 300 px. */
.agt-cta{margin-top:var(--s-5)}
@media (max-width:599px){
  .agt-grid{gap:var(--s-5)}
  .agt-fam ul{grid-auto-flow:column;grid-auto-columns:78%;gap:var(--s-3);overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter,16px);scrollbar-width:none;
    margin-inline:calc(-1 * var(--gutter,16px));padding:2px var(--gutter,16px)}
  .agt-fam ul::-webkit-scrollbar{display:none}
  .agt-it{margin-inline:0;scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);align-content:start}
  .agt-it .agt-ic{grid-row:auto;margin-bottom:var(--s-1)}
  .agt-it{grid-template-columns:minmax(0,1fr)}
  .agt-cta .g-btn{width:100%;justify-content:center}
}

/* 2026-10-06 (fondateur, option 2) : 4 familles × 4 agents. Dès 600 px, chaque famille partage les rangées
   de la grille (subgrid) : titres alignés, cartes de même hauteur d'une colonne à l'autre (4 colonnes en
   1200+, 2×2 en dessous). Sans subgrid : grille simple, comme avant. Point du jour en bandeau sous la grille. */
@media (min-width:600px){@supports (grid-template-rows:subgrid){
  .agt-fam{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:var(--s-1)}
  .agt-fam-h{margin-bottom:var(--s-1);align-self:end}
  .agt-fam ul{grid-row:span 4;grid-template-rows:subgrid}
  .agt-it{height:100%;align-content:start}
}}
.agt-brief{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s-2) var(--s-3);align-items:center;
  margin-top:var(--s-6);padding:var(--s-4);border:1px solid var(--line);border-radius:var(--r-3);
  background:var(--surface);color:inherit;text-decoration:none;transition:border-color var(--dur-micro,160ms) ease}
.agt-brief-t{display:grid;gap:2px}
.agt-brief-t b{font-weight:600;font-size:var(--t-4);line-height:1.3;color:var(--ink)}
.agt-brief-t span{font-size:var(--t-5);line-height:1.45;color:var(--ink-2);text-wrap:pretty}
.agt-brief-go{grid-column:2;display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:var(--t-5);color:var(--brand-ink)}
.agt-brief:hover{border-color:var(--brand)}
.agt-brief:hover .agt-ic{stroke:var(--brand);border-color:var(--brand)}
.agt-brief:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media (min-width:768px){.agt-brief{grid-template-columns:40px minmax(0,1fr) auto}.agt-brief-go{grid-column:auto}}

/* 2026-10-06 : titre de famille lié à sa page mission */
.agt-fam-a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:.35em}.agt-fam-a svg{width:.9em;height:.9em}.agt-fam-a:hover,.agt-fam-a:focus-visible{color:var(--brand-ink);text-decoration:underline;text-underline-offset:3px}