/* Only additional CMS utilities. Approved frontend geometry is inherited unchanged. */
.advise-pagination {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
}
.advise-pagination [aria-current="page"] {
  background: var(--brand);
  color: #fff;
}

/* Shared service-page design, using the approved site's colour and button tokens. */
.error-hero {
  background: #f3f4f4;
  padding-block: clamp(48px, 7vw, 100px);
}
.error-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  gap: clamp(24px, 5vw, 80px);
  align-items: center;
}
.error-copy { min-width: 0; }
.error-label {
  margin: 0 0 20px;
  color: var(--brand);
  font-size: 16px;
}
.error-copy .interior-lead { max-width: 52ch; }
.error-visual {
  min-height: 330px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  border: 1px solid #b9d0ce;
  border-radius: 28px;
  background: linear-gradient(145deg, #eaf3f2, #dcebea);
}
.error-visual img {
  position: absolute;
  right: -15px;
  top: -30px;
  width: 200px;
  height: 245px;
  opacity: .08;
  transform: rotate(12deg);
}
.error-number {
  position: relative;
  color: #008080;
  font-size: clamp(110px, 15vw, 230px);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -.045em;
}
.error-visual-label { color: #537574; font-size: 16px; letter-spacing: .12em; }
@media (max-width: 700px) {
  .error-layout { grid-template-columns: minmax(0, 1fr); }
  .error-visual { min-height: 180px; }
  .error-number { font-size: 115px; }
  .error-visual img { width: 140px; height: 180px; }
  .error-copy .interior-actions { flex-wrap: wrap; }
}
