:root { color-scheme: dark; font-family: Arial, Helvetica, sans-serif; color: #f7f8f7; background: #101313; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; }
button, a { -webkit-tap-highlight-color: transparent; }
.backdrop, .shade, .grid { position: fixed; inset: 0; pointer-events: none; }
.backdrop { z-index: -4; overflow: hidden; }
.photograph { position: absolute; inset: -20px; background-size: cover; background-position: center; filter: saturate(.48); }
.shade { z-index: -3; background: linear-gradient(90deg, rgba(4,8,9,.7), rgba(4,8,9,.3)), linear-gradient(0deg, rgba(3,6,7,.83), rgba(5,8,9,.28) 55%, rgba(3,6,7,.42)); }
.grid { z-index: -2; }
.page { min-height: 100svh; display: flex; flex-direction: column; }
main { flex: 1; display: flex; align-items: center; padding: 70px 7vw 90px; }
.message { max-width: 800px; }
h1 { margin: 0; font-size: clamp(2.6rem, 5.5vw, 5.5rem); font-weight: 600; letter-spacing: -.055em; line-height: 1.08; }
.contact { margin-top: 32px; display: inline-flex; align-items: center; gap: 35px; min-height: 52px; padding: 0; border: 0; background: none; color: #fff; text-decoration: none; font-size: .9375rem; }
.contact:hover > span:first-child { text-decoration: underline; text-underline-offset: 5px; }
.contact svg { opacity: .8; }
:focus-visible { outline: 2px solid white; outline-offset: 6px; }
.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; }
@media (max-width: 600px) { main { padding-top: 70px; padding-bottom: 80px; } h1 { font-size: clamp(2.5rem, 10.4vw, 3.9rem); } }
