* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; font-family: 'Segoe UI', system-ui, -apple-system, Arial, sans-serif; }
.page { position: relative; min-height: 100vh; overflow: hidden; }
.bg { position: fixed; inset: 0; background-size: cover; background-position: center; filter: saturate(110%) contrast(110%) brightness(0.9); transform: scale(1.02); }
.overlay { position: relative; z-index: 1; min-height: 100vh; background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.35) 30%, rgba(0,0,0,.6) 100%); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 4vh 4vw; text-align: center; }
h1 { font-size: clamp(28px, 4.2vh, 56px); letter-spacing: .5px; color: #fff; text-shadow: 0 8px 24px rgba(0,0,0,.6); margin: 0 0 2vh; }
p.lede { max-width: 700px; color: #f1f1f1; opacity: .95; font-size: clamp(16px, 2.2vh, 22px); margin: 0 auto 3vh; }
.grid { display: grid; gap: 1.6vh; width: min(440px, 90vw); }
.button, button { display: block; width: 100%; padding: 1.2em 1.1em; border-radius: 14px; background: rgba(18,18,20,.78); color: #fff; border: 1px solid rgba(255,215,0,.35); text-decoration: none; font-size: clamp(16px, 2.4vh, 22px); letter-spacing: .3px; backdrop-filter: blur(6px); box-shadow: 0 6px 18px rgba(0,0,0,.35); transition: transform .08s ease, background .25s ease, box-shadow .25s ease; }
.button:hover, button:hover { transform: translateY(-1px); background: rgba(24,24,28,.9); box-shadow: 0 10px 26px rgba(0,0,0,.45); }
.form-card { width: min(520px, 92vw); padding: 2.2em; border-radius: 16px; background: rgba(18,18,20,.72); border: 1px solid rgba(255,215,0,.28); box-shadow: 0 10px 30px rgba(0,0,0,.5); }
label { display: block; text-align: left; color: #f8f8f8; margin: .4em 0 .2em; font-size: 0.95em; }
input, textarea { width: 100%; padding: .95em 1em; border-radius: 12px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; font-size: 1em; outline: none; }
textarea { min-height: 120px; resize: vertical; }
.actions { margin-top: 1em; display: grid; gap: .8em; }
.small { margin-top: 2vh; font-size: .9em; color: #ddd; opacity: .85; }
.topnav { position: fixed; top: 2vh; left: 50%; transform: translateX(-50%); z-index: 2; display: flex; gap: .8em; }
.topnav a { padding: .6em 1em; border-radius: 999px; background: rgba(0,0,0,.45); color: #fff; text-decoration: none; border: 1px solid rgba(255,255,255,.2); font-size: .95em; }
.footer { position: fixed; bottom: 2vh; left: 50%; transform: translateX(-50%); z-index: 2; color: #fff; opacity: .85; font-size: .9em; }