/* ==========================================================================
   Algo Data · charte Éditeur v1.1 · ad-societe.css
   La page Entreprise (/societe), rédactionnel d'Antoine du 08/10/2026
   (08_contenu/briefs/societe-redactionnel-v2-antoine-2026-10-09.md). Se charge après ad-4d.css, dont elle
   reprend la grammaire (ouverture, strates, colonnes sous filet, bande de nuit, encadré, bande d'encre) :
   la page parle la même langue que l'Ingénierie et l'Expertise 4D. Ne sert qu'à cette page.
   Un texte de conviction : la mise en page donne le rythme (une bande par idée) et met en avant les
   phrases que le rédactionnel écrit en gras ; les deux appels à l'action ferment la bande d'encre.
   Dessins décoratifs, sans aucun texte : les générations posées sur un même socle, le planning des
   salles, la planète. Requêtes écrites en max-width : aucun « < » dans la feuille.
   ========================================================================== */

/* 0. Colonnes de texte : l'espace entre paragraphes est celui de la grille ------------------- */
.ad-soc-corps { display: grid; gap: var(--ad-e-5); align-content: start; }
.ad-soc-corps > .ad-texte + .ad-texte { margin-top: 0; }
.ad-soc-corps > p { text-wrap: pretty; }
.ad-soc-corps > .ad-chapeau { color: var(--ad-texte); }
/* les phrases que le rédactionnel met en gras : au corps d'un titre, sous un filet d'encre */
.ad-soc-affirmation { margin-top: var(--ad-e-3); padding-top: var(--ad-e-5); border-top: 2px solid var(--ad-texte); font-family: var(--ad-police-titre);
                      font-feature-settings: var(--ad-titre-fonctions); font-size: clamp(1.5rem, 1.25rem + .9vw, 2.125rem); line-height: 1.16;
                      font-weight: 560; letter-spacing: -0.02em; color: var(--ad-texte); text-wrap: balance; }

/* 1. Ouverture : le titre en deux temps, la conviction, les générations ---------------------- */
.ad-soc-ouverture .ad-4d-tete__texte > p { max-width: 40rem; text-wrap: pretty; }
.ad-soc-conviction { font-weight: 560; color: var(--ad-texte); }
.ad-soc-generations__tete { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px solid var(--ad-ui-perle); }
.ad-soc-generations__tete i { display: block; height: 8px; border-radius: 4px; background: var(--ad-ui-filet-fort); }
.ad-soc-generations__tete i:nth-of-type(1) { width: 28%; }
.ad-soc-generations__tete i:nth-of-type(2) { width: 14%; margin-left: auto; background: var(--ad-ui-perle); }
.ad-soc-point { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--ad-planete);
                box-shadow: 0 0 0 1px rgba(17, 17, 18, .18) inset; }
/* sans libellés : la colonne des noms disparaît, les pistes prennent la largeur */
.ad-soc-generations .ad-4d-strates__corps { --lab: 0px; --cg: 0px; --h: 28px; row-gap: 12px; padding: 22px 0 20px; }
.ad-soc-generations .ad-4d-version { top: -12px; bottom: 6px; }
.ad-soc-generations .ad-4d-version::before { top: 0; }
.ad-soc-generations .ad-4d-strates__jour { top: 8px; bottom: 6px; }
.ad-soc-generations .ad-4d-strates__demain { top: 10px; bottom: 8px; }
/* du socle vers le haut : les métiers (encre), les logiciels, les services en ligne, l'IA (surlignage) */
.ad-soc-piste--metiers { --seg: var(--ad-ui-encre); }
.ad-soc-piste--logiciels { --seg: var(--ad-ui-ardoise); }
.ad-soc-piste--enligne { --seg: var(--ad-ui-filet-fort); }
.ad-soc-piste--ia { --seg: var(--ad-surlignage); }
@container ad-4d-feuille (max-width: 470px) {
  .ad-soc-generations .ad-4d-strates__corps { --h: 22px; row-gap: 9px; }
}
@media (prefers-reduced-motion: no-preference) {
  /* les couches se posent du socle vers le haut, dans l'ordre où elles sont nées */
  .ad-soc-generations .ad-soc-piste--metiers .ad-4d-seg { animation-delay: .2s; }
  .ad-soc-generations .ad-soc-piste--logiciels .ad-4d-seg { animation-delay: .34s; }
  .ad-soc-generations .ad-soc-piste--enligne .ad-4d-seg { animation-delay: .5s; }
  .ad-soc-generations .ad-soc-piste--ia .ad-4d-seg { animation-delay: .72s; }
  .ad-soc-generations .ad-4d-seg.is-demain { animation: ad-4d-apparait .5s ease-out 1.05s backwards; }
}

