:root {
    --color-black: #101010;
    --color-black-soft: #1a1816;
    --color-white: #fff;
    --color-paper: #f7f5f1;
    --color-border: #eadfce;
    --color-text: #171411;
    --color-muted: #69615a;
    --color-orange: #ff7900;
    --color-orange-strong: #eb5b00;
    --color-gold: #ffc400;
    --header-top-height: 70px;
    --header-nav-height: 46px;
    --header-height: calc(var(--header-top-height) + var(--header-nav-height));
    --container: 1240px;
    --shadow-soft: 0 18px 55px rgba(22, 13, 5, .12);
    font-family: Arial, Helvetica, sans-serif;
    color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; padding-top: var(--header-height); background: var(--color-white); color: var(--color-text); overflow-x: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }

.container { width: min(var(--container), calc(100% - 64px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 9999; top: 8px; left: 8px; padding: 10px 14px; transform: translateY(-150%); background: #fff; color: #000; }
.skip-link:focus { transform: translateY(0); }

.button { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; padding: 0 24px; border: 1px solid transparent; border-radius: 7px; font-size: .92rem; font-weight: 800; letter-spacing: .02em; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.button:hover { transform: translateY(-2px); }
.button--primary { background: var(--color-orange); color: #fff; box-shadow: 0 14px 30px rgba(255,121,0,.25); }
.button--primary:hover { background: #ff8b1d; box-shadow: 0 18px 38px rgba(255,121,0,.32); }

.status-page { min-height: 55vh; display: grid; place-content: center; justify-items: start; padding-block: 90px; }
.status-page__code { margin: 0 0 12px; color: var(--color-orange); font-size: .75rem; font-weight: 900; letter-spacing: .28em; }
.status-page h1 { margin: 0 0 16px; font-size: clamp(2.3rem, 6vw, 5rem); line-height: .95; }
.status-page p:not(.status-page__code) { max-width: 620px; margin: 0 0 28px; color: var(--color-muted); line-height: 1.7; }

@media (max-width: 768px) {
    :root { --header-top-height: 74px; --header-nav-height: 0px; }
    .container { width: min(100% - 28px, 620px); }
    .button { min-height: 48px; padding-inline: 20px; font-size: .86rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}