.request-grid { display: grid; gap: 6px; }
@media (min-width: 480px) { .request-grid { grid-template-columns: 1fr 1fr; } }


.request-district-chips { margin-top: 8px; }
.request-district-chips[hidden] { display: none; }


.request-budget { position: relative; }
.request-budget .form__input { padding-right: 2.6rem; }
.request-budget__unit {
  position: absolute;
  top: 50%;
  right: 0.9rem;
  transform: translateY(-50%);
  color: var(--pp-color-text-secondary);
  pointer-events: none;
}


.request-promo { margin-top: 12px; }
.request-promo summary {
  display: flex;
  align-items: center;
  min-height: 44px;
  width: fit-content;
  color: var(--pp-color-action-primary);
  font-weight: 600;
  cursor: pointer;
}
.request-promo[open] summary { margin-bottom: 6px; }


.pp-field__error svg { width: 16px; height: 16px; flex: none; stroke: currentColor; fill: none; stroke-width: 2; }


#form-summary { margin-bottom: 12px; }
#form-summary:focus-visible, .request-promo summary:focus-visible {
  outline: var(--pp-size-focus-ring) solid var(--color-focus);
  outline-offset: 2px;
}


.request-steps {
  counter-reset: steps;
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
}
.request-steps li { display: flex; gap: 12px; }
.request-steps li::before {
  content: counter(steps);
  counter-increment: steps;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  flex: none;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 14px;
  background: var(--pp-color-action-primary-soft);
  color: var(--pp-color-action-primary-soft-text);
}
.request-steps b { display: block; }
.request-steps span { display: block; color: var(--pp-color-text-secondary); font-size: 14px; }




.card-group { display: grid; gap: 16px; }


.success-card { position: relative; padding-top: 1.35rem; }
.success-icon { position: absolute; top: 1.35rem; left: 1.35rem; width: 48px; height: 48px; border-radius: 50%; background: var(--pp-color-semantic-success-soft); color: var(--pp-color-semantic-success-text); display: grid; place-items: center; font-size: 22px; font-weight: 700; }
.success-card h2 { margin: 0 0 0.75rem; padding-left: 60px; min-height: 48px; display: flex; align-items: center; }
.success-lead { color: var(--pp-color-text-secondary); font-size: 1.05rem; line-height: 1.45; margin-bottom: 1rem; }


.success-steps { counter-reset: step; list-style: none; margin: 0 0 0; padding: 0; display: grid; gap: 0; }
.success-steps li { display: grid; grid-template-columns: 32px 1fr; gap: 12px; padding-bottom: 14px; position: relative; }
.success-steps li::before { counter-increment: step; content: counter(step); width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--pp-color-action-primary-soft); color: var(--pp-color-action-primary-soft-text); font: 700 14px/1 var(--pp-font-display); }
.success-steps li:not(:last-child)::after { content: ""; position: absolute; left: 15px; top: 34px; bottom: 2px; width: 2px; background: var(--pp-color-border-default); }
.success-steps__done::before { content: "\2713"; background: var(--pp-color-semantic-success); color: var(--pp-color-action-on-primary); }
.success-steps__done::after { display: none; }
.success-steps li b { display: block; font-size: 15px; }
.success-steps li span { display: block; color: var(--pp-color-text-secondary); font-size: 14px; }


.card--accent { border-color: var(--pp-color-action-primary); border-radius: var(--pp-radius-lg); padding: 1.35rem; }
.success-card__title { margin: 0 0 0.4rem; font-size: 1.1rem; }
.success-card__desc { margin: 0 0 0.8rem; color: var(--pp-color-text-secondary); }


.success-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.success-note { color: var(--pp-color-text-secondary); font-size: 14px; margin-top: 0.75rem; }
.success-note a { color: var(--pp-color-action-primary-pressed); }


html { scroll-padding-bottom: 7rem; }


.form__check { min-height: 44px; align-items: center; }


select.form__input {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--pp-color-text-secondary) 50%),
    linear-gradient(135deg, var(--pp-color-text-secondary) 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(50% + 2px), calc(100% - 13px) calc(50% + 2px);
  background-size: 5px 5px;
  background-repeat: no-repeat;
  padding-right: 2.4rem;
}


.request-district-chips { gap: 8px; }
.request-district-chips .pp-chip { min-height: 44px; }


@media (max-width: 40rem) {
  .hero--compact { padding-top: 1.25rem; padding-bottom: 1rem; }
  .hero--compact .eyebrow { margin-bottom: 0.5rem; }
  .hero--compact h1 { margin-bottom: 0.5rem; margin-inline: auto; font-size: 1.4rem; line-height: 1.18; max-width: 24ch; }
  .hero--compact .hero__subtitle { font-size: 1rem; line-height: 1.4; }
}