/**
 * Contact Form 7 integration used by Progesto page patterns.
 */

.contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 520px);
  gap: clamp(42px, 7vw, 92px);
  align-items: start;
}

.contact-copy {
  align-self: center;
}

.contact-form-card {
  padding: clamp(26px, 4vw, 38px);
  border: 1px solid rgba(4, 77, 118, .14);
  border-radius: 28px;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 24px 70px rgba(32, 77, 100, .12);
  backdrop-filter: blur(18px);
}

.contact-form-card h3 {
  margin: 0;
  color: var(--ink);
  font-size: clamp(28px, 2.6vw, 38px);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -.04em;
}

.contact-form-card .contact-form-intro {
  max-width: 40rem;
  margin: 14px 0 26px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.55;
}

.contact-form-card .wp-block-shortcode {
  margin: 0;
}

.contact-form-card .wpcf7-form {
  display: grid;
  gap: 16px;
}

.contact-form-card .wpcf7-form p {
  max-width: none;
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.45;
}

.contact-form-card .progesto-form-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.contact-form-card .wpcf7-form label {
  display: grid;
  gap: 8px;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}

.contact-form-card :where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), select, textarea) {
  width: 100%;
  min-height: 50px;
  padding: 12px 15px;
  border: 1px solid rgba(4, 77, 118, .18);
  border-radius: 14px;
  outline: 0;
  color: var(--ink);
  background: rgba(247, 251, 252, .92);
  font: inherit;
  font-weight: 400;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.contact-form-card textarea {
  min-height: 132px;
  resize: vertical;
}

.contact-form-card :where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), select, textarea):focus {
  border-color: rgba(36, 127, 182, .66);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(36, 127, 182, .10);
}

.contact-form-card .wpcf7-acceptance label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
}

.contact-form-card input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--blue);
}


/* CF7 adds a default 1em left margin to every list item.
   Consent checkboxes in Progesto forms must align flush with the form copy. */
.contact-form-card .wpcf7-list-item,
.progesto-form .wpcf7-list-item {
  margin-left: 0 !important;
}


/* Mailchimp for WP renders its CF7 opt-in with a different wrapper than
   wpcf7-acceptance. Keep it visually identical to the privacy consent row. */
.contact-form-card .mc4wp-checkbox {
  margin: 0 !important;
}


.contact-form-card .mc4wp-checkbox .wpcf7-list-item {
  display: block;
  margin: 0 !important;
}

.contact-form-card .mc4wp-checkbox label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: 0;
  color: var(--ink);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
}

.contact-form-card .mc4wp-checkbox input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  accent-color: var(--blue);
}

.contact-form-card .mc4wp-checkbox :is(span, strong) {
  font-weight: 400;
}

.contact-form-card input[type="submit"] {
  display: inline-flex;
  width: auto;
  min-height: 52px;
  padding: 0 28px;
  border: 0;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, var(--blue), var(--blue-d));
  box-shadow: 0 16px 38px rgba(36, 127, 182, .20);
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}

.progesto-software-detail .contact-form-card input[type="submit"] {
  background: linear-gradient(135deg, var(--blue), var(--violet));
}

.contact-form-card input[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 44px rgba(36, 127, 182, .24);
}

.contact-form-card input[type="submit"]:focus-visible {
  outline: 3px solid rgba(36, 127, 182, .35);
  outline-offset: 3px;
}

.contact-form-card .wpcf7-not-valid-tip {
  margin-top: 6px;
  color: #a63d3d;
  font-size: 12px;
  line-height: 1.35;
}

.contact-form-card .wpcf7-response-output {
  margin: 2px 0 0 !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(4, 77, 118, .18) !important;
  border-radius: 12px;
  color: var(--ink);
  background: rgba(247, 251, 252, .90);
  font-size: 13px;
  line-height: 1.45;
}

.contact-form-card form.sent .wpcf7-response-output {
  border-color: rgba(25, 168, 97, .35) !important;
  background: rgba(25, 168, 97, .07);
}

.contact-form-card form.invalid .wpcf7-response-output,
.contact-form-card form.failed .wpcf7-response-output {
  border-color: rgba(166, 61, 61, .32) !important;
  background: rgba(166, 61, 61, .06);
}

.contact-form-card .wpcf7-spinner {
  margin: 0 0 0 12px;
  vertical-align: middle;
}

/* Consent rows stay part of the form flow. No nested cards or promotional box. */
.progesto-form .progesto-form-consents {
  display: grid;
  gap: 12px;
  margin-top: 2px;
}

.progesto-form .progesto-consent,
.progesto-form .progesto-consent--required,
.progesto-form .progesto-consent--newsletter {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.progesto-form .progesto-consent--newsletter {
  padding-top: 12px !important;
  border-top: 1px solid rgba(4, 77, 118, .12) !important;
}

.progesto-form .progesto-consent-heading {
  display: none !important;
}

.progesto-form .progesto-consent .wpcf7-list-item {
  display: block;
  margin: 0;
}

.progesto-form .progesto-consent :is(.wpcf7-acceptance, .wpcf7-checkbox) label,
.contact-form-card .progesto-form .progesto-consent :is(.wpcf7-acceptance, .wpcf7-checkbox) label {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  margin: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
}

.progesto-form .progesto-consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
}

.progesto-form .progesto-consent .wpcf7-list-item-label {
  font-weight: 400;
}

.progesto-form .progesto-consent a {
  color: var(--blue-d);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: .16em;
}

/* The editor shows the shortcode placeholder rather than CF7's rendered form. */
.editor-styles-wrapper .contact-form-card .wp-block-shortcode {
  min-height: 92px;
  padding: 20px;
  border: 1px dashed rgba(36, 127, 182, .30);
  border-radius: 14px;
  color: var(--blue-d);
  background: rgba(36, 127, 182, .05);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 13px;
}

@media (max-width: 1080px) {
  .contact-layout {
    grid-template-columns: 1fr;
  }

  .contact-copy {
    max-width: 820px;
  }

  .contact-form-card {
    width: min(100%, 680px);
  }
}

@media (max-width: 760px) {
  .contact-form-card .progesto-form-row {
    grid-template-columns: 1fr;
  }

  .contact-form-card {
    width: 100%;
    padding: 24px;
    border-radius: 24px;
  }

  .contact-form-card input[type="submit"] {
    width: 100%;
  }
}