@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('fonts/plus-jakarta-sans-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('fonts/inter-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --gutter: var(--bpw-space-24);
}

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--bpw-bg-page);
  color: var(--bpw-text-body);
  font: var(--bpw-step-0)/1.65 var(--bpw-font-body);
  overflow-wrap: anywhere;
}
p, h1, h2 { margin: 0; }
h1, h2 { font-family: var(--bpw-font-display); font-weight: 700; }
a {
  color: var(--bpw-link);
  text-underline-offset: .22em;
  text-decoration-thickness: .08em;
}
@media (hover: hover) and (pointer: fine) {
  a:hover { text-decoration-thickness: .14em; }
}
:focus-visible {
  outline: 3px solid var(--bpw-focus);
  outline-offset: 3px;
}
[id][tabindex] { scroll-margin-block-start: var(--bpw-space-16); }
::selection { color: var(--bpw-ink-900); background: var(--bpw-stone-200); }

.wrap {
  width: min(1140px, calc(100% - var(--gutter) * 2));
  margin-inline: auto;
}

.skip-link {
  position: absolute;
  z-index: 1;
  inset-block-start: var(--bpw-space-8);
  inset-inline-start: var(--gutter);
  max-inline-size: calc(100% - var(--gutter) * 2);
  display: inline-flex;
  align-items: center;
  min-height: var(--bpw-target);
  padding: var(--bpw-space-8) var(--bpw-space-16);
  border-radius: var(--bpw-radius-m);
  background: var(--bpw-bg-card);
  transform: translateY(calc(-100% - var(--bpw-space-16)));
}
.skip-link:focus { transform: none; }

.masthead, .footer-layout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bpw-space-16);
}
.masthead { padding-block: var(--bpw-space-16); }
.brand {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  min-height: var(--bpw-target);
  gap: var(--bpw-space-2);
  color: var(--bpw-text-heading);
  font: 600 .875rem/1.2 var(--bpw-font-display);
  text-decoration: none;
}
.brand strong { font-size: var(--bpw-step-1); font-weight: 700; letter-spacing: -.02em; }

nav {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--bpw-space-24);
}
nav a, .footer-layout a {
  display: inline-flex;
  align-items: center;
  min-height: var(--bpw-target);
  gap: var(--bpw-space-8);
  font: 600 .9375rem/1.2 var(--bpw-font-display);
}
@media (hover: hover) and (pointer: fine) {
  .brand:hover { text-decoration: underline; }
}

.crisis {
  --bpw-focus: var(--bpw-crisis-focus);
  background: var(--bpw-crisis-bg);
  color: var(--bpw-crisis-text);
}
.crisis-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  column-gap: var(--bpw-space-32);
  padding-block: var(--bpw-space-8);
}
.crisis-heading { padding-block: var(--bpw-space-12); }
.crisis h2 {
  display: flex;
  align-items: baseline;
  gap: var(--bpw-space-8);
  font-size: 1rem;
  line-height: 1.4;
}
.phone { font-family: system-ui, sans-serif; }
.crisis-copy { font-size: 1rem; line-height: 1.5; }
.crisis a {
  min-inline-size: var(--bpw-target);
  text-align: center;
  display: inline-block;
  max-inline-size: 100%;
  min-height: var(--bpw-target);
  padding-block: var(--bpw-space-8);
  line-height: 1.75;
  color: var(--bpw-crisis-link);
  font-weight: 600;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15rem, 29%);
  gap: var(--bpw-space-48);
  align-items: center;
  padding-block: var(--bpw-space-80);
}
.eyebrow {
  color: var(--bpw-text-accent);
  font: 700 .75rem/1.2 var(--bpw-font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
}
h1, main h2 { color: var(--bpw-text-heading); }
h1 {
  margin-block: var(--bpw-space-16) var(--bpw-space-20);
  font-size: var(--bpw-step-5);
  letter-spacing: -.02em;
  line-height: 1.05;
}
h1 span { display: block; color: var(--bpw-text-accent); }
.intro { font: 500 var(--bpw-step-1)/1.4 var(--bpw-font-display); }

.cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--bpw-space-16);
  min-height: var(--bpw-target);
  max-inline-size: 100%;
  margin-top: var(--bpw-space-24);
  padding: var(--bpw-space-12) var(--bpw-space-16);
  border-radius: var(--bpw-radius-m);
  background: var(--bpw-action);
  color: var(--bpw-on-action);
  font: 700 .9375rem/1.2 var(--bpw-font-display);
  letter-spacing: .05em;
  text-decoration: none;
  text-transform: uppercase;
}
@media (hover: hover) and (pointer: fine) {
  .cta:hover { background: var(--bpw-action-hover); color: var(--bpw-on-action-hover); }
}
@media (prefers-reduced-motion: no-preference) {
  .cta:active { scale: .98; }
}

