/* ==========================================================================
   CaseLoad Select, Version 10 journey components.

   Every selector in this file is scoped under a .v10- class. Nothing here may
   target .screen, .brief, #screen, #brief, .report-*, .anatomy-* or .xr-*, and
   nothing here may use a bare element, .section, .shell or .eyebrow selector,
   because the protected Screen components inherit from base.css and must not
   be reachable through the cascade. Handoff section 17, file strategy.

   base.css, tokens.css and tools.css are immutable for this build. Additions
   live here.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shared primitives
   -------------------------------------------------------------------------- */

/* Headings.
   Orphan control on a heading cannot be done with a non-breaking space: binding
   the last two words creates one unbreakable run, and at 320 CSS pixels a large
   heading run overflows the line box, which handoff section 19 treats as a hard
   failure. text-wrap: pretty asks the browser to avoid a last-line orphan while
   still choosing legal break points, and overflow-wrap guarantees that a long
   single word can never push the page wider than the viewport. */
.v10-h {
  text-wrap: pretty;
  overflow-wrap: break-word;
}

/* base.css gives .terminal-lock white-space: nowrap so the square stays welded
   to the final word. In a marketing hero the h1 has a 3.875rem floor, so a long
   final word cannot fit a narrow viewport and pushes the page wider. Allowing
   the word itself to break removes the overflow without detaching the square:
   there is no whitespace between the word and the square, so no break
   opportunity exists between them. Scoped to .v10-h, which is never present
   inside a protected fragment. */
.v10-h .terminal-lock {
  white-space: normal;
  overflow-wrap: break-word;
  hyphens: auto;
}

/* Every primary marketing hero uses one complete sentence composed over
   exactly three authored lines. There is one source sentence only: never a
   second compact or breakpoint-specific copy variant. */
.v10-hero-statement {
  width: 100%;
  max-width: none;
}

.v10-hero-statement > span {
  display: block;
  width: max-content;
  max-width: 100%;
  white-space: nowrap;
}

/* The consolidated page has one unusually long terminal word. Give the title
   enough measure for that word to remain intact, while retaining the large,
   deliberate marketing-hero rhythm. */
.page-hero--marketing > .shell > .v10-select-hero-title {
  font-size: clamp(3rem, 5.4vw, 5.2rem);
}

.v10-select-hero-lines > span,
.v10-select-hero-lead > span {
  display: block;
}

.page-hero--marketing > .shell > .v10-select-hero-lead {
  letter-spacing: -.01em;
}

.v10-select-hero-title .terminal-lock {
  white-space: nowrap;
  overflow-wrap: normal;
  hyphens: none;
}

@media (max-width: 47.99rem) {
  .page-hero--marketing > .shell > .v10-select-hero-title {
    max-width: none;
    font-size: clamp(2.4rem, 12.5vw, 3.1rem);
  }

  .page-hero--marketing > .shell > .v10-select-hero-lead {
    font-size: clamp(.84rem, 4.2vw, 1.05rem);
    letter-spacing: -.025em;
  }

  .v10-select-hero-title .terminal-lock {
    display: block;
    width: max-content;
    max-width: 100%;
    font-size: 0.92em;
  }
}

/* --------------------------------------------------------------------------
   Hero image system

   Every primary marketing page uses a page-specific SELECT metaphor: many
   similar dark situations and one gold situation brought forward. The media
   follows the headline in source order while the shared metaphor treatment
   places it behind the complete hero at every viewport.
   -------------------------------------------------------------------------- */

.v10-image-hero .v10-image-hero-grid {
  position: relative;
  width: 100%;
  min-height: 47.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 0;
  padding: 6rem calc(42% + clamp(2.5rem, 5vw, 5rem)) 6rem 0;
}

.page-hero--marketing.v10-image-hero > .shell {
  padding-block: 0;
}

.page-hero--marketing.v10-image-hero > .shell > .v10-image-hero-grid {
  margin-left: 0;
}

.v10-image-hero .v10-image-hero-grid > .eyebrow {
  width: 100%;
  margin: 0 0 1rem;
}

.v10-image-hero .v10-image-hero-grid > h1 {
  width: 100%;
  max-width: none;
  margin: 0 0 2.25rem;
  font-size: clamp(3.875rem, 8.5vw, 6.75rem);
  line-height: 0.9;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}

.v10-image-hero .v10-image-hero-grid > .v10-select-hero-title {
  font-size: clamp(3rem, 5.4vw, 5.2rem);
}

.v10-image-hero .v10-image-hero-grid > p {
  width: 100%;
  max-width: none;
  margin: 0 0 2.25rem;
  color: var(--text-on-dark);
  font-size: 1.075rem;
  line-height: 1.6;
}

.v10-image-hero .v10-image-hero-grid > .v10-select-hero-lead {
  letter-spacing: -0.01em;
}

.v10-image-hero .v10-image-hero-grid > .lawyer-boundary {
  margin-top: -0.5rem;
  margin-bottom: 2rem;
  padding-top: 1.25rem;
}

.v10-image-hero .v10-image-hero-grid > .action-row {
  width: 100%;
  margin: 0;
}

.v10-image-hero-lead > span,
.v10-screen-hero-title > span,
.v10-work-hero-title > span,
.v10-about-hero-title > span {
  display: block;
}

.v10-image-hero-media {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 42%;
  margin: 0;
  overflow: hidden;
  background: var(--navy-deep);
}

.v10-image-hero-media::after {
  position: absolute;
  inset: 0;
  content: "";
  box-shadow: inset 1.5rem 0 2.5rem rgba(13, 21, 32, 0.24);
  pointer-events: none;
}

.v10-image-hero-media picture,
.v10-image-hero-media img {
  width: 100%;
  height: 100%;
  display: block;
}

.v10-image-hero-media img {
  object-fit: cover;
}

.v10-image-hero-media figcaption {
  position: absolute;
  z-index: 1;
  right: 1rem;
  bottom: 1rem;
  max-width: calc(100% - 2rem);
  margin: 0;
  padding: 0.4rem 0.55rem;
  background: rgba(13, 21, 32, 0.78);
  color: var(--gold-light);
  font: 700 0.64rem/1.25 var(--font-display);
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.v10-image-hero--concept .v10-image-hero-media img {
  object-position: 62% center;
}

.v10-image-hero--method .v10-image-hero-media img {
  object-position: 69% center;
  transform: scale(1.08);
}

.v10-image-hero--portrait-left .v10-image-hero-grid {
  padding-right: 0;
  padding-left: calc(42% + clamp(2.5rem, 5vw, 5rem));
}

.v10-image-hero--portrait-left .v10-image-hero-media {
  right: auto;
  left: 0;
}

.v10-image-hero--portrait .v10-image-hero-media::after {
  box-shadow: inset -1.5rem 0 2.5rem rgba(13, 21, 32, 0.24);
}

.v10-image-hero--portrait .v10-image-hero-media img {
  object-position: center 42%;
  filter: saturate(0.78) contrast(1.04);
}

.v10-image-hero--screen .v10-image-hero-media {
  padding: clamp(1.5rem, 3vw, 2.75rem);
  background: var(--navy-deep);
}

.v10-image-hero--screen .v10-image-hero-media picture {
  height: calc(100% - 2.5rem);
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.3);
}

.v10-image-hero--screen .v10-image-hero-media img {
  object-position: center top;
}

.v10-image-hero--screen .v10-image-hero-media::after {
  box-shadow: inset 1.5rem 0 2.5rem rgba(13, 21, 32, 0.16);
}

.v10-image-hero--screen .v10-image-hero-media figcaption {
  right: clamp(1.5rem, 3vw, 2.75rem);
  bottom: 1rem;
}

.v10-screen-hero-title,
.v10-work-hero-title,
.v10-about-hero-title {
  font-size: clamp(3rem, 5.1vw, 5.15rem) !important;
}

.v10-about-founder-grid--text {
  grid-template-columns: 1fr;
}

@media (max-width: 70rem) {
  .v10-image-hero .v10-image-hero-grid {
    padding-right: calc(44% + 2.5rem);
  }

  .v10-image-hero--portrait-left .v10-image-hero-grid {
    padding-right: 0;
    padding-left: calc(44% + 2.5rem);
  }

  .v10-image-hero-media {
    width: 44%;
  }
}

