@font-face{font-family:Inter;src:url('/assets/inter-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Inter;src:url('/assets/inter-bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
:root{--accent:#00cda5;--accent-glow:#00cda566;--field:#0d0d0d;--field-border:#202020;--label:#4a494a;--muted:#8a8a8f}
*{box-sizing:border-box}
html,body{margin:0;background:#000;color:#f9f9f9;font-family:Inter,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit}
.skip-link{position:fixed;z-index:30;top:8px;left:12px;padding:12px 14px;border-radius:8px;background:var(--accent);color:#fff;transform:translateY(-160%)}
.skip-link:focus{transform:translateY(0)}

/* Header: logo at left, links and emerald-teal pill at right. */
.site-header{position:relative;z-index:10;height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,5.2vw,100px);background:#000}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.brand img{width:46px;height:44px;object-fit:contain}
.brand span{font:700 22px/1 Inter,sans-serif;letter-spacing:-.02em}
.primary-nav{display:flex;align-items:center;gap:36px}
.primary-nav a{font:700 17px/1 Inter,sans-serif;color:#bababa;transition:color .18s ease}
.primary-nav a:hover{color:#fff}
.primary-nav a[aria-current=page]{color:#fff}
.primary-nav .nav-cta{display:inline-flex;align-items:center;height:50px;padding:0 33px;border-radius:999px;background:var(--accent);color:#fff;box-shadow:0 0 22px var(--accent-glow);transition:transform .18s ease,box-shadow .18s ease}
.primary-nav .nav-cta:hover{transform:translateY(-2px);box-shadow:0 0 30px var(--accent-glow)}
.menu-toggle{display:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Two columns: copy and form at left, watermark panel at right. */
.contact-layout{position:relative;min-height:calc(100svh - 96px - 120px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0}
.contact-main{width:min(620px,100%);padding:clamp(40px,6vw,96px) 0 80px clamp(24px,8.4vw,160px)}
.eyebrow{margin:0 0 22px;color:var(--accent);font:700 13px/1.4 Inter,sans-serif;letter-spacing:.32em;text-transform:uppercase}
.contact-main h1{margin:0;font:700 clamp(48px,5.2vw,68px)/1.06 Inter,sans-serif;letter-spacing:-.03em;color:#f9f9f9}
.lede{max-width:560px;margin:24px 0 0;color:#c8c8cc;font:400 18px/1.6 Inter,sans-serif}

/* Hiring callout: sits above the form so applicants don't send an application through it. */
.hiring-callout{position:relative;margin:36px 0 0;padding:26px 28px 28px;border:1px solid #00cda54d;border-radius:16px;background:linear-gradient(150deg,#00cda526,#00cda50a 55%,#070707);box-shadow:0 0 40px #00cda51f}
.hiring-badge{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;color:var(--accent);font:700 12px/1 Inter,sans-serif;letter-spacing:.22em;text-transform:uppercase}
.hiring-dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.hiring-callout h2{margin:0;color:#f9f9f9;font:700 clamp(24px,2.4vw,30px)/1.15 Inter,sans-serif;letter-spacing:-.02em}
.hiring-copy{max-width:520px;margin:12px 0 20px;color:#c8c8cc;font:400 16px/1.6 Inter,sans-serif}
.hiring-link{display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:0 26px;border:1px solid var(--accent);border-radius:999px;background:#00cda51a;color:#eafff9;font:700 15px/1 Inter,sans-serif;transition:background .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease}
.hiring-link:hover{background:var(--accent);color:#fff;transform:translateY(-2px);box-shadow:0 0 28px var(--accent-glow)}
.hiring-link svg{width:16px;height:16px}

.contact-form{margin-top:44px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.form-field .form-row{margin:0}
.form-field{display:grid;gap:10px;margin-bottom:22px}
.form-row .form-field{margin-bottom:22px}
.form-field label{color:var(--label);font:700 12px/1.3 Inter,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.form-field input,.form-field textarea{width:100%;min-height:56px;padding:14px 16px;border:1px solid var(--field-border);border-radius:10px;background:var(--field);color:#f9f9f9;font:400 16px/1.4 Inter,sans-serif;transition:border-color .18s ease,box-shadow .18s ease}
.form-field textarea{min-height:170px;resize:vertical}.form-field select{width:100%;min-height:56px;padding:14px 16px;border:1px solid var(--field-border);border-radius:10px;background:var(--field);color:#8a8a8f;font:400 16px/1.4 Inter,sans-serif;appearance:none;background-image:linear-gradient(45deg,transparent 50%,#9a9aa0 50%),linear-gradient(135deg,#9a9aa0 50%,transparent 50%);background-position:calc(100% - 22px) 52%,calc(100% - 16px) 52%;background-size:6px 6px;background-repeat:no-repeat}.form-field select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #00cda533}.form-field select.has-value,.form-field select:focus{color:#f9f9f9}
.form-field input::placeholder,.form-field textarea::placeholder{color:#55555a;opacity:1}
.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #00cda533}
.form-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.form-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.send-button{min-height:52px;display:inline-flex;align-items:center;gap:12px;padding:0 28px;border:0;border-radius:999px;background:var(--accent);color:#fff;font:700 16px/1 Inter,sans-serif;cursor:pointer;box-shadow:0 0 24px var(--accent-glow);transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease}
.send-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 0 34px var(--accent-glow)}
.send-button:disabled{cursor:wait;opacity:.7}
.send-button svg{width:18px;height:18px}
.form-privacy{margin:0;color:var(--muted);font:400 14px/1.5 Inter,sans-serif}
.form-status{min-height:1.5em;margin:18px 0 0;color:#b5b5ba;font:400 14px/1.5 Inter,sans-serif}
.form-status[data-state=success]{color:#6ff0b0}
.form-status[data-state=error]{color:#ff9e95}


/* Right panel: a watermark grid over a faint emerald-teal glow, as in the reference. */
.contact-panel{position:relative;overflow:hidden;border-left:1px solid #141414;background:radial-gradient(ellipse at 50% 50%,#00cda514,transparent 62%),#000}
.panel-grid{position:absolute;inset:-60px;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:150px;align-content:center;justify-items:center;align-items:center;gap:0;transform:rotate(-6deg);pointer-events:none}
.panel-grid span{display:flex;flex-direction:column;align-items:center;gap:8px;opacity:.5}
.panel-grid span.is-offset{transform:translateX(70px)}
.panel-grid img{width:44px;height:42px;opacity:.35;filter:saturate(.4)}
.panel-grid b{font:700 13px/1 Inter,sans-serif;letter-spacing:.02em;color:#1d4fa3}
.panel-grid span:nth-child(3n+2) b{color:#1a1d24}

/* Footer: logo and links on one row, copyright beneath a divider. */
.site-footer{padding:0 clamp(24px,8.4vw,160px) 28px;border-top:1px solid #0000}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 0;border-top:1px solid #262626}
.footer-brand{display:flex;align-items:center;gap:10px;font:700 17px/1 Inter,sans-serif;color:#f9f9f9}
.footer-brand img{width:30px;height:29px}
.site-footer nav{display:flex;gap:30px}
.site-footer nav a{font:500 15px/1 Inter,sans-serif;color:#dadada}
.site-footer nav a:hover{color:#fff}
.copyright{margin:0;text-align:center;color:#3a7299;font:400 14px/1.4 Inter,sans-serif}

@media(max-width:900px){
  .contact-layout{grid-template-columns:1fr;min-height:0}
  .contact-panel{display:none}
  .contact-main{width:100%;padding:56px clamp(24px,6vw,64px) 56px}
  .primary-nav{gap:22px}
}
@media(max-width:600px){
  .site-header{height:auto;padding:18px 20px;flex-wrap:wrap;gap:12px}
  .menu-toggle{display:flex;width:44px;height:44px;padding:11px 10px;flex-direction:column;justify-content:space-between;border:1px solid #ffffff20;border-radius:10px;background:#101010;cursor:pointer}
  .menu-toggle span{width:100%;height:2px;border-radius:1px;background:#e6e6e6}
  .primary-nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:12px;padding-top:6px}
  .primary-nav.is-open{display:flex}
  .primary-nav a{font-size:16px;padding:10px 0}
  .primary-nav .nav-cta{justify-content:center;height:50px}
  .form-row{grid-template-columns:1fr;gap:0}
  .contact-main h1{font-size:40px}
  .lede{font-size:16px}
  .hiring-callout{padding:22px 20px 24px}
  .hiring-link{width:100%;justify-content:center}
  .site-footer{padding:0 20px 24px}
  .footer-inner{flex-direction:column;align-items:flex-start;gap:16px}
  .send-button{width:100%;justify-content:center}
  .form-actions{flex-direction:column;align-items:stretch}
}
