/* ==========================================================================
   Contact — measured from tallorder.vc/contact-us @1440px
   frame 1312 = rail 96 + column 1120 + rail 96
   card grid 2 x 560, form bg --chip, fields 40px tall, radius 8
   ========================================================================== */

/* ---- rails — off ----
   The dots live outside the frame now (styles.css draws them in the gutters), and
   this page was the last live one still carrying the older inside-the-frame pair.
   Both together read as one 161px band of dots either side, cut in half by the
   frame's own rule, and they pushed this page's heading to 194 while the wordmark
   above it sat on 105.

   The markup is untouched — .railed / .rail / .rail-col are all still in
   contact.html — so this is the only thing standing between the page and the old
   layout. The column's own side borders go too: with the rails gone they would
   land on top of the frame's borders and draw them twice. */
.railed{display:block}
.rail{display:none}
.rail-col{min-width:0}

/* ---- top block ---- */
.c-form-wrap{padding:40px 0}
.c-grid{
  display:grid;grid-template-columns:1fr 1fr;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}

/* left ------------------------------------------------------------------ */
.c-intro{
  /* --pad on the sides, not 32px: this cell holds the page's heading, so its left
     inset is the site's left edge. The form beside it keeps 32px — it is a filled
     panel, and panel padding is its own business. */
  padding:32px var(--pad);
  border-right:1px solid var(--border);
  display:flex;flex-direction:column;justify-content:space-between;gap:32px;
}
.c-intro h1{
  font-family:var(--font-body);font-weight:600;
  font-size:24px;line-height:28px;letter-spacing:.005em;
  text-transform:none;
}
.c-intro .lead{margin-top:12px;color:var(--muted);font-size:16px;line-height:24px}
.c-intro .note{color:var(--muted);font-size:12px;line-height:16px}

/* right — form ----------------------------------------------------------- */
.c-form{
  background:var(--chip);
  padding:32px;
  display:flex;flex-direction:column;gap:24px;
}
.c-fields{display:grid;grid-template-columns:1fr 1fr;column-gap:20px;row-gap:12px}
.c-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.c-field.full{grid-column:1 / -1}
.c-field > span.lbl{font-size:14px;line-height:20px;font-weight:500;color:var(--muted)}
.c-field input,
.c-field textarea,
.c-field select{
  width:100%;
  background:var(--chip);
  border:none;
  box-shadow:inset 0 0 0 1px #292524;   /* drawn inside → 40px total height */
  border-radius:0;
  padding:10px 12px;
  font-family:var(--font-body);font-size:14px;line-height:20px;font-weight:400;
  color:var(--text);
  outline:none;
  transition:box-shadow .18s;
}
.c-field input{height:40px}
.c-field select{
  height:40px;cursor:pointer;
  appearance:none;-webkit-appearance:none;
  padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23a8a29e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
}
.c-field select option{background:var(--surface);color:var(--text)}
.c-field textarea{height:116px;resize:none;display:block}
.c-field input::placeholder,
.c-field textarea::placeholder{color:var(--muted-2)}
.c-field input:focus,
.c-field textarea:focus,
.c-field select:focus{box-shadow:inset 0 0 0 1px var(--muted-2)}
.c-field .err{
  font-size:12px;line-height:16px;color:var(--accent);
  visibility:hidden;user-select:none;pointer-events:none;
}

/* Send failed — the network, not the reader. Sits above the foot, in the same
   accent the field errors use so the two read as one system. */
.c-sendfail{
  grid-column:1 / -1;margin:0 0 20px;
  font-size:13px;line-height:20px;color:var(--accent);
}
.c-sendfail[hidden]{display:none}
.c-sendfail a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}

/* The privacy tick has no .err span to reveal — it is one line in the foot, not
   a field — so the box itself carries the mark. */
.c-consent.bad input[type=checkbox]{box-shadow:inset 0 0 0 1px var(--accent)}
.c-consent.bad{color:var(--accent)}

