/* Whole Picture interaction language — Release 4.21.0
   Small navy corner arrow = open another page.
   Heavy gold arrow between boxes = follow the story flow.
   Plus/minus = expand or close on this page.
   Flat boxes without these cues = information only. */

:root {
  --wp-action-navy: #112f4b;
  --wp-action-hover: #eef6fa;
  --wp-action-focus: #d49a2f;
  --wp-flow-gold: #b58a3d;
}

/* Full-card destinations. Keep this list limited to containers that truly lead somewhere. */
a.card,
.featured-grid > a,
.related-links > a,
.next-paths > a,
.continue-grid > a,
.next-view-links > a,
.more-links > a,
.doors > a,
.library-actions > a,
.evidence-room-grid > a,
.location-card > a,
a.explore-link,
a.next-door,
a.prior-link {
  position: relative !important;
  padding-right: 3.25rem !important;
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

a.card::before,
.featured-grid > a::before,
.related-links > a::before,
.next-paths > a::before,
.continue-grid > a::before,
.next-view-links > a::before,
.more-links > a::before,
.doors > a::before,
.library-actions > a::before,
.evidence-room-grid > a::before,
.location-card > a::before,
a.explore-link::before,
a.next-door::before,
a.prior-link::before {
  content: "↗" !important;
  position: absolute !important;
  top: .65rem !important;
  right: .7rem !important;
  width: 1.7rem !important;
  height: 1.7rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: var(--wp-action-navy) !important;
  color: #fff !important;
  font: 800 .82rem/1 system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  transform: none !important;
  box-shadow: none !important;
  pointer-events: none;
}

a.card:hover,
.featured-grid > a:hover,
.related-links > a:hover,
.next-paths > a:hover,
.continue-grid > a:hover,
.next-view-links > a:hover,
.more-links > a:hover,
.doors > a:hover,
.library-actions > a:hover,
.evidence-room-grid > a:hover,
.location-card > a:hover,
a.explore-link:hover,
a.next-door:hover,
a.prior-link:hover {
  background-color: var(--wp-action-hover) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(17, 47, 75, .15);
}

/* Clickable boxes that also participate in a visible flow retain both meanings. */
.map-line > a,
.connection > a,
.loopline > a,
.hierarchy > a {
  position: relative !important;
  padding-right: 3.15rem !important;
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.map-line > a::before,
.connection > a::before,
.loopline > a::before,
.hierarchy > a::before {
  content: "↗" !important;
  position: absolute !important;
  top: .65rem !important;
  right: .7rem !important;
  width: 1.7rem !important;
  height: 1.7rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: var(--wp-action-navy) !important;
  color: #fff !important;
  font: 800 .82rem/1 system-ui, sans-serif !important;
  transform: none !important;
  pointer-events: none;
}

.map-line > a:hover,
.connection > a:hover,
.loopline > a:hover,
.hierarchy > a:hover {
  background-color: var(--wp-action-hover) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(17, 47, 75, .15);
}

.map-line > a:focus-visible,
.connection > a:focus-visible,
.loopline > a:focus-visible,
.hierarchy > a:focus-visible {
  outline: 4px solid var(--wp-action-focus) !important;
  outline-offset: 3px !important;
}

a.card:focus-visible,
.featured-grid > a:focus-visible,
.related-links > a:focus-visible,
.next-paths > a:focus-visible,
.continue-grid > a:focus-visible,
.next-view-links > a:focus-visible,
.more-links > a:focus-visible,
.doors > a:focus-visible,
.library-actions > a:focus-visible,
.evidence-room-grid > a:focus-visible,
.location-card > a:focus-visible,
a.explore-link:focus-visible,
a.next-door:focus-visible,
a.prior-link:focus-visible {
  outline: 4px solid var(--wp-action-focus) !important;
  outline-offset: 3px !important;
}

/* A selected dark card keeps its contrast while retaining the same click cue. */
a.card.primary::before {
  background: #fff !important;
  color: var(--wp-action-navy) !important;
}

a.card.primary:hover {
  background-color: #173e5f !important;
}

/* Flows are relationships, not click controls. They are larger, heavier, and gold. */
.map-line > a:not(:last-child)::after,
.connection > a:not(:last-child)::after,
.loopline > a:not(:last-child)::after,
.hierarchy > a:not(:last-child)::after {
  content: "➜" !important;
  position: absolute !important;
  top: 50% !important;
  right: -2.25rem !important;
  width: auto !important;
  height: auto !important;
  background: transparent !important;
  color: var(--wp-flow-gold) !important;
  font: 900 2.1rem/1 system-ui, sans-serif !important;
  transform: translateY(-52%) !important;
  text-shadow: 0 1px 0 #fff;
  pointer-events: none;
}

/* Expand-in-place controls. */
details > summary {
  position: relative;
  padding-right: 2.5rem !important;
  cursor: pointer;
}

details > summary::after {
  content: "+" !important;
  position: absolute !important;
  top: 50% !important;
  right: .65rem !important;
  width: 1.65rem !important;
  height: 1.65rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: #dfe9ee !important;
  color: var(--wp-action-navy) !important;
  font: 850 1.1rem/1 system-ui, sans-serif !important;
  transform: translateY(-50%) !important;
}

details[open] > summary::after {
  content: "−" !important;
}

details > summary:focus-visible {
  outline: 4px solid var(--wp-action-focus) !important;
  outline-offset: 3px !important;
}

/* Ordinary inline links remain visibly textual. */
main p a:not([class]),
main li a:not([class]),
footer a:not([class]) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

@media (max-width: 720px) {
  .map-line > a:not(:last-child)::after,
  .connection > a:not(:last-child)::after,
  .loopline > a:not(:last-child)::after,
  .hierarchy > a:not(:last-child)::after {
    content: "⬇" !important;
    top: auto !important;
    right: 50% !important;
    bottom: -2.2rem !important;
    transform: translateX(50%) !important;
    font-size: 1.8rem !important;
  }
}

/* Additional card patterns used by the report library, related stories, and evidence rooms. */
.catalog-grid > a,
.related > a,
a.question-chip,
.evidence-links > a,
.source-list > a,
.rail-group > a,
.boundary > a,
.reader-choice > a:not(.button) {
  position: relative !important;
  padding-right: 3.25rem !important;
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.catalog-grid > a::before,
.related > a::before,
a.question-chip::before,
.evidence-links > a::before,
.source-list > a::before,
.rail-group > a::before,
.boundary > a::before,
.reader-choice > a:not(.button)::before {
  content: "↗" !important;
  position: absolute !important;
  top: .65rem !important;
  right: .7rem !important;
  width: 1.7rem !important;
  height: 1.7rem !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: var(--wp-action-navy) !important;
  color: #fff !important;
  font: 800 .82rem/1 system-ui, sans-serif !important;
  transform: none !important;
  pointer-events: none;
}

.catalog-grid > a:hover,
.related > a:hover,
a.question-chip:hover,
.evidence-links > a:hover,
.source-list > a:hover,
.rail-group > a:hover,
.boundary > a:hover,
.reader-choice > a:not(.button):hover {
  background-color: var(--wp-action-hover) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(17, 47, 75, .15);
}

.catalog-grid > a:focus-visible,
.related > a:focus-visible,
a.question-chip:focus-visible,
.evidence-links > a:focus-visible,
.source-list > a:focus-visible,
.rail-group > a:focus-visible,
.boundary > a:focus-visible,
.reader-choice > a:not(.button):focus-visible {
  outline: 4px solid var(--wp-action-focus) !important;
  outline-offset: 3px !important;
}

/* Non-clickable process diagrams: keep their connectors visually distinct from click arrows. */
.path > div:not(:last-child)::after,
.path > .step:not(:last-child)::after,
.step:nth-child(-n+4)::after,
.step:nth-child(n+6):not(:last-child)::after {
  color: var(--wp-flow-gold) !important;
  font-size: 2rem !important;
  font-weight: 950 !important;
  text-shadow: 0 1px 0 #fff;
}

@media (max-width: 720px) {
  .path > div:not(:last-child)::after,
  .path > .step:not(:last-child)::after,
  .step:nth-child(-n+4)::after,
  .step:nth-child(n+6):not(:last-child)::after {
    font-size: 1.75rem !important;
  }
}