/* Reading rhythm shared by the marketing pages. Close relationships stay close;
   sections, independent ideas and decisions have progressively larger pauses.
   Screen-only so the working guide keeps its authored print pagination. */
@media screen {
  :root {
    --space-copy: 1.5rem;
    --space-group: clamp(2rem, 3.2vw, 3rem);
    --space-heading: clamp(3rem, 5.5vw, 5rem);
    --space-section: clamp(5.5rem, 11vw, 10rem);
    --space-panel: clamp(1.5rem, 4vw, 3.5rem);
    --space-column: clamp(2.5rem, 7vw, 6.5rem);
  }

  /* Give a new subject more room than a paragraph within that subject. */
  .section-space, .pricing-page .section-space,
  .practice-editorial, .home-synthesis { padding-block: var(--space-section); }
  .section-intro, .approach .section-intro, .drift-section .section-intro,
  .pricing-page .section-intro, .story-heading, .explorer-intro,
  .practitioners-heading, .board-heading, .family-introduction {
    margin-bottom: var(--space-heading);
  }
  .section-intro, .practice-intro-grid, .practice-editorial,
  .home-synthesis, .home-origin, .story-heading, .story-stage,
  .explorer-intro, .decision-result, .workload-section,
  .booklet-story, .confidentiality-content, .family-introduction,
  .people-lenses, .drift-explorer { column-gap: var(--space-column); }

  .practice-intro { padding-block: clamp(3rem, 5vw, 4.5rem) var(--space-heading); }
  .breadcrumb { margin-bottom: var(--space-group); }
  .practice-intro .button { margin-top: 2rem; }
  .engagement-topics { margin-top: var(--space-heading); padding-top: 2rem; }
  .practice-next, .home-origin, .pricing-next, .pricing-preview {
    padding-block: clamp(4rem, 7vw, 6rem);
  }
  .practice-next > div { gap: 1.5rem; }
  .starting-points { padding-block: var(--space-heading); }
  .priority-routes a { padding-block: 1.75rem; }
  .practice-route { padding-block: var(--space-group); }
  .practice-routes .topic-actions { margin-bottom: 2rem; }
  .scope-preview > a { padding-block: 2rem; }

  /* Preserve the hero composition, with a quieter lead-in and action cluster. */
  .hero { padding-top: clamp(3rem, 7vw, 6rem); }
  .hero-copy > p { margin-top: 2rem; }
  .hero-actions { margin-top: 2.5rem; row-gap: 1.5rem; }
  .hero-baseline { padding-block: 2rem; }

  /* Body rhythm is scoped to prose, never diagram nodes or control labels. */
  .section-intro p + p, .practice-intro-grid p + p,
  .story-reading p + p, .practitioner-copy > p:not(.practitioner-role) + p,
  .family-origin p + p, .family-parent > p + p,
  .assessment-inclusions p + p, .privacy-document p + p {
    margin-top: var(--space-copy);
  }
  .practice-outcomes > div + div { margin-top: var(--space-group); padding-top: var(--space-group); }
  .practice-outcomes dt { margin-bottom: 1rem; }
  .story-callout { margin-top: 2rem; padding-top: 1.75rem; }
  .story-example-note { margin-top: 2rem; }
  .topic-actions { margin-top: 1.5rem; gap: .75rem 1.75rem; }

  /* Scope choices, descriptions and next steps form three distinct groups. */
  .assessment-orientation { margin-block: 2rem 2.5rem; }
  .tier-heading { margin-bottom: 1.75rem; gap: 1rem 2rem; }
  .tier-tab { padding: 2rem 1.5rem; }
  .tier-tab > strong { margin-top: 1.5rem; }
  .tier-panel { padding: var(--space-panel); gap: var(--space-column); }
  .tier-copy > p { margin-top: 1.5rem; }
  .tier-copy .text-link { margin-top: 1.75rem; }
  .tier-note { margin-top: 2rem; }
  .people-lenses { margin-top: var(--space-heading); padding-top: var(--space-group); }
  .people-lens summary { padding-block: 1.5rem; }
  .lens-body { padding-bottom: 2rem; }
  .booklet-story { margin-top: var(--space-heading); padding-top: var(--space-heading); }
  .confidentiality-content { padding-top: var(--space-heading); }
  .confidentiality-principles > div { padding-block: 2rem; }
  .confidentiality-principles > div:first-child { padding-top: 0; }

  /* Tools: breathing room between questions; labels stay with their inputs. */
  .scenario-picker { gap: .75rem; margin-bottom: var(--space-group); }
  .scenario-content > h3 { margin-bottom: var(--space-group); }
  .scenario-outcome { margin-top: var(--space-group); padding-top: 2rem; }
  .scenario-footer { margin-top: 2.5rem; }
  .explorer-controls { row-gap: 2rem; margin-bottom: 2.5rem; }
  .explorer-options { gap: .75rem; }
  .explorer-options label { padding: 1rem 1.25rem; }
  .decision-result { padding-block: 2rem var(--space-group); }
  .decision-result dl > div + div { margin-top: 2rem; }
  .explorer-footer { padding-top: 2rem; }
  .workflow-heading { margin-block: var(--space-group) 2rem; }
  .workflow-detail { padding: var(--space-panel); }
  .workflow-prerequisites { margin-block: 2rem; }
  .workload-field + .workload-field { margin-top: 2rem; }
  .workload-result { margin-top: 2.5rem; padding-top: 2rem; }
  .workload-horizons { margin-block: 2rem 1.5rem; padding-top: 1.5rem; }
  .intervention-explorer { margin-top: 2rem; }
  .drift-example { padding-top: var(--space-group); }
  .drift-commitment { margin-block: 2rem var(--space-group); }
  .drift-footer { margin-top: var(--space-group); padding-top: 2rem; }
  .roadmap-example, .organization-map-story { margin-top: var(--space-group); padding-top: var(--space-group); }
  .roadmap-picker { margin-block: 2rem; }
  .brief-layout, .origin-layout, .pilot-layout { column-gap: var(--space-column); }
  .advisory-sheet, .pilot-specimen { padding: var(--space-panel); }
  .brief-disclosures details { padding-block: 1.75rem; }
  .origin-links article + article { margin-top: 2rem; padding-top: 2rem; }
  .engagement-next .engagement-heading { margin-bottom: var(--space-heading); }
  .engagement-next .engagement-options { margin-bottom: var(--space-group); }
  .engagement-options article { padding-top: 2rem; }
  .engagement-options dl > div + div { margin-top: 1.75rem; }
  .engagement-next .engagement-agreement { padding-top: 2rem; }
  .engagement-next .engagement-evidence { margin-block: var(--space-group); padding: var(--space-panel); }

  /* People and brands need separation between profiles, not between a name
     and its title. Existing image crops and hover treatments are retained. */
  .practitioner { padding-block: var(--space-heading); }
  .board-member { padding-block: var(--space-group); }
  .support-member { padding-top: var(--space-group); }
  .family-brand { padding-block: 2rem; }
  .family-origin { padding-block: var(--space-heading); }
  .practitioner-discovery article { padding-block: var(--space-group); }

  /* Pricing remains easy to compare; the space goes into rows and headings. */
  .pricing-page-intro { padding-block: 4rem var(--space-heading); }
  .pricing-contents a, .pricing-contents a + a { padding-block: 2rem; }
  .review-price-group summary { padding-block: 2rem; }
  .review-price-group th, .review-price-group td { padding-block: 1.5rem; }
  .scope-questions summary { padding-block: 1.75rem; }
  .scope-questions details > div { padding-bottom: 2rem; }

  /* Contact and reading pages use the same rhythm without inflating chrome. */
  .field { margin-bottom: 2rem; }
  .form-row { column-gap: 1.5rem; }
  .form-bottom { margin-top: 2rem; }
  .inquiry-next-steps { margin-top: 2rem; }
  .inquiry-next-steps > div { padding-block: 1.25rem; }
  .guide-intro { padding-block: var(--space-heading); gap: var(--space-column); }
  .guide-actions { margin-top: 2rem; gap: 1.5rem; }
  .sample-sheets { padding-block: var(--space-heading); gap: var(--space-group); }
  .sample-sheet { padding: var(--space-panel); }
  .sample-prompts { margin-top: 2rem; padding-top: 1.25rem; }
  .guide-next { padding-bottom: var(--space-heading); }
  .privacy-document { padding-block: var(--space-heading); }
  .privacy-document section { padding-block: 2.5rem; }
  .footer-top { padding-block: var(--space-group); }
  .footer-pages { padding-block: 2rem; row-gap: 1.5rem; }
  .footer-bottom { padding-block: 2rem; }
  .utility-main { padding-block: var(--space-heading); }
  .utility-routes a { padding-block: 1.75rem; }

  /* A page entrance presents one proposition, rather than two simultaneous
     columns of copy. The homepage's authored orbital hero is independent. */
  .practice-intro-grid { display: block; max-width: 52rem; }
  .practice-intro-grid > div { padding-top: 0; margin-top: 2rem; max-width: 50ch; }
  .practice-intro { padding-top: var(--space-heading); }
  .practice-intro .engagement-topics { margin-top: 3.5rem; }
  .section-intro, .story-heading, .explorer-intro,
  .engagement-next .engagement-heading {
    display: block;
    max-width: 46rem;
  }
  .section-intro > p, .section-intro > div, .story-heading > p,
  .explorer-intro > p, .engagement-heading > p {
    padding-top: 0;
    margin-top: 1.75rem;
    max-width: 48ch;
  }
  .story-reading { max-width: 46ch; }
  .section-intro h2, .story-heading h2, .explorer-intro h2 { max-width: 22ch; }
  .story-reading h3 { margin-bottom: 1.5rem; }
  .story-callout { margin-top: 2.5rem; padding-top: 2rem; }
  .story-ready .story-reading { min-height: 0; }
  .origin-links { max-width: 48ch; }
  .engagement-next .engagement-options { column-gap: var(--space-column); }
  .engagement-options dd { max-width: 44ch; }

  /* Optional exercises retain their complete HTML and native keyboard access.
     Important service descriptions, prices and inquiry actions stay exposed. */
  .optional-example { border-block: 1px solid var(--line); }
  .optional-example > summary, .reading-detail > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding-block: 2rem;
    color: var(--copper-light);
    font: 1.125rem/1.5 var(--sans);
    cursor: pointer;
    list-style: none;
  }
  .optional-example > summary::-webkit-details-marker,
  .reading-detail > summary::-webkit-details-marker { display: none; }
  .optional-example .expand, .reading-detail .expand { flex: none; }
  .optional-example[open] > summary .expand::after,
  .reading-detail[open] > summary .expand::after { transform: rotate(0); }
  .optional-example > summary:hover, .reading-detail > summary:hover { color: var(--paper); }
  .optional-example-body { padding-block: var(--space-group); }
  .reading-detail { border-top: 1px solid var(--line); margin-top: 2rem; }
  .reading-detail + .reading-detail { margin-top: 0; }
  .reading-detail > summary { font-family: var(--serif); font-size: 1.5rem; color: var(--paper); }
  .reading-detail > div { padding-bottom: 2rem; }
  .reading-detail p { max-width: 48ch; }
}

