/* ─── Conteneurs ─────────────────────────────────────────────────────────── */
.container {
  max-width: 1240px;
  margin: 0 auto;
  padding: clamp(80px, 12vh, 140px) clamp(24px, 5vw, 64px);
}
.container--narrow  { max-width: 860px;  }
.container--wide    { max-width: 1320px; }
.container--text    { max-width: 720px;  }

/* ─── Sections ───────────────────────────────────────────────────────────── */
.section            { background: var(--bg); }
.section--warm      { background: var(--bg-warm); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.section--dark      { background: var(--ink); color: var(--on-dark); position: relative; overflow: hidden; }
.section--contact   {
  padding-top: clamp(120px, 14vh, 180px);
  padding-bottom: clamp(60px, 8vh, 100px);
  padding-inline: clamp(24px, 5vw, 64px);
  background: linear-gradient(155deg, #0B4D6B 0%, #0E4763 55%, #0A2233 100%);
  color: #FFFCF6;
  position: relative;
  overflow: hidden;
}

/* ─── Grilles ────────────────────────────────────────────────────────────── */
.grid-2col {
  display: grid;
  gap: clamp(32px, 5vw, 80px);
  grid-template-columns: 1.2fr 1fr;
}
.grid-2col--1-14 { grid-template-columns: 1fr 1.4fr; }
.grid-2col--equal { grid-template-columns: 1fr 1fr; }
.grid-2col--media { grid-template-columns: 1.4fr 1fr; }
.grid-3col {
  display: grid;
  gap: clamp(16px, 2vw, 28px);
  grid-template-columns: repeat(3, 1fr);
}
.grid-auto {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.grid-4col {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

/* ─── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .grid-3col { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .grid-2col,
  .grid-2col--1-14,
  .grid-2col--equal,
  .grid-2col--media { grid-template-columns: 1fr; }
}