.clinician {
  padding: var(--bpw-space-24);
  border: 1px solid var(--bpw-border);
  border-radius: var(--bpw-radius-l);
  background: var(--bpw-bg-card);
}
.clinician .eyebrow { color: var(--bpw-text-muted); }
.clinician h2 {
  margin-top: var(--bpw-space-12);
  font-size: var(--bpw-step-2);
  line-height: 1.25;
  letter-spacing: -.01em;
}
.credentials {
  margin-top: var(--bpw-space-8);
  color: var(--bpw-text-muted);
  font-size: .875rem;
  font-weight: 500;
}

.practice-details {
  border: 1px solid var(--bpw-border);
  border-radius: var(--bpw-radius-xl);
  background: var(--bpw-bg-section-adjacent);
}
.section-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: var(--bpw-space-40);
  align-items: start;
  padding: var(--bpw-space-80);
}
.section-layout + .section-layout { border-top: 1px solid var(--bpw-border); }
.section-layout h2 {
  font-size: var(--bpw-step-4);
  line-height: 1.15;
  letter-spacing: -.015em;
  text-wrap: balance;
}
.section-copy { max-inline-size: 65ch; }
.section-copy strong { color: var(--bpw-text-heading); font-weight: 600; }
.contact .section-copy a { display: inline-block; min-height: var(--bpw-target); padding-block: var(--bpw-space-8); }
.contact .section-copy p + p:last-child { margin-top: var(--bpw-space-8); }

.site-footer {
  padding-block: var(--bpw-space-24);
  color: var(--bpw-text-muted);
  font-size: .875rem;
}

@media (max-width: 1024px) {
  .hero, .section-layout { gap: var(--bpw-space-32); }
  .section-layout { padding-inline: var(--bpw-space-32); }
}
@media (max-width: 767px) {
  .masthead { flex-wrap: wrap; row-gap: var(--bpw-space-4); padding-block: var(--bpw-space-12) var(--bpw-space-4); }
  nav { column-gap: var(--bpw-space-16); }
  .crisis-layout, .hero, .section-layout { grid-template-columns: minmax(0, 1fr); }
  .crisis-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: var(--bpw-space-12);
    padding-block: var(--bpw-space-4) 0;
  }
  .hero { gap: var(--bpw-space-24); padding-block: var(--bpw-space-48); }
  .clinician { padding: var(--bpw-space-20); }
  .credentials { font-size: .8125rem; }
  .practice-details { width: 100%; border-inline: 0; border-radius: 0; }
  .section-layout { gap: var(--bpw-space-12); padding: var(--bpw-space-48) var(--gutter); }
  .site-footer { padding-block: var(--bpw-space-16); }
  .footer-layout { flex-wrap: wrap; gap: var(--bpw-space-4) var(--bpw-space-8); }
}
/* At 320 px, preserve the 24 px container gutter without splitting the long H1 word. */
@media (max-width: 359px) {
  h1 { font-size: min(var(--bpw-step-5), 11.7vw); }
}
@media (forced-colors: active) {
  :focus-visible { outline-color: Highlight; }
  .cta { border: 1px solid LinkText; }
}
