.hosting-signup-intro {
  width: min(100% - 2.5rem, 1100px);
  margin: clamp(2rem, 6vw, 5rem) auto;
}

.hosting-signup-intro h1 {
  max-width: 15ch;
  font-size: clamp(2.7rem, 6.5vw, 5.8rem);
  line-height: .98;
  overflow-wrap: normal;
}

.hosting-signup-intro > p { max-width: 780px; }
.hosting-signup-intro ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem 2rem; max-width: 920px; }

.stl-stripe-form-wrap {
  --stl-navy: #101b2d;
  --stl-blue: #1769e0;
  --stl-line: #dce3ec;
  --stl-muted: #5e6878;
  max-width: 760px;
  margin: 2rem auto;
  padding: clamp(1.4rem, 4vw, 2.5rem);
  border: 1px solid var(--stl-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(16, 27, 45, .09);
  color: var(--stl-navy);
}

.stl-stripe-form-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 1rem;
}

.stl-stripe-form-heading h2 { margin: 0; color: var(--stl-navy); }
.stl-stripe-eyebrow { margin: 0 0 .3rem; color: var(--stl-blue); font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.stl-stripe-price { flex: 0 0 auto; margin: .15rem 0 0; font-size: 1.15rem; font-weight: 800; color: var(--stl-navy); }
.stl-stripe-description { color: var(--stl-muted); }

.stl-stripe-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.1rem;
  margin-top: 1.5rem;
}

.stl-stripe-field { display: flex; flex-direction: column; gap: .42rem; }
.stl-stripe-field label { font-weight: 700; font-size: .92rem; }
.stl-stripe-field input {
  width: 100%;
  min-height: 48px;
  border: 1px solid #bdc8d6;
  border-radius: 9px;
  padding: .7rem .85rem;
  background: #fff;
  color: #111827;
  font: inherit;
  transition: border-color .15s, box-shadow .15s;
}

.stl-stripe-field input:focus { outline: none; border-color: var(--stl-blue); box-shadow: 0 0 0 3px rgba(23, 105, 224, .15); }
.stl-stripe-domains { display: contents; }
.stl-stripe-domain-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; align-items: end; }
.stl-stripe-domain-row:first-child { grid-template-columns: minmax(0, 1fr); }
.stl-stripe-domain-row:not(:first-child) { grid-column: 1 / -1; }
.stl-stripe-remove-domain[hidden] { display: none !important; }
.stl-stripe-remove-domain,
.stl-stripe-add-domain { border: 1px solid #bdc8d6; border-radius: 8px; background: #fff; color: var(--stl-navy); padding: .68rem .85rem; font: inherit; font-weight: 700; cursor: pointer; }
.stl-stripe-remove-domain { min-height: 48px; color: #842029; }
.stl-stripe-domain-actions { grid-column: 1 / -1; display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.stl-stripe-domain-actions small { color: var(--stl-muted); }
.stl-stripe-submit {
  grid-column: 1 / -1;
  min-height: 52px;
  border: 0;
  border-radius: 9px;
  padding: .85rem 1.25rem;
  background: var(--stl-blue);
  color: #fff;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  transition: transform .15s, background .15s;
}
.stl-stripe-submit:hover { background: #0f56bd; transform: translateY(-1px); }
.stl-stripe-security { grid-column: 1 / -1; margin: -.2rem 0 0; text-align: center; color: var(--stl-muted); font-size: .82rem; }
.stl-stripe-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.stl-stripe-message { margin: 1rem 0; padding: .9rem 1rem; border-radius: 8px; }
.stl-stripe-success { color: #0d5b34; background: #e8f8ef; border: 1px solid #a9dfc1; }
.stl-stripe-notice { color: #684e05; background: #fff7d6; border: 1px solid #ead47b; }
.stl-stripe-error { color: #842029; background: #f8d7da; border: 1px solid #f1aeb5; }

@media (max-width: 620px) {
  .hosting-signup-intro ul { grid-template-columns: 1fr; }
  .stl-stripe-form-heading { display: block; }
  .stl-stripe-price { margin-top: .6rem; }
  .stl-stripe-form { grid-template-columns: 1fr; }
  .stl-stripe-domain-row { grid-template-columns: 1fr; }
  .stl-stripe-remove-domain { min-height: 42px; }
}