* { box-sizing: border-box; }
:root { color: #201a17; background: #f5ecd6; font-family: 'Nunito', sans-serif; }
body { margin: 0; background-image: radial-gradient(#201a1710 1px, transparent 1px); background-size: 26px 26px; }
main { max-width: 760px; margin: auto; padding: 24px 24px 48px; text-align: center; }
.brand { display: inline-block; }
.brand img { display: block; width: 130px; height: auto; }
.error-number { display: flex; justify-content: center; gap: 10px; margin: 12px 0 0; font: 700 clamp(100px, 20vw, 160px)/1 'Fredoka', sans-serif; }
.error-number span { color: #f47b28; -webkit-text-stroke: 3px #201a17; text-shadow: 5px 6px 0 #201a17; transform: rotate(-9deg); }
.error-number span:nth-child(2) { color: #a98fd0; transform: rotate(6deg) translateY(5px); }
.error-number span:nth-child(3) { color: #5aa0db; transform: rotate(10deg); }
h1 { font: 600 clamp(30px, 6vw, 44px)/1.05 'Fredoka', sans-serif; margin: 24px 0 14px; }
.intro { font-size: 16px; line-height: 1.5; margin: 0 0 24px; }
.home-button { display: inline-block; padding: 13px 24px; border: 3px solid #201a17; border-radius: 12px; background: #b7ce3c; box-shadow: 4px 4px 0 #201a17; color: inherit; text-decoration: none; font-weight: 800; }
section { margin-top: 40px; }
h2 { font: 500 18px/1.3 'Fredoka', sans-serif; margin: 0 0 18px; }
.suggestions { display: grid; grid-template-columns: repeat(3, minmax(0, 160px)); justify-content: center; gap: 18px; }
.suggestions a { border: 3px solid #201a17; border-radius: 13px; overflow: hidden; box-shadow: 4px 4px 0 #201a17; transition: transform 150ms ease; }
.suggestions img { display: block; width: 100%; height: auto; }
.suggestions a:hover { transform: translateY(-5px) rotate(-2deg); }
a:focus-visible { outline: 4px solid #f0563e; outline-offset: 6px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 420px) { main { padding: 20px 18px 36px; } .suggestions { gap: 12px; } .intro { font-size: 14px; } }
@media (prefers-reduced-motion: reduce) { .suggestions a { transition: none; } }
