@font-face {
  font-family: "Source Serif 4";
  src: url("/assets/fonts/SourceSerif4-Variable.woff2") format("woff2");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Sans 3";
  src: url("/assets/fonts/SourceSans3-Variable.woff2") format("woff2");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }

html {
  background: var(--color-background);
  color: var(--color-ink);
  scroll-behavior: smooth;
  text-size-adjust: 100%;
}

body {
  min-width: 20rem;
  min-height: 100vh;
  margin: 0;
  background: var(--color-background);
  font-family: var(--font-body);
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
p, h1, h2, h3, figure, dl, dd { margin: 0; }

:where(a, button):focus-visible {
  outline: 3px solid var(--color-focus);
  outline-offset: 4px;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: var(--space-3);
  left: var(--space-4);
  padding: var(--space-3) var(--space-4);
  color: var(--color-on-accent);
  background: var(--color-accent);
  transform: translateY(-160%);
}

.skip-link:focus { transform: none; }

.shell {
  width: min(var(--layout-max), calc(100% - 2 * var(--layout-gutter)));
  margin-inline: auto;
}

.site-header {
  border-bottom: var(--border-subtle);
  background: var(--color-background);
}

.header-inner {
  display: flex;
  min-height: 5rem;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
}

.brand {
  display: inline-flex;
  min-height: var(--tap-target-min);
  align-items: center;
  gap: var(--space-4);
  text-decoration: none;
}

.brand strong {
  font-family: var(--font-display);
  font-size: 1.75rem;
  font-weight: 550;
  line-height: 1;
}

.brand span {
  max-width: 11rem;
  padding-left: var(--space-4);
  border-left: var(--border-subtle);
  color: var(--color-ink-muted);
  font-size: var(--font-size-caption);
  line-height: 1.25;
}

.header-inner > p {
  color: var(--color-ink-muted);
  font-size: var(--font-size-small);
}

.hero {
  border-bottom: var(--border-subtle);
}

.hero-grid {
  display: grid;
  min-height: calc(100svh - 5rem);
  grid-template-columns: minmax(0, 7fr) minmax(22rem, 5fr);
  align-items: stretch;
}

.hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-16) var(--space-16) var(--space-16) 0;
}

.hero h1 {
  max-width: 12ch;
  font-family: var(--font-display);
  font-size: var(--font-size-h1);
  font-weight: 450;
  letter-spacing: var(--tracking-heading);
  line-height: var(--line-height-h1);
}

.hero-lead {
  max-width: 42rem;
  margin-top: var(--space-8);
  font-size: var(--font-size-lead);
  line-height: var(--line-height-lead);
}

.hero-answer {
  max-width: 42rem;
  margin-top: var(--space-6);
  color: var(--color-ink-muted);
}

.primary-action {
  display: flex;
  width: min(100%, 26rem);
  min-height: 4.25rem;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin-top: var(--space-8);
  padding: var(--space-4) var(--space-6);
  border: 1px solid var(--color-accent);
  border-radius: var(--radius-action);
  color: var(--color-on-accent);
  background: var(--color-accent);
  text-decoration: none;
  transition: background-color var(--duration-normal) var(--ease-out), border-color var(--duration-normal) var(--ease-out), transform var(--duration-micro) var(--ease-out);
}

.primary-action:hover { background: var(--color-accent-hover); border-color: var(--color-accent-hover); }
.primary-action:active { background: var(--color-accent-active); border-color: var(--color-accent-active); transform: translateY(1px); }
.primary-action span { font-weight: 650; }
.primary-action strong { font-size: 1rem; white-space: nowrap; }

.action-note {
  max-width: 28rem;
  margin-top: var(--space-3);
  color: var(--color-ink-muted);
  font-size: var(--font-size-caption);
}

.hero-person {
  display: grid;
  min-width: 0;
  grid-template-rows: minmax(0, 1fr) auto;
  border-inline: var(--border-subtle);
  background: var(--color-surface);
}

.hero-person picture { min-height: 0; overflow: hidden; }
.hero-person img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 24%; }

.hero-person figcaption {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-6);
  border-top: var(--border-subtle);
}

.hero-person figcaption strong { font-family: var(--font-display); font-size: 1.375rem; font-weight: 550; }
.hero-person figcaption span { color: var(--color-ink-muted); font-size: var(--font-size-small); }
.hero-person figcaption span + span { font-size: var(--font-size-caption); }

.section { padding-block: var(--space-section); border-bottom: var(--border-subtle); }
.section h2, .final-call h2 { font-family: var(--font-display); font-size: var(--font-size-h2); font-weight: 450; letter-spacing: var(--tracking-heading); line-height: var(--line-height-h2); }
.section h3 { font-family: var(--font-display); font-size: var(--font-size-h3); line-height: var(--line-height-h3); }

.split-heading, .limits-grid {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: var(--space-24);
  align-items: start;
}

.split-heading > div > p, .limits-grid > div > p, .section-head > p, .responsibility-layout header > p {
  max-width: var(--layout-reading);
  margin-top: var(--space-6);
  color: var(--color-ink-muted);
}

.ruled-list { margin: 0; padding: 0; border-top: var(--border-strong); list-style: none; }
.ruled-list li { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--space-8); padding-block: var(--space-6); border-bottom: var(--border-subtle); }
.ruled-list strong { font-size: 1.125rem; line-height: 1.35; }
.ruled-list span { color: var(--color-ink-muted); }

.review { background: var(--color-surface); }
.responsibility-layout { display: grid; grid-template-columns: minmax(0, 4fr) 2px minmax(0, 7fr); gap: var(--space-16); }
.responsibility-line { width: var(--responsibility-line-width); min-height: 100%; background: var(--color-line-strong); }
.fact-list { border-top: var(--border-strong); }
.fact-list > div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--space-8); padding-block: var(--space-6); border-bottom: var(--border-subtle); }
.fact-list dt { font-weight: 700; }
.fact-list dd { color: var(--color-ink-muted); }

