/* HYPNO.GURU v10 form stability: no viewport crop, no shifting press state, one focus border. */

/* The request page must grow with its content; never use the viewport as a height cap. */
.request-experience,
.request-experience.section-dark,
.page-main,
.page-main > .page-view,
.page-main > .page-view > .request-experience,
.request-experience .request-shell,
.request-experience .request-stage,
.request-experience .question-card,
.request-experience .review-card,
.request-experience .prepared-panel {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

.request-experience {
  display: block !important;
  padding-top: clamp(54px, 7vh, 88px) !important;
  padding-bottom: clamp(72px, 9vh, 120px) !important;
}

.request-experience .request-shell {
  display: grid !important;
  align-items: start !important;
  grid-template-columns: minmax(220px, 0.78fr) minmax(340px, 1.22fr) !important;
  column-gap: clamp(36px, 5vw, 82px) !important;
  row-gap: 40px !important;
}

.request-experience .request-stage {
  align-self: start !important;
  width: 100% !important;
  max-width: 640px !important;
  padding-bottom: 20px !important;
}

.request-experience .question-card,
.request-experience .review-card,
.request-experience .prepared-panel {
  width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.request-experience .review-card {
  margin-bottom: 28px !important;
}

.request-experience .review-actions,
.request-experience .question-actions,
.request-experience .prepared-actions {
  position: relative !important;
  z-index: 3 !important;
  margin-bottom: 4px !important;
}

/* A press should change tone only; it must not translate or animate borders out of alignment. */
.request-experience button,
.request-experience a.action-link,
.request-experience .choice-card,
.request-experience .contact-choice label,
.request-experience .consent-row {
  transform: none !important;
  animation: none !important;
  filter: none !important;
  transition: background-color 160ms var(--ease-out), color 160ms var(--ease-out), border-color 160ms var(--ease-out) !important;
}

.request-experience button:active,
.request-experience button.is-pressed,
.request-experience a.action-link:active,
.request-experience a.action-link.is-pressed,
.request-experience .choice-card:active,
.request-experience .choice-card.is-pressed,
.request-experience .contact-choice label:active,
.request-experience .contact-choice label.is-pressed,
.request-experience .consent-row:active,
.request-experience .consent-row.is-pressed {
  transform: none !important;
  animation: none !important;
  filter: brightness(0.96) !important;
}

/* Remove every competing browser/enhancement focus ring inside the request flow. */
.request-experience input,
.request-experience textarea,
.request-experience select,
.request-experience button,
.request-experience a,
.request-experience label,
.request-experience summary,
.request-experience [role="button"] {
  outline: none !important;
  outline-width: 0 !important;
  outline-offset: 0 !important;
}

.request-experience input:focus,
.request-experience input:focus-visible,
.request-experience textarea:focus,
.request-experience textarea:focus-visible,
.request-experience select:focus,
.request-experience select:focus-visible,
.request-experience button:focus,
.request-experience button:focus-visible,
.request-experience a:focus,
.request-experience a:focus-visible,
.request-experience label:focus,
.request-experience label:focus-visible,
.request-experience [role="button"]:focus,
.request-experience [role="button"]:focus-visible {
  outline: none !important;
  outline-width: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
}

/* Editable fields: exactly one border, including during pointer press and keyboard focus. */
.request-experience .question-card textarea,
.request-experience .review-card textarea,
.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]),
.request-experience .request-fields select {
  position: relative !important;
  z-index: 2 !important;
  border: 1px solid var(--form-line) !important;
  box-shadow: none !important;
  outline: none !important;
  outline-offset: 0 !important;
  background-clip: padding-box !important;
}

.request-experience .question-card textarea:focus,
.request-experience .question-card textarea:focus-visible,
.request-experience .review-card textarea:focus,
.request-experience .review-card textarea:focus-visible,
.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]):focus,
.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]):focus-visible,
.request-experience .request-fields select:focus,
.request-experience .request-fields select:focus-visible {
  border: 1px solid var(--form-line-strong) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Actions use one intentional border and remain visually stable while pressed. */
.request-experience .question-actions .action-primary,
.request-experience .review-actions .action-primary,
.request-experience .prepared-actions .action-primary {
  border: 1px solid var(--accent) !important;
  outline: none !important;
  box-shadow: none !important;
}

.request-experience .question-actions .action-primary:focus,
.request-experience .question-actions .action-primary:focus-visible,
.request-experience .review-actions .action-primary:focus,
.request-experience .review-actions .action-primary:focus-visible,
.request-experience .prepared-actions .action-primary:focus,
.request-experience .prepared-actions .action-primary:focus-visible {
  border: 1px solid var(--accent-light) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Choice and consent controls: keep their own single selection border, without an outline ring. */
.request-experience .choice-card,
.request-experience .contact-choice label,
.request-experience .consent-row {
  outline: none !important;
  box-shadow: none !important;
}

.request-experience .choice-card:has(input[type="radio"]:focus),
.request-experience .choice-card:has(input[type="radio"]:focus-visible),
.request-experience .contact-choice label:has(input[type="radio"]:focus),
.request-experience .contact-choice label:has(input[type="radio"]:focus-visible) {
  border-color: var(--form-line-strong) !important;
  outline: none !important;
  box-shadow: none !important;
}

.request-experience .consent-row > input[type="checkbox"],
.request-experience .consent-row > input[type="checkbox"]:focus,
.request-experience .consent-row > input[type="checkbox"]:focus-visible {
  outline: none !important;
  outline-width: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 960px) {
  .request-experience .request-shell {
    grid-template-columns: minmax(220px, 0.72fr) minmax(320px, 1.28fr) !important;
    column-gap: 30px !important;
  }
}

@media (max-width: 760px) {
  html,
  body,
  #root,
  .site-shell,
  .page-main,
  .page-main > .page-view,
  .request-experience,
  .request-experience .request-shell,
  .request-experience .request-stage {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .request-experience .request-shell {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 30px !important;
  }

  .request-experience .request-visual {
    display: none !important;
  }

  .request-experience .request-stage {
    max-width: none !important;
    padding-bottom: 12px !important;
  }

  .request-experience .question-card,
  .request-experience .review-card,
  .request-experience .prepared-panel {
    margin-bottom: 0 !important;
    padding: 20px !important;
  }

  .request-experience .question-actions,
  .request-experience .review-actions,
  .request-experience .prepared-actions {
    align-items: stretch !important;
  }

  .request-experience .question-actions .action-primary,
  .request-experience .review-actions .action-primary,
  .request-experience .prepared-actions .action-primary {
    width: 100% !important;
  }
}