/* ================================================================
   ASHLEYTAIEB.COM — V2 · rebuild profond · 2026-07-07
   Système visuel AT 2026 (sources : design_system_2026, verrouillé)
   Palette v1.1 · quatuor Atipo · trait fluo V4 (« il coupe, il
   n'habille pas ») · portes tonales · matières « autorité calme ».
   Corrections retours Ashley 03/07 : fond plus sharp, fluo visible
   (événements sur fond sombre en priorité), wordmark agrandi,
   numérotation lisible (chapitres nommés), grain réduit.
   Robustesse sans JS : tout le contenu est visible par défaut —
   les états masqués n'existent que sous html.js (GEO/print).
   ================================================================ */

/* ---------- Fonts (licence desktop — licence WEB Atipo à acquérir avant mise en ligne publique) ---------- */
@font-face { font-family:'Safiro'; src:url('../fonts/Safiro-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Safiro'; src:url('../fonts/Safiro-Medium.otf') format('opentype'); font-weight:500; font-display:swap; }
@font-face { font-family:'Safiro'; src:url('../fonts/Safiro-SemiBold.otf') format('opentype'); font-weight:600; font-display:swap; }
@font-face { font-family:'Argesta'; src:url('../fonts/ArgestaDisplay-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Argesta'; src:url('../fonts/ArgestaDisplay-Italic.otf') format('opentype'); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:'Nudica'; src:url('../fonts/Nudica-Light.otf') format('opentype'); font-weight:300; font-display:swap; }
@font-face { font-family:'Nudica'; src:url('../fonts/Nudica-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Nudica'; src:url('../fonts/Nudica-Medium.otf') format('opentype'); font-weight:500; font-display:swap; }
@font-face { font-family:'Mg12'; src:url('../fonts/Mg12-Regular.otf') format('opentype'); font-weight:400; font-display:swap; }
@font-face { font-family:'Mg12'; src:url('../fonts/Mg12-Medium.otf') format('opentype'); font-weight:500; font-display:swap; }

/* ---------- Palette v1.1 ---------- */
:root{
  --blanc-galerie:#FFFFFF; /* blanc galerie plein — retour Ashley 07/07 « le site manque de lumière, le fond est gris » (historique : #FCFCFA le 03/07, source DA #F7F7F5 — écart assumé, re-tranchable) */
  --vert-nuit:#0E1A17;
  --charbon:#1C1C1C;
  --ivoire:#EBEDEA;
  --brume:#9A9A9A;
  --fluo:#EAFF3F;
  --vert-anglais:#1F3528;   /* Le Cabinet AT */
  --indigo:#0F1F3D;         /* addiction society */
  --safiro:'Safiro',Georgia,serif;
  --argesta:'Argesta',Georgia,serif;
  --nudica:'Nudica',-apple-system,'Helvetica Neue',sans-serif;
  --mg12:'Mg12','SF Mono',monospace;
  --max:1200px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
::selection{background:var(--vert-nuit);color:var(--fluo);}
body{
  font-family:var(--nudica);font-weight:300;font-size:17px;line-height:1.75;
  color:var(--charbon);background:var(--blanc-galerie);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
/* Matière — papier, grain fin (réduit 03/07 puis 07/07 : « le grain grisait tout », « manque de lumière ») */
body::after{
  content:'';position:fixed;inset:0;pointer-events:none;z-index:98;opacity:.011;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* ---------- Typo — rôles (Major Third, transposée écran, échelle montée V2) ---------- */
h1,.h1{font-family:var(--argesta);font-style:italic;font-weight:400;font-size:clamp(2.9rem,7vw,6.4rem);line-height:1.04;letter-spacing:-.015em;text-wrap:balance;}
h2,.h2{font-family:var(--argesta);font-weight:400;font-size:clamp(1.9rem,3.6vw,3.1rem);line-height:1.16;text-wrap:balance;}
h3,.h3{font-family:var(--safiro);font-weight:500;font-size:1.3rem;line-height:1.35;}
.h2-it{font-style:italic;}
.kicker{font-family:var(--mg12);font-weight:500;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--brume);}
.citation{font-family:var(--argesta);font-style:italic;font-size:clamp(1.7rem,3.4vw,2.8rem);line-height:1.32;text-wrap:balance;}
.legende{font-family:var(--mg12);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brume);}
.grand-lead{font-family:var(--argesta);font-size:clamp(1.25rem,2vw,1.55rem);line-height:1.5;}

/* Cascade — phrases courtes, le blanc fait partie du sens */
.cascade p{margin-bottom:1.35em;max-width:34em;}
.cascade p.seule{font-family:var(--safiro);font-weight:500;font-size:1.18em;line-height:1.5;}

/* ---------- Fluo V4 — un événement par écran, il coupe ---------- */
.pf{color:var(--fluo);}
.gf{color:var(--fluo);font-style:normal;}
/* Trait vertical suspendu — 1px sur sombre, 1.5px sur clair. Sur fond clair il est doublé
   d'une ombre d'encre 1px pour rester perceptible (retour 03/07 « on ne le voit pas »). */
.trait-v{display:block;width:1.5px;height:clamp(80px,16vh,150px);background:var(--fluo);margin-bottom:1.9rem;box-shadow:1px 0 0 rgba(14,26,23,.14);}
.dark .trait-v,.hero .trait-v,.cabinet-fond .trait-v,.society-fond .trait-v{width:1px;box-shadow:none;}
html.js .trait-v{transform-origin:top;animation:pousse 1.1s var(--ease) both;}
@keyframes pousse{from{transform:scaleY(0);}to{transform:scaleY(1);}}
/* Numérotation slash fluo (usage 2/4) */
.num{font-family:var(--mg12);font-size:.72rem;letter-spacing:.2em;color:var(--brume);}
.num .slash{color:var(--fluo);text-shadow:0 0 1px rgba(14,26,23,.2);}
.dark .num .slash,.cabinet-fond .num .slash,.society-fond .num .slash{text-shadow:none;}

/* ---------- Wordmarks ---------- */
.wm-ashley{font-family:var(--safiro);font-weight:600;letter-spacing:.01em;text-transform:lowercase;}
.wm-ashley .pf{margin-left:.3em;}
.wm-cabinet{font-family:var(--safiro);font-weight:500;}
.wm-society{font-family:var(--safiro);font-weight:500;text-transform:lowercase;}
.mention-fondateur{font-family:var(--mg12);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;}
.mention-fondateur .nom{font-family:var(--safiro);font-weight:500;text-transform:none;letter-spacing:.04em;font-size:.78rem;}

/* ---------- Nav — wordmark en majesté (retour Ashley : le mettre en valeur) ---------- */
nav.site{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:1.15rem 4vw;
  background:color-mix(in srgb,var(--blanc-galerie) 90%,transparent);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(28,28,28,.07);
  transition:padding .35s var(--ease),background .3s;
}
html.js nav.site.compacte{padding-top:.65rem;padding-bottom:.65rem;}
nav.site .brand{display:inline-flex;flex-direction:column;gap:.2rem;color:var(--charbon);text-decoration:none;line-height:1.02;}
nav.site .brand .wm-ashley{font-size:2rem;transition:font-size .35s var(--ease);}
html.js nav.site.compacte .brand .wm-ashley{font-size:1.5rem;}
nav.site .brand-sub{font-family:var(--mg12);font-size:.52rem;letter-spacing:.22em;text-transform:uppercase;color:var(--brume);}
nav.site ul{display:flex;gap:2.1rem;list-style:none;align-items:center;}
nav.site ul a{
  font-family:var(--mg12);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--charbon);text-decoration:none;padding-bottom:3px;border-bottom:2px solid transparent;
  transition:border-color .25s;
}
nav.site ul a:not(.cta):hover,nav.site ul a.actif:not(.cta){border-bottom-color:var(--fluo);}
nav.site .cta{
  font-family:var(--safiro);font-weight:500;font-size:.84rem;letter-spacing:.02em;text-transform:none;
  border:1px solid var(--charbon);border-radius:100px;padding:.55rem 1.35rem;
  transition:all .25s;border-bottom-width:1px!important;
}
nav.site .cta:hover{background:var(--vert-nuit);color:var(--blanc-galerie);border-color:var(--vert-nuit);}
nav.site .burger{display:none;background:none;border:none;cursor:pointer;font-family:var(--mg12);font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--charbon);padding:.4rem 0;}
@media(max-width:920px){
  nav.site .burger{display:block;}
  nav.site ul{display:none;}
  nav.site.ouvert ul{
    display:flex;flex-direction:column;gap:1.5rem;align-items:flex-start;
    position:absolute;top:100%;left:0;right:0;
    background:var(--blanc-galerie);padding:1.8rem 4vw 2.2rem;
    border-bottom:1px solid rgba(28,28,28,.08);
  }
}
@media(max-width:640px){nav.site .brand .wm-ashley{font-size:1.5rem;}nav.site .brand-sub{font-size:.46rem;letter-spacing:.14em;}}

/* ---------- Sections & fonds ---------- */
section{padding:clamp(4.5rem,11vw,9rem) 4vw;position:relative;}
.inner{max-width:var(--max);margin:0 auto;position:relative;}
.dark{background:radial-gradient(130% 110% at 50% 0%,#132420 0%,var(--vert-nuit) 62%);color:var(--ivoire);}
.dark .kicker{color:color-mix(in srgb,var(--ivoire) 55%,transparent);}
/* Sections ivoire éclaircies (07/07 : plus de lumière) — l'ivoire pur reste la couleur de texte sur fonds sombres */
.ivoire{background:color-mix(in srgb,var(--ivoire) 52%,#FFFFFF);}
.cabinet-fond{background:radial-gradient(120% 100% at 50% 0%,#264232 0%,var(--vert-anglais) 60%);color:var(--ivoire);}
.society-fond{background:radial-gradient(120% 100% at 50% 0%,#16294d 0%,var(--indigo) 60%);color:var(--ivoire);}
.cabinet-fond .kicker,.society-fond .kicker{color:rgba(235,237,234,.6);}

/* En-tête de chapitre — numérotation LISIBLE (retour 03/07 : « trop cryptique »).
   Le numéro, le total et le nom du chapitre vivent ensemble sur un filet. */
.chapitre{display:flex;align-items:baseline;gap:1.2rem;border-top:1px solid rgba(28,28,28,.16);padding-top:1.1rem;margin-bottom:2.6rem;position:relative;}
.dark .chapitre,.cabinet-fond .chapitre,.society-fond .chapitre{border-top-color:rgba(235,237,234,.22);}
/* Signature fluo de chapitre — un segment sur le filet, à chaque en-tête (07/07 : « le fluo, c'est ce qui relie ») */
.chapitre::before{content:'';position:absolute;top:-1px;left:0;width:3.4rem;height:2px;background:var(--fluo);box-shadow:0 1px 0 rgba(14,26,23,.16);}
.dark .chapitre::before,.cabinet-fond .chapitre::before,.society-fond .chapitre::before{box-shadow:none;height:1.5px;}
html.js .rv.chapitre::before{transform-origin:left;transform:scaleX(0);transition:transform 1s var(--ease) .25s;}
html.js .rv.vu.chapitre::before{transform:scaleX(1);}
.chapitre .num{flex-shrink:0;}
.chapitre .titre-ch{font-family:var(--mg12);font-weight:500;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--brume);}
.dark .chapitre .titre-ch,.cabinet-fond .chapitre .titre-ch,.society-fond .chapitre .titre-ch{color:rgba(235,237,234,.55);}

/* Numéro fantôme — cohérent : toujours le numéro du chapitre courant, jamais caché sous une photo */
.ghost{position:absolute;right:0;top:-1.6rem;font-family:var(--argesta);font-style:italic;font-size:clamp(6rem,14vw,11.5rem);line-height:1;color:currentColor;opacity:.07;pointer-events:none;user-select:none;z-index:0;}
@media(max-width:900px){.ghost{font-size:5.2rem;top:-1rem;}}

/* ---------- Hero ---------- */
.hero{min-height:94vh;display:flex;align-items:flex-end;position:relative;padding:0;overflow:hidden;}
.hero .contenu{position:relative;z-index:2;padding:9rem 4vw 5.5rem;max-width:var(--max);margin:0 auto;width:100%;}
.hero .voile{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,26,23,.05) 25%,rgba(14,26,23,.78) 100%);z-index:1;}
.hero .ph.abs{position:absolute;inset:0;}
html.js .hero .ph.abs{transform:scale(1.06);transition:transform 2.4s var(--ease);}
html.js.est-charge .hero .ph.abs{transform:scale(1.0);}
/* Titre hero — révélation ligne à ligne (masques). Sans JS : visible, rien ne bouge. */
html.js .ligne-h{display:block;overflow:hidden;}
html.js .ligne-h>span{display:block;transform:translateY(110%);transition:transform 1s var(--ease);}
html.js.est-charge .ligne-h>span{transform:none;}
.ligne-h:nth-child(2)>span{transition-delay:.1s;}
.ligne-h:nth-child(3)>span{transition-delay:.2s;}

/* ---------- Photos & cadres ---------- */
.ph{position:relative;overflow:hidden;background:linear-gradient(160deg,#E4E7E3 0%,#D3D7D2 100%);}
/* Relève tonale des photos (07/07 : « manque de lumière, de vivacité » — les provisoires sont désaturées) */
.ph.photo{background-size:cover;background-position:center;filter:saturate(1.28) brightness(1.04) contrast(1.02);}
.ratio-169{aspect-ratio:16/9;}.ratio-45{aspect-ratio:4/5;}.ratio-11{aspect-ratio:1/1;}.ratio-32{aspect-ratio:3/2;}
.cadre{position:relative;}
.cadre::after{content:'';position:absolute;top:16px;left:16px;right:-16px;bottom:-16px;border:1px solid rgba(14,26,23,.28);pointer-events:none;}
.dark .cadre::after,.cabinet-fond .cadre::after,.society-fond .cadre::after{border-color:rgba(235,237,234,.3);}
@media(max-width:640px){.cadre::after{top:10px;left:10px;right:-10px;bottom:-10px;}}
.cadre .ph{transition:transform .8s var(--ease);}
.cadre:hover .ph{transform:scale(1.015);}

/* ---------- Grilles ---------- */
.deux-col{display:grid;grid-template-columns:1.08fr 1fr;gap:4.5rem;align-items:center;}
.deux-col.haut{align-items:start;}
@media(max-width:900px){.deux-col{grid-template-columns:1fr;gap:3rem;}}
.trois-col{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
@media(max-width:900px){.trois-col{grid-template-columns:1fr;}}

/* Portes — socle tonal, accent en filet + survol seulement (portes tonales) */
.portes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
@media(max-width:900px){.portes{grid-template-columns:1fr;}}
.porte{
  --accent:var(--vert-nuit);
  display:block;text-decoration:none;color:var(--charbon);padding:3rem 2.3rem 4.6rem;min-height:400px;
  position:relative;background:var(--blanc-galerie);border-top:3px solid var(--accent);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),background .4s var(--ease),color .4s var(--ease);
}
.porte .kicker{transition:color .35s;}
a.porte:hover{transform:translateY(-8px);box-shadow:0 30px 70px -32px rgba(14,26,23,.5);background:var(--accent);color:var(--ivoire);}
a.porte:hover .kicker{color:rgba(235,237,234,.65);}
a.porte:hover .legende{color:rgba(235,237,234,.6);}
.porte .fleche{position:absolute;bottom:2rem;left:2.3rem;font-family:var(--safiro);font-size:1.3rem;transition:transform .35s var(--ease),color .35s;}
a.porte:hover .fleche{transform:translateX(10px);color:var(--fluo);}
/* Le fluo relie les trois maisons (07/07) — slash fluo sur le kicker de chaque porte
   (grammaire stricte du fluo : le slash — les wordmarks Cabinet/society n'ont pas de point fluo) */
.porte .kicker::before{content:'/';color:var(--fluo);margin-right:.55em;text-shadow:0 0 1px rgba(14,26,23,.25);}
a.porte:hover .kicker::before{text-shadow:none;}
.porte::after{content:'';position:absolute;top:-3px;left:0;width:2.4rem;height:3px;background:var(--fluo);opacity:0;transition:opacity .35s;}
a.porte:hover::after{opacity:1;}
/* Sigle AT en fluo — variante signature du wordmark Cabinet (supports signature uniquement) */
.wm-cabinet .at-f{color:var(--fluo);}
.porte.p-cabinet{--accent:var(--vert-anglais);}
.porte.p-society{--accent:var(--indigo);}
.porte.p-histoire{--accent:var(--vert-nuit);}

/* Cartes d'offre */
.offre{border:1px solid rgba(28,28,28,.14);padding:2.6rem 2.3rem;background:var(--blanc-galerie);position:relative;}
.offre .prix{font-family:var(--safiro);font-weight:600;font-size:1.7rem;margin:.8rem 0;}
.offre .prix small{font-family:var(--mg12);font-size:.62rem;letter-spacing:.14em;color:var(--brume);display:block;margin-top:.4rem;font-weight:400;}
.offre.pleine{background:var(--vert-anglais);color:var(--ivoire);border-color:var(--vert-anglais);}
.offre.pleine .kicker{color:rgba(235,237,234,.6);}
.offre.pleine .prix small{color:rgba(235,237,234,.6);}

/* Cartes sombres (fonds d'entité) */
.carte-l{border:1px solid rgba(235,237,234,.25);padding:2.6rem 2.3rem;}

/* ---------- Boutons — invitation, jamais impératif ---------- */
.btn{
  display:inline-block;font-family:var(--safiro);font-weight:500;font-size:.98rem;
  padding:.95rem 2.1rem;border-radius:100px;text-decoration:none;transition:all .3s var(--ease);
  border:1px solid currentColor;color:inherit;background:transparent;cursor:pointer;
}
.btn:hover{background:var(--charbon);color:var(--blanc-galerie);border-color:var(--charbon);}
.dark .btn:hover,.cabinet-fond .btn:hover,.society-fond .btn:hover{background:var(--ivoire);color:var(--vert-nuit);border-color:var(--ivoire);}
.btn.plein{background:var(--vert-nuit);color:var(--blanc-galerie);border-color:var(--vert-nuit);}
.btn.plein:hover{background:transparent;color:var(--vert-nuit);}
.cabinet-fond .btn.plein{background:var(--ivoire);color:var(--vert-anglais);border-color:var(--ivoire);}
.cabinet-fond .btn.plein:hover{background:transparent;color:var(--ivoire);}
.btn .fl{display:inline-block;transition:transform .3s var(--ease);margin-left:.5em;}
.btn:hover .fl{transform:translateX(5px);}

/* ---------- Murs de logos ---------- */
.logos{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem;align-items:stretch;}
@media(max-width:900px){.logos{grid-template-columns:repeat(3,1fr);}}
.logo-slot{min-height:78px;display:flex;align-items:center;justify-content:center;padding:.6rem;opacity:.82;transition:opacity .3s;}
.logo-slot img{max-height:44px;max-width:82%;object-fit:contain;}
.logo-slot:hover{opacity:1;}
/* Sur fonds sombres : l'encre charbon des logos passe en ivoire */
.dark .logo-slot img,.cabinet-fond .logo-slot img,.society-fond .logo-slot img{filter:invert(.92) hue-rotate(180deg) saturate(0);}

/* Bande défilante de preuve — marquee lent, coupé si reduced-motion */
.marquee{overflow:hidden;position:relative;padding:1.6rem 0;border-top:1px solid rgba(28,28,28,.1);border-bottom:1px solid rgba(28,28,28,.1);}
.dark .marquee,.cabinet-fond .marquee,.society-fond .marquee{border-color:rgba(235,237,234,.14);}
.marquee .rail{display:flex;gap:4.5rem;align-items:center;width:max-content;animation:defile 46s linear infinite;}
.marquee:hover .rail{animation-play-state:paused;}
.marquee .logo-slot{min-height:52px;flex-shrink:0;opacity:.72;}
.marquee .logo-slot img{max-height:34px;max-width:130px;}
@keyframes defile{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- Formulaires — éditorial, champs filet ---------- */
.formulaire{max-width:36em;}
.champ{margin-bottom:2rem;}
.champ label{display:block;font-family:var(--mg12);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brume);margin-bottom:.5rem;}
.champ input,.champ textarea,.champ select{
  width:100%;background:transparent;border:none;border-bottom:1px solid rgba(28,28,28,.3);
  font-family:var(--nudica);font-weight:300;font-size:1.05rem;color:inherit;padding:.55rem 0;
  border-radius:0;transition:border-color .3s;
}
.dark .champ input,.dark .champ textarea,.dark .champ select,
.cabinet-fond .champ input,.cabinet-fond .champ textarea,
.society-fond .champ input,.society-fond .champ textarea{border-bottom-color:rgba(235,237,234,.35);}
.champ input:focus,.champ textarea:focus,.champ select:focus{outline:none;border-bottom-color:var(--fluo);}
.champ textarea{min-height:120px;resize:vertical;}
.champ ::placeholder{color:var(--brume);opacity:.7;}
/* Capture inline (newsletter) : champ + bouton sur une ligne */
.capture{display:flex;gap:1rem;align-items:flex-end;max-width:34em;}
.capture .champ{flex:1;margin-bottom:0;}
@media(max-width:640px){.capture{flex-direction:column;align-items:stretch;}}
.note-rgpd{font-size:.78rem;color:var(--brume);max-width:34em;margin-top:1rem;line-height:1.6;}
.dark .note-rgpd,.cabinet-fond .note-rgpd,.society-fond .note-rgpd{color:rgba(235,237,234,.5);}

/* ---------- Schémas SVG — encre tonale, une coupe fluo, vivants (07/07 : « un schéma par page, mouvant ») ---------- */
.schema{width:100%;height:auto;display:block;}
.schema text{font-family:var(--mg12);letter-spacing:.14em;text-transform:uppercase;}
.schema .lbl{letter-spacing:.1em;}
/* Respiration lente des nœuds — chacun sur son propre tempo via animation-delay inline */
.schema .resp{animation:respire 7s ease-in-out infinite;transform-origin:center;transform-box:fill-box;}
@keyframes respire{0%,100%{transform:translateY(0) scale(1);}50%{transform:translateY(-6px) scale(1.03);}}
/* Tracé qui se dessine à l'entrée dans l'écran (pilote : .rv.vu du conteneur) */
html.js .rv .trace{stroke-dasharray:1400;stroke-dashoffset:1400;transition:stroke-dashoffset 2.4s var(--ease) .3s;}
html.js .rv.vu .trace{stroke-dashoffset:0;}
html.js .rv .trace.lent{transition-duration:3.2s;transition-delay:.6s;}
/* Balayage fluo (schéma entreprises) — la ligne révèle ce que personne ne regarde */
.scan-l{animation:balayage 11s linear infinite;}
@keyframes balayage{0%{transform:translateX(0);opacity:0;}4%{opacity:1;}82%{opacity:1;transform:translateX(820px);}86%,100%{opacity:0;transform:translateX(820px);}}
/* Points concernés : fluo par défaut (état statique sans JS ni animation) ; sous JS, l'animation les
   éteint puis les allume brièvement au passage de la ligne — chaque point porte un animation-delay inline
   négatif calé sur sa position horizontale. */
.pt-c{fill:var(--fluo);}
html.js .pt-c{animation:eclaire 11s linear infinite;}
@keyframes eclaire{0%{fill:#B9BDB8;}2%{fill:var(--fluo);}11%{fill:var(--fluo);}22%{fill:#B9BDB8;}100%{fill:#B9BDB8;}}
/* Graphe vivant — le SVG statique du markup est animé par at.js (dérive + survol) */
svg.vif .gn{cursor:default;}
svg.vif .gn circle{transition:fill .3s,stroke .3s;}
svg.vif .gn.act circle{fill:var(--fluo);stroke:#1C1C1C;}
svg.vif .gn.act .n-lbl{fill:#1C1C1C;font-weight:500;}
svg.vif .gl{transition:stroke .3s,stroke-width .3s,opacity .3s;}
svg.vif .gl.act{stroke:#9FB325;stroke-width:1.4;opacity:1;}
.n-lbl{font-family:var(--mg12);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;fill:#1C1C1C;}
.n-lbl.morte{fill:#9A9A9A;}

/* ---------- Listes éditoriales (pôles, étapes, angles) ---------- */
.liste-ed{list-style:none;border-top:1px solid rgba(28,28,28,.16);}
.dark .liste-ed,.cabinet-fond .liste-ed,.society-fond .liste-ed{border-top-color:rgba(235,237,234,.2);}
.liste-ed li{
  display:grid;grid-template-columns:5.5rem 1fr;gap:2rem;align-items:baseline;
  padding:1.9rem 0;border-bottom:1px solid rgba(28,28,28,.16);
}
.dark .liste-ed li,.cabinet-fond .liste-ed li,.society-fond .liste-ed li{border-bottom-color:rgba(235,237,234,.2);}
.liste-ed .num{padding-top:.3rem;}
.liste-ed h3{margin-bottom:.5rem;}
.liste-ed p{max-width:38em;font-size:.98rem;}
@media(max-width:640px){.liste-ed li{grid-template-columns:1fr;gap:.6rem;}}

/* Étapes du parcours (page Ashley Taïeb) — frise verticale */
.etapes{list-style:none;position:relative;padding-left:2.6rem;}
.etapes::before{content:'';position:absolute;left:.45rem;top:.6rem;bottom:.6rem;width:1px;background:rgba(28,28,28,.22);}
.dark .etapes::before{background:rgba(235,237,234,.25);}
.etapes li{position:relative;padding-bottom:3.2rem;}
.etapes li:last-child{padding-bottom:0;}
.etapes li::before{content:'';position:absolute;left:-2.6rem;top:.55rem;width:9px;height:9px;border-radius:50%;background:currentColor;margin-left:.06rem;}
.etapes li.lueur::before{background:var(--fluo);}
.etapes .quand{font-family:var(--mg12);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--brume);display:block;margin-bottom:.5rem;}
.etapes h3{font-family:var(--argesta);font-weight:400;font-style:italic;font-size:1.7rem;margin-bottom:.7rem;}
.etapes p{max-width:36em;}

/* Modules cliquables scène/médias */
.modules{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
@media(max-width:900px){.modules{grid-template-columns:1fr;}}
.module{display:block;text-decoration:none;color:inherit;border:1px solid rgba(28,28,28,.14);background:var(--blanc-galerie);transition:transform .35s var(--ease),box-shadow .35s var(--ease);}
.module:hover{transform:translateY(-6px);box-shadow:0 24px 60px -30px rgba(14,26,23,.4);}
.module .vignette{aspect-ratio:16/10;background-size:cover;background-position:center;background-color:#DDE0DC;position:relative;}
.module .corps{padding:1.6rem 1.7rem 1.8rem;}
.module .corps .kicker{margin-bottom:.6rem;display:block;}
.module h3{font-size:1.08rem;line-height:1.4;}
.module .lien-ind{font-family:var(--mg12);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--brume);display:inline-block;margin-top:1rem;}
.module:hover .lien-ind{color:var(--charbon);}

/* ---------- Bandes citation ---------- */
.bande-citation{text-align:center;}
.bande-citation .citation{max-width:26em;margin:0 auto;}
.bande-citation .qui{margin-top:2.2rem;}

/* ---------- Révélation au scroll — visible par défaut ---------- */
html.js .rv{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
html.js .rv.vu{opacity:1;transform:none;}
.rv.d1{transition-delay:.1s;}.rv.d2{transition-delay:.2s;}.rv.d3{transition-delay:.3s;}
@media print{html.js .rv{opacity:1!important;transform:none!important;}}

/* ---------- Mouvement réduit : tout se calme ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  html.js .rv{opacity:1!important;transform:none!important;transition:none!important;}
  html.js .ligne-h>span{transform:none!important;transition:none!important;}
  html.js .trait-v{animation:none!important;}
  html.js .hero .ph.abs{transform:none!important;transition:none!important;}
  .marquee .rail{animation:none;flex-wrap:wrap;width:auto;}
  .schema .resp{animation:none!important;}
  .scan-l{animation:none!important;opacity:0;}
  html.js .pt-c{animation:none!important;}
  html.js .rv .trace{stroke-dashoffset:0!important;transition:none!important;}
  html.js .rv.chapitre::before{transform:none!important;transition:none!important;}
  html.js .rv .mf{background-size:100% .16em!important;transition:none!important;}
}

/* ---------- Footer — territorial, wordmark en signature ---------- */
footer{background:var(--vert-nuit);color:var(--ivoire);padding:5.5rem 4vw 3rem;}
footer.footer-cabinet{background:var(--vert-anglais);}
footer.footer-society{background:var(--indigo);}
footer .grille{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;}
@media(max-width:900px){footer .grille{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){footer .grille{grid-template-columns:1fr;}}
footer .wm-pied{font-size:clamp(2.1rem,4vw,3.2rem);}
footer .wm-pied .pf{text-shadow:0 0 18px rgba(234,255,63,.35);}
footer a{color:var(--ivoire);text-decoration:none;opacity:.72;transition:opacity .2s,border-color .2s;border-bottom:1px solid transparent;padding-bottom:1px;}
footer a:hover{opacity:1;border-bottom-color:var(--fluo);}
footer ul{list-style:none;}
footer li{margin-bottom:.6rem;font-size:.9rem;}
footer .colophon{max-width:var(--max);margin:4rem auto 0;padding-top:2rem;border-top:1px solid rgba(235,237,234,.15);position:relative;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;}
/* Signature fluo du footer — même geste que les en-têtes de chapitre (07/07 : « en bas, pas de fluo ») */
footer .colophon::before{content:'';position:absolute;top:-1px;left:0;width:3.4rem;height:1.5px;background:var(--fluo);}
footer .colophon,footer .colophon *{font-family:var(--mg12);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--ivoire) 55%,transparent);}
footer .colophon a{opacity:1;}

/* ---------- Embed Calendly ---------- */
.calendly-inline-widget{min-width:320px;height:760px;border:1px solid rgba(28,28,28,.14);}

/* ---------- Accessibilité ---------- */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--fluo);outline-offset:3px;
}
.saut-contenu{position:absolute;left:-9999px;top:0;background:var(--vert-nuit);color:var(--fluo);padding:.8rem 1.4rem;z-index:100;font-family:var(--mg12);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;}
.saut-contenu:focus{left:0;}

/* ---------- Discipline mobile ---------- */
@media(max-width:640px){
  .kicker{letter-spacing:.16em;font-size:.68rem;}
  .legende{letter-spacing:.1em;}
  nav.site ul a{letter-spacing:.1em;}
  .hero{min-height:88vh;}
  .hero .contenu{padding-bottom:3.5rem;padding-top:7rem;}
  .num{letter-spacing:.14em;}
  section{padding-left:6vw;padding-right:6vw;}
  /* Schémas : sur petit écran, ils gardent leur taille lisible et défilent horizontalement */
  div:has(> .schema){overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .schema{min-width:640px;}
}

/* ---------- Marque fluo — souligné scalpel sous un mot-clé (un par écran maximum) ---------- */
.mf{background-image:linear-gradient(0deg,var(--fluo),var(--fluo));background-repeat:no-repeat;
  background-size:100% .14em;background-position:0 92%;padding:0 .04em;box-decoration-break:clone;-webkit-box-decoration-break:clone;}
html.js .rv .mf{background-size:0% .14em;transition:background-size 1.3s var(--ease) .45s;}
html.js .rv.vu .mf{background-size:100% .14em;}

/* ---------- Utilitaires ---------- */
.centre{text-align:center;}
.mt-0{margin-top:0;}.mt-1{margin-top:1rem;}.mt-2{margin-top:2rem;}.mt-3{margin-top:3rem;}
.mb-1{margin-bottom:1rem;}.mb-2{margin-bottom:2rem;}.mb-3{margin-bottom:3rem;}
.txt-ivoire-70{color:rgba(235,237,234,.7);}
.txt-ivoire-85{color:rgba(235,237,234,.85);}
.max-38{max-width:38em;}
.max-34{max-width:34em;}