/* Verapath marketing — Contact / Request-a-Demo page styles (V8 inline <style>) (design_handoff_v8). */
.B.pg-contact .demo-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:start}
@media(max-width:920px){.B.pg-contact .demo-grid{grid-template-columns:1fr;gap:40px}}

/* left rail */
.B.pg-contact .steps{margin-top:2.4rem;display:flex;flex-direction:column;gap:0}
.B.pg-contact .step{display:flex;gap:18px;padding:20px 0;border-top:1px solid var(--line)}
.B.pg-contact .step .n{width:34px;height:34px;border-radius:50%;border:1px solid color-mix(in srgb,var(--green) 45%,transparent);
  color:var(--green);display:grid;place-items:center;font-family:var(--serif);flex:none}
.B.pg-contact .step h4{font-weight:650;font-size:1rem}
.B.pg-contact .step p{color:var(--mute);font-size:.92rem;margin-top:.25rem}
.B.pg-contact .quote{margin-top:2.2rem;border-left:2px solid var(--green);padding-left:18px;font-family:var(--serif);font-style:italic;
  font-size:1.15rem;color:var(--ink);line-height:1.5}
.B.pg-contact .quote small{display:block;font-family:var(--sans);font-style:normal;color:var(--mute);margin-top:.6rem;font-size:.82rem}

/* form card */
.B.pg-contact .formcard{border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;
  background:#ffffff;position:relative}
.B.pg-contact .formhead{display:flex;align-items:center;gap:10px;padding:16px 22px;border-bottom:1px solid var(--line);background:var(--mint-2)}
.B.pg-contact .formhead .dot{width:9px;height:9px;border-radius:50%;background:var(--mute-2)}
.B.pg-contact .formhead .tt{margin-left:8px;font-size:.8rem;color:var(--mute);font-weight:650;letter-spacing:.06em}
.B.pg-contact .formhead .sec{margin-left:auto;display:inline-flex;align-items:center;gap:.45rem;font-size:.74rem;color:var(--green)}
.B.pg-contact .formhead .sec i{width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 8px var(--lime);animation:blink 2.4s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.4}}

.B.pg-contact form{padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:640px){.B.pg-contact form{grid-template-columns:1fr}}
.B.pg-contact .fld{display:flex;flex-direction:column;gap:7px;position:relative}
.B.pg-contact .fld.full{grid-column:1/-1}
.B.pg-contact .fld label{font-size:.78rem;font-weight:650;letter-spacing:.06em;color:var(--mute);text-transform:uppercase}
.B.pg-contact .fld input,.B.pg-contact .fld textarea{font-family:var(--sans);font-size:1rem;color:var(--ink);
  background:var(--paper-3);border:1px solid var(--line);border-radius:12px;padding:.9rem 1rem;outline:none;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease),background .3s}
.B.pg-contact .fld textarea{min-height:130px;resize:vertical}
.B.pg-contact .fld input:focus,.B.pg-contact .fld textarea:focus{border-color:var(--lime);box-shadow:0 0 0 3px color-mix(in srgb,var(--lime) 18%,transparent);background:#0f1d14}
.B.pg-contact .fld .ok{position:absolute;right:12px;top:38px;color:var(--lime);opacity:0;transition:opacity .3s;font-size:.9rem}
.B.pg-contact .fld.valid .ok{opacity:1}
.B.pg-contact form .actions{grid-column:1/-1;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.B.pg-contact form .note{font-size:.8rem;color:var(--mute)}
.B.pg-contact .btn[disabled]{opacity:.55;pointer-events:none}

/* success overlay */
.B.pg-contact .sent{position:absolute;inset:0;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(8px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;
  opacity:0;pointer-events:none;transition:opacity .5s var(--ease);z-index:5}
.B.pg-contact .sent.show{opacity:1;pointer-events:auto}
.B.pg-contact .sent .badge{width:74px;height:74px;border-radius:50%;background:var(--lime);color:var(--forest);display:grid;place-items:center;
  font-size:2rem;box-shadow:0 0 60px -8px color-mix(in srgb,var(--lime) 70%,transparent);animation:pop .6s var(--ease)}
@keyframes pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.12)}100%{transform:scale(1)}}
.B.pg-contact .sent h3{font-family:var(--serif);font-size:1.9rem;margin-top:1.2rem}
.B.pg-contact .sent p{color:var(--mute);margin-top:.5rem;max-width:38ch}
.B.pg-contact .sent .trace{margin-top:1.4rem;font-family:ui-monospace,'SF Mono',Menlo,monospace;font-size:.78rem;color:var(--green);
  background:var(--paper-3);border:1px solid var(--line);border-radius:10px;padding:10px 16px}
