/* Specific to the qui-accompagnons-nous page.
   Extracted from the mockups by pilotage/extract-css.ts.
   Do not edit by hand while the theme is incomplete: the mockups are still
   the source, and an edit here would be overwritten on the next run. */

/* 12/10: the page's own copy of the .has-bg rule is gone. Loaded after base.css,
   it beat the phone rule there that evens out the veil once the text runs full
   width, and the title, alone on the photo since her email, sat on the bright
   sky and blouse at 2.1:1. base.css draws this banner like every other one
   (CONVENTIONS.md, « The photo hero »). */

@media (max-width:900px){
    .hero-grid,.founder-grid,.cv-grid{grid-template-columns:1fr}
    .founder-photo{aspect-ratio:16/11;max-width:520px}
    .steps{grid-template-columns:1fr}
    .step{border-left:0;border-top:1px solid var(--line);padding:1.8rem 0}
    .step:first-child{padding-top:0;border-top:0}
    .quotes{grid-template-columns:1fr}
    .cities{grid-template-columns:1fr 1fr}
    .foot-grid{grid-template-columns:1fr 1fr}
    .segblock,.segblock.flip{grid-template-columns:1fr}
    .segblock-media,.segblock.flip .segblock-media{order:-1;aspect-ratio:16/11;max-width:520px}
    /* 24/10: the wide frame crops the portrait photo; « Cadrage sur téléphone »
       chooses what stays (page-qui-accompagnons-nous.php). */
    .segblock-media{background-position:var(--seg-pos,center)}
  }

/* 12/10, her email: the title alone on the photo, in bold; the standfirst under it;
   « Cinq parcours, une même attention » a little smaller than the other h2. */
/* 23/10, Lucas: « la typo du titre sur /label-oncrh/ est très bien… uniformise
   moi ça partout ». The bold of 12/10 goes: every banner title has the same
   weight (400), size and spacing. */

.paths-title{font-size:calc(.82 * var(--h2))}

/* 23/10, evening, Lucas: « sur toutes les pages où il y a un bandeau, on met le
   titre en bas de la photo ». This banner now carries .hero-title-only like the
   others (page-qui-accompagnons-nous.php): title low, veil from the bottom. No
   margin under the title, which is alone on the photo. */
.hero .hub-title{margin-bottom:0}
