:root {
  --hc-intake-aqua: #00bdd1;
  --hc-intake-aqua-dark: #007f93;
  --hc-intake-ink: #343a46;
  --hc-intake-muted: #6d7781;
  --hc-intake-line: #cbdce1;
  --hc-intake-soft: #effbfc;
  --hc-intake-error: #a12622;
  --hc-intake-border: #e2ecef;
  --hc-intake-white: #fff;
}

.form-card__header__logo {
  width: min(100%, 260px);
  height: auto;
}

.hc-intake-card {
  width: min(100%, 760px);
  margin: 2rem auto;
  overflow: hidden;
  color: var(--hc-intake-ink);
  background: var(--hc-intake-white);
  border: 1px solid var(--hc-intake-border);
  border-radius: 28px;
  box-shadow: 0 24px 70px rgb(30 63 72 / 14%);
}

.hc-intake-card__intro {
  padding: clamp(1.5rem, 4vw, 3rem);
  color: #fff;
  background:
    linear-gradient(135deg, rgb(0 127 147 / 96%), rgb(0 189 209 / 92%)),
    #007f93;
}

.hc-intake-card__eyebrow {
  margin: 0 0 0.55rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.hc-intake-card h2 {
  margin: 0;
  color: inherit;
  font-size: clamp(1.8rem, 5vw, 3rem);
  line-height: 1.05;
}

.hc-intake-card__intro > p:last-child {
  max-width: 54ch;
  margin: 1rem 0 0;
  font-size: 1.05rem;
}

.hc-intake {
  position: relative;
  padding: clamp(1.25rem, 4vw, 3rem);
}

.hc-intake__progress {
  display: grid;
  gap: 0.55rem;
  margin-bottom: 2rem;
  color: var(--hc-intake-muted);
  font-size: 0.88rem;
  font-weight: 700;
}

.hc-intake__progress-track {
  display: block;
  height: 7px;
  overflow: hidden;
  background: #e5f0f2;
  border-radius: 999px;
}

.hc-intake__progress-track > span {
  display: block;
  width: 25%;
  height: 100%;
  background: var(--hc-intake-aqua);
  border-radius: inherit;
  transition: width 180ms ease;
}

.hc-intake__step {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

/* The step heading is focused programmatically so screen readers announce the
   new step. It carries tabindex="-1", so it is never reached by tabbing and a
   visible ring would only read as a stray box around the question. */
.hc-intake__step > legend:focus {
  outline: none;
}

.hc-intake__step > legend {
  display: block;
  float: none;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 1.5rem;
  padding: 0;
  color: var(--hc-intake-ink);
  font-size: clamp(1.45rem, 4vw, 2.15rem);
  font-weight: 800;
  line-height: 1.15;
}

/* Browsers normally clear content after a fieldset legend, but that implicit
   layout is fragile when theme CSS also styles legends. Keep every step's
   first control below its heading instead of allowing it to squeeze beside
   the legend. */
.hc-intake__step > legend + * {
  clear: both;
}

.hc-intake__field {
  display: grid;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
}

.hc-intake__field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1.25rem;
}

.hc-intake__field-grid > .hc-intake__field {
  margin-bottom: 1.25rem;
}

@media (max-width: 600px) {
  .hc-intake__field-grid {
    grid-template-columns: 1fr;
  }
}

.hc-intake__field > label,
.hc-intake__field > legend {
  color: var(--hc-intake-ink);
  font-weight: 700;
}

.hc-intake__field input:not([type="radio"], [type="checkbox"]),
.hc-intake__field select,
.hc-intake__field textarea {
  width: 100%;
  min-height: 54px;
  box-sizing: border-box;
  padding: 0.8rem 1rem;
  color: var(--hc-intake-ink);
  background: #fff;
  border: 2px solid var(--hc-intake-line);
  border-radius: 14px;
  font: inherit;
}

.hc-intake__field textarea {
  min-height: 120px;
  resize: vertical;
}

.hc-intake__field input:focus,
.hc-intake__field select:focus,
.hc-intake__field textarea:focus {
  border-color: var(--hc-intake-aqua-dark);
  outline: 3px solid rgb(0 189 209 / 22%);
  outline-offset: 2px;
}

.hc-intake__field--choices {
  padding: 0;
  border: 0;
}

.hc-intake__field--choices > legend {
  margin-bottom: 0.65rem;
}

.hc-intake__choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.hc-intake__choice {
  position: relative;
  display: flex;
  min-height: 72px;
  cursor: pointer;
}

.hc-intake__choice input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.hc-intake__choice span {
  display: flex;
  width: 100%;
  align-items: center;
  padding: 0.9rem 1rem;
  color: var(--hc-intake-ink);
  background: #fff;
  border: 2px solid var(--hc-intake-line);
  border-radius: 16px;
  font-weight: 700;
  line-height: 1.25;
  transition: 150ms ease;
}

.hc-intake__choice input:checked + span {
  color: #006d7d;
  background: var(--hc-intake-soft);
  border-color: var(--hc-intake-aqua);
  box-shadow: inset 0 0 0 1px var(--hc-intake-aqua);
}

.hc-intake__choice input:focus-visible + span {
  outline: 3px solid rgb(0 189 209 / 28%);
  outline-offset: 3px;
}

.hc-intake__conditional {
  margin: 1rem 0;
  padding: 1.15rem;
  background: var(--hc-intake-soft);
  border: 1px solid #bde7ec;
  border-radius: 18px;
}

.hc-intake__selection-summary {
  padding: 1.15rem;
  color: #006d7d;
  background: var(--hc-intake-soft);
  border: 2px solid var(--hc-intake-aqua);
  border-radius: 16px;
  font-weight: 800;
}

.hc-intake__field--consent label {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-weight: 600;
}

.hc-intake__field--consent input {
  width: 1.2rem;
  height: 1.2rem;
  margin-top: 0.15rem;
  accent-color: var(--hc-intake-aqua-dark);
}

.hc-intake__hint {
  margin: -0.75rem 0 1.25rem;
  color: var(--hc-intake-muted);
  font-size: 0.9rem;
}

.hc-intake__hint--inline {
  display: block;
  margin: 0.4rem 0 0;
  color: var(--hc-intake-muted);
  font-size: 0.85rem;
}

.hc-intake__legal {
  margin: 1rem 0;
  color: var(--hc-intake-muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.hc-intake__actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-top: 1.75rem;
}

.hc-intake__button {
  min-height: 50px;
  padding: 0.75rem 1.3rem;
  color: #fff;
  background: var(--hc-intake-aqua-dark);
  border: 2px solid var(--hc-intake-aqua-dark);
  border-radius: 12px;
  cursor: pointer;
  font: inherit;
  font-weight: 800;
}

.hc-intake__button:hover {
  color: #fff;
  background: #00677a;
}

.hc-intake__button:focus-visible {
  outline: 3px solid rgb(0 189 209 / 32%);
  outline-offset: 3px;
}

.hc-intake__button--back {
  color: var(--hc-intake-aqua-dark);
  background: #fff;
}

.hc-intake__button[disabled] {
  cursor: wait;
  opacity: 0.55;
}

.hc-intake__error,
.hc-intake__configuration-error {
  margin: 0 0 1.5rem;
  padding: 1rem;
  color: var(--hc-intake-error);
  background: #fff2f1;
  border-left: 4px solid var(--hc-intake-error);
  border-radius: 8px;
  font-weight: 700;
}

.hc-intake__success {
  padding: 1.75rem;
  color: #075c4f;
  background: #ecfaf6;
  border: 2px solid #46a996;
  border-radius: 18px;
}

.hc-intake__success h3 {
  margin-top: 0;
  color: inherit;
}

.hc-intake__turnstile {
  min-height: 65px;
  margin-top: 1.25rem;
}

.hc-intake__honeypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

[data-hc-step][hidden],
[data-hc-care-recipient][hidden],
[data-hc-package-level][hidden],
[data-hc-success][hidden],
[data-hc-error][hidden] {
  display: none !important;
}

@media (max-width: 600px) {
  .hc-intake-card {
    margin: 1rem auto;
    border-radius: 20px;
  }

  .hc-intake__choices {
    grid-template-columns: 1fr;
  }

  .hc-intake__actions {
    flex-direction: column-reverse;
  }

  .hc-intake__button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hc-intake__progress-track > span,
  .hc-intake__choice span {
    transition: none;
  }
}

/* Get-started landing and confirmation templates (theme form-card pages). */
.form-card {
  max-width: 760px;
  padding: 0 1rem 3rem;
  margin: 0 auto;
  color: var(--hc-intake-ink);
}

.form-card__header {
  padding: 2rem 0 1.5rem;
  text-align: center;
}

.form-card__main {
  padding: clamp(1.5rem, 4vw, 3rem);
  background: #fff;
  border: 1px solid var(--hc-intake-border);
  border-radius: 28px;
  box-shadow: 0 24px 70px rgb(30 63 72 / 14%);
}

.form-card__content h1 {
  margin: 0 0 1.5rem;
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  line-height: 1.15;
  text-align: center;
}

.form-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  margin: 0 0 1.5rem;
}

.form-choice {
  display: block;
  flex: 1 1 260px;
  padding: 1.15rem 1.5rem;
  color: var(--hc-intake-aqua-dark);
  text-align: center;
  font-weight: 700;
  text-decoration: none;
  background: var(--hc-intake-soft);
  border: 2px solid var(--hc-intake-line);
  border-radius: 16px;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.form-choice:hover,
.form-choice:focus-visible {
  color: var(--hc-intake-aqua-dark);
  background: #fff;
  border-color: var(--hc-intake-aqua);
}

.form-card__actions {
  margin-top: 1.5rem;
  text-align: center;
}

/* ---------- SIL home enquiry: a compact single-step card ---------- */

.hc-intake-card--sil {
  border-radius: 0;
  border: none;
  box-shadow: none;
}

.hc-intake--sil {
  padding: 26px;
}

.hc-intake__progress--hidden {
  display: none;
}

.hc-intake--sil .hc-intake__step > legend {
  margin: 0 0 4px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
}

.hc-intake--sil .hc-intake__sil-sub {
  margin: 0 0 16px;
  color: var(--hc-intake-muted);
  font-size: 13.5px;
}

.hc-intake--sil .hc-intake__field {
  margin-top: 12px;
}

.hc-intake--sil .hc-intake__field > span {
  display: block;
  margin-bottom: 5px;
  font-size: 13px;
  font-weight: 600;
}

.hc-intake--sil .hc-intake__field input,
.hc-intake--sil .hc-intake__field select {
  width: 100%;
  height: 44px;
  padding: 0 12px;
  font-size: 14.5px;
}

.hc-intake__actions--sil {
  display: block;
  margin-top: 18px;
}

.hc-intake__actions--sil .hc-intake__button {
  width: 100%;
  font-size: 15px;
}

.hc-intake--sil .hc-intake__sil-call {
  margin: 12px 0 0;
  color: var(--hc-intake-muted);
  font-size: 13.5px;
  text-align: center;
}

.hc-intake--sil .hc-intake__sil-call b {
  color: var(--hc-intake-aqua-dark);
}
