/* HYPNO.GURU maintenance layer — responsive polish, accessibility, and performance */
:root {
  --line: transparent;
  --line-dark: transparent;
  --maintenance-focus: #f0b09a;
}

html {
  background: var(--ink);
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
}

body {
  min-width: 320px;
  overflow-x: clip;
  overscroll-behavior-x: none;
  background: var(--ink);
}

body,
button,
input,
textarea,
select {
  font-synthesis: none;
}

h1,
h2,
h3,
p,
li,
summary,
button,
a {
  text-wrap: pretty;
}

h1,
h2,
h3 {
  text-wrap: balance;
  overflow-wrap: normal;
  word-break: normal;
}

img {
  height: auto;
}

/* Keep layout hierarchy clean: replace hard rules with spacing and tonal contrast. */
.site-header,
.mobile-panel,
.action-link,
.action-text,
.action-quiet,
.choice-card,
.contact-choice label,
.prepared-panel,
.copy-button,
.skeptic-prompts button,
.audience-list,
.audience-list button,
.audience-item,
.filter-statements button,
.filter-statements .filter-statement,
.approach-track,
.approach-track button,
.approach-item,
.module-list,
.module-item,
.control-note,
.meta-list article,
.statement-stack p,
.cost-list p,
.reframe-sequence > .reveal > div,
.faq-list,
.faq-list details,
.request-ethic,
.handoff-panel,
.review-summary > div,
.success-note,
.initial-shell nav,
.initial-request-form fieldset label {
  border-color: transparent !important;
}

.site-header,
.mobile-panel,
.action-link,
.action-text,
.action-quiet,
.choice-card,
.contact-choice label,
.prepared-panel,
.copy-button,
.skeptic-prompts button,
.audience-list button,
.audience-item,
.filter-statements button,
.filter-statements .filter-statement,
.approach-track button,
.approach-item,
.module-item,
.faq-list details,
.review-summary > div,
.initial-shell nav,
.initial-request-form fieldset label {
  border-width: 0 !important;
}

.action-primary,
.initial-request-form button {
  border: 0 !important;
}

/* Pointer taps do not create a visible button outline; keyboard focus remains obvious. */
button:focus:not(:focus-visible),
a:focus:not(:focus-visible),
summary:focus:not(:focus-visible),
input:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
select:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

:focus-visible {
  outline: 2px solid var(--maintenance-focus) !important;
  outline-offset: 3px;
}

.action-link:focus-visible,
.plain-button:focus-visible,
.scroll-top:focus-visible,
.menu-button:focus-visible,
.copy-button:focus-visible,
.faq-list summary:focus-visible,
.skeptic-prompts button:focus-visible,
.audience-list button:focus-visible,
.filter-statements button:focus-visible,
.approach-track button:focus-visible,
.timeline button:focus-visible {
  border-color: transparent !important;
  box-shadow: 0 0 0 2px var(--maintenance-focus) !important;
  outline: none !important;
}

/* Stable first-page art: use the lightweight animated fallback consistently. */
.hero-art .scene-live-layer,
.hero-art .scene-live-layer.is-ready {
  display: none !important;
  opacity: 0 !important;
}

.hero-art .scene-fallback-layer,
.hero-art .scene-slot-ready .scene-fallback-layer {
  opacity: 1 !important;
}

/* Avoid a whole-page flash during route changes. */
.page-view-route {
  animation: none !important;
}

.page-main > .page-view > section:not(.hero):not(.final-cta),
.page-main > .page-view > .detail-page > section:not(.final-cta) {
  content-visibility: auto;
  contain-intrinsic-size: auto 720px;
}

