[data-page="contact"] .cp-form-w {
  padding: var(--omg-content-inset);
  border-radius: 8px;
}

.omg-contact-form {
  gap: calc(var(--omg-content-gap) * 1.5);
  font-size: var(--omg-content-size);
  line-height: 1.4;
  letter-spacing: 0;
}

.omg-contact-form .form-field-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--omg-content-gap);
}

.omg-contact-form .form-field-w {
  display: grid;
  gap: var(--omg-content-gap);
  min-width: 0;
  margin: 0;
}

.omg-contact-form .form-field-row > .form-field-w {
  grid-template-rows: 1fr auto auto;
}

.omg-contact-form .form-field-w > label,
.omg-contact-form .form-field-w > p {
  margin: 0;
  font-size: var(--omg-content-size);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
}

.omg-contact-form .form-field-w > .o-hidden {
  min-height: var(--omg-control-height);
}

.omg-contact-form .form-input {
  box-sizing: border-box;
  width: 100%;
  height: var(--omg-control-height);
  min-height: var(--omg-control-height);
  margin: 0;
  padding: 0.45em 0.65em;
  border-radius: 8px;
  font-size: var(--omg-content-size);
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}

.omg-contact-form .form-input::placeholder {
  color: #666;
  opacity: 1;
}

html.dark .omg-contact-form .form-input::placeholder {
  color: #bebebe;
}

.omg-contact-form .form-input:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: -3px;
}

.omg-contact-form .form-line {
  height: 1px;
  margin-top: var(--omg-content-gap);
}

.omg-contact-form .omg-contact-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: var(--omg-content-gap);
}

.omg-contact-form .omg-contact-option {
  min-width: 0;
  min-height: var(--omg-option-height);
  margin: 0;
  padding: 0.6em 0.8em;
  border: 1px solid var(--light-grey);
  border-radius: 100px;
  background: var(--white);
  font-weight: 400;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.omg-contact-form .omg-contact-option input {
  position: absolute;
  inset: 0;
  z-index: 12;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.omg-contact-form .omg-contact-option .checkbox-txt {
  max-width: 100%;
  font-size: var(--omg-content-size);
  line-height: 1.35;
  letter-spacing: 0;
  color: inherit;
  white-space: normal;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.omg-contact-form .omg-contact-option:hover {
  border-color: currentColor;
}

.omg-contact-form .omg-contact-option:has(input:checked) {
  border-color: var(--black);
  background: var(--black);
  color: var(--white);
}

.omg-contact-form .omg-contact-option:has(input:focus-visible) {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

html.dark .omg-contact-form .omg-contact-option {
  border-color: var(--dark-grey);
  background: var(--main-dark);
  color: var(--main-light);
}

html.dark .omg-contact-form .omg-contact-option:has(input:checked) {
  border-color: var(--main-light);
  background: var(--main-light);
  color: var(--main-dark);
}

.omg-contact-form .is-source {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.omg-contact-form .is-source .omg-contact-option {
  min-height: var(--omg-control-height);
  padding-inline: 0.6em;
}

html.dark .omg-contact-form .omg-contact-option .checkbox-txt {
  color: inherit;
}

.omg-contact-form .form-submit-w {
  flex-direction: column;
  align-items: flex-start;
  gap: var(--omg-content-gap);
}

.omg-contact-form [contact-trigger] {
  height: var(--omg-control-height);
  min-height: var(--omg-control-height);
  max-width: 100%;
  padding: 0;
  font-size: var(--omg-content-size);
}

.omg-contact-form [contact-trigger] .btn-inner {
  height: 100%;
  padding: 0.5em 0.8em;
  gap: 0.6em;
}

.omg-contact-form [contact-trigger] .btn-txt {
  font-size: var(--omg-content-size);
  line-height: 1.2;
  letter-spacing: 0;
}

.omg-contact-details {
  display: grid;
  gap: var(--omg-content-gap);
  width: 100%;
  max-width: 100%;
}

.omg-contact-form .omg-contact-details p.is--contact {
  margin: 0;
  font-size: var(--omg-content-size);
  line-height: 1.5;
  letter-spacing: 0;
}

.omg-contact-value {
  display: inline-block;
  max-width: 100%;
  text-transform: none;
  overflow-wrap: anywhere;
}

.omg-wechat-id {
  font-weight: 500;
  user-select: all;
}

.omg-contact-status {
  max-width: 42ch;
  font-size: var(--omg-content-size);
  line-height: 1.5;
}

@media (max-width: 1279px) {
  .omg-contact-form .is-source {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991px) {
  [data-page="contact"] .cp-form-w {
    padding: var(--omg-content-inset);
  }

  .omg-contact-form .form-field-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 767px) {
  [data-page="contact"] .cp-form-w {
    padding: 24px 20px;
  }

  .omg-contact-form,
  .omg-contact-form .form-field-row {
    gap: 24px;
  }

  .omg-contact-form .form-field-w {
    gap: 12px;
  }

  .omg-contact-form .form-field-w > label,
  .omg-contact-form .form-field-w > p,
  .omg-contact-form .omg-contact-details p.is--contact {
    font-size: var(--omg-content-size);
  }

  .omg-contact-form .form-input {
    height: var(--omg-control-height);
    min-height: var(--omg-control-height);
    padding: 14px 16px;
    font-size: var(--omg-content-size);
  }

  .omg-contact-form .form-field-w > .o-hidden {
    min-height: var(--omg-control-height);
  }

  .omg-contact-form .omg-contact-options {
    gap: 12px;
  }

  .omg-contact-form .omg-contact-options.is-services {
    grid-template-columns: minmax(0, 1fr);
  }

  .omg-contact-form .omg-contact-option {
    min-height: var(--omg-option-height);
    padding: 16px;
  }

  .omg-contact-form .omg-contact-option .checkbox-txt {
    font-size: var(--omg-content-size);
  }

  .omg-contact-form .is-source {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .omg-contact-form .is-source .omg-contact-option {
    min-height: var(--omg-control-height);
    padding-inline: 12px;
  }

  .omg-contact-form [contact-trigger] {
    height: var(--omg-control-height);
    min-height: var(--omg-control-height);
  }

  .omg-contact-form [contact-trigger] .btn-inner {
    padding: 16px 12px;
    gap: 12px;
  }

  .omg-contact-form [contact-trigger] .btn-txt {
    font-size: var(--omg-content-size);
  }
}