@media (max-width: 52rem) {
  .hero.v10-image-hero,
  .page-hero--marketing.v10-image-hero {
    min-height: 0;
  }

  .v10-image-hero .v10-image-hero-grid,
  .v10-image-hero--portrait-left .v10-image-hero-grid {
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding: 4.25rem 0 4.75rem;
  }

  .v10-image-hero .v10-image-hero-grid > .eyebrow {
    order: 1;
  }

  .v10-image-hero .v10-image-hero-grid > h1 {
    order: 2;
    margin-bottom: 2rem;
    font-size: clamp(3.25rem, 15.5vw, 4.5rem);
  }

  .v10-image-hero .v10-image-hero-grid > .v10-select-hero-title {
    font-size: clamp(2.4rem, 12.5vw, 3.1rem);
  }

  .v10-image-hero .v10-image-hero-media {
    position: relative;
    inset: auto;
    order: 3;
    width: 100%;
    aspect-ratio: 4 / 3;
    margin-bottom: 2rem;
  }

  .v10-image-hero .v10-image-hero-grid > p {
    order: 4;
  }

  .v10-image-hero .v10-image-hero-grid > .lawyer-boundary {
    order: 5;
  }

  .v10-image-hero .v10-image-hero-grid > .action-row {
    order: 6;
  }

  .v10-image-hero--screen .v10-image-hero-media {
    aspect-ratio: 1 / 1.08;
    padding: 1.25rem;
  }

  .v10-image-hero--screen .v10-image-hero-media picture {
    height: calc(100% - 2.2rem);
  }

  .v10-image-hero--screen .v10-image-hero-media figcaption {
    right: 1.25rem;
    bottom: 0.8rem;
  }

  .v10-screen-hero-title {
    font-size: clamp(2.1rem, 10vw, 3.1rem) !important;
  }

  .v10-work-hero-title {
    font-size: clamp(1.95rem, 9vw, 3rem) !important;
  }

  .v10-about-hero-title {
    font-size: clamp(2.3rem, 10vw, 3rem) !important;
  }

  .v10-image-hero .v10-image-hero-grid > p {
    font-size: 1rem;
    line-height: 1.55;
  }
}

@media (max-width: 36rem) {
  .v10-image-hero .v10-image-hero-media {
    width: calc(100% + 2rem);
    margin-left: -1rem;
    margin-right: -1rem;
  }

  .v10-image-hero-media figcaption {
    right: 1rem;
  }
}

/* Internal metaphor heroes

   The image is a full hero surface, never a side panel and never a separate
   mobile block. Each page changes the metaphorical action while preserving one
   composition, one three-line headline rule and one three-line subhead rule. */
.page-hero--marketing.v10-image-hero--metaphor {
  position: relative;
  isolation: isolate;
  min-height: max(47.5rem, calc(100svh - 5.35rem));
  overflow: hidden;
  background: var(--navy-deep);
}

.page-hero--marketing.v10-image-hero--metaphor > .shell {
  /* Keep the copy on the shell while allowing the absolute media to anchor
     to the full hero section instead of inheriting the shell gutters. */
  position: static;
  padding-block: 0;
}

.v10-image-hero--metaphor .v10-image-hero-grid {
  position: static;
  min-height: max(47.5rem, calc(100svh - 5.35rem));
  justify-content: center;
  padding: clamp(4.75rem, 8vw, 7rem) 0;
}

.v10-image-hero--metaphor .v10-image-hero-grid > :not(.v10-image-hero-media) {
  position: relative;
  z-index: 2;
  width: min(100%, 45rem);
  margin-left: clamp(0rem, 4vw, 4rem);
}

.v10-image-hero--metaphor .v10-image-hero-grid > h1 {
  font-size: clamp(3.35rem, 5.5vw, 5.25rem) !important;
}

.v10-image-hero--metaphor .v10-image-hero-grid > .v10-pricing-hero-title,
.v10-image-hero--metaphor .v10-image-hero-grid > .v10-conversation-hero-title {
  font-size: clamp(3.2rem, 5vw, 4.75rem) !important;
}

.v10-image-hero--metaphor .v10-image-hero-grid > .v10-work-hero-title {
  font-size: clamp(3.1rem, 4.8vw, 4.6rem) !important;
}

.v10-metaphor-hero-title > span,
.v10-image-hero--metaphor .v10-image-hero-lead > span,
.v10-image-hero--metaphor .v10-select-hero-lead > span {
  display: block;
}

.v10-image-hero--metaphor .v10-image-hero-media {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  aspect-ratio: auto;
}

.v10-image-hero--metaphor .v10-image-hero-media::after {
  background:
    linear-gradient(180deg, rgba(13, 21, 32, 0.26) 0%, rgba(13, 21, 32, 0.12) 55%, rgba(13, 21, 32, 0.66) 100%),
    linear-gradient(90deg, rgba(13, 21, 32, 0.9) 0%, rgba(13, 21, 32, 0.7) 38%, rgba(13, 21, 32, 0.22) 66%, rgba(13, 21, 32, 0.08) 100%);
  box-shadow: none;
}

/* SELECT method-family heroes use the brighter method navy established for
   the four capabilities while preserving the universal full-bleed hero. */
.page-hero--marketing.v10-image-hero--select-family {
  background: var(--navy);
}

.v10-image-hero--select-family .v10-image-hero-media::after {
  background:
    linear-gradient(180deg, rgba(30, 47, 88, 0.18) 0%, rgba(30, 47, 88, 0.08) 55%, rgba(30, 47, 88, 0.52) 100%),
    linear-gradient(90deg, rgba(30, 47, 88, 0.96) 0%, rgba(30, 47, 88, 0.72) 38%, rgba(30, 47, 88, 0.18) 66%, rgba(30, 47, 88, 0.04) 100%);
}

.v10-image-hero--metaphor .v10-image-hero-media picture {
  height: 100%;
  box-shadow: none;
}

.v10-image-hero--metaphor .v10-image-hero-media img {
  object-position: 50% center;
  transform: none;
  filter: brightness(1.18) contrast(1.04);
}

.v10-image-hero--metaphor .v10-image-hero-media figcaption {
  display: none;
}

@media (max-width: 70rem) {
  .v10-image-hero--metaphor .v10-image-hero-grid > :not(.v10-image-hero-media) {
    margin-left: 0;
  }
}