/* Mobile FAQ: every question is a single compact, readable line. */
@media (max-width: 760px) {
  .faq-list {
    border-top: 0 !important;
  }

  .faq-list details {
    border-bottom: 0 !important;
  }

  .faq-list summary {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 14px 0;
    font-size: clamp(12px, 3.4vw, 15px);
    line-height: 1.2;
    letter-spacing: -0.012em;
    white-space: nowrap;
    overflow: hidden;
  }

  .faq-list summary > span {
    display: flex;
    align-items: center;
    min-width: 0;
    flex: 1 1 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .faq-list summary small {
    width: 28px;
    flex: 0 0 28px;
    font-size: 8px;
  }

  .faq-list summary svg {
    flex: 0 0 16px;
    width: 16px;
    height: 16px;
  }

  .faq-answer {
    max-width: 100%;
    padding: 0 0 18px 28px;
    font-size: 13px;
    line-height: 1.65;
  }

  .hero h1,
  .section-head h2,
  .field-copy h2,
  .final-cta h2,
  .request-intro h1 {
    text-wrap: balance;
  }

  .hero-actions .action-link,
  .initial-request-form button {
    border: 0 !important;
    box-shadow: none !important;
  }

  .site-header,
  .mobile-panel {
    border: 0 !important;
    box-shadow: none;
  }
}

@media (max-width: 390px) {
  .faq-list summary {
    gap: 6px;
    padding: 12px 0;
    font-size: 12px;
    letter-spacing: -0.02em;
  }

  .faq-list summary small {
    width: 25px;
    flex-basis: 25px;
  }

  .faq-answer {
    padding-left: 25px;
    font-size: 12.5px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
}

/* Full-bleed containment removes accidental viewport gutters and horizontal bleed. */
#root,
.site-shell,
.page-main,
.page-view,
.page-view > section,
.page-view > .detail-page,
.site-footer {
  width: 100%;
  max-width: 100%;
}

.page-main {
  overflow-x: clip;
}

.section,
.final-cta,
.request-experience {
  max-width: 100%;
}

/* Final CTA must truly span the viewport: the original mobile rule used calc(100% - 48px), exposing paper rails. */
.final-cta {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

/* Tactile press feedback for every button and button-like control. */
button,
.action-link,
[role="button"],
summary {
  transition: transform 140ms var(--ease-out), background-color 160ms var(--ease-out), color 160ms var(--ease-out), box-shadow 160ms var(--ease-out), filter 160ms var(--ease-out) !important;
  -webkit-tap-highlight-color: transparent;
}

button:active,
.action-link:active,
[role="button"]:active,
summary:active,
button.is-pressed,
.action-link.is-pressed,
[role="button"].is-pressed,
summary.is-pressed {
  transform: scale(0.97) translateY(1px) !important;
}

@media (max-width: 760px) {
  .final-cta {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Pointer/touch presses must never leave a browser focus border or outline behind. */
button,
a.action-link,
summary,
[role="button"],
.menu-button,
.scroll-top,
.copy-button,
.plain-button {
  border: 0 !important;
  outline: none !important;
  -webkit-appearance: none;
  appearance: none;
}

button[data-pointer-focus="true"],
a.action-link[data-pointer-focus="true"],
summary[data-pointer-focus="true"],
[role="button"][data-pointer-focus="true"],
button[data-pointer-focus="true"]:focus,
a.action-link[data-pointer-focus="true"]:focus,
summary[data-pointer-focus="true"]:focus,
[role="button"][data-pointer-focus="true"]:focus {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Keep the motion visible without adding a border-like ring. */
button.is-pressed,
a.action-link.is-pressed,
summary.is-pressed,
[role="button"].is-pressed {
  transform: scale(0.97) translateY(1px) !important;
  filter: brightness(0.92) !important;
}

/* Final interaction rule: buttons never paint an outline, focus ring, border, or box-shadow. */
button:focus,
button:focus-visible,
a.action-link:focus,
a.action-link:focus-visible,
summary:focus,
summary:focus-visible,
[role="button"]:focus,
[role="button"]:focus-visible,
.menu-button:focus,
.menu-button:focus-visible,
.scroll-top:focus,
.scroll-top:focus-visible,
.copy-button:focus,
.copy-button:focus-visible,
.plain-button:focus,
.plain-button:focus-visible {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

button:focus-visible,
a.action-link:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible {
  filter: brightness(1.08);
}

/* Route-specific full-bleed correction for /method and /faq. These sections must not inherit the centered content-shell width. */
.detail-page .faq-section,
.detail-page .skeptic-section,
.detail-page .timeline-section,
.detail-page .final-cta {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc((100% - 100vw) / 2) !important;
  margin-right: calc((100% - 100vw) / 2) !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* The FAQ rows themselves use spacing, never a visible horizontal rule. */
.faq-section .faq-list,
.faq-section .faq-list details,
.faq-section .faq-list summary,
.timeline-section .module-list,
.timeline-section .module-item {
  border: 0 !important;
  box-shadow: none !important;
}

/* Final no-rail, no-ring form hardening. */
.request-experience,
.request-experience *,
.request-experience *::before,
.request-experience *::after {
  min-width: 0;
}

.request-experience input,
.request-experience textarea,
.request-experience select {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

.request-experience textarea {
  min-height: 112px !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  resize: vertical;
  padding: 17px 0 !important;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

/* The production title-line rule used nowrap and clipped long question headings. */
.request-stage h2 .title-line,
.question-card h2 .title-line,
.review-card h2 .title-line {
  display: block !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow: visible !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  text-wrap: balance !important;
}

/* Pointer and keyboard interaction may change tone or scale, never paint a border/ring. */
button,
a,
summary,
[role="button"],
button:active,
button:focus,
button:focus-visible,
a:active,
a:focus,
a:focus-visible,
summary:active,
summary:focus,
summary:focus-visible,
[role="button"]:active,
[role="button"]:focus,
[role="button"]:focus-visible,
.contact-choice label:has(input:focus),
.contact-choice label:has(input:focus-visible),
.consent-row input:focus,
.consent-row input:focus-visible {
  border: 0 !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

button:focus-visible,
a:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible {
  filter: brightness(1.08) !important;
}

/* Restore the custom site cursor; this ring is separate from button focus styling. */
body.has-custom-cursor,
body.has-custom-cursor * {
  cursor: none !important;
}

.custom-cursor,
body.has-custom-cursor .custom-cursor {
  display: block !important;
  opacity: 0.86 !important;
  visibility: visible !important;
  border: 1px solid rgba(229, 161, 141, 0.9) !important;
  box-shadow: none !important;
}

/* Services page: keep all four offer points on one desktop row. */
@media (min-width: 761px) {
  html.services-route .module-list:has(> .module-item:nth-child(4)) {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: auto !important;
    align-items: start;
  }

  html.services-route .module-list > .module-item {
    min-width: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
  }
}


/* Form control repair: keep the request form legible and interactive. */
.request-experience {
  --form-line: rgba(248, 244, 237, 0.28);
  --form-line-strong: rgba(229, 161, 141, 0.92);
}

.request-experience input:not([type="radio"]):not([type="checkbox"]),
.request-experience textarea,
.request-experience select {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  border: 1px solid var(--form-line) !important;
  border-radius: 3px !important;
  outline: none !important;
  box-shadow: none !important;
  background: rgba(255, 255, 255, 0.018) !important;
  color: var(--text) !important;
}

.request-experience input:not([type="radio"]):not([type="checkbox"]) {
  min-height: 49px !important;
  padding: 12px 14px !important;
}

.request-experience textarea {
  min-height: 112px !important;
  height: auto !important;
  padding: 17px 14px !important;
  resize: vertical;
}

.request-experience select {
  min-height: 49px !important;
  padding: 12px 40px 12px 14px !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
  cursor: pointer;
}

.request-experience select option {
  background: #1c1916;
  color: #f8f4ed;
}

.request-experience input:not([type="radio"]):not([type="checkbox"]):focus,
.request-experience textarea:focus,
.request-experience select:focus {
  border-color: var(--form-line-strong) !important;
  box-shadow: 0 0 0 1px rgba(229, 161, 141, 0.24) !important;
}

/* Keep the visually hidden radios small so they never sit over the label's hit area. */
.request-experience .choice-card > input[type="radio"],
.request-experience .contact-choice input[type="radio"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-width: 1px !important;
  min-height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  opacity: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.request-experience .choice-card,
.request-experience .contact-choice label {
  border: 1px solid var(--form-line) !important;
  border-radius: 3px !important;
  user-select: none;
  -webkit-user-select: none;
}

.request-experience .choice-card {
  position: relative;
  background: rgba(255, 255, 255, 0.012);
}

.request-experience .choice-card:hover,
.request-experience .choice-card.is-selected,
.request-experience .contact-choice label:hover,
.request-experience .contact-choice label.is-selected {
  border-color: var(--form-line-strong) !important;
  background: rgba(229, 161, 141, 0.08) !important;
}

.request-experience .choice-card:has(input[type="radio"]:focus-visible),
.request-experience .contact-choice label:has(input[type="radio"]:focus-visible) {
  outline: 2px solid var(--maintenance-focus) !important;
  outline-offset: 3px;
}

.request-experience .consent-row input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  border: 0 !important;
  padding: 0 !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
}


/* Final field interaction hardening: one border, one reliable hit target. */
.request-experience .request-fields,
.request-experience .field-label {
  position: relative;
  z-index: 1;
}

.request-experience .field-label > span {
  pointer-events: none;
}

.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]),
.request-experience .request-fields textarea,
.request-experience .request-fields select {
  position: relative;
  z-index: 2;
  pointer-events: auto !important;
  cursor: text !important;
  touch-action: manipulation;
  border: 1px solid var(--form-line) !important;
  box-shadow: none !important;
  outline: none !important;
}

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


/* Final control normalization: no wrapper ring, no duplicate input edge, generous consent hit area. */
.request-experience .field-label,
.request-experience .field-label:focus-within,
.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]),
.request-experience .request-fields textarea,
.request-experience .request-fields select,
.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]):focus,
.request-experience .request-fields textarea:focus,
.request-experience .request-fields select:focus,
.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]):focus-visible,
.request-experience .request-fields textarea:focus-visible,
.request-experience .request-fields select:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

.request-experience .request-fields input:not([type="radio"]):not([type="checkbox"]),
.request-experience .request-fields textarea,
.request-experience .request-fields select {
  border: 1px solid var(--form-line) !important;
}

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

.request-experience .consent-row {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  min-height: 44px;
  padding: 4px 0;
  cursor: pointer !important;
  pointer-events: auto !important;
  user-select: none;
  -webkit-user-select: none;
}

.request-experience .consent-row > input[type="checkbox"] {
  position: relative !important;
  z-index: 2;
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  min-height: 20px !important;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  opacity: 1 !important;
  border: 1px solid var(--form-line-strong) !important;
  outline: none !important;
  box-shadow: none !important;
  appearance: auto !important;
  -webkit-appearance: auto !important;
  accent-color: var(--accent-light);
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation;
}

.request-experience .consent-row > input[type="checkbox"]:focus,
.request-experience .consent-row > input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--maintenance-focus) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}

.request-experience .consent-row > span {
  display: block;
  min-height: 36px;
  cursor: pointer !important;
  pointer-events: auto !important;
}

/* Keep the custom cursor exactly on the pointer hotspot; it must never intercept clicks. */
body.has-custom-cursor .custom-cursor {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  margin: -13px 0 0 -13px !important;
  pointer-events: none !important;
  transform: translate3d(var(--cursor-x, -100px), var(--cursor-y, -100px), 0) !important;
  transition: width var(--base) var(--ease-emphasis), height var(--base) var(--ease-emphasis), margin var(--base) var(--ease-emphasis), background-color var(--base) var(--ease-out), border-color var(--base) var(--ease-out) !important;
}

body.has-custom-cursor .custom-cursor.is-hover {
  margin: -22px 0 0 -22px !important;
}


/* HYPNO.GURU v9 visual repair: restore rhythm, borders, and deliberate spacing. */
:root {
  --line: rgba(248, 244, 237, 0.16) !important;
  --line-dark: rgba(18, 17, 15, 0.16) !important;
  --form-line: rgba(248, 244, 237, 0.30) !important;
  --form-line-strong: rgba(229, 161, 141, 0.96) !important;
  --form-surface: rgba(255, 255, 255, 0.025) !important;
}

/* Restore the site’s visual rhythm without turning every section into a box. */
.site-header {
  border-bottom: 1px solid var(--line) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.10) !important;
}

