/* PathJeevani Category Boxes · palette: blue #456e8f · gold #e8b512 · navy #16283a */
.pjcb-wrap{--gap:18px;--cols:5;--arrow:44px;--gutter:60px;--pjcb-fs-base:17px;--pjcb-blue:#456e8f;--pjcb-navy:#16283a;--pjcb-gold:#e8b512;--pjcb-ink:#15181d;--pjcb-muted:#6b7684;position:relative;width:100%;max-width:100%;min-width:0;margin:0 0 8px}
.pjcb-wrap *{box-sizing:border-box}

/* Kill icons injected on links by theme/other plugins (the stray "A↓" glyph) */
.pjcb-wrap a::before,.pjcb-wrap a::after,.pjcb-wrap a *::before,.pjcb-wrap a *::after{content:none !important;display:none !important}

/* ---------- Layout ---------- */
.pjcb-stage{position:relative}
.pjcb-track{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:var(--gap);padding:4px 0 10px;align-items:stretch}

/* Scrolling row (slider always; grid too on tablet/mobile - see media queries) */
.pjcb-slider{--cols:4}
.pjcb-slider .pjcb-stage{padding:0 var(--gutter)}
.pjcb-slider .pjcb-track{display:flex;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:0 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:10px 6px 34px;margin:-10px -6px -26px}
.pjcb-track::-webkit-scrollbar{display:none}
.pjcb-slider .pjcb-box{flex:0 0 calc((100% - var(--gap) * (var(--cols) - 1)) / var(--cols));scroll-snap-align:start}

/* ---------- Common box: every box has exactly the same width & height ---------- */
.pjcb-wrap .pjcb-box{position:relative;display:flex;flex-direction:column;min-width:0;width:100%;overflow:hidden;text-decoration:none !important;color:var(--pjcb-ink) !important;outline:none;-webkit-tap-highlight-color:transparent;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}
.pjcb-wrap .pjcb-box:focus-visible{outline:2px solid var(--pjcb-gold);outline-offset:3px}

.pjcb-top{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}

/* Name: bold, always one line. JS shrinks the font a little (same size for every box) so the full name fits. */
.pjcb-wrap .pjcb-name{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--pjcb-fs,var(--pjcb-fs-base));line-height:1.3;font-weight:700;letter-spacing:-.01em;color:var(--pjcb-ink);transition:color .25s}
/* Excerpt: fixed 2-line area, so boxes stay equal even when a description is short or empty */
.pjcb-wrap .pjcb-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;height:3em;margin-top:6px;font-size:13px;line-height:1.5;font-weight:400;color:var(--pjcb-muted)}
.pjcb-wrap .pjcb-count{flex:0 0 auto;white-space:nowrap;font-size:12px;line-height:1;font-weight:600;padding:6px 10px;border-radius:999px;color:var(--pjcb-blue);background:#eef3f7}

.pjcb-wrap img{display:block;width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;margin:0 !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.pjcb-bar{position:absolute;left:18px;right:18px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:linear-gradient(90deg,var(--pjcb-gold),#f5d565);transform:scaleX(0);transform-origin:center;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.pjcb-box:hover .pjcb-bar,.pjcb-box:focus-visible .pjcb-bar{transform:scaleX(1)}

/* ---------- Design 1: white card ---------- */
.pjcb-style-1 .pjcb-box{background:#fff;padding:16px 18px 18px;border:1px solid rgba(22,40,58,.07);border-radius:16px;box-shadow:0 1px 2px rgba(22,40,58,.04),0 6px 18px rgba(22,40,58,.05)}
.pjcb-style-1 .pjcb-top{margin-bottom:14px}
.pjcb-style-1 .pjcb-top .pjcb-count:only-child{margin-left:auto}
.pjcb-style-1 .pjcb-box:hover{transform:translateY(-3px);border-color:rgba(232,181,18,.45);box-shadow:0 4px 8px rgba(22,40,58,.05),0 16px 34px rgba(22,40,58,.12)}
.pjcb-style-1 .pjcb-box:hover .pjcb-name{color:var(--pjcb-blue)}
.pjcb-style-1 .pjcb-box:hover .pjcb-count{background:var(--pjcb-gold);color:var(--pjcb-navy)}
.pjcb-thumb{flex:0 0 48px;width:48px;height:48px;border-radius:12px;overflow:hidden;background:#eef2f6;box-shadow:0 0 0 1px rgba(22,40,58,.06),0 4px 10px rgba(22,40,58,.10)}
.pjcb-box:hover .pjcb-thumb img{transform:scale(1.1)}
.pjcb-thumb.pjcb-noimg{display:flex;align-items:center;justify-content:center;background:linear-gradient(140deg,#6f93b0 0%,var(--pjcb-blue) 50%,var(--pjcb-navy) 100%);color:#fff;font-size:20px;font-weight:700;line-height:1}

/* ---------- Design 2: photo tile ---------- */
.pjcb-style-2 .pjcb-box{height:215px;justify-content:flex-end;padding:18px;border-radius:16px;isolation:isolate;background:linear-gradient(140deg,#6f93b0 0%,#456e8f 55%,#16283a 100%);box-shadow:0 2px 6px rgba(22,40,58,.08),0 10px 24px rgba(22,40,58,.12)}
.pjcb-style-2.pjcb-nodesc .pjcb-box{height:175px}
.pjcb-style-2 .pjcb-box:hover{transform:translateY(-4px);box-shadow:0 6px 12px rgba(22,40,58,.10),0 20px 40px rgba(22,40,58,.22)}
.pjcb-style-2 .pjcb-bar{left:0;right:0;border-radius:0}
.pjcb-style-2 .pjcb-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-2;overflow:hidden}
.pjcb-style-2 .pjcb-box:hover .pjcb-bg img{transform:scale(1.08)}
.pjcb-style-2 .pjcb-shade{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:linear-gradient(180deg,rgba(13,25,37,.35) 0%,rgba(22,40,58,.1) 28%,rgba(22,40,58,.55) 55%,rgba(13,25,37,.96) 100%)}
.pjcb-style-2 .pjcb-top{position:absolute;top:16px;left:16px;right:60px}
.pjcb-wrap.pjcb-style-2 .pjcb-count{color:#f7d86a;background:rgba(232,181,18,.16);border:1px solid rgba(232,181,18,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.pjcb-wrap.pjcb-style-2 .pjcb-name{color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.35)}
.pjcb-wrap.pjcb-style-2 .pjcb-desc{color:rgba(255,255,255,.82)}
.pjcb-style-2 .pjcb-go{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .25s,color .25s,transform .3s,border-color .25s}
.pjcb-style-2 .pjcb-go svg{width:16px;height:16px}
.pjcb-style-2 .pjcb-box:hover .pjcb-go{background:var(--pjcb-gold);border-color:var(--pjcb-gold);color:var(--pjcb-navy);transform:rotate(-45deg)}

/* ---------- Side arrows ---------- */
.pjcb-wrap .pjcb-arrow{position:absolute !important;top:50% !important;z-index:5;width:var(--arrow) !important;height:var(--arrow) !important;min-width:0 !important;min-height:0 !important;padding:0 !important;margin:0 !important;border-radius:50% !important;border:1px solid rgba(22,40,58,.08) !important;background:#fff !important;color:var(--pjcb-navy) !important;box-shadow:0 2px 6px rgba(22,40,58,.08),0 8px 22px rgba(22,40,58,.12) !important;display:flex !important;align-items:center;justify-content:center;cursor:pointer;line-height:1 !important;font-size:0 !important;text-transform:none !important;transform:translateY(-50%);transition:background .25s,color .25s,box-shadow .25s,opacity .25s,transform .25s}
.pjcb-wrap .pjcb-prev{left:0}
.pjcb-wrap .pjcb-next{right:0}
.pjcb-wrap .pjcb-arrow svg{display:block;width:18px;height:18px}
.pjcb-wrap .pjcb-arrow:hover:not(:disabled){background:var(--pjcb-navy) !important;color:#fff !important;box-shadow:0 0 0 4px rgba(232,181,18,.3),0 10px 24px rgba(22,40,58,.22) !important;transform:translateY(-50%) scale(1.06)}
.pjcb-wrap .pjcb-arrow:focus-visible{outline:2px solid var(--pjcb-gold);outline-offset:2px}
.pjcb-wrap .pjcb-arrow:disabled{opacity:.35;cursor:default;box-shadow:0 1px 3px rgba(22,40,58,.08) !important}
.pjcb-no-overflow .pjcb-arrow{display:none !important}
.pjcb-slider.pjcb-no-overflow .pjcb-stage{padding:0}

/* 5 boxes in one row: a little tighter so long names still fit on one line */
.pjcb-grid.pjcb-n-5{--gap:14px}
.pjcb-grid.pjcb-n-5.pjcb-style-1 .pjcb-box{padding-left:14px;padding-right:14px}
.pjcb-grid.pjcb-n-5.pjcb-style-2 .pjcb-box{padding-left:15px;padding-right:15px}

/* No sticky hover lift on touch screens */
@media (hover:none){
	.pjcb-wrap .pjcb-box:hover{transform:none}
	.pjcb-box:hover .pjcb-thumb img,.pjcb-style-2 .pjcb-box:hover .pjcb-bg img{transform:none}
}

/* ---------- Responsive ---------- */
@media (max-width:1280px){
	.pjcb-wrap{--pjcb-fs-base:16px}
	.pjcb-slider{--cols:3}
	.pjcb-grid:not(.pjcb-n-1):not(.pjcb-n-2) .pjcb-track{grid-template-columns:repeat(3,minmax(0,1fr))}
	.pjcb-grid.pjcb-n-4 .pjcb-track{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* Tablet & mobile: every layout becomes a swipe row with a peek of the next box.
   Arrows still only exist when there are more than 5 categories. */
@media (max-width:1024px){
	.pjcb-wrap{--gap:14px;--arrow:40px;--gutter:52px;--cols:2.4}
	.pjcb-grid .pjcb-track{display:flex;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:10px 0 34px;margin:-10px 0 -26px}
	.pjcb-grid .pjcb-box{flex:0 0 calc((100% - var(--gap) * (var(--cols) - 1)) / var(--cols));scroll-snap-align:start}
	.pjcb-grid.pjcb-n-1{--cols:1}
	.pjcb-grid.pjcb-n-2{--cols:2}
}
@media (max-width:900px){
	.pjcb-slider{--cols:2}
}
@media (max-width:640px){
	.pjcb-wrap{--gap:12px;--arrow:32px;--gutter:38px;--cols:1.3;--pjcb-fs-base:16px}
	.pjcb-slider{--cols:1.08}
	.pjcb-grid.pjcb-n-2{--cols:1.3}
	.pjcb-wrap .pjcb-arrow svg{width:16px;height:16px}
	.pjcb-style-1 .pjcb-box{padding:14px 16px 16px;border-radius:14px}
	.pjcb-style-1 .pjcb-top{margin-bottom:14px}
	.pjcb-thumb{flex-basis:44px;width:44px;height:44px;border-radius:10px}
	.pjcb-style-2 .pjcb-box{height:200px;padding:16px;border-radius:14px}
	.pjcb-style-2.pjcb-nodesc .pjcb-box{height:160px}
	.pjcb-style-2 .pjcb-go{width:30px;height:30px;top:12px;right:12px}
	.pjcb-style-2 .pjcb-go svg{width:14px;height:14px}
	.pjcb-style-2 .pjcb-top{top:14px;left:14px}
}
@media (max-width:380px){
	.pjcb-wrap{--arrow:30px;--gutter:35px;--gap:10px;--cols:1.12;--pjcb-fs-base:15px}
	.pjcb-grid.pjcb-n-2{--cols:1.12}
	.pjcb-slider{--cols:1}
	.pjcb-wrap .pjcb-desc{font-size:12.5px}
}
@media (prefers-reduced-motion:reduce){
	.pjcb-wrap *{transition:none !important}
}