#app {
  background: var(--color-background);
}
.container {
  max-width: 1400px;
  margin: 0 auto;
  padding: var(--padding-container-main);
  @media (max-width: 560px) {
    padding: var(--padding-container-mobile);
  }
}
.home {
  position: relative;
}
div img {
  width: 100%;
  overflow: hidden;
}
h1, h2, h3, h4 {
  hyphens: auto;
}
.hero-form,
.final-form {
  padding: 18px;
  border-radius: 8px;
  box-shadow: var(--shadow-soft);
  background: var(--gradient-surface);
  background-size: cover, cover;
  background-position: center, center;
}
.form-card {
  background: var(--surface-card);
  color: var(--text-strong);
  border: 1px solid var(--border-subtle);
}

.form-card h3,
.form-card .form-title {
  color: var(--text-strong);
}

.form-card p,
.form-card .form-sub {
  color: var(--text-muted);
}

.form-card label {
  color: var(--text-muted);
  font-weight: 600;
}

.form-card input {
  background: var(--input-bg);
  color: var(--text-strong);
  border: 1px solid var(--input-border);
}

.form-card input::placeholder {
  color: var(--text-muted);
}

.form-card input:focus {
  outline: none;
  box-shadow: 0 0 0 4px var(--focus-ring);
  border-color: transparent;
}