.c-formfoot{display:flex;align-items:center;justify-content:space-between;gap:24px}
.c-consent{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;line-height:20px}
.c-consent input[type=checkbox]{
  appearance:none;-webkit-appearance:none;
  width:16px;height:16px;flex:none;
  border-radius:0;background:var(--chip);
  box-shadow:inset 0 0 0 1px #292524;
  cursor:pointer;position:relative;
}
.c-consent input[type=checkbox]:checked{background:var(--white);box-shadow:none}
.c-consent input[type=checkbox]:checked::after{
  content:"";position:absolute;left:5px;top:2px;width:4px;height:8px;
  border:solid var(--surface);border-width:0 2px 2px 0;transform:rotate(45deg);
}
.c-consent a{color:var(--text);text-decoration:underline;text-underline-offset:2px}
.c-submit{
  width:100px;height:32px;flex:none;
  border-radius:0;background:var(--white);color:var(--surface);
  font-size:14px;line-height:20px;font-weight:500;
  display:flex;align-items:center;justify-content:center;
  transition:opacity .18s;
}
.c-submit:hover{opacity:.88}

/* ---- second block — direct emails ---- */
.c-emails-wrap{padding:0 0 40px}
.c-emails{
  padding:32px;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
}
.c-emails .pairs{display:flex;gap:12px}
.c-emails .keys,
.c-emails .vals{display:flex;flex-direction:column;gap:4px}
.c-emails .keys span,
.c-emails .vals a{
  font-family:var(--font-mono);font-size:12px;line-height:16px;font-weight:500;
  white-space:nowrap;
}
.c-emails .keys span{color:var(--muted)}
.c-emails .vals a{color:var(--text);transition:color .18s}
.c-emails .vals a:hover{color:var(--muted)}
.c-social{display:flex;gap:8px;flex:none}
.c-social a{
  width:32px;height:32px;border-radius:0;background:var(--surface);
  display:flex;align-items:center;justify-content:center;color:var(--text);
  transition:background .18s;
}
.c-social a:hover{background:#262220}
.c-social svg{width:16px;height:16px}

/* ---- responsive ---- */
@media (max-width:1100px){
  .rail{display:none}
  .rail-col{border-left:none;border-right:none}
  .c-grid{grid-template-columns:1fr}
  .c-intro{border-right:none;border-bottom:1px solid var(--border);padding:32px 20px;gap:20px}
  .c-form{padding:20px}
  .c-emails{padding:30px;flex-wrap:wrap}
}
@media (max-width:620px){
  .c-fields{grid-template-columns:1fr}
  .c-formfoot{flex-direction:column;align-items:flex-start;gap:16px}
  .c-submit{width:100%}
  .c-emails{flex-direction:column;align-items:flex-start;gap:24px}
}

/* Wholesale declaration — investor enquiries only. Fund interests are s708
   wholesale-only, so this gate appears before the general consent line. */
.c-wholesale{border-top:1px solid var(--border);padding:20px 0 4px;margin-top:8px}
.c-wholesale-note{color:var(--muted-2);font-size:13px;line-height:20px;margin:10px 0 0;max-width:64ch}

/* Founder redirect — replaces the form body when someone says they are raising.
   The pitch form asks the right questions, so this is a door, not a dead end. */
.c-redirect{grid-column:1 / -1;padding:4px 0 8px}
.c-redirect h2{font-size:22px;line-height:28px;font-weight:600;letter-spacing:-.01em;margin:0 0 10px}
.c-redirect p{color:var(--muted);font-size:15px;line-height:24px;margin:0 0 20px;max-width:52ch}
.c-redirect-btn{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--white);color:var(--surface);
  padding:12px 20px;font-size:14px;line-height:20px;font-weight:500;
}
.c-redirect-btn:hover{opacity:.9}
.c-redirect p.c-redirect-alt{margin:24px 0 0;font-size:13px;line-height:20px;color:var(--muted-2)}
.c-linkish{
  background:none;border:0;padding:0;font:inherit;color:var(--muted);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer;
}
.c-linkish:hover{color:var(--text)}
