/* ==========================================================
   Workflow Review & Contact — fully scoped under .mlab-contact
   No bare element selectors outside this root.
   ========================================================== */

.mlab-contact {
  --c-bg: #05070a;
  --c-surface: #111620;
  --c-card: #141b28;
  --c-border: rgba(255,255,255,0.11);
  --c-text: #dde6f5;
  --c-muted: #8fa3b8;
  --c-lime: #b8ff57;
  --c-cyan: #3de8f0;
  --c-blue: #5b8cff;
  --c-danger: #ff5c6c;
  --c-radius: 12px;
  font-family: 'DM Sans', sans-serif !important;
  background: var(--c-bg) !important;
  color: var(--c-text) !important;
  padding: 0 0 80px;
}

.mlab-contact * { box-sizing: border-box; }

.mlab-contact .contact-hero {
  max-width: 780px;
  margin: 0 auto;
  padding: 72px 24px 40px;
  text-align: center;
}

.mlab-contact .contact-eyebrow {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-cyan) !important;
  margin-bottom: 16px;
}

.mlab-contact .contact-hero h1 {
  font-family: 'Syne', sans-serif !important;
  font-size: clamp(2rem, 5vw, 2.75rem);
  font-weight: 800;
  line-height: 1.15;
  color: var(--c-text) !important;
  margin-bottom: 18px;
}

.mlab-contact .contact-sub {
  color: var(--c-muted) !important;
  font-size: 15px;
  line-height: 1.7;
}

.mlab-contact .contact-problems {
  max-width: 980px;
  margin: 0 auto 48px;
  padding: 0 24px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
}

.mlab-contact .contact-card {
  background: var(--c-card) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: var(--c-radius);
  padding: 20px;
}

.mlab-contact .contact-card h3 {
  font-family: 'Syne', sans-serif !important;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 8px;
  color: var(--c-text) !important;
}

.mlab-contact .contact-card p {
  font-size: 13px;
  color: var(--c-muted) !important;
  line-height: 1.6;
  margin: 0;
}

.mlab-contact .contact-form-section {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 24px;
}

.mlab-contact .contact-form-heading {
  font-family: 'Syne', sans-serif !important;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--c-text) !important;
  margin-bottom: 20px;
  text-align: center;
}

.mlab-contact .contact-noscript {
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 8px;
  padding: 14px 18px;
  margin-bottom: 20px;
  color: #f59e0b !important;
  font-size: 13.5px;
  line-height: 1.6;
}

.mlab-contact .contact-noscript p {
  margin: 0;
  color: #f59e0b !important;
}

.mlab-contact .contact-noscript a {
  color: var(--c-cyan) !important;
  text-decoration: underline;
}

.mlab-contact .contact-form {
  background: var(--c-surface) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: 16px;
  padding: 32px;
}

.mlab-contact .field-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.mlab-contact .field {
  margin-bottom: 18px;
}

.mlab-contact .field label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--c-text) !important;
  margin-bottom: 6px;
}

.mlab-contact .field input[type="text"],
.mlab-contact .field input[type="email"],
.mlab-contact .field input[type="url"],
.mlab-contact .field select,
.mlab-contact .field textarea {
  width: 100%;
  background: var(--c-card) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: 8px;
  color: var(--c-text) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13.5px;
  padding: 10px 12px;
  transition: border-color 0.15s, outline 0.15s;
}

.mlab-contact .field input:focus,
.mlab-contact .field select:focus,
.mlab-contact .field textarea:focus {
  outline: none;
  border-color: var(--c-blue) !important;
}

.mlab-contact .field input:focus-visible,
.mlab-contact .field select:focus-visible,
.mlab-contact .field textarea:focus-visible,
.mlab-contact .contact-submit:focus-visible,
.mlab-contact a:focus-visible {
  outline: 3px solid rgba(91, 140, 255, 0.45) !important;
  outline-offset: 2px !important;
  border-color: var(--c-blue) !important;
}

.mlab-contact .field textarea { resize: vertical; }

.mlab-contact .checkbox-field label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 400;
  color: var(--c-muted) !important;
  line-height: 1.5;
}

.mlab-contact .checkbox-field a {
  color: var(--c-cyan) !important;
  text-decoration: underline;
}