@media (max-width: 52rem) {
  .page-hero--marketing.v10-image-hero--metaphor,
  .v10-image-hero--metaphor .v10-image-hero-grid {
    min-height: max(47rem, calc(100svh - 4.75rem));
  }

  /* The Method hero has two compact actions and a focal square composed near
     them. Let its content set the mobile height instead of forcing a second
     half-screen of empty artwork below the actions. */
  .page-hero--marketing.v10-image-hero--method,
  .v10-image-hero--method .v10-image-hero-grid {
    min-height: 0;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid {
    display: flex;
    justify-content: flex-start;
    padding: clamp(4.25rem, 13vw, 5.5rem) 0 3.75rem;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid > h1,
  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-pricing-hero-title,
  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-conversation-hero-title {
    margin-bottom: 2.25rem;
    font-size: clamp(2.45rem, 11.5vw, 3.35rem) !important;
  }

  .v10-image-hero--relationship .v10-image-hero-grid > h1 {
    font-size: clamp(2.3rem, 10.8vw, 3.35rem) !important;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-screen-hero-title,
  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-about-hero-title {
    font-size: clamp(2.05rem, 10vw, 3rem) !important;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-work-hero-title,
  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-pricing-hero-title,
  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-conversation-hero-title {
    font-size: clamp(2.1rem, 10vw, 3.1rem) !important;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-work-hero-title {
    font-size: clamp(1.9rem, 8.6vw, 2.75rem) !important;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid > p {
    font-size: clamp(0.96rem, 4.05vw, 1.05rem);
    line-height: 1.62;
  }

  .v10-image-hero--metaphor .v10-image-hero-media {
    position: absolute;
    inset: 0;
    order: initial;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    aspect-ratio: auto;
  }

  .v10-image-hero--metaphor .v10-image-hero-media::after {
    background:
      linear-gradient(180deg, rgba(13, 21, 32, 0.5) 0%, rgba(13, 21, 32, 0.34) 54%, rgba(13, 21, 32, 0.8) 100%),
      linear-gradient(90deg, rgba(13, 21, 32, 0.76) 0%, rgba(13, 21, 32, 0.3) 100%);
  }

  .v10-image-hero--select-family .v10-image-hero-media::after {
    background:
      linear-gradient(180deg, rgba(30, 47, 88, 0.42) 0%, rgba(30, 47, 88, 0.26) 54%, rgba(30, 47, 88, 0.7) 100%),
      linear-gradient(90deg, rgba(30, 47, 88, 0.82) 0%, rgba(30, 47, 88, 0.24) 100%);
  }

  .v10-image-hero--metaphor .v10-image-hero-media img {
    object-position: 50% center;
    filter: brightness(1.08) contrast(1.04);
  }

  /* Each portrait crop keeps the selected gold case inside the composition.
     The source concepts place that case at different horizontal positions. */
  .v10-image-hero--method .v10-image-hero-media img {
    object-position: 78% center;
  }

  .v10-image-hero--screen .v10-image-hero-media img {
    object-position: 80% center;
  }

  .v10-image-hero--drive .v10-image-hero-media img,
  .v10-image-hero--relationship .v10-image-hero-media img,
  .v10-image-hero--about .v10-image-hero-media img,
  .v10-image-hero--insights .v10-image-hero-media img {
    object-position: 74% center;
  }

  .v10-image-hero--work .v10-image-hero-media img {
    object-position: 78% center;
  }

  .v10-image-hero--pricing .v10-image-hero-media img {
    object-position: 100% center;
  }

  .v10-image-hero--conversation .v10-image-hero-media img {
    object-position: 78% center;
  }

  .v10-image-hero--conversation .v10-image-hero-grid > .lawyer-boundary {
    order: 4;
  }

  .v10-image-hero--conversation .v10-image-hero-grid > .v10-next {
    order: 5;
  }

  .v10-image-hero--metaphor .action-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 1rem;
  }

  .v10-image-hero--metaphor .action-row .button {
    width: 100%;
  }
}

/* Homepage cinematic hero

   The selected-opportunity image is the hero surface at every viewport. The
   navy falloff keeps the promise primary while allowing the gold tile to
   remain visible as the visual proof of selection. */
.hero.v10-image-hero--cinematic {
  position: relative;
  isolation: isolate;
  min-height: max(47.5rem, calc(100svh - 5.35rem));
  overflow: hidden;
}

.hero.v10-image-hero--cinematic > .hero-inner {
  padding-block: 0;
}

.v10-image-hero--cinematic .v10-image-hero-grid {
  position: static;
  min-height: max(47.5rem, calc(100svh - 5.35rem));
  padding: clamp(4.75rem, 8vw, 7rem) 0;
}

.v10-image-hero--cinematic .v10-image-hero-grid > :not(.v10-image-hero-media) {
  position: relative;
  z-index: 2;
  width: min(100%, 44rem);
  margin-left: clamp(0rem, 8vw, 7rem);
}

.v10-image-hero--cinematic .v10-image-hero-grid > h1 {
  font-size: clamp(4rem, 8vw, 6rem);
  letter-spacing: -0.04em;
}

.v10-image-hero--cinematic .v10-image-hero-media {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  aspect-ratio: auto;
}

.v10-image-hero--cinematic .v10-image-hero-media::after {
  background:
    linear-gradient(180deg, rgba(13, 21, 32, 0.22) 0%, rgba(13, 21, 32, 0.12) 55%, rgba(13, 21, 32, 0.58) 100%),
    linear-gradient(90deg, rgba(13, 21, 32, 0.84) 0%, rgba(13, 21, 32, 0.64) 35%, rgba(13, 21, 32, 0.18) 58%, rgba(13, 21, 32, 0.06) 100%);
  box-shadow: none;
}

.v10-image-hero--cinematic .v10-image-hero-media img {
  object-position: 50% center;
  filter: brightness(1.32) contrast(1.03);
}

@media (max-width: 70rem) {
  .v10-image-hero--cinematic .v10-image-hero-grid > :not(.v10-image-hero-media) {
    margin-left: 0;
  }
}

@media (max-width: 52rem) {
  /* Mobile: hug the content instead of stretching to the viewport; the
     full-height floor left a large empty band under the action row. */
  .hero.v10-image-hero--cinematic,
  .v10-image-hero--cinematic .v10-image-hero-grid {
    min-height: 0;
  }

  .v10-image-hero--cinematic .v10-image-hero-grid {
    display: flex;
    justify-content: flex-start;
    padding: clamp(4.25rem, 13vw, 5.5rem) 0 3rem;
  }

  .v10-image-hero--cinematic .v10-image-hero-grid > h1 {
    margin-bottom: 2.25rem;
    font-size: clamp(3.25rem, 15.4vw, 4.5rem);
  }

  .v10-image-hero--cinematic .v10-image-hero-grid > .v10-hero-lead {
    margin-bottom: 2.25rem;
    font-size: clamp(0.96rem, 4.05vw, 1.05rem);
    line-height: 1.62;
  }

  .v10-image-hero--cinematic .v10-image-hero-media {
    position: absolute;
    inset: 0;
    order: initial;
    width: 100%;
    height: 100%;
    margin: 0;
    aspect-ratio: auto;
  }

  .v10-image-hero--cinematic .v10-image-hero-media::after {
    background:
      linear-gradient(180deg, rgba(13, 21, 32, 0.34) 0%, rgba(13, 21, 32, 0.24) 58%, rgba(13, 21, 32, 0.76) 100%),
      linear-gradient(90deg, rgba(13, 21, 32, 0.70) 0%, rgba(13, 21, 32, 0.28) 100%);
  }

  .v10-image-hero--cinematic .v10-image-hero-media img {
    object-position: 68% center;
    filter: brightness(1.12) contrast(1.03);
  }

  .v10-image-hero--cinematic .action-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 1rem;
  }

  .v10-image-hero--cinematic .action-row .button {
    width: 100%;
  }
}

@media (max-width: 23rem) {
  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-hero-statement,
  .v10-image-hero--cinematic .v10-image-hero-grid > .v10-hero-statement {
    font-size: 0.82rem !important;
    letter-spacing: -0.02em;
  }

  .v10-image-hero--metaphor .v10-image-hero-grid > .v10-pricing-hero-title {
    font-size: 1.95rem !important;
  }

  .v10-image-hero--cinematic .v10-image-hero-grid > h1 {
    font-size: clamp(3.125rem, 15.5vw, 3.4rem);
  }

  .v10-image-hero--cinematic .v10-image-hero-grid > .v10-hero-lead {
    font-size: 0.9rem;
  }
}

.v10-lede {
  font-size: var(--text-lead);
  line-height: 1.5;
  max-width: none;
  color: inherit;
}

.v10-prose {
  max-width: none;
}

.v10-prose > * + * {
  margin-top: var(--space-4);
}

.v10-note {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--blue-text);
  max-width: none;
}

.v10-section-intro {
  max-width: none;
  margin-bottom: var(--space-6);
}

/* The boundary sentence. Stated plainly, never decorated with an edge rule. */
.v10-boundary {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: var(--text-h3);
  line-height: 1.3;
  max-width: none;
  margin-block: var(--space-6);
  color: inherit;
}

/* Relationship continuity. One connected path carries the relationship record
   through changing stages without presenting them as separate products. */
.v10-connected-copy {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(20rem, .72fr);
  gap: 0 clamp(3rem, 7vw, 7rem);
  align-items: end;
}

.v10-connected-copy .eyebrow {
  grid-column: 1 / -1;
}

.v10-connected-copy h2 {
  grid-row: 2 / 4;
  width: 100%;
  max-width: none;
}

.v10-connected-copy > p:last-child {
  width: 100%;
  max-width: none;
  margin: var(--space-5) 0 .4rem;
  font-size: var(--text-lead);
  line-height: 1.55;
}

.v10-connected-path {
  margin-top: clamp(4rem, 8vw, 7rem);
}

.v10-connected-stages {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.v10-connected-stages::before {
  content: "";
  position: absolute;
  top: .65rem;
  right: 0;
  left: 0;
  height: 1px;
  background: var(--gold-deep);
}

.v10-connected-stages li {
  position: relative;
  min-width: 0;
  padding: 2.25rem clamp(1rem, 2.5vw, 2.5rem) 2.5rem 0;
}

.v10-connected-stages li + li {
  padding-left: clamp(1rem, 2.5vw, 2.5rem);
  border-left: 1px solid var(--line);
}

.v10-connected-node {
  position: absolute;
  top: 0;
  left: 0;
  width: 1.35rem;
  height: 1.35rem;
  border: .25rem solid var(--white);
  background: var(--navy);
  box-shadow: 0 0 0 1px var(--navy);
}

.v10-connected-stages li + li .v10-connected-node {
  left: clamp(1rem, 2.5vw, 2.5rem);
}

.v10-connected-node--gold {
  background: var(--gold-deep);
  box-shadow: 0 0 0 1px var(--gold-deep);
}

.v10-connected-stages small {
  display: block;
  color: var(--gold-deep);
  font: 700 var(--text-xs)/1.25 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.v10-connected-stages strong {
  display: block;
  margin-top: .65rem;
  color: var(--navy);
  font: 800 clamp(1.25rem, 2vw, 1.7rem)/1.15 var(--font-heading);
}

.v10-connected-stages p {
  width: 100%;
  max-width: none;
  margin: .85rem 0 0;
  color: var(--blue-text);
  line-height: 1.5;
}

.v10-connected-return {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-6);
  align-items: center;
  padding: 1.1rem 1.35rem;
  background: var(--paper);
  border-block: 1px solid var(--line);
}

.v10-connected-return span {
  color: var(--blue-text);
}

.v10-connected-return strong {
  color: var(--navy);
  font: 700 var(--text-base)/1.25 var(--font-heading);
}

.v10-connected-close {
  width: 100%;
  max-width: none;
  margin: clamp(3rem, 6vw, 5rem) 0 0;
  padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1.5rem, 5vw, 4.5rem);
  background: var(--navy);
  color: var(--white);
  font: 700 clamp(1.25rem, 2vw, 1.8rem)/1.3 var(--font-heading);
}

@media (max-width: 70rem) {
  .v10-connected-copy {
    grid-template-columns: 1fr;
  }

  .v10-connected-copy h2 {
    grid-row: auto;
  }

  .v10-connected-copy > p:last-child {
    margin-bottom: 0;
  }
}

@media (max-width: 48rem) {
  .v10-connected-copy h2 {
    font-size: clamp(2.15rem, 9.5vw, 3rem);
  }

  .v10-connected-path {
    margin-top: var(--space-7);
  }

  .v10-connected-stages {
    grid-template-columns: 1fr;
    padding-left: var(--space-4);
  }

  .v10-connected-stages::before {
    top: 0;
    bottom: 0;
    left: 1.65rem;
    width: 1px;
    height: auto;
  }

  .v10-connected-stages li,
  .v10-connected-stages li + li {
    padding: 0 0 2.25rem 3.4rem;
    border-left: 0;
  }

  .v10-connected-node,
  .v10-connected-stages li + li .v10-connected-node {
    top: .1rem;
    left: 0;
  }

  .v10-connected-return {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }

  .v10-connected-close {
    padding-inline: var(--space-5);
  }
}

.v10-caption {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--blue-text);
  margin-top: var(--space-4);
}

.on-dark .v10-caption,
.v10-on-dark .v10-caption,
.v10-on-dark .v10-note {
  color: var(--text-on-dark);
}

/* --------------------------------------------------------------------------
   Card grid, used for benefits, produced items and short example sets
   -------------------------------------------------------------------------- */

/* min() on the track floor lets a column shrink below its ideal width rather
   than forcing the grid wider than the viewport. Without it a 17rem floor plus
   card and shell padding overflows at 320 CSS pixels. */
.v10-grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr));
  margin-top: var(--space-6);
}

