/* =========================================
   FICHIER : css/galerie-content.css
   PAGE    : galerie.njk
   ROLE    : contenu et CTA
   ========================================= */

.gallery-section {
  padding: 92px 0;
}

.gallery-section--soft {
  border-top: 1px solid var(--gallery-line);
  border-bottom: 1px solid var(--gallery-line);

  background: var(--color-sand);
}

.gallery-heading {
  display: grid;

  grid-template-columns: 52px minmax(0, 1fr);

  gap: 18px;

  max-width: 930px;
  margin-bottom: 36px;
}

.gallery-heading__index {
  display: grid;

  width: 52px;
  height: 52px;

  place-items: center;

  border: 1px solid var(--gallery-line);
  border-radius: 50%;

  color: var(--gallery-accent);

  font-size: 0.72rem;
  font-weight: 900;
}

.gallery-heading h2 {
  max-width: 760px;
  margin: 6px 0 10px;

  color: var(--gallery-ink);

  font-size: var(--hz-title-section);
  line-height: 1.04;
  letter-spacing: -0.035em;
}

.gallery-heading p {
  max-width: 760px;
  margin: 0;

  color: var(--gallery-muted);

  line-height: 1.72;
}

/* Futures collections */
.gallery-future-grid {
  display: grid;

  grid-template-columns:
    repeat(2, minmax(0, 1fr));

  border-top: 1px solid var(--gallery-line);
}

.gallery-future-card {
  display: grid;

  grid-template-columns: 52px minmax(0, 1fr);

  gap: 20px;

  min-height: 190px;
  padding: 28px 24px;

  border-right: 1px solid var(--gallery-line);
  border-bottom: 1px solid var(--gallery-line);

  background: #fff;
}

.gallery-future-card:nth-child(2n) {
  border-right: 0;
}

.gallery-future-card > span {
  color: var(--gallery-accent);

  font-size: 0.68rem;
  font-weight: 900;
}

.gallery-future-card h3 {
  margin: 0 0 9px;

  color: var(--gallery-ink);

  font-size: 1.5rem;
  line-height: 1.15;
}

.gallery-future-card p {
  max-width: 430px;
  margin: 0;

  color: var(--gallery-muted);

  font-size: 0.9rem;
  line-height: 1.7;
}

/* Principes */
.gallery-principles {
  display: grid;

  grid-template-columns:
    repeat(3, minmax(0, 1fr));

  gap: 14px;
}

.gallery-principles article {
  min-height: 245px;

  padding: 25px;

  border: 1px solid var(--gallery-line);
  border-radius: 18px;

  background: #fff;
}

.gallery-principles article > span {
  display: inline-flex;

  padding: 6px 9px;

  border-radius: 999px;

  background: rgba(255, 110, 64, 0.08);
  color: var(--gallery-accent);

  font-size: 0.67rem;
  font-weight: 900;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.gallery-principles h3 {
  margin: 38px 0 9px;

  color: var(--gallery-ink);

  font-size: 1.5rem;
  line-height: 1.15;
}

.gallery-principles p {
  margin: 0;

  color: var(--gallery-muted);

  font-size: 0.9rem;
  line-height: 1.7;
}

/* CTA final */
.gallery-next {
  padding: 94px 0 108px;

  background: #fff;
}

.gallery-next__inner {
  display: grid;

  grid-template-columns:
    minmax(0, 1fr) auto;

  gap: 60px;
  align-items: center;

  padding: 42px;

  border-radius: 26px;

  background:
    radial-gradient(
      circle at 92% 0%,
      rgba(255, 110, 64, 0.22),
      transparent 30%
    ),
    var(--gallery-ink);
}

.gallery-next h2 {
  max-width: 700px;
  margin: 8px 0 10px;

  color: #fff;

  font-size: var(--hz-title-section);
  line-height: 1.05;
}

.gallery-next p {
  max-width: 640px;
  margin: 0;

  color: rgba(255, 255, 255, 0.7);

  line-height: 1.65;
}

.gallery-next .gallery-eyebrow {
  color: rgba(255, 255, 255, 0.58);
}

.gallery-next__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.gallery-next .btn-outline {
  border-color: rgba(255, 255, 255, 0.35);
  color: #fff;
}