@media screen and (prefers-reduced-motion: no-preference) {
  html:not(.motion-paused) .optional-example[open] > .optional-example-body,
  html:not(.motion-paused) .reading-detail[open] > div { animation: reading-detail-arrive 240ms ease-out; }
}
@keyframes reading-detail-arrive { from { opacity: .4; } to { opacity: 1; } }

@media screen {
  /* Assessment, map and guide are separate chapters, not one extended panel. */
  #assessments, #organizational-map, #working-guides {
    margin-top: var(--space-section);
    padding-top: var(--space-heading);
  }
  .assessment-questions { margin-top: 2.5rem; }
  .assessment-questions > div { padding-block: 1.5rem; }
  .assessment-questions dd { max-width: 34ch; }
  .people-lens summary { gap: 1.5rem; padding-block: 2rem; }
  .people-lens summary small {
    display: block;
    margin-top: .75rem;
    max-width: 36ch;
    color: var(--muted);
    font: 1rem/1.6 var(--sans);
  }
  .hogan-perspectives > div + div { margin-top: 2rem; }
  .hogan-perspectives dd { margin-top: .75rem; }
  .organization-map-story { align-items: start; }
  .organization-map-story > div > p + p { margin-top: 2rem; }
  .organization-map-story .reading-detail { margin-top: 2.5rem; }
  .booklet-copy > .guide-inclusions { margin-block: 2.5rem; }
  .guide-inclusions ul { margin-top: 1.5rem; }
  .guide-inclusions li + li { margin-top: 1rem; }

  /* The selected outcome is the first reading stop; its reasoning is optional. */
  .scenario-content { max-width: 60rem; }
  .scenario-content > h3 { max-width: 25ch; min-height: 0; margin-bottom: 1.75rem; }
  .scenario-content > .scenario-outcome {
    display: block;
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
    max-width: 48ch;
  }
  .scenario-outcome > span:first-child { display: none; }
  .scenario-outcome > p { margin-top: 0; }
  .scenario-outcome .scenario-measure { display: block; margin-top: 1.5rem; }
  .scenario-breakdown { margin-top: 2.5rem; }
  .scenario-breakdown .scenario-connections {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem 4rem;
    padding-block: 1rem;
  }
  .scenario-step p { max-width: 38ch; }
  .scenario-breakdown .scenario-step h4 { min-height: 0; }
  .decision-deliverables {
    margin-top: var(--space-section);
    padding-top: var(--space-heading);
  }
  .decision-deliverables > dl { gap: 2.5rem; margin-top: 2.5rem; }
  .decision-deliverables dt { margin-bottom: 1rem; }
  .decision-deliverables .roadmap-example { padding-top: 0; margin-top: 3rem; }
  .drift-example > h3 { max-width: 28ch; }
  .drift-example > p { max-width: 50ch; margin-top: 1.5rem; }
  .drift-commitment { margin-block: 3rem 4rem; gap: 2rem; }
  .drift-next { margin-top: 2.5rem; padding-top: 2rem; }
  .workload-field + .workload-field { margin-top: 3rem; }
  .workload-result { margin-top: 3.5rem; padding-top: 3rem; }
  .workload-horizons { margin-top: 3rem; padding-top: 2rem; }
  .workload-costs { margin-top: 2.5rem; padding-top: 2rem; }
  .workload-savings {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-heading) var(--space-column);
    border-top: 1px solid var(--line);
    padding-top: var(--space-heading);
  }
  .workload-savings h3 { font-size: clamp(2rem, 3vw, 2.75rem); }
  .workload-savings-intro > p { max-width: 43ch; margin-top: 1.5rem; line-height: 1.8; }
  .workload-savings-controls { margin-top: 2.5rem; }
  .reduction-endpoints { display: flex; justify-content: space-between; gap: 1rem; font-size: .8125rem; color: var(--muted); }
  .workload-savings-intro > .workload-reduction-help { font-size: .875rem; color: var(--teal); }
  .savings-totals { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin: 0; }
  .savings-totals > div { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
  .savings-totals dt { font-size: .875rem; color: var(--muted); line-height: 1.6; }
  .savings-totals dd { margin: 0; font: clamp(1.75rem, 3vw, 2.75rem)/1.15 var(--serif); color: var(--copper-light); font-variant-numeric: tabular-nums; }
  .savings-totals .savings-time { font: .875rem/1.7 var(--sans); color: var(--teal); }
  .savings-assumption { margin-top: 2.5rem; max-width: 50ch; font-size: .875rem; line-height: 1.8; }
  .workload-savings-results > .text-link { margin-top: 2rem; }
}

@media screen and (max-width: 800px) {
  /* Stacked layouts need a clear handoff, not desktop-sized empty screens. */
  .section-intro, .practice-intro-grid, .practice-editorial,
  .home-synthesis, .home-origin, .story-heading, .story-stage,
  .explorer-intro, .decision-result, .family-introduction,
  .people-lenses, .booklet-story, .confidentiality-content { row-gap: 2rem; }
  .tier-tab { padding: 1.5rem 1rem; }
  .tier-panel { gap: 2rem; }
  .practice-route { row-gap: 1rem; }
  .pricing-page-intro { padding-top: 3rem; }
  .scenario-connections { row-gap: 2.5rem; }
  #assessments, #organizational-map, #working-guides { row-gap: 3rem; }
  .scenario-breakdown .scenario-connections { grid-template-columns: 1fr; gap: 2.5rem; }
  .workload-savings { grid-template-columns: 1fr; }
  .guide-intro { row-gap: 2rem; }
}

@media screen and (max-width: 560px) {
  .savings-totals { grid-template-columns: 1fr; gap: 2.5rem; }
}