:root{
  --bg:#0d0d0e;
  --bg-soft:#141416;
  --ink:#f0ede6;
  --ink-dim:rgba(240,237,230,.55);
  --ink-faint:rgba(240,237,230,.18);
  --acid:#d4ff4f;
  --font-display:'Syne',sans-serif;
  --font-body:'Inter',sans-serif;
  --font-mono:'JetBrains Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
  background:var(--bg);color:var(--ink);
  font-family:var(--font-body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
  min-height:100svh;display:flex;flex-direction:column;
}
::selection{background:var(--acid);color:#0d0d0e}
a{color:inherit;text-decoration:none}

.nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:1.6rem 3vw;
}
.nav .logo{font-family:var(--font-display);font-weight:800;font-size:1.25rem;letter-spacing:-.02em}
.nav .back{
  font-family:var(--font-mono);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-dim);transition:color .3s;
}
.nav .back:hover{color:var(--ink)}

main{
  flex:1;display:flex;flex-direction:column;align-items:center;
  padding:6vh 5vw 10vh;
}
.page-tag{
  font-family:var(--font-mono);font-size:.78rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-dim);margin-bottom:2.5vh;
  display:flex;align-items:center;gap:.8rem;
}
.page-tag::before,.page-tag::after{content:"";width:36px;height:1px;background:var(--acid);display:inline-block}
h1{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  font-size:clamp(2.4rem,6.5vw,6rem);line-height:.95;letter-spacing:-.03em;
  text-align:center;
}
h1 .hollow{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.sub{
  color:var(--ink-dim);text-align:center;max-width:46ch;
  margin-top:2.5vh;font-size:clamp(.95rem,1.2vw,1.1rem);
}

.contact-form{
  width:min(640px,100%);margin-top:6vh;
  display:flex;flex-direction:column;gap:1.2rem;
  animation:rise .7s cubic-bezier(.25,.1,.25,1) both;
}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media (max-width:640px){.cf-row{grid-template-columns:1fr}}
label{display:flex;flex-direction:column;gap:.5rem}
label span{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim)}
label span i{font-style:normal;color:rgba(240,237,230,.35);text-transform:none;letter-spacing:.05em}
input,textarea,select{
  background:var(--bg-soft);border:1px solid var(--ink-faint);border-radius:12px;
  padding:1rem 1.1rem;color:var(--ink);font-family:var(--font-body);font-size:1rem;
  transition:border-color .3s;resize:vertical;width:100%;
}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23d4ff4f' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1.1rem center;cursor:pointer}
select:invalid{color:rgba(240,237,230,.35)}
option{color:#0d0d0e;background:#fff}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--acid)}
input::placeholder,textarea::placeholder{color:rgba(240,237,230,.35)}
.cf-honey{position:absolute;left:-9999px;opacity:0}
.submit{
  margin:1.5rem auto 0;display:inline-flex;align-items:center;gap:1rem;
  background:var(--acid);color:#0d0d0e;border:none;border-radius:99px;cursor:pointer;
  font-family:var(--font-mono);font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;
  padding:1.4rem 3rem;transition:background .3s,transform .3s;
}
.submit:hover{background:#fff;transform:translateY(-2px)}
.submit:disabled{opacity:.5;cursor:default;transform:none}
.cf-status{font-family:var(--font-mono);font-size:.85rem;text-align:center;color:var(--acid);min-height:1.4em;letter-spacing:.05em}

.sent{
  display:none;flex-direction:column;align-items:center;gap:2.5vh;margin-top:8vh;text-align:center;
  animation:rise .7s cubic-bezier(.25,.1,.25,1) both;
}
.sent h2{
  font-family:var(--font-display);font-weight:800;text-transform:uppercase;
  font-size:clamp(2.4rem,7vw,6rem);line-height:.95;letter-spacing:-.03em;color:var(--acid);
}
.sent p{color:var(--ink-dim);max-width:40ch}
.sent a{border-bottom:2px solid var(--acid);padding-bottom:.2rem;font-family:var(--font-display);font-weight:700;text-transform:uppercase}

.foot{
  padding:3vh 3vw;display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;
  font-family:var(--font-mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(240,237,230,.72);
  border-top:1px solid var(--ink-faint);
}
.foot a:hover{color:var(--ink)}
.cf-turnstile{margin:0 auto}
.cf-note{text-align:center;font-size:.8rem;color:rgba(240,237,230,.45)}
.cf-note a{text-decoration:underline}
