/* The journey closes in the dark; the inventory opens on a paper-like surface. */
.journey { padding-bottom: 0; }
.journey-ending {
  max-width: 880px;
  margin: 0 auto;
  padding: 3rem 0 2rem;
  background: #040404;
  color: #f2f2f2;
}
.journey-ending .journey-eyebrow, .journey-ending h2 { color: #e8c95b; }
.journey-ending > p:last-child { color: #c4c4c8; }
.overlay-story {
  position: relative;
  z-index: 2;
  background: #f4f0e7;
  border-radius: 50% 50% 0 0 / 3rem 3rem 0 0;
  color: #222c29;
  color-scheme: light;
  padding: 4rem 1.5rem 5rem;
  font-size: 1.05rem;
  line-height: 1.8;
}
.overlay-container { max-width: 1180px; margin: auto; }
.overlay-story a { color: #29564e; text-underline-offset: .22em; }
.overlay-story a:hover { text-decoration-thickness: .15em; }
.overlay-story a:focus-visible { outline: 3px solid #29564e; outline-offset: 5px; border-radius: 2px; }
.overlay-story :is(section, aside) { scroll-margin-top: 2rem; }
.overlay-story :is(h2, h3, h4) { font-family: 'Assistant', sans-serif; line-height: 1.08; text-wrap: balance; }
.overlay-story h2 { font-size: 4rem; margin: 0 0 1.5rem; }
.overlay-story h3 { font-size: clamp(2.1rem, 4vw, 3.5rem); margin: 0; }
.overlay-story h4 { font-size: 1.8rem; margin: 0 0 1.2rem; }
.overlay-kicker { color: #526259; font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; margin: 0 0 .3rem; }
.overlay-intro { max-width: 800px; text-align: center; margin: 2rem auto 3rem; }
.overlay-intro > p:last-child { font-size: 1.2rem; }
.overlay-index { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #bcbeb3; border-bottom: 1px solid #bcbeb3; }
.overlay-index a { padding: 1.3rem 1rem; text-decoration: none; font-size: .95rem; }
.overlay-index a:hover { background: #e6e8de; }
.overlay-index span:not(.sr-only) { display: block; font-family: 'Assistant', sans-serif; font-size: 1.6rem; font-weight: 800; }
.overlay-chapter { padding: 5rem 0; border-bottom: 1px solid #bcbeb3; }
.overlay-chapter-heading { display: flex; gap: 1.5rem; align-items: flex-start; margin-bottom: 3rem; }
.overlay-number { font-family: 'Assistant', sans-serif; font-size: 2rem; font-weight: 800; display: grid; place-items: center; width: 4rem; height: 4rem; flex: 0 0 4rem; border: 1px solid #738176; border-radius: 50%; }
.inventory-closing-note { margin: .5rem 0 0; }
.overlay-lead { max-width: 780px; margin: -1rem 0 2.5rem; }
.overlay-research { padding: clamp(1.5rem, 4vw, 3rem); background: #e4e8dd; border-radius: .7rem; }
.overlay-research h4 { max-width: 700px; font-size: 2.2rem; }
.overlay-research-limit { font-size: .95rem; color: #4e5d51; }
.overlay-references { padding-top: 3rem; max-width: 900px; }
.overlay-references h3 { font-size: 2rem; }
.overlay-references > p, .overlay-references li { font-size: .95rem; }
.overlay-references ol { padding-left: 1.5rem; }
.overlay-references li { margin-bottom: .2rem; padding-left: .4rem; }
.overlay-external { font-size: 1rem; vertical-align: middle; margin-left: .3rem; }
@media (max-width: 767px) {
  .journey-ending { padding: 2rem 0 1.5rem; }
  .overlay-story { padding: 2rem 1.25rem 3rem; border-radius: 50% 50% 0 0 / 1.5rem 1.5rem 0 0; }
  .overlay-index { grid-template-columns: 1fr 1fr; }
  .overlay-index a { padding: 1rem .5rem; }
  .overlay-chapter { padding: 3rem 0; }
  .overlay-chapter-heading { gap: 1rem; margin-bottom: 2rem; }
  .overlay-number { width: 3rem; height: 3rem; flex-basis: 3rem; font-size: 1.5rem; }
}
@media print {
  .overlay-story, .journey-ending { background: white; color: black; }
  .overlay-index { display: none; }
  .overlay-chapter { break-inside: avoid; padding: 2rem 0; }
}

/* Comparison inventory: visible without scripting, optional category filter. */
.inventory-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin: 2rem 0 1rem; }
.inventory-controls[hidden], .overlay-comparison tr[hidden] { display: none; }
.inventory-controls label { font-weight: 600; }
.inventory-controls select { max-width: 100%; min-height: 48px; padding: .6rem 2rem .6rem .8rem; font: inherit; font-size: 1rem; color: #222c29; background: #fffdf8; border: 1px solid #677b6b; border-radius: .3rem; }
.inventory-controls select:focus-visible { outline: 3px solid #29564e; outline-offset: 4px; }
.inventory-controls p { margin: 0; font-size: .95rem; }
.overlay-comparison { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 1.1rem; line-height: 1.65; }
.overlay-comparison caption { text-align: left; font-weight: 700; padding: 1rem 0; }
.overlay-comparison th, .overlay-comparison td { text-align: left; vertical-align: top; padding: 1.5rem; border-bottom: 1px solid #bdc4b7; overflow-wrap: anywhere; }
.overlay-comparison thead { background: #315b4f; color: white; }
.overlay-comparison th:first-child { width: 28%; }
.overlay-comparison tbody th { background: #e6e9df; }
.overlay-comparison tbody td { background: #fffdf8; }
.overlay-comparison td p { margin: 0 0 .75rem; }
.overlay-comparison td a { font-size: 1.1rem; }
.inventory-category { display: block; width: fit-content; margin-top: .8rem; padding: .25rem .6rem; font-size: 1.1rem; line-height: 1.45; font-weight: 500; border: 1px solid #788777; border-radius: .3rem; background: #f6f8f1; }
.inventory-category-parcial { background: #f7ebcd; border-color: #998152; }
.inventory-category-significativa { background: #e2eaf0; border-color: #718596; }
.inventory-category-especializada { background: #eee3ed; border-color: #9a7995; }
.comparison-mobile-label { display: none; }
.comparison-source { font-size: .95rem; }
@media (max-width: 900px) {
  .overlay-comparison th, .overlay-comparison td { padding: 1rem; }
}
@media (max-width: 767px) {
  .overlay-comparison, .overlay-comparison tbody { display: block; }
  .overlay-comparison caption { display: block; }
  .overlay-comparison thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .overlay-comparison tbody tr { display: block; margin-bottom: 1.5rem; border: 1px solid #bdc4b7; }
  .overlay-comparison tbody th, .overlay-comparison tbody td { display: block; width: auto; }
  .overlay-comparison tbody th:first-child { width: 100%; }
  .overlay-comparison tbody td:last-child { border-bottom: 0; }
  .inventory-table tbody tr:last-child { margin-bottom: 0; }
  .comparison-mobile-label { display: block; font-weight: 700; font-size: 1.1rem; margin-bottom: .5rem; }
  .inventory-controls { align-items: stretch; flex-direction: column; gap: .7rem; }
}
@media print {
  .inventory-controls { display: none; }
  .overlay-comparison tr[hidden] { display: table-row; }
  .overlay-comparison tr { break-inside: avoid; }
}

/* Shared title scale and emphasis for the inventory introduction. */
.overlay-chapter-heading h3 { font-size: 4rem; }
.overlay-chapter-heading > div { min-width: 0; }
.inventory-introduction { padding: 1.5rem; border-left: 4px solid #315b4f; background: #e4e8dd; font-weight: 700; }
@media (max-width: 767px) {
  .overlay-story h2, .overlay-chapter-heading h3 { font-size: clamp(2.1rem, 8vw, 4rem); overflow-wrap: anywhere; }
}

/* An explanatory sequence, not a set of navigation controls. */


/* Company references in three highlighted panels. */
.company-examples { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.company-example { padding: 2rem; background: #fffdf8; border: 1px dashed #788777; border-radius: .6rem; }
.company-example h4 { font-size: 2.4rem; margin-bottom: 1.5rem; }
.company-example ul { list-style: none; margin: 0; padding: 0; }
.company-example li { margin-top: .3rem; overflow-wrap: anywhere; }
.company-example a { display: inline-block; padding-block: .25rem; }
@media (max-width: 767px) {
  .company-examples { grid-template-columns: 1fr; }
  .company-example { padding: 1.5rem; }
}

/* Institutional statements following the company examples. */
.overlay-story .institution-heading { margin: 3rem 0 1.5rem; font-size: 1.75rem; line-height: 1.35; }
.institution-example { min-width: 0; }
.institution-example h5 { margin: 0 0 1rem; font-size: 1.8rem; line-height: 1.3; overflow-wrap: anywhere; }
.institution-example p { font-size: 1.1rem; }
.institution-example .institution-link { margin-bottom: 0; }
.institution-followup { margin-top: 2rem; }

/* Interactive cognitive-effort map; native disclosures also work without JS. */
.effort-sequence { margin: 3rem 0; }
.effort-sequence > p { max-width: 52rem; color: #505951; }
.effort-sequence .effort-instruction { font-size: .95rem; }
.effort-map { position: relative; display: grid; grid-template-columns: 18rem minmax(0, 1fr); gap: 4rem; align-items: center; padding: 2rem 0; isolation: isolate; }
.effort-connections { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; overflow: visible; }
.effort-connections line { stroke: #84958a; stroke-width: 1.5; }
.effort-connections line.is-active { stroke: #315b4f; stroke-width: 3; }
.effort-hub { display: grid; place-items: center; width: 18rem; min-height: 18rem; aspect-ratio: 1; padding: 2rem; border-radius: 50%; background: #243e36; color: #fff; border: 2px solid #243e36; }
.effort-hub h4 { margin: 0; text-align: center; font-size: 1.85rem; line-height: 1.15; }
.effort-branches { display: grid; gap: 1.25rem; list-style: none; padding: 0; margin: 0; min-width: 0; }
.effort-branch { --orb-color: #dbe8d5; padding: 0; margin: 0 2rem 0 0; min-width: 0; }
.effort-branch:nth-child(2) { --orb-color: #cce5df; margin-left: 2rem; }
.effort-branch:nth-child(3) { --orb-color: #eedb9b; margin-left: 3rem; }
.effort-branch:nth-child(4) { --orb-color: #ecd4bd; margin-left: 2rem; }
.effort-branch:nth-child(5) { --orb-color: #ded9e9; }
.effort-step summary { display: grid; grid-template-columns: 5rem minmax(0, 1fr) 1.5rem; gap: 1rem; align-items: center; list-style: none; cursor: pointer; border-radius: .6rem; }
.effort-step summary::-webkit-details-marker { display: none; }
.effort-step summary:focus-visible { outline: 3px solid #244b3d; outline-offset: 7px; }
.effort-orb { position: relative; display: grid; place-items: center; width: 5rem; height: 5rem; border-radius: 50%; background: var(--orb-color); color: #243e36; border: 2px solid #52675b; }
.effort-orb > .material-symbols-outlined { font-size: 2rem; }
.effort-number { position: absolute; right: -.3rem; bottom: -.15rem; display: grid; place-items: center; min-width: 1.7rem; height: 1.7rem; padding: .1rem; border-radius: 50%; background: #243e36; color: #fff; font: 700 .9rem/1 'Assistant', sans-serif; }
.effort-copy { display: grid; gap: .3rem; }
.effort-copy strong { font: 700 1.4rem/1.15 'Assistant', sans-serif; }
.effort-copy > span { font-size: .95rem; line-height: 1.6; color: #414d45; }
.effort-toggle { color: #315b4f; font-size: 1.5rem; }
.effort-step summary:hover .effort-orb, .effort-step[open] .effort-orb { border-color: #243e36; box-shadow: 0 0 0 4px #f4f0e7, 0 0 0 6px #52675b; }
.effort-step[open] .effort-toggle { transform: rotate(45deg); }
.effort-branch:has(.effort-step[open]) { transform: translateX(1.5rem); }
.effort-example { margin: 1rem 0 .5rem 6rem; padding: 1.2rem 1.4rem; border: 1px solid #85958a; border-left: 4px solid #315b4f; border-radius: .3rem .8rem .8rem .3rem; background: #fffdf7; color: #243e36; }
.effort-example p { margin: 0; font-size: 1rem; line-height: 1.7; }
.effort-example .effort-example-label { margin-bottom: .45rem; font-size: .9rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
@media (prefers-reduced-motion: no-preference) {
  html:not(:has(.motion-toggle[aria-pressed="true"])) .effort-branch { transition: transform .3s ease; }
}
@media (max-width: 1000px) {
  .effort-map { grid-template-columns: 14rem minmax(0, 1fr); gap: 2rem; }
  .effort-hub { width: 14rem; min-height: 14rem; padding: 1.5rem; }
  .effort-hub h4 { font-size: 1.5rem; }
  .effort-branch:nth-child(n) { margin-left: 0; }
  .effort-example { margin-left: 0; }
}
@media (max-width: 700px) {
  .effort-map { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; padding: 1rem 0; }
  .effort-hub { justify-self: center; width: 16rem; min-height: 16rem; max-width: 100%; }
  .effort-hub h4 { font-size: 1.65rem; }
  .effort-connections { display: none; }
  .effort-branches { gap: 1.5rem; border-left: 2px solid #84958a; padding-left: 1rem; }
  .effort-branch:nth-child(n) { margin: 0 .5rem 0 0; }
  .effort-step summary { grid-template-columns: 3.5rem minmax(0, 1fr) 1.2rem; gap: .7rem; }
  .effort-orb { width: 3.5rem; height: 3.5rem; }
  .effort-orb > .material-symbols-outlined { font-size: 1.7rem; }
  .effort-copy strong { font-size: 1.25rem; }
  .effort-branch:has(.effort-step[open]) { transform: translateX(.35rem); }
  .effort-example { padding: 1rem; }
}
@media print {
  .effort-map { display: block; }
  .effort-hub { margin: 0 auto 2rem; }
  .effort-connections { display: none; }
  .effort-branch:nth-child(n) { margin: 0; transform: none; break-inside: avoid; }
  .effort-step::details-content { content-visibility: visible; }
  .effort-example { display: block; }
}

/* Documentation continues the inventory, with a distinct yellow palette. */
.inventory-documentation { margin-top: 3rem; }
.documentation-table caption { padding: 1.5rem 0; }
.documentation-table caption h4 { margin: 0; max-width: 52rem; font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.2; }
.documentation-table thead { background: #e8c95b; color: #30270e; }
.documentation-table tbody th { background: #f4e5ad; color: #30270e; }
.documentation-table tbody td { background: #fff9e5; color: #30270e; }
.documentation-table th, .documentation-table td { border-color: #c8b66e; }
.documentation-table th:first-child { width: 26%; }
.documentation-table thead th:nth-child(2) { width: 31%; }
.documentation-table a { color: #5c4309; }
.documentation-table a:focus-visible { outline-color: #5c4309; }
.documentation-links { padding-left: 1.2rem; margin: 0; }
.documentation-links li + li { margin-top: 1rem; }
.documentation-note { font-size: .95rem; max-width: 60rem; color: #554b2e; }
@media (max-width: 767px) {
  .documentation-table tbody tr { border-color: #c8b66e; }
  .documentation-table thead th:nth-child(2) { width: auto; }
}
