/* ==========================================================================
   Algo Data · charte Éditeur v1.1 · ad-societe-v2.css
   Mise en scène « encre et lin » de la page Entreprise (/societe), 25/10/2026
   (v1.1/MISE-EN-SCENE.md, §9 bis : page transversale, aucun univers de produit
   en décor). Palette neutre, identique à celle de la Plateforme ADNS (pf3) :
   la page parle de toute la maison, pas d'un seul produit. Se charge après
   ad-gipco-v3.css (squelette gp-*, classes .card/.hd/.row/.pill/.ft/.pan/
   .gp-scene partagées), main="gp2 se3". Texte inchangé : seuls les objets
   (aria-hidden, role="img") illustrent.
   Requêtes écrites en max-width : aucun « < » dans la feuille.
   ========================================================================== */

main.se3 { --se-encre:#15171a; --se-nuit:#1e2125; --se-neige:#f6f5f2; --se-sable:#ebe9e3;
           --se-clair:#e8e6e0; --se-ombre:21,23,26; background:var(--se-neige); }
main.se3 .gp-encre, main.se3 .gp-hero, main.se3 .gp-fin { background:var(--se-encre); }
main.se3 .gp-nuit { background:var(--se-nuit); }
main.se3 .gp-clair { background:var(--se-neige); }
main.se3 .gp-sable { background:var(--se-sable); }

/* 1. Haut de page et fin : la photo propre à la page -------------------------------------------- */
main.se3 .gp-photo { background-image:url(/images/societe-v1/heros-1920.webp); background-position:center 38%; }
main.se3 .gp-voile { background:linear-gradient(90deg,rgba(var(--se-ombre),.62),rgba(var(--se-ombre),.3) 40%,rgba(var(--se-ombre),0) 56%),
                                linear-gradient(180deg,rgba(var(--se-ombre),.45),rgba(var(--se-ombre),0) 16%,rgba(var(--se-ombre),0) 70%,rgba(var(--se-ombre),.6) 100%); }
main.se3 .gp-photo--fin { background-image:url(/images/societe-v1/fin-1600.webp); background-position:center 50%; transform:none; filter:none; }
main.se3 .gp-voile--fin { background:linear-gradient(90deg,rgba(var(--se-ombre),.05),rgba(var(--se-ombre),.4) 45%,rgba(var(--se-ombre),.82) 100%); }
@media (max-width:760px) {
  main.se3 .gp-photo { background-image:url(/images/societe-v1/heros-900.webp); background-position:72% 40%; }
  main.se3 .gp-photo--fin { background-image:url(/images/societe-v1/fin-900.webp); background-position:70% 50%; }
  main.se3 .gp-voile { background:linear-gradient(180deg,rgba(var(--se-ombre),.5) 0%,rgba(var(--se-ombre),.12) 28%,rgba(var(--se-ombre),.72) 56%,rgba(var(--se-ombre),1) 100%); }
  main.se3 .gp-voile--fin { background:linear-gradient(180deg,rgba(var(--se-ombre),.2),rgba(var(--se-ombre),.92) 50%); }
}

/* 2. L'ouverture : un seul objet, la demande de l'assistant, posée sur le plateau --------------- */
/* trois paragraphes (plus que les autres pages mises en scène) : le haut de page respire en hauteur
   plutôt que de couper le texte ; l'objet reste au premier plan, bas et à droite, sans recouvrir le texte */
main.se3 .gp-hero { height:auto; padding:168px 0 72px; }
main.se3 .gp-hero__in { padding-top:0; display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:40px; }
/* trois paragraphes : un corps de titre plus mesuré que les autres pages (un seul grand mot-clé),
   pour que les deux lignes voulues (les deux span) tiennent sans sous-couper chacune à son tour */
main.se3 .gp-hero h1 { font-size:clamp(2rem, 1.2rem + 2.4vw, 3rem); line-height:1.08; }
main.se3 .gp-hero h1 > span { display:block; }
main.se3 .gp-hero__t { width:min(700px,58%); display:grid; gap:18px; }
main.se3 .gp-hero__t p { margin:0; }
main.se3 .gp-hs { height:auto; }
main.se3 .gp-hero__scene { position:relative; top:auto; right:auto; width:auto; margin:0; flex:none; }
main.se3 .se-assist { width:min(372px,78vw); padding-bottom:2px; }
@media (max-width:960px) {
  /* la carte repasse sous le texte, pleine largeur ; plus de ligne forcée dans le titre */
  main.se3 .gp-hero__in { flex-direction:column; align-items:stretch; gap:32px; }
  main.se3 .gp-hero__t { width:auto; max-width:46rem; }
  main.se3 .gp-hero h1 { font-size:clamp(1.75rem, 1.1rem + 3.4vw, 2.5rem); }
  main.se3 .gp-hero h1 > span { display:inline; }
  main.se3 .gp-hero__scene { width:100%; }
  main.se3 .se-assist { width:100%; max-width:420px; }
}
main.se3 .se-assist__q { padding:16px 20px 4px; font-size:14px; line-height:1.5; font-style:italic; color:var(--gp-texte); }
main.se3 .se-assist__comp { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:12px 20px 16px; border-top:1px solid #f2f1ed; }
main.se3 .se-assist__label { font-size:11.5px; font-weight:600; color:var(--gp-doux); text-transform:uppercase; letter-spacing:.04em; margin-right:2px; }
main.se3 .se-chip { display:inline-flex; align-items:center; padding:5px 10px; border-radius:999px; background:#f1f0ec; color:var(--gp-texte); font-size:11.5px; font-weight:600; white-space:nowrap; }
main.se3 .se-n { display:flex; align-items:baseline; gap:12px; padding:14px 20px 10px; border-top:1px solid #f2f1ed; }
main.se3 .se-n b { font:600 36px/1 var(--gp-titre); letter-spacing:-.03em; color:var(--gp-encre); font-variant-numeric:tabular-nums; }
main.se3 .se-n span { font-size:12px; color:var(--gp-doux); }

/* 3. Section IA : trois temps posés sur un aplat clair, reliés par un fil simple ----------------- */
main.se3 .pan.se-clair { background:radial-gradient(ellipse 70% 80% at 92% 0%,rgba(255,255,255,.95),rgba(255,255,255,0) 60%),var(--se-clair);
                         box-shadow:inset 0 0 0 1px rgba(var(--se-ombre),.08); border-radius:12px; }
main.se3 .gp-sable .pan.se-clair { background:radial-gradient(ellipse 70% 80% at 92% 0%,rgba(255,255,255,.9),rgba(255,255,255,0) 60%),#f3f2ee; }
main.se3 .se-clair .card { box-shadow:0 0 0 1px rgba(var(--se-ombre),.08),-6px 14px 28px -14px rgba(var(--se-ombre),.3),-18px 36px 70px -34px rgba(var(--se-ombre),.3); }
main.se3 .se-fil { position:absolute; left:0; top:0; width:0; border-left:1.5px dashed rgba(var(--se-ombre),.3); }
main.se3 .se-fil::before, main.se3 .se-fil::after { content:""; position:absolute; left:-3.5px; width:8px; height:8px; border-radius:50%; background:var(--gp-soleil); box-shadow:0 0 0 3px var(--se-clair); }
main.se3 .se-fil::before { top:-4px; } main.se3 .se-fil::after { bottom:-4px; }
/* titres de section : des lignes réparties plutôt qu'un mot seul livré à lui-même */
main.se3 .gp-cas__t h2, main.se3 .gp-fin__t h2 { text-wrap:balance; }
main.se3 .se-pas .hd { padding:14px 18px; }
main.se3 .se-pas__texte { padding:14px 18px 16px; font-size:14px; line-height:1.5; font-style:italic; color:var(--gp-texte); }

/* 4. Section terrain : la photo du carnet, un seul objet (planning), sur un coin calme ----------- */
main.se3 .pan.se-photo { aspect-ratio:612 / 600; background:var(--se-encre); border-radius:12px; position:sticky; top:32px; }
main.se3 .se-photo .se-ph { position:absolute; inset:0; }
main.se3 .se-photo .se-ph > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:62% 38%; }
main.se3 .se-photo .se-ph::after { content:""; position:absolute; inset:0; pointer-events:none;
                                   background:linear-gradient(200deg,rgba(var(--se-ombre),0) 40%,rgba(var(--se-ombre),.4) 100%); }
main.se3 .se-photo .se-ph__obj { position:absolute; z-index:2; right:6%; bottom:7%; width:min(280px,52%); }
main.se3 .se-photo .card { box-shadow:0 0 0 1px rgba(0,0,0,.06),-10px 22px 44px -14px rgba(0,0,0,.55),-30px 50px 100px -30px rgba(0,0,0,.5); }

/* 5. Section éditeur : le chiffre « 1994 », une phrase, trois lignes sans emphase excessive ------ */
main.se3 .pan.se-preuve { aspect-ratio:auto; background:#fff; border-radius:12px; box-shadow:-10px 28px 60px -30px rgba(0,0,0,.5); }
main.se3 .se-c { padding:40px 40px 36px; color:var(--gp-texte); text-align:left; }
main.se3 .se-c__n { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; }
main.se3 .se-c__n b { font:600 clamp(80px,9vw,128px)/.86 var(--ad-police-titre); letter-spacing:-.04em; color:var(--gp-encre); font-variant-numeric:tabular-nums; }
main.se3 .se-c__n span { font:600 19px/1.2 var(--gp-titre); letter-spacing:-.01em; }
main.se3 .se-c__sur { margin-top:16px; font-size:15px; line-height:1.55; color:var(--gp-doux); max-width:30em; }
main.se3 .se-c__sur b { color:var(--gp-texte); font-weight:600; }
main.se3 .se-c__liste { position:relative; margin-top:24px; border-radius:12px; box-shadow:0 0 0 1px rgba(var(--se-ombre),.1); }
main.se3 .se-c__liste .row:first-child { border-top:0; }

/* 5 bis. La bande de fin : la citation de 2005 en grand, la phrase forte, les deux boutons --------- */
main.se3 .gp-fin__t p.se-citation { position:relative; margin:28px 0; padding-top:28px; 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.12; font-weight:560; letter-spacing:-.024em; color:#fff; text-wrap:balance; }
main.se3 .gp-fin__t p.se-citation::before { content:""; position:absolute; left:0; top:0; width:48px; height:3px; border-radius:2px; background:var(--gp-soleil); }
main.se3 .gp-fin__t p.gp-ben { margin-top:22px; padding-top:18px; border-top:1px solid rgba(255,255,255,.22); color:#fff; font-weight:500; }
main.se3 .se-actions { display:flex; flex-wrap:wrap; gap:14px 18px; margin-top:28px; }

/* 6. Survols (≤ 150 ms, couleur seulement) ------------------------------------------------------- */
@media (hover:hover) { main.se3 .se-pas { transition:box-shadow .12s ease; } }

/* 7. Tailles intermédiaires et téléphone --------------------------------------------------------- */
@media (max-width:1100px) {
  main.se3 .se-assist { width:min(340px,80vw); }
}
@media (max-width:960px) {
  main.se3 .pan.se-photo { position:relative; top:auto; }
}
@media (max-width:640px) {
  main.se3 .pan.se-photo, main.se3 .pan.se-preuve { width:100%; max-width:612px; }
  main.se3 .pan.se-photo { aspect-ratio:auto; display:flex; flex-direction:column; }
  main.se3 .se-photo .se-ph { position:relative; inset:auto; width:100%; aspect-ratio:4 / 3; min-height:240px; flex:none; }
  main.se3 .se-photo .se-ph__obj { position:relative; right:auto; bottom:auto; width:auto; margin:-56px 16px 18px; }
  main.se3 .se-c { padding:28px 20px 24px; }
  main.se3 .se-c__n span { font-size:17px; }
  main.se3 .se-assist { width:100%; max-width:360px; }
}
