/* ==========================================================================
   Chiron Psychological — inner pages (v1, 10/22): the page hero, the
   services sidebar, the content column's blocks, Our Providers, the bios,
   About, the legal pages. Measured from the live pages at 1440px.
   ========================================================================== */

/* --- Page hero: the photo behind, the title low-left, breadcrumb under it ---- */
.page-inner .site-header { position: absolute; top: 0; left: 0; right: 0; background: transparent; }
.page-hero { position: relative; min-height: 700px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; color: var(--paper); background: var(--heading); }
.page-hero__bg { position: absolute; inset: 0; }
.page-hero__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.page-hero__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(32,25,5,.5) 0%, rgba(32,25,5,.3) 50%, rgba(32,25,5,.6) 100%); }
.page-hero__inner { position: relative; max-width: calc(var(--narrow) + 30px); padding-bottom: 133px; padding-top: 220px; }
.page-hero__title { font-size: 70px; line-height: 1.1; font-weight: 600; color: var(--paper); }
.page-hero__title--long { font-size: 60px; }
.crumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-top: 10px; font-size: 16px; line-height: 1.25; }
.crumbs a:hover { color: var(--gold-hover); }
.crumbs__sep { opacity: .7; }
/* Shorter heroes, as live: bios 412px, forms 500px; the legal pages and 404 like the forms page. */
.page-forms .page-hero, .page-legal .page-hero, .page-404 .page-hero { min-height: 500px; }
.page-forms .page-hero__inner, .page-legal .page-hero__inner, .page-404 .page-hero__inner { padding-top: 190px; padding-bottom: 100px; }
.page-bio .page-hero { min-height: 420px; }
.page-bio .page-hero__inner { padding-top: 170px; padding-bottom: 80px; }

