:root{
  --bg:#0b1117; --panel:#121821; --text:#e6edf3; --muted:#9aa6b2; --line:#1f2937;
  --brand:#22c55e; --brand-2:#16a34a; --btn-txt:#0b1117;
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
a{color:var(--brand);text-decoration:none} a:hover{opacity:.9}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
.header{position:sticky;top:0;z-index:10;background:rgba(11,17,23,.9);backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{font-weight:800;font-size:20px}
.nav a{margin-left:18px}
h1{font-size:48px;line-height:1.1;margin:28px 0 8px}
h2{font-size:22px;margin:0 0 8px} h3{font-size:18px;margin:0}
.note{color:var(--muted)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:18px}
.btn{display:inline-block;background:transparent;border:1px solid var(--brand);color:var(--brand);
     padding:10px 16px;border-radius:12px;font-weight:600}
.btn.primary{background:var(--brand);color:var(--btn-txt);border-color:var(--brand-2)}
.prose p{margin:0 0 10px}
input,textarea,select{background:#0f141c;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:10px}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:.85}

/* Make controls fill the grid cell width */
.contact-card label{ display:block; }
.contact-card input,
.contact-card textarea{ width:100%; }

/* Ensure the “How can we help?” row spans both columns */
.contact-grid .span-2{ grid-column: 1 / -1; }

/* Optional: make the textarea a bit taller on desktop */
@media (min-width: 760px){
  .contact-grid .span-2 textarea{ min-height: 180px; }
}