:root { --ink:#0a0a0a; --paper:#fff; --mute:#6b6b6b; --hair:#d9d9d9; --neon:#00e5cf; --f:"Saira","Arial Narrow",sans-serif; }
* { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
html, body { background:var(--paper); color:var(--ink); }
body { font-family:var(--f); min-height:100vh; display:flex; flex-direction:column; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
::selection { background:var(--ink); color:var(--paper); }

.top { padding:6vh 5vw 0; display:flex; justify-content:space-between; align-items:baseline; }
.home { font-variation-settings:"wdth" 125; font-weight:700; font-size:1rem; letter-spacing:.08em; text-decoration:none; }
.back { font-variation-settings:"wdth" 112; font-size:.62rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; text-decoration:none; }
.back:hover { border-bottom:1.5px solid var(--ink); }

main { flex:1; width:min(34rem, 100% - 32px); margin:0 auto; padding:9vh 0 12vh; }
h1 { font-variation-settings:"wdth" 118; font-weight:700; font-size:clamp(1.6rem, 3.4vw, 2.5rem); line-height:1.05; letter-spacing:.03em; text-transform:uppercase; }
.lede { margin-top:1rem; font-variation-settings:"wdth" 80; font-size:1rem; line-height:1.65; color:var(--mute); }

form { margin-top:2.6rem; display:grid; gap:1.5rem; }
label { display:grid; gap:.5rem; }
label > span { font-variation-settings:"wdth" 112; font-size:.62rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; }
label > span i { font-style:normal; font-weight:500; color:var(--mute); letter-spacing:.14em; }
input, textarea {
  font:inherit; font-variation-settings:"wdth" 85; font-size:1rem; color:var(--ink);
  background:var(--paper); border:1.5px solid var(--ink); border-radius:0; padding:.75rem .85rem; width:100%;
  -webkit-appearance:none; appearance:none;
}
textarea { min-height:7.5rem; resize:vertical; line-height:1.5; }
input:focus, textarea:focus { outline:none; box-shadow:4px 4px 0 var(--ink); }
.hp { position:absolute; left:-9999px; }
button {
  justify-self:start; cursor:pointer; font:inherit; font-variation-settings:"wdth" 112; font-size:.78rem; font-weight:700;
  letter-spacing:.26em; text-transform:uppercase; color:var(--paper); background:var(--ink);
  border:1.5px solid var(--ink); border-radius:0; padding:.95rem 2.2rem; transition:.15s;
}
button:hover, button:focus-visible { background:var(--paper); color:var(--ink); outline:none; }
.note { font-variation-settings:"wdth" 80; font-size:.68rem; line-height:1.7; color:var(--mute); }

footer { border-top:1px solid var(--hair); margin:0 5vw; padding:1.6rem 0 2rem; font-variation-settings:"wdth" 80; font-size:.54rem; line-height:1.75; color:var(--mute); }
footer b { display:block; color:var(--ink); letter-spacing:.3em; text-transform:uppercase; font-size:.53rem; margin-bottom:.6rem; }
@media (max-width:820px) { .top { padding:5vh 16px 0; } footer { margin:0 16px; } main { padding:7vh 0 9vh; } }