/* Two means two. auto-fit with a 22rem floor fits three tracks in a 1312px
   shell, so a four-card set rendered three across with one orphan beside an
   empty cell. */
.v10-grid--two {
  grid-template-columns: 1fr;
}

@media (min-width: 48rem) {
  .v10-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.v10-grid--four {
  grid-template-columns: repeat(auto-fit, minmax(min(14rem, 100%), 1fr));
}

/* Homepage outcomes. This ruled field gives each buyer outcome one short,
   distinct job before the SELECT Method is introduced. */
.v10-home-outcomes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: var(--space-6);
  border-block: 1px solid var(--line);
}

.v10-home-outcomes > article {
  min-width: 0;
  min-height: 12rem;
  display: flex;
  flex-direction: column;
  padding: var(--space-5);
}

.v10-home-outcomes > article + article {
  border-left: 1px solid var(--line);
}

.v10-home-outcomes h3 {
  width: 100%;
  max-width: none;
  margin: var(--space-5) 0 var(--space-3);
  font-size: clamp(1.6rem, 2.4vw, 2.35rem);
  line-height: 1.08;
}

.v10-home-outcomes h3 a {
  color: inherit;
  text-decoration-thickness: 1px;
  text-decoration-color: transparent;
  text-underline-offset: .22em;
}

.v10-home-outcomes h3 a:hover,
.v10-home-outcomes h3 a:focus-visible {
  color: var(--navy);
  text-decoration-color: currentColor;
}

.v10-home-outcomes article > p:last-child {
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--blue-text);
  line-height: 1.55;
}

.v10-outcomes-action {
  width: 100%;
  max-width: none;
  margin: var(--space-5) 0 0;
}

.v10-select-capability-map .v10-capability-outcome {
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--navy);
  font: 700 var(--text-xs)/1.3 var(--font-display);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.v10-select-capability-map h3 {
  margin-top: var(--space-6);
}

.v10-select-authority {
  width: 100%;
  max-width: none;
  margin: var(--space-6) 0 0;
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: var(--text-lead);
  font-weight: 700;
  line-height: 1.5;
}

.v10-select-system {
  display: grid;
  grid-template-columns: minmax(24rem, .72fr) minmax(0, 1.28fr);
  width: min(calc(100% - 3rem), var(--shell));
  margin: clamp(4rem, 8vw, 7rem) auto;
  background: var(--white);
}

.v10-select-system > .section {
  min-width: 0;
  padding-block: 0;
}

.v10-select-system-copy,
.v10-select-work-inner {
  padding: clamp(3rem, 5vw, 5rem);
}

.v10-select-system-intro h2 {
  width: 100%;
  max-width: none;
  margin-top: var(--space-5);
  color: var(--white);
  font-size: clamp(2.25rem, 4vw, 4.5rem);
  line-height: 1;
  letter-spacing: -.045em;
}

.v10-select-system-intro .v10-lede {
  width: 100%;
  max-width: none;
  margin-top: var(--space-6);
  color: var(--text-on-dark);
}

.v10-select-boundary {
  width: 100%;
  max-width: none;
  margin: var(--space-5) 0 0;
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: var(--text-lead);
  font-weight: 700;
}

.v10-select-system-intro .v10-select-boundary {
  color: var(--white);
}

.v10-select-work {
  display: flex;
  align-items: center;
}

.v10-select-work-inner {
  width: 100%;
}

.v10-select-work h2 {
  width: 100%;
  max-width: none;
  margin-top: var(--space-3);
  font-size: clamp(2.25rem, 4vw, 4rem);
  line-height: 1;
}

.v10-select-work-list > article {
  display: grid;
  grid-template-columns: minmax(10.5rem, .9fr) minmax(10rem, 1fr) minmax(13rem, 1.5fr);
}

.v10-select-work-head {
  display: none;
}

.v10-select-work-list {
  margin-top: var(--space-7);
  border-bottom: 1px solid var(--line);
}

.v10-select-work-list > article {
  min-width: 0;
  align-items: stretch;
  border-top: 1px solid var(--line);
}

.v10-select-work-list p,
.v10-select-work-list h3 {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: var(--space-5) var(--space-4);
}

.v10-select-work-label {
  display: flex;
  align-items: center;
  background: var(--navy-deep);
  color: var(--gold-light);
  font: 700 var(--text-xs)/1.3 var(--font-display);
  letter-spacing: .04em;
  text-transform: uppercase;
  overflow-wrap: normal;
}

.v10-select-work-list h3 {
  display: flex;
  align-items: center;
  border-right: 1px solid var(--line);
  color: var(--navy);
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  line-height: 1.15;
}

.v10-select-work-list article > p:last-child {
  display: flex;
  align-items: center;
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  line-height: 1.5;
}

/* Consolidated SELECT outcomes. Ruled editorial rows keep the three outcomes
   visibly connected without presenting them as separate products or cards. */
.v10-select-outcomes {
  border-top: 1px solid var(--line);
}

.v10-select-outcome {
  display: grid;
  grid-template-columns: minmax(12rem, .6fr) minmax(0, 1.4fr);
  gap: clamp(2rem, 6vw, 6rem);
  padding-block: clamp(3rem, 7vw, 6rem);
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 7rem;
}

.v10-select-outcome:focus {
  outline: 3px solid var(--gold-deep);
  outline-offset: 6px;
}

.v10-select-outcome-mark p,
.v10-select-outcome-mark strong {
  width: 100%;
  max-width: none;
  margin: 0;
}

.v10-select-outcome-mark p {
  color: var(--navy);
  font: 700 var(--text-sm)/1.3 var(--font-display);
  letter-spacing: .06em;
  text-transform: uppercase;
}

.v10-select-outcome-mark strong {
  display: block;
  margin-top: var(--space-3);
  color: var(--navy);
  font: 700 clamp(2.2rem, 5vw, 4.5rem)/1 var(--font-heading);
}

.v10-select-outcome-copy > * {
  width: 100%;
  max-width: none;
}

.v10-select-outcome-copy > * + * {
  margin-top: var(--space-4);
}

.v10-select-outcome-copy h3 {
  margin-top: 0;
  color: var(--ink);
  font-size: clamp(2rem, 4vw, 3.8rem);
  line-height: 1.05;
}

.v10-capability-intro {
  color: var(--ink);
  font-size: var(--text-lead);
  line-height: 1.45;
}