.mlab-contact .checkbox-field input {
  margin-top: 3px;
  accent-color: var(--c-blue);
  flex-shrink: 0;
}

.mlab-contact .hp-field {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.mlab-contact .contact-submit {
  width: 100%;
  background: var(--c-blue) !important;
  color: #fff !important;
  border: none;
  border-radius: 40px;
  padding: 14px;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, opacity 0.15s;
}

.mlab-contact .contact-submit:hover { background: #7aa0ff !important; }
.mlab-contact .contact-submit:disabled { opacity: 0.6; cursor: not-allowed; }

.mlab-contact .contact-status {
  margin-top: 14px;
  font-size: 13px;
  min-height: 18px;
}

.mlab-contact .contact-status.is-success { color: var(--c-lime) !important; }
.mlab-contact .contact-status.is-error { color: var(--c-danger) !important; }

.mlab-contact .contact-alt {
  max-width: 720px;
  margin: 32px auto 0;
  padding: 0 24px;
  text-align: center;
  font-size: 13px;
  color: var(--c-muted) !important;
}

.mlab-contact .contact-alt a { color: var(--c-blue) !important; }
.mlab-contact .contact-alt a:hover { color: var(--c-cyan) !important; }

@media (max-width: 640px) {
  .mlab-contact .field-row { grid-template-columns: 1fr; }
  .mlab-contact .contact-form { padding: 22px; }
}
/* ==========================================================
   CONTACT PAGE SHELL
   Isolates GeneratePress layout without restoring legacy CSS
   ========================================================== */

body.page-template-page-workflow-contact-php {
  background: #05070a !important;
  color: #dde6f5 !important;
}

/* Remove reserved sidebar width */
body.page-template-page-workflow-contact-php #page,
body.page-template-page-workflow-contact-php .site,
body.page-template-page-workflow-contact-php .site-content,
body.page-template-page-workflow-contact-php .content-area,
body.page-template-page-workflow-contact-php .site-main {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #05070a !important;
}

body.page-template-page-workflow-contact-php .widget-area,
body.page-template-page-workflow-contact-php #right-sidebar,
body.page-template-page-workflow-contact-php #left-sidebar {
  display: none !important;
}

/* Center the actual Contact experience */
body.page-template-page-workflow-contact-php .mlab-contact {
  width: min(100% - 40px, 1180px);
  max-width: 1180px;
  margin-inline: auto;
}

/* Header */
body.page-template-page-workflow-contact-php .site-header,
body.page-template-page-workflow-contact-php .main-navigation {
  background: #080b12 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}

body.page-template-page-workflow-contact-php .site-header .inside-header,
body.page-template-page-workflow-contact-php .main-navigation .inside-navigation {
  max-width: 1180px;
  margin-inline: auto;
}

body.page-template-page-workflow-contact-php .site-title a,
body.page-template-page-workflow-contact-php .main-title a {
  color: #dde6f5 !important;
  text-decoration: none !important;
}

body.page-template-page-workflow-contact-php .main-navigation a {
  color: #9aabc5 !important;
  text-decoration: none !important;
}

body.page-template-page-workflow-contact-php .main-navigation a:hover,
body.page-template-page-workflow-contact-php .main-navigation .current-menu-item > a {
  color: #b8ff57 !important;
}

/* One visually consistent footer */
body.page-template-page-workflow-contact-php .site-footer,
body.page-template-page-workflow-contact-php .site-info,
body.page-template-page-workflow-contact-php .inside-site-info {
  background: #080b12 !important;
  color: #8fa3b8 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
}

body.page-template-page-workflow-contact-php .site-info a {
  color: #3de8f0 !important;
}

/* Give the form a useful desktop width */
body.page-template-page-workflow-contact-php .contact-form-wrap,
body.page-template-page-workflow-contact-php .contact-form {
  width: 100%;
  max-width: 900px;
  margin-inline: auto;
}

@media (max-width: 768px) {
  body.page-template-page-workflow-contact-php .mlab-contact {
    width: min(100% - 24px, 1180px);
  }
}.mlab-contact .contact-alternatives {
  color: #8fa3b8 !important;
}

.mlab-contact .contact-alternatives a {
  color: #5b8cff !important;
}

.mlab-contact .contact-alternatives a:hover {
  color: #3de8f0 !important;
}