/* ============================================================
   CGS Carbon — contact page styles
   Inquiry form, contact aside, success state.
   ============================================================ */

.page-hero.on-photo{background-image:url(../img/contact-hero.jpg)}

/* ---------- form ---------- */
.form-card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:40px}
.field{margin-bottom:22px}
.field label{display:block;font-size:.88rem;font-weight:600;color:var(--ink);margin-bottom:8px}
.req{color:#B4472C}
.field input,.field select,.field textarea{width:100%;padding:14px 16px;border:1.5px solid #CBD6D8;
  border-radius:var(--r);font:inherit;font-size:.97rem;color:var(--ink);background:#fff;
  transition:border-color .15s,box-shadow .15s}
.field textarea{resize:vertical;min-height:132px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(29,118,134,.15)}
.field .hint{font-size:.8rem;color:var(--slate);margin-top:7px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.checkline{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--slate)}
.checkline input{width:18px;height:18px;flex:none;margin-top:3px;accent-color:var(--teal)}
.form-ok{border:1px solid var(--teal);background:var(--teal-pale);border-radius:var(--r-lg);
  padding:34px;color:var(--ink)}
.form-ok h3{margin-bottom:10px}

/* ---------- contact aside ---------- */
.contact-aside .card{margin-bottom:22px}
.contact-aside .lbl{font-size:.72rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
  color:var(--teal);margin-bottom:12px}
.contact-aside .big{font-size:1.1rem;font-weight:600;color:var(--ink)}

@media(max-width:620px){
  .form-card{padding:26px 22px}
  .row2{grid-template-columns:1fr}
}