.v10-capability-sequence {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: var(--space-6) 0 0;
  padding: 0;
  border-block: 1px solid var(--line);
  list-style: none;
}

.v10-capability-sequence li {
  position: relative;
  min-width: 0;
  padding: var(--space-5) var(--space-4) var(--space-5) 0;
}

.v10-capability-sequence li + li {
  padding-left: var(--space-4);
  border-left: 1px solid var(--line);
}

.v10-capability-sequence strong,
.v10-capability-sequence span {
  display: block;
}

.v10-capability-sequence strong {
  color: var(--navy);
  font: 700 var(--text-base)/1.2 var(--font-heading);
}

.v10-capability-sequence span {
  margin-top: var(--space-3);
  color: var(--blue-text);
  font-size: var(--text-sm);
  line-height: 1.5;
}

.v10-capability-boundary {
  display: grid;
  grid-template-columns: minmax(8rem, .45fr) minmax(0, 1.55fr);
  gap: var(--space-5);
  align-items: baseline;
  padding: var(--space-4) var(--space-5);
  color: var(--paper);
  background: var(--navy);
}

.v10-capability-boundary strong,
.v10-capability-boundary span {
  display: block;
}

.v10-capability-boundary strong {
  color: var(--gold-light);
  font: 700 var(--text-xs)/1.3 var(--font-display);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.v10-capability-boundary span {
  font-size: var(--text-sm);
  line-height: 1.45;
}

.v10-select-outcome-result {
  padding-top: var(--space-4);
  border-top: 2px solid var(--gold-deep);
  color: var(--navy);
  font-family: var(--font-heading);
  font-size: var(--text-lead);
  font-weight: 700;
}

@media (max-width: 47.9375rem) {
  .v10-select-outcome {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }

  .v10-capability-sequence {
    grid-template-columns: 1fr;
  }

  .v10-capability-sequence li {
    display: grid;
    grid-template-columns: minmax(7.5rem, .7fr) minmax(0, 1.3fr);
    gap: var(--space-4);
    padding: var(--space-4) 0;
  }

  .v10-capability-sequence li + li {
    padding-left: 0;
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .v10-capability-sequence span {
    margin-top: 0;
  }

  .v10-capability-boundary {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }
}

@media (min-width: 48rem) and (max-width: 70rem) {
  .v10-capability-sequence {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .v10-capability-sequence li {
    border-bottom: 1px solid var(--line);
  }

  .v10-capability-sequence li:nth-child(odd) {
    padding-left: 0;
    border-left: 0;
  }

  .v10-capability-sequence li:nth-child(even) {
    padding-right: 0;
    padding-left: var(--space-4);
    border-left: 1px solid var(--line);
  }

  .v10-capability-sequence li:nth-last-child(-n + 2) {
    border-bottom: 0;
  }
}

.v10-card {
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: var(--space-5);
  background: var(--white);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.v10-card h3,
.v10-card h4 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: var(--text-h3);
  line-height: 1.25;
  margin: 0;
}

.v10-card p {
  margin: 0;
}

.v10-card-label {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-deep);
}

.v10-on-dark .v10-card {
  background: transparent;
  border-color: var(--line-dark);
  color: var(--text-on-dark);
}

.v10-on-dark .v10-card-label {
  color: var(--gold);
}

/* --------------------------------------------------------------------------
   Problem, handles, decides. The three-subject block.
   -------------------------------------------------------------------------- */

.v10-split {
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.v10-split > div {
  display: grid;
  gap: var(--space-1);
}

.v10-split dt,
.v10-split-term {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-deep);
}

.v10-split dd {
  margin: 0;
}

.v10-on-dark .v10-split dt,
.v10-on-dark .v10-split-term {
  color: var(--gold);
}

/* --------------------------------------------------------------------------
   Three connected journeys. Static, readable with CSS and JavaScript off.
   -------------------------------------------------------------------------- */

.v10-journeys {
  display: grid;
  gap: 0;
  margin-top: var(--space-6);
}

.v10-journey {
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: var(--space-5);
  background: var(--white);
  display: grid;
  gap: var(--space-3);
}

.v10-journey-name {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: var(--text-h3);
  line-height: 1.2;
  margin: 0;
}

.v10-journey-count {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-deep);
}

.v10-journey-bounds {
  display: grid;
  gap: var(--space-2);
  margin: 0;
}

.v10-journey-bounds div {
  display: grid;
  grid-template-columns: 7.5rem 1fr;
  gap: var(--space-3);
  align-items: baseline;
}

.v10-journey-bounds dt {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--blue-text);
}

.v10-journey-bounds dd {
  margin: 0;
}

/* Branch chips. Restrained, square, no accent bar. */
.v10-branches {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  list-style: none;
  padding: 0;
  margin: 0;
}

.v10-branches li {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--blue-text);
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: var(--space-1) var(--space-3);
}

.v10-on-dark .v10-branches li {
  color: var(--text-on-dark);
  border-color: var(--line-dark);
}

/* The connector between journeys carries the condition that moves a person on. */
.v10-connector {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--blue-text);
  padding: var(--space-4) 0 var(--space-4) 0;
  text-align: center;
}

.v10-connector::before {
  content: "";
  display: block;
  width: 1px;
  height: var(--space-5);
  background: var(--line);
  margin: 0 auto var(--space-3);
}

.v10-connector--return::before {
  height: var(--space-6);
}

.v10-on-dark .v10-connector {
  color: var(--text-on-dark);
}

.v10-on-dark .v10-connector::before {
  background: var(--line-dark);
}

.v10-on-dark .v10-journey {
  background: transparent;
  border-color: var(--line-dark);
  color: var(--text-on-dark);
}

.v10-on-dark .v10-journey-count {
  color: var(--gold);
}

.v10-on-dark .v10-journey-bounds dt {
  color: var(--gold);
}

/* --------------------------------------------------------------------------
   Ordered step sequences. Numbers are never zero padded.
   -------------------------------------------------------------------------- */

.v10-steps {
  list-style: none;
  counter-reset: v10step;
  padding: 0;
  margin: var(--space-6) 0 0;
  display: grid;
  gap: var(--space-5);
}

.v10-steps > li {
  counter-increment: v10step;
  display: grid;
  grid-template-columns: 2.25rem 1fr;
  gap: var(--space-4);
  align-items: start;
}

.v10-steps > li::before {
  content: counter(v10step);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--gold-deep);
  border: 1px solid var(--line);
  border-radius: 4px;
  text-align: center;
  min-width: 2.25rem;
}

.v10-steps h3 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: var(--text-base);
  margin: 0 0 var(--space-2);
}

.v10-steps p {
  margin: 0;
  max-width: none;
}

.v10-on-dark .v10-steps > li::before {
  color: var(--gold);
  border-color: var(--line-dark);
}

/* --------------------------------------------------------------------------
   Responsibility split. Four subjects, one of which decides.
   -------------------------------------------------------------------------- */

.v10-responsibility {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
  margin-top: var(--space-6);
}

.v10-responsibility > div {
  border-top: 2px solid var(--gold);
  padding-top: var(--space-4);
  display: grid;
  gap: var(--space-2);
  align-content: start;
}

.v10-responsibility h3 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: var(--text-base);
  margin: 0;
}

.v10-responsibility p {
  margin: 0;
}

/* Phase 5 service-page refinements. These remain inside the Version 10
   stylesheet and do not alter the shared shell or protected Screen. */
.v10-phase {
  padding-block: var(--space-6);
  border-top: 1px solid var(--line);
}

.v10-phase:last-child {
  border-bottom: 1px solid var(--line);
}

.v10-phase > h3 {
  margin: 0 0 var(--space-4);
}

.v10-about-founder-grid {
  display: grid;
  grid-template-columns: minmax(16rem, 0.85fr) minmax(0, 1.15fr);
  gap: var(--space-6);
  align-items: start;
}

.v10-about-portrait {
  margin: 0;
}

.v10-about-portrait img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
}

