/* EPI Staff Organogram: bespoke CSS-drawn connector tree */

.org-hero {
  position: relative; height: 440px; overflow: hidden; background: var(--color-dark);
}
.org-hero-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .45;
}
.org-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(105deg, rgba(10,30,22,.93) 0%, rgba(10,30,22,.65) 52%, rgba(10,30,22,.2) 100%);
  display: flex; align-items: center;
}
.org-hero h1 {
  color: #fff; font-size: clamp(32px, 3.6vw, 54px); line-height: 1.1; margin: 0 0 16px;
  letter-spacing: -.025em; text-shadow: 0 2px 18px rgba(0,0,0,.24); max-width: 620px;
}
.org-hero p { color: rgba(255,255,255,.8); font-size: 17px; line-height: 1.65; margin: 0; max-width: 520px; }

.org-legend { display: flex; gap: 16px; flex-wrap: wrap; justify-content: center; align-items: center; }
.org-legend-item { display: flex; align-items: center; gap: 8px; }
.org-legend-swatch { width: 20px; height: 14px; border-radius: 4px; }
.org-legend-label { font-size: 12px; color: rgba(0,0,0,.6); }

.org-tree-scroll { overflow-x: auto; padding: 0 16px 24px; }
.org-tree-inner { min-width: max-content; padding: 0 40px; }

/* Connector-line tree */
.otree, .otree ul { list-style: none; padding: 0; margin: 0; }
.otree { display: flex; flex-direction: column; align-items: center; }
.otree ul { display: flex; flex-direction: row; align-items: flex-start; }
.otree li { display: flex; flex-direction: column; align-items: center; position: relative; padding: 20px 6px 0; }
.otree li::before {
  content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 2px; height: 20px; background: #7fbfb0;
}
.otree li::after { content: ''; position: absolute; top: 0; height: 2px; background: #7fbfb0; }
.otree li:not(:first-child):not(:last-child)::after { left: 0; right: 0; }
.otree li:first-child:not(:last-child)::after { left: 50%; right: 0; }
.otree li:last-child:not(:first-child)::after { left: 0; right: 50%; }
.otree li:only-child { padding-top: 0; }
.otree li:only-child::before, .otree li:only-child::after { display: none; }
.root-li { padding-top: 0 !important; }
.root-li::before, .root-li::after { display: none !important; }
.ov { width: 2px; background: #7fbfb0; margin: 0 auto; }

.onode { border-radius: 9px; padding: 8px 14px; font-size: 11.5px; font-weight: 700; text-align: center; line-height: 1.35; white-space: nowrap; }
.onode.n1 { background: var(--color-dark); color: #fff; min-width: 140px; }
.onode.n2 { background: var(--color-primary); color: #fff; min-width: 160px; font-size: 12.5px; }
.onode.n3 { background: var(--color-mid); color: #fff; }
.onode.nm { background: var(--color-mint); color: var(--color-dark); border: 1.5px solid #5fa898; }
.onode.nl { background: #fff; color: var(--color-dark); border: 1.5px solid #b8d4cc; font-size: 11px; font-weight: 600; }
.onode.nk { background: #edf7f4; color: var(--color-dark); border: 1.5px solid #9fd0c3; font-size: 11px; font-weight: 600; }
