/* =========================================================
   OUR PROJECTS PAGE  (new file - only used by projects.html)
   ========================================================= */

.pj-page { position: relative; overflow: hidden; padding: 50px 0 70px;
  background: linear-gradient(135deg,#f7f8f5 0%,#fff 55%,#eef3ef 100%); }
.pj-page::before { content:""; position:absolute; width:500px; height:500px; right:-180px; top:-180px; border-radius:50%;
  border:1px solid rgba(0,98,56,.08);
  box-shadow:0 0 0 50px rgba(0,98,56,.025),0 0 0 100px rgba(0,98,56,.02),0 0 0 150px rgba(0,98,56,.015); pointer-events:none; }
.pj-page .container { position: relative; z-index: 2; }

/* Jump bar */
.pj-jump { margin: 0 0 40px; padding: 12px 0 16px; border-bottom: 1px solid #e3e6e0; }
.pj-jump__list { display:flex; flex-wrap:wrap; gap:8px; }
.pj-jump__list a { flex:0 0 auto; padding:7px 14px; font-size:12px; font-weight:700; letter-spacing:.6px; text-transform:uppercase;
  color:#006238; background:#e9f0eb; border:1px solid transparent; white-space:nowrap; transition:all .25s var(--ease); }
.pj-jump__list a:hover, .pj-jump__list a.is-active { background:#006238; color:#fff; }

/* Project section */
.pj-section { margin-bottom: 64px; scroll-margin-top: 90px; }
.pj-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-bottom:14px; margin-bottom:20px; border-bottom:2px solid #006238; position:relative; }
.pj-head::after { content:""; position:absolute; left:0; bottom:-2px; width:90px; height:2px; background:var(--brass-500); }
.pj-num { font-family:var(--font-mono); font-size:13px; font-weight:600; color:var(--brass-600); letter-spacing:2px; display:block; margin-bottom:6px; }
.pj-title { font-size:32px; font-weight:800; letter-spacing:-.5px; text-transform:uppercase; color:#17231d; }
.pj-count { display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:#006238;
  background:#e9f0eb; padding:6px 14px; }
.pj-count i { color:var(--brass-500); }

/* Justified gallery (shows full photos, no cropping) */
.pj-gallery { display:flex; flex-wrap:wrap; gap:10px; }
.pj-gallery::after { content:""; flex-grow:1000000; }
.pj-item { position:relative; margin:0; padding:0; border:0; background:#e8ebe6; cursor:zoom-in; overflow:hidden;
  flex-grow:calc(var(--r) * 100); flex-basis:calc(var(--r) * 230px); min-width:120px; }
.pj-item::before { content:""; display:block; padding-bottom:calc(100% / var(--r)); }
.pj-item img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.pj-item::after { content:"\f00e"; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; right:10px; bottom:10px;
  width:36px; height:36px; display:flex; align-items:center; justify-content:center; font-size:14px; color:#fff;
  background:rgba(0,98,56,.9); opacity:0; transform:translateY(6px); transition:all .3s var(--ease); }
.pj-item:hover img { transform:scale(1.06); }
.pj-item:hover::after, .pj-item:focus-visible::after { opacity:1; transform:none; }
.pj-item:focus-visible { outline:3px solid var(--brass-500); outline-offset:2px; }

/* Back to top */
.pj-top { position:fixed; right:20px; bottom:20px; z-index:900; width:46px; height:46px; border:0; background:#006238; color:#fff;
  opacity:0; visibility:hidden; transition:all .3s; cursor:pointer; }
.pj-top.is-show { opacity:1; visibility:visible; }
.pj-top:hover { background:var(--brass-600); }

/* ---------------- LIGHTBOX ---------------- */
.pj-lb { position:fixed; inset:0; z-index:10000; display:none; background:#08120d; user-select:none; -webkit-user-select:none; }
.pj-lb.is-open { display:block; }
.pj-lb__stage { position:absolute; inset:56px 0 0 0; overflow:hidden; touch-action:none; cursor:grab; }
.pj-lb__stage.is-drag { cursor:grabbing; }
.pj-lb__img { position:absolute; left:50%; top:50%; max-width:92%; max-height:92%; transform-origin:center center; will-change:transform;
  -webkit-user-drag:none; box-shadow:0 10px 50px rgba(0,0,0,.5); }
.pj-lb__bar { position:absolute; top:0; left:0; right:0; height:56px; display:flex; align-items:center; justify-content:space-between;
  padding:0 14px; color:#fff; background:rgba(0,0,0,.35); z-index:3; gap:10px; }
.pj-lb__cap { font-size:14px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pj-lb__cap small { font-family:var(--font-mono); color:var(--brass-500); margin-left:10px; letter-spacing:1px; }
.pj-lb__tools { display:flex; gap:6px; flex:0 0 auto; }
.pj-lb button { border:0; color:#fff; background:rgba(255,255,255,.12); width:40px; height:40px; cursor:pointer; font-size:15px; transition:background .2s; }
.pj-lb button:hover { background:var(--brass-600); }
.pj-lb__nav { position:absolute; top:50%; z-index:3; width:48px !important; height:64px !important; margin-top:-18px; font-size:20px !important; }
.pj-lb__prev { left:12px; } .pj-lb__next { right:12px; }
.pj-lb__hint { position:absolute; bottom:12px; left:0; right:0; text-align:center; font-size:12px; color:rgba(255,255,255,.55); pointer-events:none; z-index:2; }
body.pj-lock { overflow:hidden; }

@media (max-width: 991px) {
  .pj-title { font-size:26px; }
}
@media (max-width: 767px) {
  .pj-page { padding:30px 0 50px; }
  .pj-title { font-size:21px; }
  .pj-section { margin-bottom:46px; }
  .pj-gallery { gap:6px; }
  .pj-item { flex-basis:calc(var(--r) * 150px); min-width:90px; }
  .pj-lb__nav { width:38px !important; height:52px !important; }
  .pj-lb__prev { left:4px; } .pj-lb__next { right:4px; }
  .pj-lb__cap small { display:block; margin:0; }
  .pj-lb__hint { display:none; }
}