.action-link.action-primary {
  border: 1px solid var(--accent) !important;
  box-shadow: none !important;
}

.action-link.action-text {
  border-bottom: 1px solid currentColor !important;
}

.action-link.action-quiet {
  border-bottom: 1px solid var(--line) !important;
}

.statement-stack p,
.cost-list p,
.reframe-sequence > .reveal > div,
.module-list,
.module-item,
.faq-list,
.faq-list details,
.meta-list article,
.audience-list,
.approach-track,
.approach-item,
.control-note,
.handoff-panel,
.initial-shell nav {
  border-color: var(--line-dark) !important;
}

.statement-stack p,
.cost-list p,
.reframe-sequence > .reveal > div,
.module-item,
.faq-list details,
.meta-list article,
.audience-item,
.approach-item {
  border-bottom: 1px solid var(--line-dark) !important;
}

.module-list,
.faq-list {
  border-top: 1px solid var(--line-dark) !important;
}

/* The request flow is a spacious three-column composition on desktop. */
.request-experience {
  padding: clamp(58px, 7vh, 88px) 0 clamp(68px, 8vh, 104px) !important;
}

.request-shell {
  column-gap: clamp(36px, 4.6vw, 76px) !important;
  row-gap: 36px !important;
  align-items: center !important;
}