@media (max-width: 48rem) {
  .v10-about-founder-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* --------------------------------------------------------------------------
   Definition rows, used for "what the firm can see" and produced items
   -------------------------------------------------------------------------- */

.v10-rows {
  display: grid;
  gap: 0;
  margin: var(--space-6) 0 0;
}

.v10-rows > div {
  display: grid;
  grid-template-columns: minmax(11rem, 18rem) 1fr;
  gap: var(--space-5);
  padding: var(--space-4) 0;
  border-top: 1px solid var(--line);
  align-items: baseline;
}

.v10-rows > div:last-child {
  border-bottom: 1px solid var(--line);
}

.v10-rows dt {
  font-family: var(--font-heading);
  font-weight: 700;
  margin: 0;
}

.v10-rows dd {
  margin: 0;
  max-width: none;
}

.v10-on-dark .v10-rows > div {
  border-color: var(--line-dark);
}

/* Compact authority epilogue. It concludes the detailed records section
   without repeating its row structure or competing with the closing CTA. */
.v10-authority-epilogue {
  padding-block: clamp(2.5rem, 5vw, 4.5rem);
}

.v10-authority-epilogue .v10-h {
  width: 100%;
  max-width: none;
  margin-bottom: 0;
}

.v10-authority-epilogue .shell > p:last-child {
  width: 100%;
  max-width: none;
  margin: var(--space-4) 0 0;
  color: var(--text-on-dark);
}

/* --------------------------------------------------------------------------
   Client Relationship Portfolio, the new fictional proof component.
   Version 10 original, not a protected component.
   -------------------------------------------------------------------------- */

.v10-portfolio {
  margin-top: var(--space-6);
  border: 1px solid var(--line);
  border-radius: 4px;
  background: var(--white);
  overflow-x: auto;
}

.v10-portfolio-head {
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  justify-content: space-between;
  align-items: baseline;
}

.v10-portfolio-title {
  font-family: var(--font-display);
  font-size: var(--text-sm);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0;
}

.v10-portfolio-flag {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--gold-deep);
  border: 1px solid var(--gold);
  border-radius: 4px;
  padding: var(--space-1) var(--space-3);
}

.v10-portfolio-record {
  padding: var(--space-5);
  border-top: 1px solid var(--line);
  display: grid;
  gap: var(--space-3);
}

.v10-portfolio-record:first-of-type {
  border-top: 0;
}

.v10-portfolio-who {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: var(--text-base);
  margin: 0;
}

.v10-portfolio-fields {
  display: grid;
  gap: var(--space-3);
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  margin: 0;
}

.v10-portfolio-fields > div {
  display: grid;
  gap: var(--space-1);
  align-content: start;
}

.v10-portfolio-fields dt {
  font-family: var(--font-display);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--blue-text);
}

.v10-portfolio-fields dd {
  margin: 0;
  font-size: var(--text-sm);
}

.v10-portfolio-verdict {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  border-top: 1px solid var(--line);
  padding-top: var(--space-3);
  margin: 0;
}

/* --------------------------------------------------------------------------
   Marketing hero, Version 10 children

   base.css offsets only .eyebrow, h1, p and .action-row inside a marketing
   hero shell, so a Version 10 element placed there sits flush left and full
   width while its siblings are indented. base.css is immutable, so the same
   measure and offset are restated here for the Version 10 children that need
   them. The target of every rule is a .v10- class, so nothing here can reach a
   protected component through the cascade.
   -------------------------------------------------------------------------- */

.page-hero--marketing > .shell > .v10-journey-bounds,
.page-hero--marketing > .shell > .v10-lede,
.page-hero--marketing > .shell > .v10-branches {
  width: min(100%, 41.25rem);
  margin-left: clamp(0rem, 8vw, 7rem);
}

@media (max-width: 70rem) {
  .page-hero--marketing > .shell > .v10-journey-bounds,
  .page-hero--marketing > .shell > .v10-lede,
  .page-hero--marketing > .shell > .v10-branches {
    margin-left: 0;
  }
}

/* Hero bound labels sit on dark ground. */
.page-hero--marketing .v10-journey-bounds dt,
.page-hero--marketing .v10-split-term {
  color: var(--gold);
}

.page-hero--marketing .v10-journey-bounds dd {
  color: var(--text-on-dark);
}

/* --------------------------------------------------------------------------
   Plain sentence lists

   Unlabelled lists inside Version 10 prose. Scoped under .v10-prose so the
   selector cannot reach a protected component.
   -------------------------------------------------------------------------- */

.v10-list,
.v10-prose ul,
.v10-prose ol {
  max-width: none;
  padding-left: var(--space-5);
  margin: var(--space-4) 0 0;
  display: grid;
  gap: var(--space-2);
}

.v10-list li,
.v10-prose ul li,
.v10-prose ol li {
  padding-left: var(--space-2);
}

.v10-list::marker,
.v10-prose ul li::marker,
.v10-prose ol li::marker {
  color: var(--gold-deep);
}

.v10-on-dark .v10-prose ul li::marker,
.v10-on-dark .v10-prose ol li::marker,
.v10-on-dark .v10-list li::marker {
  color: var(--gold);
}

/* --------------------------------------------------------------------------
   Closing block

   base.css sets .cta-close h2 { margin-bottom: 0 } and supplies the paragraph's
   top margin only through the .home-closing modifier, which the homepage
   carries and the seven interior pages do not. Without this the closing
   heading and its paragraph touch at every width. Matched as an adjacent
   sibling of .v10-h, which never appears inside a protected fragment.
   -------------------------------------------------------------------------- */

.cta-close .v10-h + p {
  margin-top: var(--space-5);
}

.cta-close .v10-h + p + p {
  margin-top: var(--space-4);
}

.v10-compact-close .shell {
  width: min(calc(100% - 3rem), 76rem);
  gap: var(--space-6);
}

.v10-compact-close .shell > div {
  display: grid;
  justify-items: center;
}

.v10-compact-close h2 {
  width: 100%;
  font-size: clamp(2.35rem, 4.25vw, 3.8rem);
  line-height: 1;
  letter-spacing: -0.04em;
}

.v10-compact-close .v10-h + p {
  width: 100%;
  max-width: none;
  margin: var(--space-4) 0 0;
  color: var(--text-on-dark);
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  line-height: 1.45;
}

@media (min-width: 64rem) {
  .v10-compact-close h2,
  .v10-compact-close .v10-h + p {
    white-space: nowrap;
  }
}

@media (max-width: 48rem) {
  .v10-compact-close .shell {
    width: min(calc(100% - 2rem), 76rem);
  }

  .v10-compact-close h2 {
    font-size: clamp(2.15rem, 10.5vw, 3rem);
  }
}

/* --------------------------------------------------------------------------
   Conversation form

   Retained for any isolated form prototype that still uses .v10-form. The
   public conversation page now hands off to the CaseLoad Select application.
   -------------------------------------------------------------------------- */

.v10-form {
  /* Resting border for form controls.
     WCAG 1.4.11 requires 3:1 for the boundary of a user-interface component.
     --line (#c9ced7) measures 1.58:1 on white, so every required control on
     this form failed. The palette has no value near the threshold: it jumps
     from --line at 1.58 to --gold-deep at 5.44, and --blue-text at 8.03 is far
     too heavy for a resting field border. This is --line walked darker on the
     same cool-grey hue, measured at 3.68:1 on white and 3.31:1 on paper.

     Declared on .v10-form rather than :root so it obeys this stylesheet's own
     rule that every selector is Version 10 scoped. It is inherited by the
     controls below, which is the only place it is used. */
  --v10-line-strong: #7d8694;
}

.v10-form .field input,
.v10-form .field select,
.v10-form .field textarea {
  border-color: var(--v10-line-strong);
}

/* The invalid state must still read as louder than the resting state. */
.v10-form .field.is-invalid input,
.v10-form .field.is-invalid select,
.v10-form .field.is-invalid textarea,
.v10-form .check.is-invalid input {
  border-color: var(--error);
}

/* The public conversation page now hands off to the verified CaseLoad Select
   application. The editorial split distinguishes preparation from action
   without presenting the application as an embedded marketing form. */
.conversation-launch-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(24rem, 1.1fr);
  gap: clamp(2.5rem, 8vw, 8rem);
  align-items: start;
}

.conversation-launch-copy h2 {
  max-width: 13ch;
  font-size: clamp(2.6rem, 5vw, 5.2rem);
  line-height: .98;
}

.conversation-launch-copy > p:not(.eyebrow) {
  color: var(--blue-text);
  font-size: var(--text-lead);
}

.conversation-launch-panel {
  padding: clamp(2rem, 4.5vw, 4rem);
  background: var(--ink);
  color: var(--white);
}

.conversation-launch-panel .eyebrow {
  color: var(--gold-light);
}

.conversation-launch-steps {
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  padding: 0;
  border-top: 1px solid var(--line-dark);
  list-style: none;
}

.conversation-launch-steps li {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr);
  gap: 1rem;
  align-items: start;
  padding: 1.2rem 0;
  border-bottom: 1px solid var(--line-dark);
}

.conversation-launch-steps span {
  color: var(--gold-light);
  font: 700 1.4rem/1 var(--font-display);
}

.conversation-launch-steps p {
  margin: 0;
  color: var(--text-on-dark);
  line-height: 1.55;
}

.conversation-launch-panel .button {
  width: 100%;
}

.conversation-email-alternative {
  margin: 1.35rem 0 0;
  color: var(--text-on-dark);
  font-size: var(--text-sm);
}

