/* /services/psychological-assessments (renamed Oct 5, 2026; see the page's header):
   what the shared components can't express.
   Loaded after service.css via Page `styles`. Each rule is recorded in the build
   record (scrollcraft/builds/services/pages/, under the page's old name, "Page CSS"). */

/* 1 · (Oct 1) The "To confirm" placeholder rules are gone with the placeholders: the page
   was cut to what BWell publishes, and nothing on it is marked open any more. */
/* Jane refresh: stated facts in the Glance. The value (a Jane session name or a short Jane
   sentence) keeps the display face; under it, in the text face, the Jane length as a small
   key and Jane's own sentence, so a 20-word sentence never runs five lines of display type. */
.facts dd .pc-v { display: block; }
.facts dd .pc-sub { display: block; margin-top: 0.55em; font-family: var(--sc-font-text); font-size: 0.68em; line-height: 1.6; color: var(--sc-ink-soft); }
.pc-len { display: block; margin: 0 0 0.3em; color: var(--sc-ink); font-size: max(0.72em, 11px); }
.pc-sub__x { display: block; }
/* Audit pass: the fact labels say which service they belong to ("Assessments:
   introductory call", "Assessment fees"; a fifth label came off on Oct 5, 2026). Their
   longest word (INTRODUCTORY, about 145px in the spaced label face) is
   wider than the shared label column's 7rem floor, so at 961-1100px and at 1920px they ran
   up to 16px into the value beside them (glance-dt.mjs). The floor rises to the longest
   word; every row keeps the same column, so the values still line up. Phones (<= 520px)
   keep the shared single column. */