/* --- Sidebar + content ------------------------------------------------------- */
.inner-grid { display: grid; grid-template-columns: 428px minmax(0, 1fr); gap: 50px; align-items: start; padding-top: 110px; padding-bottom: 110px; }
.sidebar { display: grid; gap: 50px; position: sticky; top: 30px; }
.side-card { padding: 30px; border-radius: var(--radius); background: rgba(238,236,230,.98); }
.side-card__title { font-size: 32px; line-height: 1; font-weight: 400; color: var(--heading); margin-bottom: 30px; }
.side-list { display: grid; gap: 20px; }
.side-list a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 20px; border-radius: 10px; background: var(--paper); font-size: 16px; line-height: 1.25; font-weight: 600; color: var(--ink); transition: background .25s var(--ease), color .25s var(--ease); }
.side-list a .icon { width: 18px; height: 18px; color: var(--gold); flex: none; transition: transform .25s var(--ease); }
.side-list a:hover { background: var(--gold); color: #fff; }
.side-list a:hover .icon { color: #fff; transform: translateX(3px); }
.side-list a[aria-current="page"] { background: var(--gold); color: #fff; }
.side-list a[aria-current="page"] .icon { color: #fff; }
.side-card--gold { background: var(--gold); color: var(--paper); }
.side-card__q { font-size: 22px; line-height: 1.1; font-weight: 400; color: var(--paper); }
.side-links { display: grid; gap: 20px; margin-top: 22px; }
.side-links a { display: flex; align-items: center; gap: 10px; font-size: 22px; line-height: 1.6; }
.side-links a .icon { width: 25px; height: 25px; flex: none; }
.side-links a:hover { color: var(--heading); }

.content { font-family: var(--serif); font-size: 16px; line-height: 1.6; color: var(--ink); }
.content > * + * { margin-top: 20px; }
.content > .figure:first-child { margin-bottom: 40px; }
.content p + p { margin-top: 25px; }
.content .c-h2 { margin-top: 40px; font-size: 32px; line-height: 1; font-weight: 500; color: var(--heading); }
.content .c-h2:first-child { margin-top: 0; }
.content .c-h2 + p, .content .c-h2 + .indent, .content .c-h2 + .checks { margin-top: 20px; }
.content .c-h3 { font-size: 23px; line-height: 1.1; font-weight: 600; color: var(--heading); }
.content a { color: var(--gold); font-weight: 600; }
.content a:hover { color: var(--heading); }
.content strong { font-weight: 700; }
.content ul:not(.checks), .content ol { padding-left: 24px; }
.content ul:not(.checks) { list-style: disc; }
.content ol { list-style: decimal; }
.content ul:not(.checks) li + li, .content ol li + li { margin-top: 8px; }
.indent { padding-left: 0; }  /* live: the quoted blocks sit flush with the headings */
.indent > * + * { margin-top: 25px; }
.figure { margin: 0; overflow: hidden; border-radius: var(--radius); }
.figure img { width: 100%; height: auto; }
.content > .figure:first-child img { aspect-ratio: 907 / 499; object-fit: cover; }
.row { display: grid; gap: 30px; align-items: start; margin-top: 40px; }
.row--2 { grid-template-columns: 1fr 1fr; }
.row--3 { grid-template-columns: 1fr 1fr 1fr; }
.row .col > * + * { margin-top: 20px; }
.row .col .c-h2 { margin-top: 0; }
.row .col > .figure { margin-top: 0; }
.row .col > .figure img { aspect-ratio: 439 / 373; object-fit: cover; }
.row .col > .figure:only-child { height: 100%; }
.row .col > .figure:only-child img { height: 100%; aspect-ratio: auto; min-height: 373px; }

.checks { display: grid; gap: 14px 24px; }
.checks--2 { grid-template-columns: 1fr 1fr; }
.checks li { display: flex; align-items: flex-start; gap: 10px; font-weight: 600; color: var(--heading); line-height: 1.6; }
.checks li .icon { width: 20px; height: 20px; margin-top: 3px; color: var(--gold); flex: none; }
.checks li a { color: inherit; font-weight: inherit; }
.checks li a:hover { color: var(--gold); }
.checks li strong { font-weight: 700; }

.panel { margin-top: 40px; padding: 60px; border-radius: var(--radius); background: rgba(238,236,230,.98); }
.panel > * + * { margin-top: 20px; }
.feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 0; }
.feature-grid > * + * { margin-top: 0; }
.feature-box { padding: 0 40px 0 0; }
.feature-grid .feature-box:nth-child(even) { padding: 0 0 0 40px; border-left: 1px solid var(--line); }
.feature-box__icon { display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 8px; background: var(--gold); color: #fff; }
.feature-box__icon .icon { width: 26px; height: 26px; }
.feature-box__title { margin-top: 30px; font-size: 23px; line-height: 1.1; font-weight: 600; color: var(--heading); }
.feature-box p { margin-top: 15px; }

.step-row { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 20px; align-items: start; margin-top: 30px; }
.step-row__num { display: inline-flex; align-items: center; justify-content: center; width: 80px; height: 80px; border-radius: 8px; background: var(--gold); font-family: var(--sans); font-size: 40px; line-height: 1.1; font-weight: 500; color: #fff; }
.step-row__title { font-size: 23px; line-height: 1.1; font-weight: 400; color: var(--heading); }
.step-row p { margin-top: 15px; font-family: var(--sans); }
.center { text-align: center; }
.content .btn { font-family: var(--serif); }
.content a.btn { color: #fff; }
.content a.btn:hover { color: #fff; }
.btn--ghost { background: transparent; color: var(--gold); box-shadow: inset 0 0 0 2px var(--gold); }
.content a.btn--ghost { color: var(--gold); }
.content a.btn--ghost:hover { background: var(--gold); color: #fff; }
.iop-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: 40px; }
.iop-address { padding: 14px 20px; border-left: 3px solid var(--gold); background: rgba(238,236,230,.98); }

/* --- Narrow pages (forms, contact, legal, 404) ---------------------------------- */
.narrow { max-width: calc(1140px + var(--pad) * 2); padding-top: 110px; padding-bottom: 110px; }
.content--card { padding: 80px; border-radius: var(--radius); background: rgba(238,236,230,.98); }
.content--card p, .content--card li { font-family: var(--sans); }
.content--card .c-h2 { font-size: 26px; }
.forms-btn { display: inline-block; margin: 20px 20px 0 0; }
.forms-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px 30px; margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--line); }
.content--card > .forms-actions { margin-top: 40px; }
.forms-actions .btn { font-family: var(--sans); font-size: 15px; padding: 14px 24px; }
.contact-card { padding: 40px; }
.contact-card .appt__form { min-height: 600px; }
.contact-card .appt__form iframe { height: 1400px; }
.legal__note { padding: 14px 20px; border-left: 3px solid var(--gold); background: var(--paper); font-size: 14px; color: var(--muted); }

/* --- Our Providers: the photo across the top of the card, as live; name and credentials under it ------ */
.team-wrap { padding-top: 110px; padding-bottom: 110px; }
.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; max-width: 1140px; margin: 0 auto; }
.team-card { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--radius); background: rgba(238,236,230,.98); transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.team-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px rgba(32,25,5,.1); }
.team-card__photo { margin: 0; aspect-ratio: 360 / 400; overflow: hidden; background: var(--line); }
.team-card__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; transition: transform .8s var(--ease); }
.team-card:hover .team-card__photo img { transform: scale(1.04); }
.team-card__blank { display: block; width: 100%; height: 100%; }
.team-card__body { padding: 24px 28px 28px; }
.team-card__name { font-size: 24px; line-height: 1.15; font-weight: 600; color: var(--heading); }
.team-card:hover .team-card__name { color: var(--gold); }
.team-card__cred { margin-top: 8px; font-family: var(--serif); font-size: 16px; line-height: 1.4; font-weight: 600; color: var(--ink); }

/* --- Bio ---------------------------------------------------------------------------- */
/* The whole photo (never cropped), the facts and the gold location bar in one card, as live. */
.bio { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 60px; align-items: start; max-width: calc(1140px + var(--pad) * 2); padding-top: 110px; padding-bottom: 110px; }
.bio__side { position: sticky; top: 30px; }
.bio__card { overflow: hidden; border-radius: var(--radius); background: rgba(238,236,230,.98); }
.bio__photo { margin: 0; background: var(--line); }
.bio__photo img { width: 100%; height: auto; }
.bio__facts { margin: 0; padding: 10px 26px 12px; }
.bio__facts > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; align-items: baseline; padding: 11px 0; }
.bio__facts > div + div { border-top: 1px solid var(--line); }
.bio__facts dt { margin: 0; font-family: var(--serif); font-size: 17px; color: var(--heading); }
.bio__facts dd { margin: 0; font-size: 16px; font-weight: 500; color: var(--ink); }
.bio__loc { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0; padding: 16px 26px; background: var(--gold); color: #fff; font-family: var(--serif); font-size: 24px; line-height: 1.2; }
.bio__loc span { font-weight: 500; }
.bio__body { font-size: 16px; }
.bio__body p { font-weight: 500; }
.bio__cta { margin-top: 40px; }

/* --- About ------------------------------------------------------------------------------ */
.about--page .about__grid { grid-template-columns: minmax(0, 620px) minmax(0, 695px); align-items: center; }
/* Taller collage on About (10/23, Brandon: balance the long story column, as live): the same notched layout stretched
   vertically; the card and photos are sized in % of the collage's height so they stay matched to the notch. */
.about--page .about__media { aspect-ratio: 620 / 840; }
.about--page .review-card { height: 28.5%; }
.eyebrow--gold { color: var(--gold); }
.about__story > * + * { margin-top: 25px; }
.about__story { margin-top: 30px; font-size: 16px; line-height: 1.6; font-weight: 500; color: var(--muted); }
.about__values { margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--line); }
.about__values .checklist { margin-top: 28px; }
.about--page .about__cols { border-bottom: 0; padding-bottom: 0; }
.approach__grid { display: grid; grid-template-columns: minmax(0, 665px) minmax(0, 595px); justify-content: space-between; gap: 60px; align-items: center; }
.approach .h-md { font-weight: 600; }
.approach__text { margin-top: 30px; font-family: var(--serif); font-size: 16px; line-height: 1.6; font-weight: 500; }
.approach__text > * + * { margin-top: 20px; }
.approach__items { margin-top: 40px; padding-top: 40px; border-top: 1px solid var(--line); display: grid; gap: 30px; }
.approach-item { display: flex; gap: 14px; align-items: flex-start; }
.approach-item > .icon { width: 24px; height: 24px; margin-top: 4px; color: var(--gold); flex: none; }
.approach-item__title { font-size: 28px; line-height: 1.1; font-weight: 400; color: var(--heading); }
.approach-item p { margin-top: 8px; font-family: var(--serif); font-size: 15px; line-height: 1.6; }
.approach__media { position: relative; }
.approach__media:has(.approach__img--2) { padding: 0 0 80px 80px; }
.approach__img { margin: 0; overflow: hidden; border-radius: var(--radius); }
.approach__img img { width: 100%; height: auto; aspect-ratio: 595 / 619; object-fit: cover; }
.approach__img--2 { position: absolute; left: 0; bottom: 0; width: 46%; border: 10px solid var(--tint); }
.leaders__grid { display: grid; grid-template-columns: minmax(0, 439px) minmax(0, 886px); justify-content: space-between; gap: 45px; align-items: start; }
.leaders__side { align-self: stretch; }  /* the column runs the full height of the list, so the heading can stick (10/23) */
.leaders__sticky { position: sticky; top: 30px; }
.leaders__side .h-lg { font-weight: 600; }
.stat-card { margin-top: 40px; padding: 30px; border-radius: var(--radius); background: rgba(238,236,230,.98); max-width: 335px; }
.stat-card__num { display: flex; align-items: center; gap: 16px; font-family: var(--serif); font-size: 44px; line-height: 1; color: var(--heading); }
.stat-card__num .icon { width: 40px; height: 40px; color: var(--gold); }
.stat-card__label { margin-top: 14px; font-family: var(--serif); font-size: 16px; line-height: 1.4; color: var(--ink); }
.leaders__list { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.team-card--lead .team-card__photo { aspect-ratio: 428 / 480; }
.team-card--lead .team-card__name { font-size: 26px; }

/* --- Breakpoints --------------------------------------------------------------------- */
@media (max-width: 1279px) {
  .inner-grid { grid-template-columns: 360px minmax(0, 1fr); gap: 40px; }
  .side-card { padding: 24px; }
  .side-card__title { font-size: 28px; }
  .side-links a { font-size: 19px; }
  .panel { padding: 40px; }
  .bio { grid-template-columns: 320px minmax(0, 1fr); gap: 40px; }
  .about--page .about__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
  .approach__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
  .leaders__grid { grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 40px; }
  .team-card__name { font-size: 22px; }
  .team-card--lead .team-card__name { font-size: 24px; }
}
@media (max-width: 1024px) {
  .page-hero { min-height: 560px; }
  .page-hero__inner { padding-top: 200px; padding-bottom: 90px; }
  .page-hero__title { font-size: 54px; }
  .page-hero__title--long { font-size: 46px; }
  .page-bio .page-hero { min-height: 400px; }
  .page-bio .page-hero__inner { padding-top: 180px; padding-bottom: 60px; }
  .page-forms .page-hero, .page-legal .page-hero, .page-404 .page-hero { min-height: 460px; }
  .inner-grid { grid-template-columns: 1fr; gap: 40px; padding-top: 80px; padding-bottom: 80px; }
  .sidebar { position: static; order: 2; grid-template-columns: 1fr 1fr; gap: 30px; align-items: start; }
  .narrow, .team-wrap, .bio { padding-top: 80px; padding-bottom: 80px; }
  .content--card { padding: 50px 40px; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .bio { grid-template-columns: 1fr; gap: 50px; }
  .bio__side { position: static; width: min(100%, 420px); margin: 0 auto; }
  .about--page .about__grid { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .approach__grid { grid-template-columns: 1fr; gap: 40px; }
  .approach__media { width: 100%; }
  .approach__img img { aspect-ratio: 16 / 11; }
  .approach-item__title { font-size: 26px; }
  .leaders__grid { grid-template-columns: 1fr; gap: 40px; }
  .leaders__sticky { position: static; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 40px; align-items: end; }
  .leaders__sticky .stat-card { margin-top: 0; grid-row: 1 / span 2; grid-column: 2; align-self: end; }
}
@media (max-width: 639px) {
  .page-hero { min-height: 420px; }
  .page-hero__inner { padding-top: 150px; padding-bottom: 56px; }
  .page-hero__title { font-size: 38px; }
  .page-hero__title--long { font-size: 32px; }
  .page-bio .page-hero, .page-forms .page-hero, .page-legal .page-hero, .page-404 .page-hero { min-height: 340px; }
  .page-bio .page-hero__inner, .page-forms .page-hero__inner, .page-legal .page-hero__inner, .page-404 .page-hero__inner { padding-top: 140px; padding-bottom: 48px; }
  .inner-grid, .narrow, .team-wrap, .bio { padding-top: 56px; padding-bottom: 56px; }
  .team-card__name, .team-card--lead .team-card__name { font-size: 22px; }
  .team-card__body { padding: 20px 22px 24px; }
  .bio__loc { font-size: 21px; padding: 14px 22px; }
  .bio__facts { padding: 8px 22px 10px; }
  .approach-item__title { font-size: 23px; }
  .leaders__sticky { display: block; }
  .leaders__sticky .stat-card { margin-top: 30px; }
  .sidebar { grid-template-columns: 1fr; }
  .content .c-h2 { font-size: 26px; }
  .row--2, .row--3, .checks--2, .feature-grid, .team-grid, .leaders__list { grid-template-columns: 1fr; }
  .feature-grid .feature-box, .feature-grid .feature-box:nth-child(even) { padding: 0; border: 0; }
  .feature-grid { gap: 30px; }
  .panel { padding: 28px 22px; }
  .content--card { padding: 32px 20px; }
  .contact-card { padding: 16px 10px; }
  .step-row { grid-template-columns: 60px minmax(0, 1fr); gap: 14px; }
  .step-row__num { width: 60px; height: 60px; font-size: 28px; }
  .indent { padding-left: 0; }
  .bio__facts > div { grid-template-columns: 100px minmax(0, 1fr); }
  .forms-actions { flex-direction: column; align-items: stretch; }
}
