/* ============================================
   Layout: Sections, Grids, Utilities
   ============================================ */

/* Sections */
.section { padding: var(--space-4xl) 0; }
.section-alt { background: var(--bg-alt); }
.section-navy { background: var(--navy-deep); color: var(--text-light-on-dark); }
.section-navy h2, .section-navy h3 { color: var(--text-light-on-dark); }
.section-navy .stat-label { color: rgba(255,255,255,.72); }

/* Section header — centered */
.section-header {
  text-align: center; margin-bottom: 2.5rem;
}
.section-header h2 {
  font-family: var(--font-heading);
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 600; color: var(--ink);
}
.section-header p {
  font-size: 1.05rem; color: var(--muted); max-width: 600px;
  margin: .75rem auto 0;
}

/* Section label (eyebrow) */
.section-label {
  display: inline-block; font-family: var(--font-display);
  font-size: .72rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .18em; color: var(--sky); margin-bottom: .5rem;
}

/* Section top — title left, link right (Delors pattern) */
.sec-hdr {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 2.5rem;
}
.sec-ttl {
  font-family: var(--font-heading);
  font-size: clamp(1.6rem, 2.5vw, 2.2rem);
  font-weight: 600;
  color: var(--ink);
}
.sec-lnk {
  font-family: var(--font-display);
  font-size: .8rem;
  font-weight: 500;
  color: var(--sky);
  text-decoration: none;
  white-space: nowrap;
  transition: color var(--transition);
}
.sec-lnk:hover { color: var(--blue); }

/* Grids */
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; }
.grid-auto { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }

/* Card grid helpers */
.card-grid { display: grid; gap: 1.5rem; }
.card-grid-3 { grid-template-columns: repeat(3, 1fr); }
.card-grid-2 { grid-template-columns: repeat(2, 1fr); }

/* Utilities */
.text-center { text-align: center; }
.text-left { text-align: left; }
.mt-1 { margin-top: .5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2rem; }
.mb-1 { margin-bottom: .5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.flex-center { display: flex; align-items: center; justify-content: center; }
.gap-1 { gap: .5rem; }
.gap-2 { gap: 1rem; }
.gap-3 { gap: 1.5rem; }
.hidden { display: none; }

/* Reveal Animation — refined */
.rv {
  opacity: 0; transform: translateY(16px);
  transition: opacity .6s cubic-bezier(.25,.46,.45,.94), transform .6s cubic-bezier(.25,.46,.45,.94);
}
.rv.visible { opacity: 1; transform: translateY(0); }
.rv-delay-1 { transition-delay: .1s; }
.rv-delay-2 { transition-delay: .2s; }
.rv-delay-3 { transition-delay: .3s; }
.rv-delay-4 { transition-delay: .4s; }
/* Fallback: ensure hero/header content is visible even without JS */
.page-header .rv,
.projet-quote .rv,
.projet-hero .rv,
.hero .rv,
.pdv-header .rv,
.nl-page-header .rv { opacity: 1; transform: none; }