/* Accueil fidèle (accueil-fidele.html) : l'ordre et les textes du site en ligne, au style de la direction 1.
   Seulement ce que cette page ajoute à onglets.css ; toutes les valeurs viennent de tokens.css. */

/* Premier écran : une porte arrondie derrière le portrait (choix de Lilian du 30/09/2026, idée reprise de la direction
   "L'affiche"). Elle a la largeur exacte de la photo (86 % x 0,75 = 64,5 % de la hauteur de la scène), part de sa coupe
   basse et s'arrondit au-dessus de la tête. Un disque centré sur la tête faisait auréole : essais écartés dans
   ../propositions-halo/. */
.scene::before{content:"";position:absolute;left:50%;bottom:0;height:84%;aspect-ratio:.7679;transform:translateX(-50%);border-radius:999px 999px 0 0;background:var(--rouge);pointer-events:none}

/* Les titres du site sont plus longs que ceux de la maquette : la bande passe sur plusieurs lignes, sans rotation */
.hero h1{font-size:var(--t-hero-long)}
.hero h1 .bande,.contact h2 .bande{display:inline;white-space:normal;transform:none;padding:0 .12em;-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:1.18}

/* Références : pas de titre de section sur le site, deux groupes présentés par une ligne.
   Juste sous le premier écran ; les services qui suivent portent seuls l'espace entre les deux. */
.references{padding-bottom:0}
/* Sur téléphone, trois logos par ligne, comme en ligne : le bloc tient en un demi-écran au lieu d'un écran entier */
@media(max-width:767px){
  .references .epingles{gap:var(--e-5)}
  .references .epingles ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .references .epingles li{justify-content:center;height:48px;padding:0 var(--e-2)}
  .references .logo{width:100%;height:22px}
  .references .logo--haut{height:30px}
}
/* Petit titre de groupe, en caractères de fichier : références et colonnes des missions */
.epingles-titre,.cas-titre{margin-bottom:var(--e-3);font-family:var(--police-fichier);font-size:var(--t-xs);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--encre-douce)}

/* Biographie : la photo de l'EDHEC dans une fenêtre */
.photo-bio{max-width:420px}
.photo-bio img{display:block;width:100%;height:auto;aspect-ratio:992 / 1150;object-fit:cover;object-position:50% 18%}
.bio-suite{font-size:var(--t-base)}

/* Missions : une fenêtre, un onglet par client, trois colonnes par mission */
.cas-onglets{display:flex;gap:var(--e-1);overflow-x:auto;padding:var(--e-2) var(--e-2) 0;background:var(--fond-2);border-bottom:1px solid var(--filet);scrollbar-width:thin}
.cas-onglet{flex:0 0 auto;display:grid;gap:6px;align-content:start;width:210px;min-height:44px;padding:var(--e-3) var(--e-4);border:0;border-radius:var(--rayon-onglet) var(--rayon-onglet) 0 0;background:transparent;box-shadow:inset 0 3px 0 transparent;color:var(--encre-douce);font:inherit;font-size:var(--t-xs);font-weight:600;line-height:1.35;text-align:left;cursor:pointer;transition:background-color var(--duree-secondaire) var(--courbe)}
.cas-onglet .cas-logo{width:96px;height:24px}
.cas-onglet:hover{background:var(--filet)}
.cas-onglet[aria-selected="true"]{background:var(--fenetre);box-shadow:inset 0 3px 0 var(--rouge);color:var(--encre)}
.cas-onglet[aria-selected="true"] .cas-logo{opacity:1}
.cas-onglet:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.cas-panneau{display:grid;gap:var(--e-6);padding:var(--e-5)}
.cas-panneau[hidden]{display:none}
.cas-panneau:focus-visible{outline:2px solid var(--focus);outline-offset:-4px}
.cas-fait{display:grid;gap:6px;font-size:var(--t-sm);line-height:1.4}
.cas-fait li{position:relative;padding-left:22px}
.cas-fait li::before{content:"→";position:absolute;left:0;top:-1px;font-family:var(--police-fichier);font-weight:700;color:var(--encre-douce)}
.cas-col .lien{margin-top:var(--e-3)}
@media(min-width:900px){.cas-panneau{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--e-7);padding:var(--e-6)}}
@media(min-width:1024px){.cas-onglets{overflow:visible}.cas-onglet{flex:1 1 0;width:auto}}