.conversation-email-alternative a {
  color: var(--white);
  font-weight: 700;
  text-underline-offset: .18em;
}

@media (max-width: 56rem) {
  .conversation-launch-grid {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  .conversation-launch-copy h2 {
    max-width: 16ch;
  }
}

/* --------------------------------------------------------------------------
   Cross-links at the foot of a page
   -------------------------------------------------------------------------- */

.v10-next {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-5);
  margin-top: var(--space-6);
}

/* Homepage commercial protection. The compact light bridge keeps the buyer's
   attention on continuity rather than turning three failure states into a
   visual climax. */
.v10-commercial-protection {
  padding-block: clamp(3rem, 6vw, 5rem);
}

.v10-commercial-protection-grid {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: clamp(2rem, 7vw, 7rem);
  align-items: start;
}

.v10-commercial-protection-grid h2 {
  margin-bottom: 0;
}

.v10-continuity-risks {
  width: 100%;
  max-width: none;
  margin: 0;
  border-block: 1px solid var(--line);
}

.v10-continuity-risks article {
  display: grid;
  grid-template-columns: minmax(6.5rem, .42fr) minmax(0, 1fr);
  gap: var(--space-4);
  align-items: baseline;
  padding: var(--space-4) 0;
}

.v10-continuity-risks article + article {
  border-top: 1px solid var(--line);
}

.v10-continuity-risks p {
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--blue-text);
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 400;
  letter-spacing: normal;
  line-height: 1.55;
}

.v10-continuity-risks .v10-risk-label {
  color: var(--navy);
  font: 700 var(--text-xs)/1.25 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Homepage FAQ. One editorial field, followed by a continuous ruled list.
   The component is reusable on internal pages without changing their content. */
.v10-faq-section {
  padding-block: clamp(5.5rem, 9vw, 9rem);
}

.v10-faq-heading {
  width: 100%;
  margin-bottom: clamp(3.5rem, 6vw, 5.5rem);
}

.v10-faq-heading .eyebrow {
  color: var(--gold-deep);
}

.v10-faq-heading h2 {
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--navy);
  font-size: clamp(3rem, 6.2vw, 5.8rem);
  line-height: .98;
  letter-spacing: -.045em;
}

.v10-faq-list {
  display: block;
  width: 100%;
  gap: 0;
  border-top: 1px solid var(--navy);
}

.v10-faq-list details {
  border-bottom: 1px solid var(--line);
}

.v10-faq-list summary {
  min-height: clamp(6rem, 8vw, 7.25rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  padding: var(--space-4) 0;
  color: var(--navy);
  font: 700 clamp(1.25rem, 1.12rem + .5vw, 1.72rem)/1.3 var(--font-heading);
  cursor: pointer;
  list-style: none;
}

.v10-faq-list summary::-webkit-details-marker {
  display: none;
}

.v10-faq-list summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--gold-deep);
  font: 500 1.8rem/1 var(--font-body);
}

.v10-faq-list details[open] summary::after {
  content: "−";
}

.v10-faq-list summary:focus-visible {
  outline: var(--focus);
  outline-offset: 5px;
}

.v10-faq-list details p {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 4rem var(--space-6) 0;
  color: var(--blue-text);
  font-size: var(--text-lead);
  line-height: 1.6;
}

/* Universal conversion footer. The hero opens the promise with an image;
   this text-only close converts the page subject into one outcome and action. */
.v10-conversion-footer {
  padding-block: clamp(6.5rem, 10vw, 10rem);
  background: var(--ink);
  color: var(--white);
}

.v10-conversion-footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(18rem, 0.9fr);
  gap: clamp(4rem, 8vw, 9rem);
  align-items: center;
}

.v10-conversion-footer .eyebrow {
  color: var(--gold-light);
}

.v10-conversion-footer h2 {
  margin: 0;
  color: var(--white);
  font-size: clamp(4rem, 7.4vw, 7.25rem);
  line-height: 0.94;
  letter-spacing: -0.04em;
  text-wrap: balance;
}

.v10-conversion-footer-action {
  padding-top: clamp(2.25rem, 4vw, 3.5rem);
  border-top: 1px solid rgba(255,255,255,.34);
}

.v10-conversion-footer-action p {
  margin: 0 0 clamp(2rem, 4vw, 3.25rem);
  color: var(--text-on-dark);
  font-size: clamp(1.25rem, 2vw, 1.8rem);
  line-height: 1.45;
  text-wrap: balance;
}

.v10-conversion-footer-action .button {
  width: 100%;
}

.home-insights-grid {
  display: grid;
  grid-template-columns: minmax(13rem, .45fr) minmax(0, 1.55fr);
  gap: clamp(3rem, 8vw, 9rem);
  align-items: start;
}

.home-insights-grid h2 {
  margin-top: 0;
  font-size: clamp(3rem, 5.4vw, 5.5rem);
  line-height: .98;
  letter-spacing: -.04em;
}

.home-insights-grid > div > p {
  max-width: 52rem;
  color: var(--blue-text);
  font-size: var(--text-lead);
}

/* Insights extends the established editorial system rather than introducing a
   blog feed. Its structure remains an advisory library of maintained work. */
.v10-image-hero--insights .v10-image-hero-media img {
  object-position: 50% center;
}

/* Insights uses the universal three-line hero statement. Its page-scoped
   measure keeps the approved sentence balanced without changing other routes. */
.v10-image-hero--insights .v10-image-hero-grid > .v10-image-hero-lead {
  max-width: 45rem;
  letter-spacing: -.012em;
}

.insights-page .v10-image-hero .text-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.insights-feature-grid,
.insights-tool-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(20rem, .75fr);
  gap: clamp(3rem, 7vw, 8rem);
  align-items: start;
}

.insights-feature h2 {
  font-size: clamp(3rem, 4.8vw, 5.25rem);
  line-height: .98;
  letter-spacing: -.04em;
  text-wrap: balance;
}

.insights-feature h2 a,
.insights-rows h3 a {
  text-decoration: none;
  transition: color .18s ease;
}

.insights-feature h2 a:hover,
.insights-feature h2 a:focus-visible,
.insights-rows h3 a:hover,
.insights-rows h3 a:focus-visible {
  color: var(--navy);
}

/* The Insights close carries a longer, fixed statement than the other routes.
   Its page-scoped scale preserves the shared component while keeping that
   statement within three lines at desktop and mobile widths. */
.insights-page .v10-conversion-footer h2 {
  font-size: clamp(3.35rem, 5.7vw, 5.5rem);
}

.insights-feature-context {
  padding-top: .35rem;
  border-top: 1px solid var(--navy);
}

.insights-format,
.insights-status,
.insights-decision dt,
.insights-tool-questions span {
  color: var(--gold-deep);
  font: 700 var(--text-xs)/1.35 var(--font-display);
  letter-spacing: .07em;
  text-transform: uppercase;
}

.insights-feature-context > p:not(.insights-format) {
  margin-block: 1.5rem 2rem;
  color: var(--blue-text);
  font-size: var(--text-lead);
}

.insights-decision {
  margin: 0 0 2rem;
  border-top: 1px solid var(--line);
}

.insights-decision > div {
  display: grid;
  grid-template-columns: 6rem minmax(0, 1fr);
  gap: 1rem;
  padding: 1rem 0;
  border-bottom: 1px solid var(--line);
}

.insights-decision dd {
  margin: 0;
}

.insights-status {
  display: block;
  margin-top: .8rem;
  color: var(--navy);
}

.insights-library-heading {
  margin-bottom: clamp(3rem, 6vw, 5rem);
}

.insights-rows {
  border-top: 1px solid var(--navy);
}

.insights-rows article {
  display: grid;
  grid-template-columns: minmax(18rem, .85fr) minmax(0, 1.15fr);
  gap: clamp(2rem, 5vw, 6rem);
  padding: clamp(2rem, 4vw, 3.5rem) 0;
  border-bottom: 1px solid var(--line);
}

.insights-rows h3 {
  margin: .7rem 0 0;
  font-size: clamp(2rem, 3.2vw, 3.25rem);
  line-height: 1.05;
}

.insights-rows article > div:last-child > p {
  margin: 0 0 1.5rem;
  color: var(--blue-text);
  font-size: var(--text-lead);
}

.insights-tool-grid > div > p:last-child {
  color: var(--text-on-dark);
  font-size: var(--text-lead);
}

.insights-tool-questions {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--line-dark);
}

.insights-tool-questions li {
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--line-dark);
}

.insights-tool-questions span {
  display: block;
  margin-bottom: .55rem;
  color: var(--gold-light);
}

.insights-tool-questions strong {
  color: var(--white);
  font: 700 clamp(1.1rem, 1.8vw, 1.45rem)/1.35 var(--font-heading);
}

