/* 404 page: the logo's hands and red dot, a short message and three ways back in. */
.tth-404 { background: var(--wp--preset--color--cream); }
.tth-404__inner { max-width: 640px; margin: 0 auto; padding: 72px 20px 150px; text-align: center; }
.tth-404 .tth-404__title { margin: 0; font-size: var(--tth-fs-h1); line-height: 1.06; }
.tth-404 .tth-404__lead { margin: 16px 0 0; color: var(--wp--preset--color--muted); font-size: var(--tth-fs-lead); line-height: 1.6; }
.tth-404__btns { margin-top: 32px; gap: 12px; }
.tth-404 .is-style-outline > .wp-block-button__link {
  border: 1.5px solid #C9D3DF; background: transparent; color: var(--wp--preset--color--navy);
  padding: 13.5px 20.5px;
}
.tth-404 .is-style-outline > .wp-block-button__link:is(:hover, :focus-visible) {
  border-color: var(--wp--preset--color--navy-2); background: var(--wp--preset--color--soft); color: var(--wp--preset--color--navy-2);
}

/* Brand mark: hands with the red dot between them */
.tth-mark { position: relative; width: 92px; aspect-ratio: 243 / 263; margin: 0 auto 28px; }
.tth-mark img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }

@media (max-width: 520px) {
  .tth-404__inner { padding: 48px 16px 130px; }
  .tth-mark { width: 72px; }
  .tth-404__btns > .wp-block-button { flex: 1 1 100%; }
  .tth-404__btns .wp-block-button__link { width: 100%; }
}