.request-intro {
  padding-right: clamp(0px, 1.5vw, 20px) !important;
}

.request-intro > p {
  margin-top: 30px !important;
}

.request-intro .request-application-note {
  margin-top: 18px !important;
}

.request-ethic {
  margin-top: 44px !important;
  padding-top: 20px !important;
  border-top: 1px solid var(--line) !important;
}

.request-visual {
  min-width: 0 !important;
}

.request-stage {
  min-width: 0 !important;
  max-width: 590px !important;
  width: 100% !important;
}

.request-progress {
  margin-bottom: 30px !important;
}

/* Give each question a quiet surface and consistent internal padding. */
.question-card,
.review-card,
.prepared-panel {
  padding: clamp(22px, 2.7vw, 36px) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, rgba(255,255,255,0.028), rgba(255,255,255,0.008)) !important;
}

.question-card h2,
.review-card h2 {
  margin-bottom: 24px !important;
}

.question-card textarea,
.review-card textarea,
.request-fields input:not([type="radio"]):not([type="checkbox"]),
.request-fields select,
.initial-request-form input,
.initial-request-form textarea,
.initial-request-form select {
  width: 100% !important;
  min-height: 50px !important;
  padding: 13px 15px !important;
  border: 1px solid var(--form-line) !important;
  border-radius: 8px !important;
  outline: none !important;
  box-shadow: none !important;
  background: var(--form-surface) !important;
  color: var(--text) !important;
  transition: border-color 160ms var(--ease-out), background-color 160ms var(--ease-out) !important;
}

