.pch-wrap{
  width:100%;
  margin-left:0;
  margin-right:0;
  box-sizing:border-box;
  clear:both;
}
.pch-wrap *{box-sizing:border-box}
.pch-grid{
  display:grid;
  grid-template-columns:repeat(var(--pch-cols-m,1),minmax(0,1fr));
  grid-auto-rows:minmax(var(--pch-row-h,auto),auto);
  grid-auto-flow:row;
  align-items:stretch;
  justify-items:stretch;
  justify-content:stretch;
  gap:var(--pch-gap,20px);
  width:100%;
  max-width:100%;
  color:var(--pch-text,#0b2545);
  background:var(--pch-grid-bg,transparent);
  padding:var(--pch-pad,0);
  box-sizing:border-box;
  margin:0;
}
@media(min-width:640px){.pch-grid{grid-template-columns:repeat(var(--pch-cols-t,2),minmax(0,1fr))}}
@media(min-width:1024px){.pch-grid{grid-template-columns:repeat(var(--pch-cols-d,3),minmax(0,1fr))}}

/* Equalized mode uses flex rows so the first visible card always starts at the
   left edge and every row item has the same width/spacing. This prevents CSS
   grid auto-placement holes from older per-card span/order values. */
.pch-grid[data-equalize="1"]{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  justify-content:flex-start;
  align-content:flex-start;
  grid-template-columns:none;
  grid-template-rows:none !important;
  grid-auto-rows:auto;
  grid-auto-flow:initial;
}

.pch-grid.pch-divider{gap:0;border:var(--pch-bw,1px) solid var(--pch-bc,#111);background:var(--pch-bc,#111)}
.pch-grid.pch-divider .pch-card{border:0;outline:var(--pch-bw,1px) solid var(--pch-bc,#111);border-radius:0}

.pch-card{
  background:var(--pch-bg,#f3f4f6);
  border-radius:var(--pch-radius,12px);
  overflow:hidden;
  display:flex;flex-direction:column;
  border:var(--pch-bw,0) solid var(--pch-bc,transparent);
  min-height:var(--pch-min-h,auto);
  width:100%;
  height:100%;
  min-width:0;
  box-sizing:border-box;
  transition:transform .35s ease, box-shadow .35s ease;
  position:relative;
  align-self:stretch;
}
.pch-grid > .pch-card{
  grid-column:auto / span 1;
  grid-row:auto / span 1;
  max-width:none;
  margin:0;
}
.pch-grid[data-equalize="1"] > .pch-card{
  grid-column:auto / span 1 !important;
  grid-row:auto / span 1 !important;
  flex:0 0 var(--pch-cell-m,100%);
  width:var(--pch-cell-m,100%);
  max-width:var(--pch-cell-m,100%);
  min-height:var(--pch-row-h,auto);
  order:initial;
}
@media(min-width:640px){.pch-grid[data-equalize="1"] > .pch-card{flex-basis:var(--pch-cell-t,50%);width:var(--pch-cell-t,50%);max-width:var(--pch-cell-t,50%)}}
@media(min-width:1024px){.pch-grid[data-equalize="1"] > .pch-card{flex-basis:var(--pch-cell-d,33.333%);width:var(--pch-cell-d,33.333%);max-width:var(--pch-cell-d,33.333%)}}

/* Media — uniform aspect ratio + top alignment so all images line up across the row */
.pch-media{
  aspect-ratio:var(--pch-ratio,4/3);
  background:#e5e7eb;
  position:relative;
  overflow:hidden;
  cursor:default;
  flex:0 0 auto;
  width:100%;
  min-width:0;
  margin:0;
}
.pch-layout-overlay .pch-card{min-height:var(--pch-min-h,auto)}
.pch-layout-overlay .pch-media{height:100%;aspect-ratio:auto;min-height:var(--pch-min-h,260px);flex:1 1 auto}
.pch-grid[style*="--pch-img-h"] .pch-media{height:var(--pch-img-h);aspect-ratio:auto}
.pch-grid[style*="--pch-img-h: auto"] .pch-media{height:auto;aspect-ratio:var(--pch-ratio,4/3)}

.pch-grid[data-lightbox="1"] .pch-media[data-full]{cursor:zoom-in}
.pch-media img{
  width:var(--pch-img-w,100%);
  min-width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center top;
  display:block;
  margin:0 auto;
  transition:transform .5s ease;
}
.pch-empty{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#9ca3af;background:repeating-linear-gradient(45deg,#eef0f3,#eef0f3 10px,#e5e7eb 10px,#e5e7eb 20px)}

/* Body */
.pch-body{padding:18px;text-align:center;display:flex;flex-direction:column;gap:6px;flex:1 1 auto}
.pch-heading{
  margin:0 0 4px;color:var(--pch-accent,#0b2545);
  font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:1.05rem;
  display:flex;align-items:center;gap:10px;justify-content:center;
}
.pch-num{
  display:inline-grid;place-items:center;
  width:30px;height:30px;border-radius:50%;
  border:2px solid currentColor;font-size:.85rem;font-weight:700;
  flex:0 0 auto;
}
.pch-name{font-weight:700;font-size:1rem}
.pch-title{font-size:.95rem;opacity:.85}
.pch-position{font-size:.85rem;opacity:.7;font-style:italic}
.pch-profile{margin:8px 0 0;font-size:.9rem;line-height:1.5;opacity:.9}
.pch-link{
  margin-top:auto;display:inline-block;padding:10px 18px;
  background:var(--pch-accent,#0b2545);color:#fff;text-decoration:none;
  border-radius:6px;font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;
  align-self:center;margin-top:14px;
}
.pch-link:hover{opacity:.9;color:#fff}

/* Overlay */
.pch-layout-overlay .pch-overlay{
  position:absolute;left:0;right:0;bottom:0;padding:18px 20px;
  color:var(--pch-overlay-text,#fff);
  background:linear-gradient(to top, var(--pch-overlay-bg,rgba(0,0,0,.78)) 0%, rgba(0,0,0,.55) 60%, rgba(0,0,0,0) 100%);
  text-align:left;display:flex;flex-direction:column;gap:4px;
}
.pch-layout-overlay .pch-heading{color:var(--pch-overlay-text,#fff);justify-content:flex-start;font-size:1.15rem;letter-spacing:.03em}
.pch-layout-overlay .pch-num{border-color:var(--pch-overlay-text,#fff);color:var(--pch-overlay-text,#fff)}
.pch-layout-overlay .pch-name,
.pch-layout-overlay .pch-title,
.pch-layout-overlay .pch-position,
.pch-layout-overlay .pch-profile{color:var(--pch-overlay-text,#fff);opacity:.95}

/* Animations */
.pch-anim-lift .pch-card:hover{transform:translateY(-6px);box-shadow:0 16px 36px rgba(0,0,0,.15)}
.pch-anim-zoom .pch-card:hover .pch-media img{transform:scale(1.08)}
.pch-anim-pulse .pch-card:hover{animation:pchPulse 1.2s ease infinite}
@keyframes pchPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}

.pch-anim-fade .pch-card,
.pch-anim-slide .pch-card,
.pch-anim-flip .pch-card{
  opacity:0;animation-fill-mode:both;animation-duration:.7s;
  animation-timing-function:cubic-bezier(.2,.7,.2,1);
  animation-delay:var(--pch-anim-delay,0ms);
}
.pch-anim-fade .pch-card{animation-name:pchFade}
.pch-anim-slide .pch-card{animation-name:pchSlide}
.pch-anim-flip .pch-card{animation-name:pchFlip;transform-origin:top center}
@keyframes pchFade{0%{opacity:0;transform:translateY(12px)}100%{opacity:1;transform:none}}
@keyframes pchSlide{0%{opacity:0;transform:translateX(-24px)}100%{opacity:1;transform:none}}
@keyframes pchFlip{0%{opacity:0;transform:rotateX(-30deg)}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){
  .pch-anim-fade .pch-card,.pch-anim-slide .pch-card,.pch-anim-flip .pch-card{opacity:1 !important;animation:none !important;transform:none !important}
}
.pch-grid.pch-divider .pch-card:hover{transform:none;box-shadow:none}

/* Lightbox */
.pch-lb{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:99999;padding:24px}
.pch-lb.open{display:flex}
.pch-lb-dialog{background:#111;color:#fff;border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.6);max-width:95vw;max-height:95vh;display:flex;flex-direction:column;overflow:hidden;width:auto}
.pch-lb-bar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#1b1b1b;border-bottom:1px solid #2a2a2a;flex-wrap:wrap}
.pch-lb-title{flex:1;font-weight:600;font-size:.95rem;min-width:140px}
.pch-lb-btn{background:#2a2a2a;border:1px solid #333;color:#fff;border-radius:6px;padding:6px 10px;font-size:.85rem;cursor:pointer;line-height:1}
.pch-lb-btn:hover{background:#3a3a3a}
.pch-lb-input{width:70px;background:#0e0e0e;border:1px solid #333;color:#fff;border-radius:6px;padding:6px 8px;font-size:.85rem;text-align:center}
.pch-lb-close{background:transparent;border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer;padding:0 4px}
.pch-lb-stage{flex:1;overflow:auto;display:flex;align-items:center;justify-content:center;background:#000;padding:20px}
.pch-lb-stage img{display:block;transform-origin:center center;transition:width .25s ease, height .25s ease;max-width:none;max-height:none}

@media (max-width:640px){
  .pch-layout-overlay .pch-overlay{padding:12px 14px}
  .pch-layout-overlay .pch-heading{font-size:1rem}
  .pch-profile{font-size:.85rem}
  .pch-lb-title{font-size:.85rem}
}