.section-head { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: var(--space-24); margin-bottom: var(--space-16); }
.section-head > p { margin-top: 0; }
.process-list { margin: 0; padding: 0; border-top: var(--border-strong); list-style: none; }
.process-list li { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: var(--space-16); padding-block: var(--space-8); border-bottom: var(--border-subtle); }
.process-list > li > span { color: var(--color-ink-muted); font-size: var(--font-size-caption); font-weight: 700; letter-spacing: 0.04em; }
.process-list h3 { font-weight: 550; }
.process-list p { max-width: var(--layout-reading); margin-top: var(--space-3); color: var(--color-ink-muted); }

.limits { color: var(--color-surface); background: var(--color-ink); }
.limits-grid > div > p, .limits-copy p { color: #c6c8ca; }
.limits-copy { border-top: 1px solid #4a4d50; }
.limits-copy p { padding-block: var(--space-6); border-bottom: 1px solid #4a4d50; }

.practitioner-grid { display: grid; grid-template-columns: minmax(18rem, 4fr) minmax(0, 7fr); gap: var(--space-24); align-items: center; }
.practitioner picture { align-self: stretch; min-height: 34rem; border: var(--border-subtle); background: var(--color-surface); overflow: hidden; }
.practitioner picture img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 24%; }
.practitioner-role { margin-top: var(--space-4); color: var(--color-ink-muted); font-weight: 650; }
.professional-roles { margin-top: var(--space-1); color: var(--color-ink); font-weight: 650; }
.practitioner-grid > div > p:not(.practitioner-role):not(.professional-roles) { max-width: var(--layout-reading); margin-top: var(--space-8); }
.status-link { display: inline-flex; min-height: var(--tap-target-min); align-items: center; margin-top: var(--space-6); color: var(--color-accent); font-weight: 650; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.25em; }
.status-link:hover { color: var(--color-accent-hover); }
.practitioner address { display: flex; flex-direction: column; gap: var(--space-1); margin-top: var(--space-8); padding-top: var(--space-6); border-top: var(--border-subtle); font-style: normal; }
.practitioner address span { color: var(--color-ink-muted); font-size: var(--font-size-small); }

.final-call { padding-block: var(--space-section); border-bottom: var(--border-subtle); background: var(--color-surface); }
.final-call-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(20rem, 4fr); gap: var(--space-24); align-items: end; }
.final-call p { max-width: var(--layout-reading); margin-top: var(--space-6); color: var(--color-ink-muted); }
.call-actions .primary-action { width: 100%; margin-top: 0; }
.text-action { display: inline-flex; min-height: var(--tap-target-min); align-items: center; margin-top: var(--space-3); color: var(--color-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.25em; }
.text-action:hover { color: var(--color-accent-hover); }

.bankruptcy-warning {
  padding-block: clamp(var(--space-12), 6vw, var(--space-24));
  border-bottom: var(--border-strong);
  background: #e7e5df;
}

.bankruptcy-warning strong {
  display: block;
  max-width: 58ch;
  font-family: var(--font-display);
  font-size: clamp(1.375rem, 2.5vw, 2.25rem);
  font-weight: 550;
  line-height: 1.3;
}

.site-footer { padding-block: var(--space-12); background: var(--color-background); }
.footer-grid { display: grid; grid-template-columns: 1.1fr 1fr 1.3fr; gap: var(--space-12); color: var(--color-ink-muted); font-size: var(--font-size-small); }
.footer-grid p { display: flex; flex-direction: column; gap: var(--space-1); }
.footer-grid strong { color: var(--color-ink); font-family: var(--font-display); font-size: 1.25rem; }
.footer-grid address { font-style: normal; }

@media (max-width: 960px) {
  .hero-grid { grid-template-columns: minmax(0, 6fr) minmax(19rem, 5fr); }
  .hero-copy { padding-right: var(--space-8); }
  .split-heading, .limits-grid, .section-head, .final-call-grid { gap: var(--space-12); }
  .practitioner-grid { gap: var(--space-12); }
}

@media (max-width: 760px) {
  .header-inner { min-height: 4.5rem; }
  .header-inner > p { display: none; }
  .brand { width: 100%; justify-content: space-between; }

  .hero-grid,
  .split-heading,
  .limits-grid,
  .responsibility-layout,
  .section-head,
  .practitioner-grid,
  .final-call-grid,
  .footer-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .hero-grid { min-height: 0; }
  .hero-copy { padding: var(--space-12) 0; }
  .hero h1 { max-width: 100%; }
  .hero-person { border-right: 0; border-left: 0; }
  .hero-person picture { aspect-ratio: 4 / 5; }
  .primary-action { width: 100%; min-height: 4rem; }

  .split-heading, .limits-grid, .section-head, .final-call-grid { gap: var(--space-12); }
  .ruled-list li { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }
  .responsibility-layout { gap: var(--space-8); }
  .responsibility-line { width: 100%; min-height: 2px; height: 2px; }
  .fact-list > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .section-head { margin-bottom: var(--space-8); }
  .process-list li { grid-template-columns: minmax(0, 1fr); gap: var(--space-3); }

  .practitioner picture { min-height: 0; aspect-ratio: 4 / 5; }
  .call-actions { width: 100%; }
  .text-action { width: 100%; justify-content: flex-start; }
  .footer-grid { gap: var(--space-8); }

}

@media (max-width: 390px) {
  .brand span { max-width: 9rem; font-size: 0.6875rem; }
  .primary-action { flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0ms !important; }
}