.question-card textarea,
.review-card textarea {
  min-height: 132px !important;
  resize: vertical !important;
  line-height: 1.6 !important;
}

.question-card textarea::placeholder,
.review-card textarea::placeholder,
.request-fields input::placeholder,
.initial-request-form input::placeholder,
.initial-request-form textarea::placeholder {
  color: rgba(181, 171, 160, 0.80) !important;
}

.question-card textarea:focus,
.review-card textarea:focus,
.request-fields input:not([type="radio"]):not([type="checkbox"]):focus,
.request-fields select:focus,
.initial-request-form input:focus,
.initial-request-form textarea:focus,
.initial-request-form select:focus {
  border-color: var(--form-line-strong) !important;
  background: rgba(229, 161, 141, 0.055) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Focus is expressed by one border color, never a second ring. */
.question-card textarea:focus-visible,
.review-card textarea:focus-visible,
.request-fields input:focus-visible,
.request-fields select:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.request-fields {
  display: grid !important;
  gap: 20px !important;
  margin-top: 4px !important;
}

.field-label {
  display: grid !important;
  gap: 8px !important;
  color: var(--muted) !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

.field-label > span,
.contact-fieldset legend {
  color: var(--muted) !important;
  font-weight: 700 !important;
}

.field-label small {
  color: var(--accent-light) !important;
}

.contact-fieldset {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.contact-fieldset legend {
  margin: 0 0 8px !important;
  font-size: 11px !important;
}

.contact-choice {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.request-experience .contact-choice label {
  min-height: 50px !important;
  padding: 0 15px !important;
  border: 1px solid var(--form-line) !important;
  border-radius: 8px !important;
  background: var(--form-surface) !important;
  color: var(--muted) !important;
  transform: none !important;
}

.request-experience .contact-choice label:hover,
.request-experience .contact-choice label.is-selected {
  border-color: var(--form-line-strong) !important;
  background: rgba(229, 161, 141, 0.08) !important;
  color: var(--text) !important;
  transform: none !important;
}

.choice-stack {
  gap: 12px !important;
}

.request-experience .choice-card {
  min-height: 60px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--form-line) !important;
  border-radius: 8px !important;
  background: var(--form-surface) !important;
  transform: none !important;
}

.request-experience .choice-card:hover,
.request-experience .choice-card.is-selected {
  border-color: var(--form-line-strong) !important;
  background: rgba(229, 161, 141, 0.08) !important;
  color: var(--text) !important;
  transform: none !important;
}

.consent-row {
  margin-top: 2px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--line) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.018) !important;
}

.request-experience .consent-row > span {
  font-size: 11px !important;
  line-height: 1.55 !important;
  color: var(--muted) !important;
}

.request-experience .consent-row > input[type="checkbox"] {
  margin-top: 2px !important;
  width: 20px !important;
  height: 20px !important;
  border: 1px solid var(--form-line-strong) !important;
  border-radius: 4px !important;
  accent-color: var(--accent-light) !important;
}

.request-experience .consent-row > input[type="checkbox"]:focus,
.request-experience .consent-row > input[type="checkbox"]:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 2px rgba(229,161,141,0.32) !important;
}

