/* =========================
   PAGES ÉDITORIALES
   perspectives.html
   ========================= */

/* HERO PAGE LISTING */
.page-hero {
  padding: 8.5rem 4rem 3.5rem;
}

.page-hero-inner {
  max-width: 1320px;
  margin: 0 auto;
}

.page-title {
  max-width: 1450px;
  font-family: var(--f-display);
  font-size: clamp(3.8rem, 6vw, 6.4rem);
  font-weight: 300;
  line-height: 1.02;
  letter-spacing: -.02em;
  color: var(--paper);
}

.page-title em {
  color: var(--gold);
  font-style: italic;
}

.page-intro {
  max-width: 680px;
  font-size: .9rem;
  line-height: 1.8;
  color: var(--ash);
  text-align: center;
  margin: auto;
}

/* SECTION PAGE PERSPECTIVES */
.perspectives-page-section {
  padding-top: 0rem;
}

/* ───────────────────────────── */
/* PAGE HEADER (générique)       */
/* ───────────────────────────── */

.page-header {
  padding: 8.5rem 4rem 0rem;
  background: var(--ink);
}

.page-header-inner {
  max-width: 1240px;
  margin: 0 auto;
}

.page-header h1 {
  font-family: var(--f-display);
  font-size: clamp(3.2rem, 5.8vw, 5.9rem);
  font-weight: 300;
  line-height: 1.02;
  letter-spacing: -.015em;
  color: var(--paper);
  margin-bottom: 1.75rem;
  max-width: 1320px;
}

.page-header h1 em {
  font-style: italic;
  color: var(--gold);
}

.page-header p {
  font-size: .92rem;
  line-height: 1.8;
  color: var(--ash);
  max-width: 780px;
}

/* ───────────────────────────── */
/* MOBILE                        */
/* ───────────────────────────── */

@media (max-width: 900px) {
  .page-hero {
    padding: 7.5rem 2rem 3rem;
  }

  .page-title {
    font-size: clamp(2.8rem, 12vw, 4.8rem);
    line-height: 1.04;
  }

  .page-intro {
    max-width: none;
    margin-top: 1.25rem;
  }

  .page-header {
    padding: 8.5rem 2rem 2.5rem;
  }

  .page-header h1 {
    font-size: clamp(2.6rem, 10vw, 4.2rem);
    line-height: 1.04;
    margin-bottom: 1.25rem;
  }

  .page-header p {
    font-size: .88rem;
    max-width: 100%;
  }
}