/* Start a Project template. Rebuilt 2026-09-04 to follow mockup 06 exactly:
   the same calm shared hero pattern used across the interior templates,
   followed by a three-column form (details / interest checkboxes / free
   text) and a single-row submit strip. No pricing appears anywhere on this
   template — the pricing-vs-no-pricing conflict flagged in
   homepage-copy-master.md is still unresolved. No live form backend exists
   yet — the submit handler shows a same-page confirmation only (see
   bm-template.js, #startProjectForm / #startProjectStatus). */

.bmit-sp-form{
  display:grid; grid-template-columns:0.9fr 1fr 1fr; gap:clamp(28px,4vw,56px);
  padding-bottom:40px;
}
.bmit-sp-col{ display:flex; flex-direction:column; gap:18px; }
.bmit-sp-col-label{
  font-family:var(--font-mono); font-size:11px; letter-spacing:0.08em; font-weight:700;
  text-transform:uppercase; color:var(--carbon); opacity:0.55; margin-bottom:2px;
}

.bmit-sp-form label{ display:flex; flex-direction:column; gap:7px; font-size:13.5px; }
.bmit-sp-form label > span{ font-family:var(--font-mono); font-size:11px; letter-spacing:0.06em; font-weight:700; text-transform:uppercase; color:var(--carbon); }
.bmit-sp-form label > span em{ color:var(--red); font-style:normal; }
.bmit-sp-form input[type="text"],
.bmit-sp-form input[type="email"],
.bmit-sp-form select,
.bmit-sp-form textarea{
  border:2px solid var(--carbon); background:var(--snow); color:var(--carbon);
  font-family:var(--font-head); font-size:14.5px; padding:11px 13px;
  border-radius:0; appearance:none; -webkit-appearance:none;
}
.bmit-sp-form select{
  background-image:linear-gradient(45deg, transparent 50%, var(--carbon) 50%), linear-gradient(135deg, var(--carbon) 50%, transparent 50%);
  background-position:calc(100% - 18px) center, calc(100% - 13px) center;
  background-size:5px 5px, 5px 5px; background-repeat:no-repeat;
}
.bmit-sp-form input:focus, .bmit-sp-form select:focus, .bmit-sp-form textarea:focus{ outline:none; border-color:var(--red); }

.bmit-sp-checklist{ display:flex; flex-direction:column; gap:12px; }
.bmit-sp-check-option{ display:flex; align-items:flex-start; gap:9px; font-size:13.5px; line-height:1.35; cursor:pointer; }
.bmit-sp-check-option input{ accent-color:var(--red); margin-top:2px; }

.bmit-sp-textarea{ flex:1 1 auto; display:flex; flex-direction:column; gap:7px; }
.bmit-sp-textarea textarea{ flex:1 1 auto; min-height:220px; resize:vertical; }

.bmit-sp-submit-row{
  display:flex; align-items:center; gap:28px; flex-wrap:wrap;
  padding-top:32px; border-top:1px solid rgba(26,26,26,0.14);
  margin-bottom:96px;
}
.bmit-sp-submit{
  background:var(--red); color:var(--snow) !important; border:2px solid var(--carbon);
  font-family:var(--font-mono); font-weight:700; letter-spacing:0.08em; font-size:13px;
  padding:16px 32px; text-align:center; cursor:pointer;
}
.bmit-sp-expectation{ font-family:var(--font-mono); font-size:11.5px; opacity:0.6; }
.bmit-sp-status{ font-family:var(--font-mono); font-size:11px; color:var(--red); opacity:0; height:0; overflow:hidden; }
.bmit-sp-status.visible{ opacity:1; height:auto; }
.bmit-sp-form.sent input, .bmit-sp-form.sent select, .bmit-sp-form.sent textarea, .bmit-sp-form.sent button{ opacity:0.5; pointer-events:none; }

@media (max-width:900px){
  .bmit-sp-form{ grid-template-columns:1fr; gap:36px; }
}