@media (min-width: 521px) { #glance .facts > div { grid-template-columns: minmax(9.6rem, 0.36fr) minmax(0, 1fr); } }
/* the emergency note: small and soft (Glance and, round 6, the Close, where the Close
   body's own gap does the spacing) */
.pc-emergency { margin-top: var(--sc-4); color: var(--sc-ink-soft); }
.close__body > p.pc-emergency { margin-top: 0; }
/* The Glance has no foot line on this page (round 3 cut it), only the CTAs. Stacked on
   one column, the facts' closing rule and the foot's rule sat 65px apart with nothing
   between them; the CTAs follow the facts' rule directly instead. */
@media (max-width: 960px) { .svc-glance__foot { margin-top: var(--sc-6); padding-top: 0; border-top: 0; } }

/* 2 · Ch 2 "Psychological Assessments" (Oct 1; it was a two-column Compare with a box of
   open questions in column 1): BWell's Jane wording as keyed rows, key left and text
   right at >= 1101px, key over text below. Hairlines between rows, on a reading measure. */
.pc-assess { max-width: 46rem; margin-top: var(--sc-7); }
.pc-rows { display: grid; margin: 0; border-top: 1px solid var(--sc-hairline-strong); }
.pc-rows > div { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 0.2em 1.4em; align-items: baseline; padding: 0.9em 0; border-bottom: 1px solid var(--sc-hairline); }
.pc-rows dt { margin: 0; color: var(--sc-ink-soft); font-size: max(0.72em, 11px); }
.pc-rows dd { margin: 0; display: grid; gap: 0.45em; text-wrap: pretty; }
.pc-rows dd p { margin: 0; }
@media (max-width: 1100px) { .pc-rows > div { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 860px) { .pc-rows > div { padding: 0.65em 0; } }

/* 3 · Ch3 "Areas of Support" (Jane refresh): the sentence after the list, a step down. */
.pc-after-list { margin-top: var(--sc-6); max-width: 60ch; }
.pc-after-list p { margin: 0; }

/* 3b · "See also" in the last chapter (round 6: the Psychotherapy plate moved out of Ch3,
   where it sat right under "…and how" and read as the answer). The label takes the FAQ
   head's column and the plate the FAQ list's, so the row lines up with the question above
   it. The CrossSell is ONE plate (xsell--1), which the shared layer sets at full width, a
   second large photograph; here it is a ruled row, photo beside text, as the shared layer
   sets a plate on a phone. */
.pc-also { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: var(--sc-4) clamp(2rem, 6vw, 7rem); align-items: start; margin-top: var(--sc-7); }
.pc-also__h { margin: 0; padding-top: var(--sc-5); color: var(--sc-ink-soft); }
.pc-also .xsell--1 .xsell__item { padding-top: var(--sc-5); border-top: 1px solid var(--sc-hairline-strong); }
@media (min-width: 861px) {
  .pc-also .xsell--1 .xsell__item { grid-template-columns: minmax(0, 40%) minmax(0, 1fr); column-gap: var(--sc-5); align-items: start; }
  .pc-also .xsell--1 .xsell__img { grid-row: 1 / span 3; aspect-ratio: 4 / 3; margin-bottom: 0; }
  .pc-also .xsell--1 .xsell__item h3 { font-size: var(--sc-t-lg); }
}
@media (max-width: 860px) {
  .pc-also { grid-template-columns: minmax(0, 1fr); margin-top: var(--sc-7); }
  .pc-also__h { padding-top: 0; }
}
/* the next rule down is the Close's; keep the two rules apart. "one-on-one" never
   breaks at its hyphens (it did, "one-on- / one", in the narrow text column). */
.pc-nobr { white-space: nowrap; }
.pc-also + .close { margin-top: var(--sc-9); }

/* 4 · (Oct 1) The FAQ's "To confirm" flag on a question is gone with its placeholder. */

/* 5 · Hero. The title is long, so on desktop it sets one notch smaller and wider: two
   lines, as on the reference page, instead of four. Photo 40 (the consult office) is
   white wall and a white window blind behind the crumb and the headline, so the scrim
   is (a) an ellipse under the crumb and headline, anchored to the bottom edge the copy
   sits on, (b) a fade from the left under the type column, (c) a darkening anchored
   bottom-left under the intro and CTAs, and (d) the masthead band. It does not run full
   width from the bottom, so the desk, chair and floor on the right stay lit. */
@media (min-width: 861px) {
  .svc-hero__h1 { max-width: 21ch; font-size: clamp(2.6rem, 0.7rem + 3.7vw, 4.6rem); text-shadow: 0 2px 28px rgb(var(--dusk) / 0.5); }
  .svc-hero__scrim { background:
    radial-gradient(ellipse 52vw 230px at 34% calc(100% - 330px), rgb(var(--dusk) / 0.66) 0%, rgb(var(--dusk) / 0.58) 45%, rgb(var(--dusk) / 0.26) 78%, rgb(var(--dusk) / 0) 100%),
    linear-gradient(to right, rgb(var(--dusk) / 0.7) 0%, rgb(var(--dusk) / 0.56) 30%, rgb(var(--dusk) / 0.24) 52%, rgb(var(--dusk) / 0) 70%),
    radial-gradient(110% 60% at 0% 100%, rgb(var(--dusk) / 0.78) 0%, rgb(var(--dusk) / 0.5) 48%, rgb(var(--dusk) / 0) 100%),
    linear-gradient(to bottom, rgb(var(--dusk) / 0.5) 0%, rgb(var(--dusk) / 0) 22%); }
}
/* Phone: the photo fills the screen's height, so its top fifth is ceiling and a light
   fixture. The image is set a little taller and lifted, so the window and desk rise
   into the frame; the scrim stays under the type. The crumb drops its last item (it
   repeats the H1 directly below) so it stays on one line. */
@media (max-width: 860px) {
  .svc-hero__photo img { height: 118%; position: relative; top: -18%; }
  .svc-hero__scrim { background:
    linear-gradient(to bottom, rgb(var(--dusk) / 0.08) 10%, rgb(var(--dusk) / 0.56) 29%, rgb(var(--dusk) / 0.5) 42%, rgb(var(--dusk) / 0) 64%),
    linear-gradient(to top, rgb(var(--dusk) / 0.95) 0%, rgb(var(--dusk) / 0.9) 30%, rgb(var(--dusk) / 0.7) 52%, rgb(var(--dusk) / 0.2) 72%, rgb(var(--dusk) / 0) 86%),
    linear-gradient(to bottom, rgb(var(--dusk) / 0.55) 0%, rgb(var(--dusk) / 0) 24%); }
  .svc-hero__crumb [aria-current], .svc-hero__crumb > span[aria-hidden]:has(+ [aria-current]) { display: none; }
}

/* 6 · (removed, Jane refresh; still not needed after the audit pass) The bar is the phone
   again (interim, TBC #22), and the shared ChapterBar / Masthead now draw "Call" for a
   `tel:` link on their own and name the bar link with its full label, so no page rule. */

/* 7 · (moved to service.css, Sept 23 shared follow-ups) The Close's 0.8fr / 1.2fr
   columns and the balanced FAQ questions are the shared rule now. */