/* ============================================================================
   PAGE /label-oncrh/

   Le theme charge assets/css/pages/<slug>.css pour une page singuliere, et rien
   d'autre : accueil.css ne sort JAMAIS de l'accueil. Les regles ci-dessous y
   avaient ete posees par erreur le 30/09, et la page est restee quelques minutes
   en ligne sans elles. C'est exactement le defaut que le commentaire de
   perinel_view_stylesheets() decrit pour l'archive des agences : rien ne casse,
   rien n'erre, les regles n'existent simplement pas.
   ============================================================================ */

/* Les cinq engagements sont numerotes parce que l'ordre vient du label lui-meme,
   et parce que ce sont des engagements, pas des puces. Meme rendu que les stages
   de /pourquoi-agence/, dont la regle est reprise ici : les deux pages ne
   partagent pas de feuille, et une page qui emprunte celle d'une autre pour trois
   selecteurs se paie en dependance invisible le jour ou l'une des deux bouge. */
.stages{margin:1.2rem 0;padding-left:0;list-style:none;counter-reset:et}

.stages li{counter-increment:et;position:relative;padding-left:2.6rem;margin-bottom:.9rem;
    line-height:1.6}

.stages li::before{content:counter(et);position:absolute;left:0;top:.05em;
    width:1.8rem;height:1.8rem;border-radius:50%;background:var(--tint);color:var(--brand);
    font-weight:600;font-size:.95rem;display:grid;place-items:center}

.oncrh-list{max-width:62ch}

/* The diploma, right under undertaking 5 as she asked on 04/10. Capped at 640 px:
   wider, a landscape certificate takes over a page of short blocks. The blue frame
   is part of the image, so no border here. */
.oncrh-diploma{margin:clamp(1.4rem,1rem + 1.5vw,2.2rem) 0 0;max-width:640px}

.oncrh-diploma img{display:block;width:100%;height:auto;border-radius:4px;
    box-shadow:0 2px 14px rgba(0,63,100,.12)}

/* Le bandeau d'adhesion. 170 px est le plafond : le fichier fait 284 px de large
   avec du texte incruste, au-dela il bave. Son fond est blanc et non transparent,
   d'ou le lisere qui l'assied sur le creme plutot que de le laisser flotter. */
.distinction-oncrh{margin:0 0 .9rem;max-width:none}

/* 04/10, « peux tu aussi grossir l'image ? » : 240 px, still under the 284 px of
   the file, so the inlaid text stays sharp. */
.distinction-oncrh img{width:240px;height:auto;border:1px solid var(--line);border-radius:4px}

/* Le bloc du Prix : le bandeau, puis le texte, puis les deux videos. Il porte son
   propre conteneur parce qu'il disparait d'un bloc avec show_excellence_award, et
   qu'un ensemble qui tombe ensemble se nomme. */
.oncrh-awards{display:grid}

/* Les deux videos de sa page actuelle, cote a cote des que la place le permet. */
.oncrh-videos{display:grid;gap:clamp(1.2rem,.8rem + 1.5vw,2rem);
    margin-top:clamp(1.8rem,1.2rem + 2vw,2.6rem)}

@media (min-width:760px){.oncrh-videos{grid-template-columns:1fr 1fr}}
/* 22/10: a third video. Three in a row once each keeps about 300 px. */
@media (min-width:1000px){.oncrh-videos{grid-template-columns:repeat(3,1fr)}}

/* 04/10, twice in her feedback: « trop de blanc en dessous de la photo » and « trop
   de blanc au dessous du logo ». The page stacks four short sections, and each one
   carried the site's full 8 rem above and below: 256 px between two blocks that
   hold five lines each. This page alone drops to about half, and the list, which
   follows the banner directly, starts closer still. This stylesheet is only served
   on /label-oncrh/, so the bare selectors stay on this page. */
/* 06/10: « trop d'espace » again, between the diploma and the cabinet text and
   above the logo. Cut by a quarter with the rest of the site, and kept at half the
   site-wide value: 126 px between two blocks at 1440 becomes 95, 80 on a phone
   becomes 61. */
/* 07/10: the sections follow the site-wide padding of base.css, which now opens
   on the home page's tighter junction. The rule that reset them to --sp on both
   sides is gone. */

/* 22/10, Lucas: « juste le titre sur la photo et en dessous le texte qui
   l'accompagne ». The lead now sits in .hero-intro, and it ends on « s'engagent
   à : », so the list it introduces follows it with no section gap: the list's own
   1.2 rem margin is the whole distance, as when both shared a block. */
main > .hero-intro + section{padding-top:0}

/* 13/10: a denser left veil kept the lead readable over the backlit glasses.
   22/10: the lead has left the photo and the title sits at its foot, under the
   shared bottom veil of .hero-title-only, so the override is gone: it would have
   beaten that veil on desktop. */