/* Village banner at the top of /about (+ FR): the artwork covers the top third of the
   screen, edge to edge, like the castle banner on /heirs-to-ruin. Own file because the
   main stylesheet is cached for a year. */
.team-hero {
  position: relative;
  width: 100%;
  height: 33.333vh;
  height: 33.333svh;
  min-height: 200px;
  overflow: hidden;
  background-color: #6f8fb0; /* the sky/snow tone, shown while the artwork loads */
}
.team-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* The artwork is almost square, so only a strip of it shows: centre it on the
     houses and their chimney smoke (roughly 35-65% down the picture). */
  object-position: 50% 52%;
}

/* The banner now sits right under the navbar, so the old offsets above the content go. */
.team-page > .section-3 { top: 0; margin-top: 32px; }

/* Desktop/tablet: tighten the gap between the tagline ("Joust est un studio créatif…")
   and everything below it (team list, QR codes, proofreading). The negative margin
   shortens the tagline's grid row, so all the rows after it move up together.
   Phones keep their own stacked layout (see the mobile block of the main stylesheet). */
@media screen and (min-width: 768px) {
  .team-page .grid-2 > .container-4 { margin-bottom: -50px; }
}