.ssku-support-form,
.ssku-support-form * {
  box-sizing: border-box;
}

.ssku-support-form {
  display: grid;
  grid-template-columns: minmax(250px, .62fr) minmax(0, 1.38fr);
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto 96px;
  padding: 24px;
  border: 1px solid #dce6f7;
  border-radius: 26px;
  background:
    radial-gradient(circle at 0 0, rgba(47,212,190,.10), transparent 28%),
    radial-gradient(circle at 100% 100%, rgba(142,101,248,.11), transparent 31%),
    #f9fbff;
  color: #111b3d;
  font-family: Manrope, Inter, Arial, sans-serif;
  scroll-margin-top: 80px;
}

.ssku-support-form__intro {
  padding: 20px 10px 20px 4px;
}

.ssku-support-form__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #65748e;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.ssku-support-form__eyebrow i {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #2fd4be;
  box-shadow: 0 0 0 5px rgba(47,212,190,.12);
}

.ssku-support-form__intro h2 {
  margin: 16px 0 0;
  color: #101a38;
  font-size: clamp(35px, 3.7vw, 52px);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -.06em;
}

.ssku-support-form__intro > p {
  margin: 19px 0 0;
  color: #697792;
  font-size: 13px;
  line-height: 1.68;
}

.ssku-support-form__tips {
  display: grid;
  gap: 11px;
  margin-top: 24px;
}

.ssku-support-form__tips div {
  padding: 12px 13px;
  border: 1px solid #dfe7f4;
  border-radius: 12px;
  background: rgba(255,255,255,.66);
}

.ssku-support-form__tips strong,
.ssku-support-form__tips span {
  display: block;
}

.ssku-support-form__tips strong {
  color: #31466e;
  font-size: 11px;
  font-weight: 800;
}

.ssku-support-form__tips span {
  margin-top: 4px;
  color: #78869f;
  font-size: 9px;
  line-height: 1.45;
}

.ssku-support-form__development-note {
  margin-top: 16px;
  padding: 12px 13px;
  border: 1px solid #dce6f5;
  border-radius: 12px;
  background: rgba(255,255,255,.72);
  color: #687895;
  font-size: 10px;
  line-height: 1.55;
}

.ssku-support-form__development-note a {
  color: #2867e7;
  font-weight: 800;
  text-decoration: none;
}

.ssku-support-form__panel {
  padding: 22px;
  border: 1px solid #dce5f4;
  border-radius: 20px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 18px 48px rgba(38,65,135,.09);
}

.ssku-support-form__message {
  margin-bottom: 17px;
  padding: 13px 15px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}

.ssku-support-form__message.is-success {
  border: 1px solid #bfe8dc;
  background: #effbf7;
  color: #247866;
}

.ssku-support-form__message.is-error {
  border: 1px solid #f0c7ce;
  background: #fff4f5;
  color: #a33c4d;
}

.ssku-support-form__form,
.ssku-support-form__grid {
  display: grid;
}

.ssku-support-form__form {
  gap: 16px;
}

.ssku-support-form__grid {
  gap: 13px;
}

.ssku-support-form__grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ssku-support-form__field {
  display: grid;
  gap: 6px;
}

.ssku-support-form__field--wide {
  grid-column: 1 / -1;
}

.ssku-support-form__field > span {
  color: #34486e;
  font-size: 10px;
  font-weight: 800;
}

.ssku-support-form__field b,
.ssku-support-form__consent b {
  color: #ef5a6f;
}

.ssku-support-form input:not([type="checkbox"]),
.ssku-support-form select,
.ssku-support-form textarea {
  width: 100%;
  border: 1px solid #d8e2f2;
  border-radius: 10px;
  background: #fbfcff;
  color: #203154;
  font: inherit;
  font-size: 12px;
  outline: 0;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.ssku-support-form input:not([type="checkbox"]),
.ssku-support-form select {
  min-height: 44px;
  padding: 0 12px;
}

.ssku-support-form textarea {
  min-height: 132px;
  padding: 12px;
  resize: vertical;
  line-height: 1.55;
}

.ssku-support-form input:focus,
.ssku-support-form select:focus,
.ssku-support-form textarea:focus {
  border-color: #7b9af0;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(60,105,229,.11);
}

.ssku-support-form__field.has-error input,
.ssku-support-form__field.has-error select,
.ssku-support-form__field.has-error textarea {
  border-color: #e58896;
}

.ssku-support-form__field small,
.ssku-support-form__consent-error {
  min-height: 1em;
  color: #b34254;
  font-size: 9px;
  font-weight: 700;
}

.ssku-support-form__consent {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  color: #667590;
  font-size: 10px;
  line-height: 1.5;
}

.ssku-support-form__consent input {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: #2867e7;
}

.ssku-support-form__submit {
  display: inline-flex;
  justify-self: start;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 48px;
  padding: 0 18px;
  border: 0;
  border-radius: 13px;
  background: linear-gradient(100deg, #1765f2, #3470f0 55%, #9166f7);
  color: #fff;
  box-shadow: 0 13px 27px rgba(46,92,219,.24);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.ssku-support-form__submit:disabled {
  opacity: .65;
  cursor: wait;
}

.ssku-support-form__submit svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.9;
}

.ssku-support-form__honeypot {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

@media (max-width: 900px) {
  .ssku-support-form {
    grid-template-columns: 1fr;
  }

  .ssku-support-form__intro {
    max-width: 700px;
  }
}

@media (max-width: 620px) {
  .ssku-support-form {
    padding: 16px;
    border-radius: 22px;
  }

  .ssku-support-form__panel {
    padding: 16px;
    border-radius: 18px;
  }

  .ssku-support-form__grid--two {
    grid-template-columns: 1fr;
  }

  .ssku-support-form__field--wide {
    grid-column: auto;
  }

  .ssku-support-form__submit {
    width: 100%;
  }
}
