@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;700&display=swap');

:root { color: #f3f4f6; background: #17191f; font-family: Manrope, system-ui, sans-serif; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 18% 12%, #38415f 0, transparent 31rem), radial-gradient(circle at 88% 88%, #3d2849 0, transparent 28rem), #17191f; }
main { width: min(38rem, calc(100vw - 3rem)); padding: 2rem 0; }
.eyebrow { margin: 0 0 1.1rem; color: #b8bdd0; font: 500 .72rem/1.2 'DM Mono', monospace; letter-spacing: .09em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(4rem, 14vw, 8rem); line-height: .9; letter-spacing: -.09em; }
.message { max-width: 24rem; margin: 1.5rem 0 2rem; color: #c9cdd8; font-size: clamp(1.05rem, 3vw, 1.3rem); line-height: 1.5; }
.chat-link { display: inline-flex; gap: .5rem; align-items: center; padding: .8rem 1rem; color: #17191f; background: #f3f4f6; border-radius: .45rem; font-weight: 700; text-decoration: none; transition: transform .16s ease, background .16s ease; }
.chat-link:hover, .chat-link:focus-visible { background: #d7dcff; transform: translateY(-2px); }
@media (max-width: 520px) { main { width: min(100% - 2.5rem, 32rem); } }