.editorial-page {
  --page-rule: #ccd9e6;
  --page-tint: #eef3f8;
}

.page-intro {
  padding-block: clamp(116px, 10vw, 148px) clamp(36px, 5vw, 64px);
  background: linear-gradient(135deg, #071426, #183757);
  color: #fff;
}

.page-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  gap: 22px clamp(28px, 5vw, 72px);
}

.page-intro .page-columns {
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  align-items: end;
}

.page-label,
.deliverables h3 {
  margin-bottom: 10px;
  font: 600 .77rem/1.4 "Hanken Grotesk", system-ui, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.page-intro .page-label { color: #bdd2e6; }

.page-intro h1 {
  font-size: clamp(2.1rem, 4.2vw, 3.85rem);
  font-stretch: 113%;
  text-wrap: balance;
}

.page-intro .page-lead {
  max-width: 40ch;
  color: #d6e2ee;
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.55;
}

.page-section { padding-block: clamp(34px, 4.7vw, 65px); }
.page-section p { line-height: 1.6; }
.page-section p + p { margin-top: 14px; }
.page-tint { background: var(--page-tint); border-block: 1px solid #dce6ef; }

.editorial-page h2 {
  margin-bottom: 10px;
  font-size: clamp(1.45rem, 2.8vw, 2.4rem);
  font-stretch: 113%;
  line-height: 1.15;
}

.editorial-page h2::before { content: none; }
.page-section h3 { font-weight: 600; font-stretch: 109%; line-height: 1.3; }
.editorial-page :focus-visible { outline-color: #2c6aa0; }

.practice-list,
.region-list,
.service-lines { list-style: none; }

.practice-list li {
  padding-block: 16px;
  border-top: 1px solid var(--page-rule);
}

.practice-list h3 { margin-bottom: 4px; }
.practice-list li:last-child { padding-bottom: 0; }

.region-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 24px;
  font-weight: 600;
}

.region-list li { padding: 11px 0; border-top: 1px solid #becddd; }

.page-faq details {
  margin: 0;
  padding: 15px 0;
  border-top: 1px solid var(--page-rule);
  border-radius: 0;
  background: none;
}

.page-faq details:last-child { padding-bottom: 0; }
.page-faq summary { font-stretch: 109%; line-height: 1.4; }
.page-faq details p { margin-top: 8px; }

.service-line {
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1.18fr) minmax(0, .82fr);
  gap: 12px clamp(16px, 3.1vw, 46px);
  padding-block: clamp(24px, 3.3vw, 42px);
  border-top: 1px solid var(--page-rule);
}

.service-line:first-child { border-top: 0; padding-top: 0; }
.service-line:last-child { padding-bottom: 0; }

.service-number {
  color: #4b6a88;
  font: 600 1.08rem/1.6 Archivo, sans-serif;
  font-variant-numeric: tabular-nums;
}

.deliverables {
  align-self: start;
  padding-left: clamp(16px, 2vw, 28px);
  border-left: 1px solid var(--page-rule);
}

.deliverables h3 { color: #4b6a88; }
.deliverables ul { padding-left: 1.15em; color: #4a5d73; line-height: 1.5; }
.deliverables li + li { margin-top: 6px; }
.deliverables li::marker { color: #4b6a88; }

.page-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 6px;
  color: var(--navy);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: .2em;
}

.page-link:hover { color: #2c6aa0; }

@media (max-width: 760px) {
  .page-columns,
  .page-intro .page-columns { grid-template-columns: minmax(0, 1fr); }
  .page-intro .page-columns { gap: 14px; }
  .page-intro h1 { text-wrap: initial; }
  .service-line { grid-template-columns: 1.85rem minmax(0, 1fr); }
  .deliverables { grid-column: 2; padding-left: 0; border-left: 0; }
}