.insights-principles {
  margin: clamp(3rem, 6vw, 5rem) 0 0;
  border-top: 1px solid var(--navy);
}

.insights-principles > div {
  display: grid;
  grid-template-columns: minmax(11rem, .5fr) minmax(0, 1.5fr);
  gap: clamp(2rem, 5vw, 6rem);
  padding: clamp(1.5rem, 3vw, 2.5rem) 0;
  border-bottom: 1px solid var(--line);
}

.insights-principles dt {
  color: var(--navy);
  font: 700 clamp(1.2rem, 2vw, 1.6rem)/1.25 var(--font-heading);
}

.insights-principles dd {
  margin: 0;
  color: var(--blue-text);
  font-size: var(--text-lead);
}

@media (max-width: 64rem) {
  .v10-conversion-footer-grid,
  .home-insights-grid,
  .insights-feature-grid,
  .insights-tool-grid,
  .insights-rows article {
    grid-template-columns: 1fr;
  }

  .v10-conversion-footer-grid {
    gap: var(--space-7);
  }

  .home-insights-grid {
    gap: var(--space-5);
  }

  .insights-feature-grid,
  .insights-tool-grid,
  .insights-rows article {
    gap: var(--space-6);
  }
}

@media (max-width: 52rem) {
  .v10-conversion-footer {
    padding-block: var(--space-8);
  }

  .v10-conversion-footer h2 {
    font-size: clamp(2.8rem, 13vw, 4rem);
  }

  .v10-conversion-footer-action p {
    font-size: 1.1rem;
  }

  .v10-image-hero--insights .v10-image-hero-media img {
    object-position: 68% center;
  }

  .v10-image-hero--insights .v10-image-hero-grid > .v10-image-hero-lead {
    font-size: clamp(.88rem, 3.7vw, 1rem);
    letter-spacing: -.02em;
    line-height: 1.55;
  }

  .insights-feature h2 {
    font-size: clamp(2.1rem, 9.5vw, 3rem);
  }

  .insights-page .v10-conversion-footer h2 {
    font-size: clamp(2.2rem, 10vw, 3.2rem);
  }

  .insights-decision > div,
  .insights-principles > div {
    grid-template-columns: 1fr;
    gap: .55rem;
  }
}

@media (max-width: 23rem) {
  .v10-image-hero--insights .v10-image-hero-grid > .v10-image-hero-lead {
    font-size: .82rem !important;
  }
}

@media (max-width: 23rem) {
  .insights-page .v10-faq-heading h2 {
    font-size: 2.25rem;
  }

  .insights-page .v10-conversion-footer h2 {
    font-size: 2rem;
  }

  .insights-page .insights-rows h3 {
    font-size: 1.7rem;
  }

  .insights-page .insights-tool h2 {
    font-size: 1.8rem;
  }
}

/* Homepage service offer, adapted from the ACTS complete-service composition.
   It presents the approved fixed-fee model without implying unlimited scope. */
.v10-complete-service {
  border-top: 1px solid var(--line-dark);
}

.v10-complete-service-top {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(18rem, .75fr);
  gap: clamp(3rem, 8vw, 8rem);
  align-items: end;
}

.v10-complete-service-top h2,
.v10-complete-service-summary p,
.v10-complete-service-bottom p {
  width: 100%;
  max-width: none;
  margin-bottom: 0;
}

.v10-complete-service-summary {
  padding-left: var(--space-5);
  border-left: 1px solid var(--line-dark);
}

.v10-complete-service-summary strong,
.v10-complete-service-terms span {
  display: block;
  color: var(--gold-light);
  font: 700 var(--text-xs)/1.25 var(--font-display);
  letter-spacing: .1em;
  text-transform: uppercase;
}

.v10-complete-service-summary p {
  margin-top: 0;
  color: var(--text-on-dark);
  font-size: var(--text-lead);
}

.v10-complete-service-terms {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: var(--space-7);
  border-block: 1px solid var(--line-dark);
}

.v10-complete-service-terms > div {
  min-width: 0;
  padding: var(--space-5);
}

.v10-complete-service-terms > div + div {
  border-left: 1px solid var(--line-dark);
}

.v10-complete-service-terms p {
  width: 100%;
  max-width: none;
  margin: var(--space-4) 0 0;
  color: var(--white);
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.45;
}

.v10-complete-service-bottom {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-5);
  align-items: end;
  margin-top: var(--space-5);
}

.v10-complete-service-bottom p {
  color: var(--text-on-dark);
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 70rem) {
  .v10-select-system {
    grid-template-columns: minmax(0, 1fr);
  }

  .v10-select-system-copy {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    grid-template-rows: auto auto 1fr;
    column-gap: clamp(2rem, 6vw, 4.5rem);
  }

  .v10-select-system-intro .eyebrow {
    grid-column: 1 / -1;
  }

  .v10-select-system-intro h2 {
    grid-column: 1;
    grid-row: 2 / 4;
    align-self: start;
    max-width: none;
    font-size: clamp(2.5rem, 6vw, 4rem);
  }

  .v10-select-system-intro .v10-lede {
    grid-column: 2;
    grid-row: 2;
    margin-top: var(--space-5);
  }

  .v10-select-system-intro .v10-select-boundary {
    grid-column: 2;
    grid-row: 3;
    align-self: end;
  }
}

@media (max-width: 40rem) {
  .v10-select-system {
    width: min(calc(100% - 2rem), var(--shell));
    margin-block: var(--space-7);
  }

  .v10-select-system-copy,
  .v10-select-work-inner {
    padding: var(--space-6) var(--space-5);
  }

  .v10-select-system-copy {
    display: block;
  }

  .v10-select-system-intro h2 {
    max-width: none;
    font-size: clamp(2.45rem, 11vw, 3.4rem);
  }

  .v10-home-outcomes,
  .v10-commercial-protection-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .v10-home-outcomes > article {
    min-height: 0;
  }

  .v10-home-outcomes > article + article {
    border-left: 0;
    border-top: 1px solid var(--line);
  }

  .v10-complete-service-top,
  .v10-complete-service-terms,
  .v10-complete-service-bottom {
    grid-template-columns: minmax(0, 1fr);
  }

  .v10-complete-service-summary {
    padding-top: var(--space-5);
    padding-left: 0;
    border-top: 1px solid var(--line-dark);
    border-left: 0;
  }

  .v10-complete-service-terms > div + div {
    border-top: 1px solid var(--line-dark);
    border-left: 0;
  }

  .v10-complete-service-bottom {
    align-items: start;
  }

  .v10-select-work-list > article {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .v10-select-work-list {
    margin-top: var(--space-6);
  }

  .v10-select-work-list h3 {
    border-right: 0;
  }

  .v10-faq-section {
    padding-block: var(--space-8);
  }

  .v10-faq-heading {
    margin-bottom: var(--space-7);
  }

  .v10-faq-heading h2 {
    font-size: clamp(2.7rem, 12vw, 4rem);
  }

  .v10-faq-list summary {
    min-height: 5.75rem;
    gap: var(--space-4);
    font-size: 1.15rem;
  }

  .v10-faq-list summary::after {
    font-size: 1.55rem;
  }

  .v10-faq-list details p {
    padding-right: var(--space-6);
    font-size: 1rem;
  }

  .v10-journey-bounds div,
  .v10-rows > div {
    grid-template-columns: 1fr;
    gap: var(--space-1);
  }

  .v10-steps > li {
    grid-template-columns: 1.9rem 1fr;
    gap: var(--space-3);
  }

  .v10-boundary {
    font-size: var(--text-lead);
  }
}

/* Version 10 journey navigation. The shared base shell stays frozen; these
   selectors opt the new journey disclosure into its visible affordance. */
.v10-nav-method .method-menu-toggle:hover,
.v10-nav-method:has(.method-menu a[aria-current="page"]) > .method-menu-toggle {
  color: var(--gold-light);
}

.v10-nav-method .method-menu-toggle svg {
  display: block;
  flex: 0 0 auto;
  width: .75rem;
  height: .5rem;
  margin-left: .55rem;
  transition: transform 140ms ease;
}

.v10-nav-method .method-menu-toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}

.v10-nav-method .method-menu {
  z-index: 2;
}

@media (prefers-reduced-motion: reduce) {
  .v10-card,
  .v10-journey,
  .v10-portfolio,
  .v10-nav-method .method-menu-toggle svg {
    transition: none;
  }
}

/* --------------------------------------------------------------------------
   Print. The Screen report is handled by base.css and is not touched here.
   -------------------------------------------------------------------------- */

@media print {
  .v10-next,
  .v10-branches {
    display: none;
  }

  .v10-card,
  .v10-journey,
  .v10-portfolio {
    border-color: #000;
    background: transparent;
  }
}