.container:has(.error-page) { padding-top: clamp(36px, 7vw, 88px); padding-bottom: 36px; }
.error-page { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items: center; gap: clamp(24px, 4vw, 54px); max-width: 1000px; margin: 0 auto; padding: clamp(28px, 4vw, 52px); border: 1px solid #e0e7eb; border-radius: 32px; background: #fff; box-shadow: 0 20px 65px #30495b08; }
.error-art { min-width: 0; padding: 8px; border-radius: 25px; background: #edf8f8; }
.error-art img { display: block; width: 100%; height: auto; }
.error-copy { min-width: 0; }
.error-status { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 18px; padding: 7px 11px; border-radius: 999px; background: #eaf6f6; color: #287e83; font-size: .78rem; font-weight: 750; letter-spacing: .04em; }
.error-status-dot { width: 6px; height: 6px; border-radius: 50%; background: #54bfc3; }
.error-copy h1 { margin: 0 0 18px; font-size: clamp(2.1rem, 4vw, 3.3rem); line-height: 1.04; letter-spacing: -.05em; text-wrap: balance; }
.error-description { max-width: 43ch; margin: 0; color: #626d72; font-size: 1rem; line-height: 1.65; }
.error-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; margin-top: 28px; }
.error-actions .button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border-radius: 12px; background: #54bfc3; color: #112a2c; font-size: .94rem; }
.error-actions .button:hover { background: #43aeb3; }
.error-actions .button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.error-secondary { display: inline-flex; align-items: center; gap: 8px; padding: 10px 0; color: #39777d; font-size: .9rem; font-weight: 650; text-decoration: none; }
.error-secondary:hover { text-decoration: underline; text-underline-offset: 4px; }
.error-actions a:focus-visible { outline: 2px solid #287e83; outline-offset: 5px; }
.error-footer { margin: 25px auto 0; max-width: 45ch; padding: 0 12px; text-align: center; color: #727780; font-size: .87rem; line-height: 1.5; }
@media (max-width: 760px) {
  .error-page { grid-template-columns: minmax(0, 1fr); max-width: 520px; gap: 26px; padding: 28px; border-radius: 26px; }
  .error-art { width: 100%; max-width: 290px; margin: 0 auto; }
  .error-copy { text-align: center; }
  .error-description { margin-inline: auto; }
  .error-actions { justify-content: center; }
}
@media (max-width: 400px) {
  .container:has(.error-page) { padding: 28px 16px; }
  .error-page { padding: 22px; gap: 22px; }
  .error-copy h1 { font-size: 2rem; }
  .error-description { font-size: .94rem; }
  .error-actions { gap: 8px 18px; }
}