/* ============================================================================
   PAGES DE DOCUMENTATION — juridiques et guide de soumission.
   Le calque global impose aux h2 le clamp(2rem,3.4vw,2.6rem) de l'accueil, qui
   a sept sections. Ces pages en ont douze, et ce sont des paragraphes de
   contrat, pas des accroches. À 2,6 rem la page devient une suite d'affiches.
   On revient à une échelle de lecture continue.
   ============================================================================ */
section.block h2, #pipeline h2{
  font-size:1.4rem !important; line-height:1.3 !important;
  letter-spacing:-.01em !important; max-width:60ch !important;
  margin:2.5rem 0 .9rem !important;
}
.legal-body h2{ font-size:1.4rem !important; margin:2.5rem 0 .9rem !important; }
.legal-body{ max-width:72ch; }
.legal-body p, .legal-body li{ font-size:1rem; line-height:1.75; }

/* Encarts et cartes : même famille que le reste du site, rayon proportionné à
   des boîtes courtes — 1,4 rem ferait ballon sur 1 rem de marge intérieure. */
.sample-card, .callout, .tblwrap{
  border:1px solid transparent !important;
  border-radius:1rem !important;
  box-shadow:0 1px 2px rgba(18,19,42,.03), 0 14px 28px -18px rgba(18,19,42,.10);
}
.sample-card{ padding:1.2rem 1.3rem !important; }
.callout{
  border-left:3px solid var(--brand-magenta,#C00060) !important;
  padding:1.15rem 1.4rem !important;
}
.sample-card h3{ font-size:.98rem !important; }

/* ---------------------------------------------------------------------------
   RYTHME DE LA PAGE CONSIGNES (03/08)
   Le calque global donne 7 rem de respiration à chaque section, calibrés sur
   l'accueil et ses sept blocs marketing. Cette page en aligne onze, tous de la
   même nature : 14 rem entre deux tableaux de référence, c'est du vide, pas du
   rythme. On resserre, et le filet de séparation reprend le travail que
   l'espace faisait mal.
   --------------------------------------------------------------------------- */
body:has(#protocols) section.block{ padding:4rem 0 !important; }
body:has(#protocols) section.block + section.block{
  border-top:1px solid var(--hair,rgba(18,19,42,.08)) !important;
}
body:has(#protocols) header.top + section.block{ padding-top:3.25rem !important; }
@media (max-width:700px){
  body:has(#protocols) section.block{ padding:2.75rem 0 !important; }
  body:has(#protocols) header.top + section.block{ padding-top:2.25rem !important; }
}

/* Halo de plateforme, repris de platforms.html : chaque section porte la teinte
   de la plateforme dont elle décrit les exigences. Purement décoratif, derrière
   le contenu, alterné gauche/droite pour ne pas créer une colonne de taches. */
.guide-glow{ position:relative; }
.guide-glow > .wrap{ position:relative; z-index:1; }
.guide-glow::before{
  content:""; position:absolute; width:520px; height:520px; border-radius:50%;
  filter:blur(90px); z-index:0; pointer-events:none; opacity:.13;
  background:radial-gradient(circle, var(--accent,#38d6ff) 0%, transparent 70%);
}
.guide-glow:nth-of-type(odd)::before{  right:-170px; top:-190px; }
.guide-glow:nth-of-type(even)::before{ left:-180px;  bottom:-200px; }
/* Sur mobile le halo déborderait de la fenêtre : plus petit et recentré. */
@media (max-width:700px){
  .guide-glow::before{ width:320px; height:320px; filter:blur(70px); opacity:.10; }
  .guide-glow:nth-of-type(odd)::before{  right:-110px; top:-120px; }
  .guide-glow:nth-of-type(even)::before{ left:-120px;  bottom:-130px; }
}

/* ---------------------------------------------------------------------------
   SOMMAIRE DES CONSIGNES (06/08)
   Les quatre cartes reprenaient `.sample-card`, dessinée pour des encarts de
   données : rayon .5rem, pas d'ombre, titre magenta. Posée à côté des tuiles de
   l'accueil, elle jurait. On aligne sur `.ind`, la tuile de référence du site :
   même rayon, même filet, même ombre, même réaction au survol. Le titre repasse
   en bleu nuit avec la police d'affichage, comme partout ailleurs : le magenta
   est réservé aux actions, pas aux intitulés.
   --------------------------------------------------------------------------- */
#sommaire .sampling-grid{
  grid-template-columns:repeat(2,1fr) !important;   /* 2 x 2, et non 3 + 1 orphelin */
  gap:1.5rem !important;
  margin-top:2rem;
}
#sommaire .sample-card{
  position:relative;
  background:#fff !important;
  border:1px solid var(--hair) !important;
  border-radius:1.4rem !important;
  padding:1.5rem 1.6rem 1.4rem !important;
  box-shadow:0 1px 2px rgba(18,19,42,.04), 0 20px 40px -22px rgba(18,19,42,.12),
             0 24px 48px -26px rgba(192,0,96,.12) !important;
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
#sommaire .sample-card:hover{
  border-color:var(--brand-magenta-tint) !important;
  transform:translateY(-2px);
  box-shadow:0 1px 2px rgba(18,19,42,.05), 0 28px 50px -24px rgba(18,19,42,.16),
             0 32px 60px -28px rgba(192,0,96,.18) !important;
}
/* Titre : même échelle et même couleur que les tuiles de l'accueil. */
#sommaire .sample-card h3{
  font-family:var(--display) !important;
  font-weight:600 !important;
  font-size:1.1rem !important;
  line-height:1.3;
  letter-spacing:-.01em;
  color:var(--bone) !important;
  margin:0 0 .65rem !important;
}
#sommaire .sample-card h3 a{
  color:inherit !important;
  text-decoration:none !important;
}
/* Toute la carte est cliquable, pas seulement les quelques mots du titre. */
#sommaire .sample-card h3 a::after{ content:""; position:absolute; inset:0; }
#sommaire .sample-card p{
  font-family:var(--body) !important;
  font-size:.95rem !important;
  line-height:1.55 !important;
  color:var(--mute) !important;
  margin:0 !important;
}
@media (max-width:760px){
  #sommaire .sampling-grid{ grid-template-columns:1fr !important; gap:1rem !important; }
  #sommaire .sample-card{ padding:1.2rem 1.3rem !important; }
}

/* ---------------------------------------------------------------------------
   PAGES DE SERVICE (06/08) — dPCR, exosomes, protéomique
   Trois blocs courts espacés de 7 rem, un calibrage hérité de l'accueil et de
   ses sept sections illustrées : sur une page de texte, ça fait deux écrans de
   vide entre deux paragraphes. Et les listes n'avaient aucun style, la page
   perdait sa largeur de lecture et semblait changer de police.
   --------------------------------------------------------------------------- */
body:has(.svc) section.block{ padding:3.5rem 0 !important; }
body:has(.svc) section.block + section.block{
  border-top:1px solid var(--hair,rgba(18,19,42,.08)) !important;
}
body:has(.svc) header.top + section.block{ padding-top:3rem !important; }
/* Le calque global pousse la dernière `.sub` à 3,75 rem de marge basse, prévu
   pour un chapeau de section. Ici chaque paragraphe porte `sub` : on reprend
   une marge de paragraphe. */
.svc .sub{ margin:0 0 1.1rem !important; max-width:74ch; }
.svc .sub:last-child{ margin-bottom:0 !important; }
.svc h2{ margin-top:0 !important; }
.svc ul.svc-list{
  margin:0 0 1.2rem; padding-left:1.2rem; max-width:74ch;
  color:var(--mute); font-size:.94rem; line-height:1.6;
}
.svc ul.svc-list li{ margin:.4rem 0; }
/* La puce prend la teinte de la plateforme, comme le halo de la section. */
.svc ul.svc-list li::marker{ color:var(--accent,var(--brand-magenta,#C00060)); }
@media (max-width:700px){
  body:has(.svc) section.block{ padding:2.5rem 0 !important; }
  body:has(.svc) header.top + section.block{ padding-top:2rem !important; }
}

/* Tableaux : la légende était en monospace majuscule interlettré. */
table.dtable caption{
  font-family:var(--body,"Archivo",system-ui,sans-serif) !important;
  text-transform:none !important; letter-spacing:0 !important;
  font-size:.95rem !important; font-weight:600; color:var(--bone) !important;
}
table.dtable{ font-size:.92rem !important; }