/* ==========================================================================
   GSP Capital - Portfolio Map (Our Companies page)
   Uses the site's design tokens (variables.css). Every class is prefixed
   "pm-" and everything lives inside .pmap, so nothing else on the site is
   affected.
   ========================================================================== */

.pmap { --pm-ease: cubic-bezier(.3, .7, .3, 1); }
.pmap[hidden] { display: none; }
.pmap button { font: inherit; color: inherit; cursor: pointer; }
.pmap .pm-head { margin-bottom: var(--spacing-lg); }
.pmap .pm-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ---- stage (the map) ---- */
.pm-stage { position: relative; height: 62vw; min-height: 250px; max-height: 420px; overflow: hidden; scroll-margin-top: 96px; border: 1px solid rgba(243, 112, 33, .2); border-radius: var(--radius-xl); background: linear-gradient(135deg, #3a1e12 0%, #1a0f0a 60%, #0a0a1a 100%); }
@media (min-width: 900px) { .pm-stage { height: 600px; max-height: none; } }
.pm-svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.pm-land { fill: rgba(243, 112, 33, .05); stroke: rgba(243, 112, 33, .62); stroke-width: 1; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: opacity .4s ease; }
.pm-borders { fill: none; stroke: rgba(243, 112, 33, .2); stroke-width: .7; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: opacity .4s ease; }
.pm-stage.is-focused .pm-land, .pm-stage.is-focused .pm-borders { opacity: .55; }

.pm-back { position: absolute; top: 12px; left: 12px; z-index: 6; min-height: 44px; padding: 0 18px; border: 1px solid var(--color-accent-ghost); border-radius: var(--radius-full); background: rgba(26, 15, 10, .78); font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--color-gray-300); transition: border-color .2s, color .2s, background .2s; }
.pm-back:hover { border-color: var(--color-accent); color: #fff; background: rgba(26, 15, 10, .92); }
.pm-back[hidden] { display: none; }

/* ---- pins ---- */
.pm-pins { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.pm-pin { position: absolute; left: 0; top: 0; width: 34px; height: 34px; margin: -17px 0 0 -17px; padding: 0; border: 0; border-radius: 50%; background: transparent; pointer-events: auto; will-change: transform; transition: opacity .3s ease, visibility 0s; }
.pm-pin.is-away { opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .3s ease, visibility 0s linear .3s; }
.pm-pin__ring { position: absolute; left: 50%; top: 50%; width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; border: 1px solid rgba(243, 112, 33, .65); animation: pm-pulse 2.8s ease-out infinite; }
.pm-pin__dot { position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 0 3px rgba(26, 15, 10, .9); transition: transform .2s var(--pm-ease); }
.pm-pin:hover .pm-pin__dot { transform: scale(1.35); }
@keyframes pm-pulse { 0% { transform: scale(.6); opacity: .85; } 100% { transform: scale(2.1); opacity: 0; } }
.pm-pin__label { position: absolute; white-space: nowrap; font-size: .6875rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .88); text-shadow: 0 0 6px #1a0f0a, 0 0 2px #1a0f0a; transition: opacity .2s; pointer-events: none; }
.pm-pin:hover .pm-pin__label { color: var(--color-accent-light); }
.pm-pin[data-lab="nw"] .pm-pin__label { right: calc(50% + 10px); bottom: calc(50% + 3px); }
.pm-pin[data-lab="sw"] .pm-pin__label { right: calc(50% + 10px); top: calc(50% + 3px); }
.pm-pin[data-lab="s"] .pm-pin__label { left: 50%; top: calc(50% + 12px); transform: translateX(-50%); }
.pm-pin[data-lab="e"] .pm-pin__label { left: calc(50% + 12px); top: 50%; transform: translateY(-50%); }
.pm-pin[data-lab="n"] .pm-pin__label { left: 50%; bottom: calc(50% + 12px); transform: translateX(-50%); }
@media (max-width: 899.98px) { .pm-pin__label { font-size: .5625rem; letter-spacing: .1em; } }
/* On small phones the map is a decorative picture and the pins sit too close for labels; the chips below carry the names */
@media (max-width: 539.98px) { .pm-pin__label { display: none; } }

.pm-pin__hub { position: absolute; left: 50%; top: 50%; width: 68px; height: 68px; margin: -34px 0 0 -34px; border-radius: 50%; background: var(--color-primary-dark); border: 1.5px solid rgba(243, 112, 33, .55); display: grid; place-content: center; justify-items: center; text-align: center; transform: scale(0); opacity: 0; transition: transform .45s cubic-bezier(.34, 1.56, .64, 1), opacity .2s ease; }
.pm-pin__hub::before { content: ""; position: absolute; inset: -7px; border-radius: 50%; border: 1px solid rgba(243, 112, 33, .25); }
.pm-pin__hub b { font-family: var(--font-heading); font-weight: 700; font-size: .875rem; line-height: 1.15; color: var(--color-accent); max-width: 56px; }
.pm-pin[data-hub="true"] .pm-pin__hub { transform: scale(1); opacity: 1; }
.pm-pin[data-hub="true"] .pm-pin__dot, .pm-pin[data-hub="true"] .pm-pin__ring, .pm-pin[aria-expanded="true"] .pm-pin__label { opacity: 0; animation: none; }
.pm-pin:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.pm-pin[data-hub="true"]:focus-visible { outline: none; }
.pm-pin[data-hub="true"]:focus-visible .pm-pin__hub { box-shadow: 0 0 0 3px var(--color-accent); }

/* ---- fan: companies around the selected pin (same look as the hero wheel) ---- */
.pm-fan { position: absolute; left: 50%; top: 50%; width: 0; height: 0; z-index: 2; pointer-events: none; }
.pm-orbit { position: absolute; border-radius: 50%; border: 1px dashed rgba(243, 112, 33, .16); opacity: 0; transition: opacity .5s ease; }
.pm-fan.is-open .pm-orbit { opacity: 1; }
.pm-spoke { position: absolute; left: 0; top: 0; height: 1px; transform-origin: 0 0; }
.pm-spoke i { display: block; width: 100%; height: 1px; background: rgba(243, 112, 33, .42); transform: scaleX(0); transform-origin: 0 50%; transition: transform .45s ease var(--d, 0ms); }
.pm-fan.is-open .pm-spoke i { transform: scaleX(1); }
.pm-node { position: absolute; left: 0; top: 0; width: 44px; height: 44px; margin: -22px 0 0 -22px; padding: 0; border: 0; background: transparent; pointer-events: auto; opacity: 0; transform: translate(var(--x), var(--y)) scale(0); transition: transform .42s cubic-bezier(.34, 1.56, .64, 1) var(--d2, 0ms), opacity .2s ease var(--d2, 0ms); }
.pm-fan.is-open .pm-node { opacity: 1; transform: translate(var(--x), var(--y)) scale(1); }
.pm-node__c { position: absolute; inset: 0; border-radius: 50%; background: var(--color-primary-dark); border: 1px solid rgba(243, 112, 33, .45); transition: border-color .2s, background .2s, box-shadow .2s; }
.pm-node__c::after { content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: var(--color-accent); opacity: .85; }
.pm-node:hover .pm-node__c { border-color: rgba(243, 112, 33, .95); background: #2a1a12; }
.pm-node[aria-pressed="true"] .pm-node__c { border-color: var(--color-accent); background: #3a1e12; box-shadow: 0 0 0 4px var(--color-accent-subtle); }
.pm-node:focus-visible { outline: none; }
.pm-node:focus-visible .pm-node__c { outline: 2px solid var(--color-accent); outline-offset: 3px; }
.pm-node__l { position: absolute; display: block; width: 172px; text-shadow: 0 0 8px #1a0f0a, 0 0 3px #1a0f0a; }
.pm-node__l.is-r { left: calc(100% + 12px); top: 50%; transform: translateY(-50%); text-align: left; }
.pm-node__l.is-l { right: calc(100% + 12px); top: 50%; transform: translateY(-50%); text-align: right; }
.pm-node__l.is-t { bottom: calc(100% + 8px); left: 50%; margin-left: -86px; text-align: center; }
.pm-node__l.is-b { top: calc(100% + 8px); left: 50%; margin-left: -86px; text-align: center; }
.pm-node__n { display: block; font-family: var(--font-heading); font-weight: 700; font-size: .8125rem; line-height: 1.3; color: #fff; }
.pm-node:hover .pm-node__n { color: var(--color-accent-light); }
.pm-node__s { display: block; margin-top: 2px; font-size: .625rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; line-height: 1.3; color: rgba(255, 255, 255, .55); }

/* ---- region chips ---- */
.pm-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 22px 0 0; padding: 0; }
.pm-chip { min-height: 44px; padding: 0 20px; border: 1px solid var(--color-accent-ghost); border-radius: var(--radius-full); background: rgba(26, 15, 10, .6); font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--color-gray-300); transition: background .25s var(--pm-ease), color .25s var(--pm-ease), border-color .25s var(--pm-ease); }
.pm-chip span { margin-left: 8px; font-weight: 500; opacity: .7; }
.pm-chip:hover { color: #fff; border-color: var(--color-accent); }
.pm-chip[aria-pressed="true"] { background: var(--color-accent); border-color: var(--color-accent); color: #fff; }
.pm-chip:focus-visible, .pm-back:focus-visible, .pm-row:focus-visible, .pm-sheet__close:focus-visible, .pm-sheet__back:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.pmap .pm-sub { text-align: center; margin: 14px 0 0; color: var(--color-gray-400); font-size: .9375rem; }

/* ---- region list: bottom sheet on phones/tablets, inline card on desktop ---- */
.pm-sheet { background: var(--color-off-white); color: var(--color-gray-900); }
.pm-sheet__bar { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 8px; padding: 16px 0 10px; background: var(--color-off-white); border-bottom: 1px solid var(--color-gray-200); }
.pmap .pm-sheet__title { flex: 1; margin: 0; font-family: var(--font-heading); font-weight: 700; font-size: 1.125rem; line-height: 1.2; letter-spacing: 0; color: var(--color-gray-900); outline: none; }
.pm-sheet__title small { display: block; font-family: var(--font-body); font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--color-gray-500); margin-top: 3px; }
.pm-sheet__close, .pm-sheet__back { width: 44px; height: 44px; flex: none; border: 0; border-radius: 50%; background: var(--color-gray-100); color: var(--color-gray-700); font-size: 1.5rem; line-height: 1; display: grid; place-items: center; }
.pm-sheet__back { font-size: 1.25rem; }
.pm-sheet__close:hover, .pm-sheet__back:hover { background: var(--color-gray-200); }
.pm-sheet__back[hidden] { display: none; }
.pm-sheet__list { list-style: none; margin: 0; padding: 0; }
.pm-sheet[data-view="detail"] .pm-sheet__list { display: none; }
.pm-row { width: 100%; min-height: 56px; text-align: left; display: flex; flex-direction: column; gap: 2px; margin-top: 10px; padding: 10px 14px; background: #fff; border: 1px solid var(--color-gray-200); border-radius: var(--radius-lg); color: var(--color-gray-900); transition: border-color .2s, background .2s; }
.pm-row:hover { border-color: var(--color-accent); }
.pm-row[aria-pressed="true"] { border-color: var(--color-accent); background: var(--color-accent-subtle); }
.pm-row__n { font-family: var(--font-heading); font-weight: 700; font-size: .9375rem; line-height: 1.3; }
.pm-row__s { font-size: .75rem; color: var(--color-gray-500); letter-spacing: .04em; }

@media (max-width: 899.98px) {
  .pm-sheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; max-height: 58vh; max-height: 58dvh; overflow-y: auto; overscroll-behavior: contain; border-radius: 16px 16px 0 0; box-shadow: 0 -10px 30px rgba(0, 0, 0, .4); padding: 0 16px calc(16px + env(safe-area-inset-bottom)); transform: translateY(105%); visibility: hidden; transition: transform .35s var(--pm-ease), visibility 0s linear .35s; }
  .pm-sheet.is-open { transform: none; visibility: visible; transition: transform .35s var(--pm-ease), visibility 0s; }
  .pm-sheet__bar::before { content: ""; position: absolute; top: 6px; left: 50%; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: var(--color-gray-200); }
  .pm-sheet .pm-detail { margin: 14px 0 0; max-width: none; border-radius: 0; box-shadow: none; padding: 0; background: transparent; animation: none; }
  .pm-sheet .pm-detail__close { display: none; }
  .pmap .pm-sheet .pm-detail__title { margin-right: 0; }
}
@media (min-width: 900px) {
  .pm-sheet { display: none; margin: 28px auto 0; max-width: 760px; border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); padding: 0 24px 20px; }
  .pm-sheet.is-open { display: block; }
  .pm-sheet__bar { padding-top: 18px; }
}

/* ---- company details card (matches the site's card + team pop-up look) ---- */
.pm-detail { margin: 36px auto 0; max-width: 760px; background: var(--color-off-white); color: var(--color-gray-900); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); padding: 28px 28px 26px; position: relative; scroll-margin: 96px 0 24px; animation: pm-rise .35s var(--pm-ease); }
.pm-detail[hidden] { display: none; }
@keyframes pm-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.pm-detail__label { font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--color-accent-dark); }
.pmap .pm-detail__title { font-family: var(--font-heading); font-weight: 700; font-size: 1.5rem; line-height: 1.2; letter-spacing: 0; margin: 6px 40px 12px 0; color: var(--color-gray-900); outline: none; }
.pmap .pm-detail__desc { margin: 0 0 18px; color: var(--color-gray-700); font-size: 1.0625rem; line-height: 1.6; }
.pm-detail__meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px 24px; margin: 0 0 22px; padding: 16px 0 0; border-top: 1px solid var(--color-gray-200); }
.pm-detail__meta dt { font-size: .6875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--color-gray-500); }
.pm-detail__meta dd { margin: 2px 0 0; font-weight: 500; }
.pm-badge { display: inline-block; padding: 3px 12px; border-radius: var(--radius-full); border: 1px solid var(--color-accent); background: var(--color-accent-subtle); color: var(--color-accent-dark); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.pm-detail__link { display: inline-block; padding: 10px 20px; border: 2px solid var(--color-accent); border-radius: var(--radius-lg); color: var(--color-accent-dark); font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; transition: background .2s, color .2s; }
.pm-detail__link:hover { background: var(--color-accent); color: #fff; }
.pm-detail__link[hidden] { display: none; }
.pm-detail__close { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--color-gray-100); font-size: 1.5rem; line-height: 1; color: var(--color-gray-700); }
.pm-detail__close:hover { background: var(--color-gray-200); }
.pm-detail__close:focus-visible, .pm-detail__link:focus-visible { outline: 2px solid var(--color-accent-dark); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .pmap *, .pmap *::before, .pmap *::after { transition-duration: .01ms !important; transition-delay: 0s !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .pm-pin__ring { display: none; }
}

/* Headquarters line shown under a company's location in the map detail card */
.pm-detail__hq { display: block; margin-top: 2px; font-size: .8125rem; font-weight: 400; color: var(--color-gray-500); }