/* =============================================================
   B-COCKPIT 360° — Page Expertises (/banque/expertises.html)
   Blocs Héritage alternés (spec UX §4.4), section couverture.
   ============================================================= */

/* ---------- Bloc Héritage (récit + visuel) ---------- */
.bq-heritage-block {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: var(--spacing-8);
  align-items: center;
  margin-bottom: var(--spacing-12);
}
.bq-heritage-block:last-of-type { margin-bottom: 0; }

/* Alternance gauche/droite (spec UX §4.4) */
.bq-heritage-block:nth-of-type(even) .bq-heritage-media { order: 2; }
.bq-heritage-block:nth-of-type(even) .bq-heritage-content { order: 1; }

.bq-heritage-media img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  display: block;
}

.bq-heritage-content h3 {
  font-size: var(--font-size-2xl);
  margin-bottom: var(--spacing-2);
}
.bq-heritage-meta {
  font-family: var(--bq-font-body);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  color: var(--bq-gold-700);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: var(--spacing-4);
}
.bq-heritage-content > p:not(.bq-heritage-meta):not(.bq-caption) {
  color: var(--bq-ink-muted);
  margin-bottom: var(--spacing-4);
}

/* ---------- Section Couverture Géographique (FR-029) ---------- */
.bq-couverture {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: var(--spacing-8);
  align-items: center;
}
.bq-couverture-texte h2 {
  font-size: var(--font-size-3xl, var(--font-size-2xl));
  margin-bottom: var(--spacing-6);
}
.bq-couverture-chiffre {
  font-family: var(--bq-font-display);
  font-size: var(--font-size-4xl);
  font-weight: var(--font-weight-bold);
  color: var(--bq-navy-900);
  line-height: 1.25;
  margin-bottom: var(--spacing-2);
}
.bq-couverture-texte p:not(.bq-couverture-chiffre) {
  color: var(--bq-ink-muted);
  font-size: var(--font-size-lg);
}
.bq-couverture-media img {
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
  display: block;
}

/* ---------- Responsive ---------- */
@media (max-width: 1023px) {
  .bq-heritage-block,
  .bq-couverture {
    grid-template-columns: 1fr;
    gap: var(--spacing-6);
  }
  /* Image au-dessus du texte sur mobile (spec UX §4.4) */
  .bq-heritage-block:nth-of-type(even) .bq-heritage-media,
  .bq-heritage-media { order: 1; }
  .bq-heritage-block:nth-of-type(even) .bq-heritage-content,
  .bq-heritage-content { order: 2; }
}