.question-actions,
.review-actions,
.prepared-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  margin-top: 26px !important;
}

.question-actions .action-primary,
.review-actions .action-primary,
.prepared-actions .action-primary {
  min-height: 48px !important;
  padding: 0 20px !important;
}

.review-summary {
  display: grid !important;
  gap: 0 !important;
  margin-bottom: 28px !important;
}

.review-summary > div {
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--line) !important;
}

.review-summary > div:first-child {
  padding-top: 0 !important;
}

.review-summary > div:last-child {
  border-bottom: 0 !important;
}

.error-summary {
  margin-bottom: 16px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(229, 161, 141, 0.50) !important;
  border-radius: 8px !important;
  background: rgba(229, 161, 141, 0.08) !important;
}

.field-error {
  margin-top: 8px !important;
  color: var(--accent-light) !important;
  line-height: 1.45 !important;
}

.success-panel {
  padding: clamp(28px, 4vw, 48px) !important;
  border-color: rgba(229, 161, 141, 0.46) !important;
}

.success-note {
  margin-top: 22px !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--line) !important;
}

@media (max-width: 960px) {
  .request-shell {
    grid-template-columns: minmax(220px, 0.86fr) minmax(340px, 1.14fr) !important;
    gap: 32px !important;
  }

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

  .request-stage {
    max-width: 640px !important;
  }
}

@media (max-width: 760px) {
  .site-header {
    border-bottom: 1px solid var(--line) !important;
  }

  .request-experience {
    padding: 42px 0 64px !important;
  }

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

  .request-intro {
    padding-right: 0 !important;
  }

  .request-intro > p {
    margin-top: 22px !important;
  }

  .request-ethic {
    margin-top: 28px !important;
  }

  .request-stage {
    max-width: none !important;
    padding-bottom: 0 !important;
  }

  .question-card,
  .review-card,
  .prepared-panel {
    padding: 20px !important;
    border-radius: 12px !important;
  }

  .contact-choice {
    grid-template-columns: 1fr !important;
  }

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

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

@media (max-width: 390px) {
  .question-card,
  .review-card,
  .prepared-panel {
    padding: 17px !important;
  }

  .request-experience input:not([type="radio"]):not([type="checkbox"]),
  .request-experience textarea,
  .request-experience select {
    padding-left: 13px !important;
    padding-right: 13px !important;
  }
}