/* 2. La recherche au contact du réel : le titre et le planning des salles à gauche (collants) ---- */
.ad-soc-terrain__tete { gap: clamp(28px, 3vw, 44px); }
@media (min-width: 961px) { .ad-soc-terrain__tete, .ad-soc-ia__grille .ad-4d-probleme__texte { position: sticky; top: var(--ad-e-8); } }
.ad-soc-planning { max-width: 420px; }
.ad-soc-planning__dessin { display: block; width: 100%; height: auto; }
.ad-soc-planning .p-fond { fill: var(--ad-surface); stroke: var(--ad-filet-fort); }
.ad-soc-planning .p-ligne { fill: none; stroke: var(--ad-filet); stroke-width: 1; }
.ad-soc-planning .p-col { fill: none; stroke: var(--ad-filet); stroke-width: 1; stroke-dasharray: 2 4; }
.ad-soc-planning .p-jour { fill: var(--ad-filet); }
.ad-soc-planning .p-salle { fill: var(--ad-filet-fort); }
.ad-soc-planning .p-confirme { fill: var(--ad-texte); }
.ad-soc-planning .p-confirme--doux { fill: var(--ad-texte-doux); }
.ad-soc-planning .p-ecartee { fill: none; stroke: var(--ad-texte-discret); stroke-width: 1.25; stroke-dasharray: 4 3; }
.ad-soc-planning .p-rature { fill: none; stroke: var(--ad-texte-discret); stroke-width: 1.25; }
.ad-soc-planning .p-option { fill: var(--ad-surlignage); stroke: var(--ad-texte); stroke-width: 1; }
.ad-soc-planning .p-montage { fill: var(--ad-fond-alt); stroke: var(--ad-filet-fort); stroke-width: 1; }
.ad-soc-planning .p-astre { fill: var(--ad-planete); }
/* les gestes du métier : la phrase qui scande, un ton au-dessus du texte */
/* la planète en pastille, comme l'encart de Mail-ADNS : le soleil n'est jamais un filet sur fond clair (DESIGN §1.2, passe Impeccable du 09/10) */
.ad-soc-gestes { position: relative; padding-left: var(--ad-e-6); color: var(--ad-texte); font-weight: 500; }
.ad-soc-gestes::before { content: ""; position: absolute; left: 2px; top: calc(.8em - 5px); width: 10px; height: 10px; border-radius: 50%; background: var(--ad-planete); }

/* 3. L'esprit de recherche et la responsabilité de l'éditeur : l'encadré de l'Ingénierie ------- */
.ad-soc-editeur__titre { max-width: 12em; text-wrap: balance; }
@media (min-width: 961px) { .ad-soc-editeur .ad-4d-esn__texte { position: sticky; top: var(--ad-e-8); } }
/* le passage vers l'ingénierie : la dernière phrase de l'encadré, sous un filet */
.ad-soc-relais { padding-top: var(--ad-e-5); border-top: 1px solid var(--ad-filet-fort); color: var(--ad-texte); }

/* 4. L'IA et ses perspectives : la bande de nuit, juste après l'ouverture --------------------- */
/* colonnes égales : le titre, long, tient en trois lignes à 1 440 px (quatre en 5/12) */
@media (min-width: 961px) { .ad-soc-ia__grille { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); } }
.ad-soc-ia .ad-titre-2 { max-width: 13em; text-wrap: balance; }
.ad-soc-ia .ad-soc-gestes { color: var(--ad-texte); }
/* le tournant de l'encadré : une phrase courte, un ton au-dessus */
.ad-soc-pivot { color: var(--ad-texte); font-weight: 600; }

/* 5. Depuis 1994 : la bande d'encre ferme la page ; la citation de 2005 au corps d'un titre ----- */
.ad-soc-final { align-items: start; }
.ad-soc-final__texte { display: grid; gap: var(--ad-e-4); max-width: 44rem; }
.ad-soc-final__texte > p { text-wrap: pretty; }
.ad-soc-final .ad-titre-2 { margin-bottom: var(--ad-e-2); text-wrap: balance; }
.ad-soc-final .ad-soc-citation { position: relative; margin: var(--ad-e-3) 0; padding-top: var(--ad-e-6); font-family: var(--ad-police-titre);
                                 font-feature-settings: var(--ad-titre-fonctions); font-size: clamp(1.75rem, 1.2rem + 1.9vw, 2.75rem); line-height: 1.1;
                                 font-weight: 560; letter-spacing: -0.024em; color: var(--ad-encre-texte); text-wrap: balance; }
.ad-soc-final .ad-soc-citation::before { content: ""; position: absolute; left: 0; top: 0; width: 56px; height: 3px; border-radius: 2px; background: var(--ad-planete); }
.ad-soc-final .ad-soc-final__chute { color: var(--ad-encre-texte); font-weight: 500; }
/* la phrase en gras du rédactionnel, dans la bande d'encre : filet du soleil, texte clair */
.ad-soc-final .ad-soc-affirmation { margin-top: var(--ad-e-4); border-top-color: var(--ad-planete); color: var(--ad-encre-texte);
                                    font-size: clamp(1.375rem, 1.15rem + .8vw, 1.875rem); }
@media (min-width: 641px) { .ad-soc-final .ad-fin__astre { align-self: center; } }

/* 6. Tailles intermédiaires et téléphone ------------------------------------------------------- */
@media (max-width: 960px) {
  .ad-soc-planning { max-width: 360px; }
}
@media (max-width: 640px) {
  .ad-soc-h1 > span { display: inline; }
  /* dans la bande d'encre, plus étroite : le titre de fin en trois lignes, pas quatre */
  .ad-soc-final .ad-titre-2 { font-size: 1.625rem; }
  .ad-soc-gestes { padding-left: var(--ad-e-4); }
}
