/* DL-Frat — mise en page commune des articles éditoriaux */

.editorial-page {
  width: min(100% - 40px, 880px);
  margin: 0 auto;
  padding: 72px 0 90px;
}

.editorial-intro { margin-bottom: 58px; }

.editorial-kicker {
  margin: 0 0 14px;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #5967c9;
}

.editorial-page h1 {
  margin: 0 0 24px;
  font-size: clamp(2.2rem, 5vw, 4rem);
  line-height: 1.05;
  letter-spacing: -.04em;
  color: #172554;
}

.editorial-lead {
  margin: 0;
  font-size: clamp(1.08rem, 2vw, 1.3rem);
  line-height: 1.75;
  color: #4c5060;
}

.editorial-article {
  font-size: 1.04rem;
  line-height: 1.82;
  color: #30323a;
}

.editorial-article h2 {
  margin: 64px 0 20px;
  font-size: clamp(1.55rem, 3vw, 2.15rem);
  line-height: 1.2;
  letter-spacing: -.025em;
  color: #1f2130;
}

.editorial-article h3 { color: #1f2130; }
.editorial-article p { margin: 0 0 22px; }
.editorial-article strong { color: #202230; }

.definition-box,
.dream-box,
.toolbox {
  margin: 38px 0;
  padding: 30px 32px;
  border-radius: 22px;
  background: #f5f4fb;
}

.definition-box p:last-child,
.toolbox p:last-child { margin-bottom: 0; }

.dream-box p {
  margin: 0;
  font-size: clamp(1.1rem, 2vw, 1.28rem);
  line-height: 1.65;
  font-weight: 600;
  color: #34364a;
}

.toolbox h3 { margin: 0 0 18px; font-size: 1.25rem; }
.toolbox ul { margin: 0; padding-left: 1.25rem; }
.toolbox li { margin: 10px 0; }

.editorial-note {
  margin: 42px 0;
  padding: 24px 28px;
  border-left: 4px solid #7b83d7;
  background: #faf9fd;
  border-radius: 0 16px 16px 0;
}
.editorial-note p:last-child { margin-bottom: 0; }

.editorial-links {
  margin-top: 68px;
  padding-top: 38px;
  border-top: 1px solid #e5e5ec;
}
.editorial-links h2 { margin-top: 0; }
.editorial-links a:not(.button) { font-weight: 700; }

.editorial-closing {
  margin-top: 64px;
  padding: 36px;
  border-radius: 24px;
  background: #f5f4fb;
}
.editorial-closing h2 { margin-top: 0; }
.editorial-closing .button { margin-top: 8px; }

@media (max-width: 640px) {
  .editorial-page {
    width: min(100% - 30px, 880px);
    padding: 46px 0 64px;
  }
  .editorial-intro { margin-bottom: 42px; }
  .editorial-article { font-size: 1rem; line-height: 1.72; }
  .editorial-article h2 { margin-top: 48px; }
  .definition-box, .dream-box, .toolbox, .editorial-closing { padding: 25px 22px; }
  .editorial-note { padding: 21px 20px; }
}