/* ==========================================================================
   SECTORWEB — compléments de la page « Réalisations »
   Repris du <style> en ligne de la maquette (études de cas .study).
   ========================================================================== */

/* Étude de cas détaillée */
.study{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--gridline);border-radius:var(--r-card);overflow:hidden;background:var(--canvas)}
.study .visual{border-right:1px solid var(--gridline);background:var(--vellum);min-height:360px;display:flex;align-items:center;justify-content:center;font-family:var(--f-mono);font-size:12px;color:var(--stone);text-align:center;padding:24px;background-image:linear-gradient(var(--gridline) 1px,transparent 1px),linear-gradient(90deg,var(--gridline) 1px,transparent 1px);background-size:30px 30px}
.study.flip .visual{order:2;border-right:0;border-left:1px solid var(--gridline)}
/* Case portant une vraie capture : elle laisse tomber son quadrillage et son
   rembourrage — l'image reprend déjà ce fond — et remplit toute la hauteur de
   la carte, quelle que soit la longueur du texte à côté. */
.study .visual--shot{padding:0;background-image:none;display:block}
.study .visual--shot figure{margin:0;height:100%}
.study .visual--shot img{display:block;width:100%;height:100%;object-fit:cover}
.study .txt{padding:clamp(26px,3.2vw,38px);display:flex;flex-direction:column;gap:16px}
.study .txt .type{font-family:var(--f-mono);font-size:11.5px;color:var(--ember)}
.study .txt h3{font-size:clamp(21px,2.3vw,27px);font-weight:500;letter-spacing:-.014em;line-height:1.25}
.study .txt p{font-size:14.5px;color:var(--slate);line-height:1.7}
.study .txt p b{color:var(--ink);font-weight:500}
.study .txt .tags{display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:880px){
  .study{grid-template-columns:minmax(0,1fr)}
  .study .visual,.study.flip .visual{order:0;border-right:0;border-left:0;border-bottom:1px solid var(--gridline);min-height:250px}
}

/* --------------------------------------------------------------------------
   Ajouts
   -------------------------------------------------------------------------- */
/* Espacement entre les deux études de cas : la maquette le posait en style
   en ligne sur un conteneur sans classe. */
.etudes{
  display:flex;
  flex-direction:column;
  gap:24px;
}
.voir-offres{
  display:flex;
  justify-content:center;
  margin-top:32px;
}