:root {
--b:  #0071CF;
--bd: #005aa3;
--bp: #e8f3fc;
--t:  #111827;
--m:  #6b7280;
--br: #e5e7eb;
--bg: #f8fafc;
--w:  #ffffff;
--r:  8px;
--sh: 0 2px 10px rgba(0,113,207,.09);
--sh2:0 8px 28px rgba(0,113,207,.18);
--tr: .2s ease;
} #gpj-page-header {
position:relative;
background-image: url(//gpjconsulting.co.uk/wp-content/uploads/2026/07/jorge-vasconez-LCaKuYefLQk-unsplash.jpg);
background-size: cover;
background-position: center center;
background-attachment: fixed;
padding: 130px 20px;
text-align: center;
overflow: hidden;
margin-bottom: 0;
}
#gpj-page-header::before {
content:'';
position:absolute; inset:0;
background: rgba(10,30,61,0.55);
pointer-events:none;
}
#gpj-page-header h1 {
position:relative; z-index:1;
color:#fff;
font-size: 60px;
font-weight: 300;
margin:0; line-height:1.15;
}
#gpj-page-header p { display:none; }
#gpj-page-header .gpj-header-bar { display:none; }
@media(max-width:900px){
#gpj-page-header { padding: 130px 20px; }
#gpj-page-header h1 { font-size:50px; }
}
@media(max-width:540px){
#gpj-page-header { padding: 130px 20px; background-attachment: scroll; }
#gpj-page-header h1 { font-size:50px; }
} #gpj-wrap { max-width:1200px; margin:0 auto; padding:40px 20px 0; font-family:inherit; } #gpj-filters {
margin-bottom: 48px;
} .gpj-filter-row-all {
margin-bottom: 24px;
} .gpj-filter-group {
margin-bottom: 20px;
}
.gpj-filter-group-label {
font-size: 10px;
font-weight: 800;
text-transform: uppercase;
letter-spacing: .12em;
color: var(--m);
display: block;
margin-bottom: 10px;
}
.gpj-filter-btns {
display: flex;
flex-wrap: wrap;
gap: 8px;
}
.gpj-filter-divider { display: none; }
.gpj-filter-row { display: none; }
.gpj-filter-label { display: none; }
.gpj-btn {
display: inline-flex;
align-items: center;
gap: 6px;
background: var(--w);
border: 1px solid var(--br);
color: var(--t);
padding: 8px 14px;
font-size: 13px;
font-weight: 500;
cursor: pointer;
transition: all var(--tr);
font-family: inherit;
white-space: nowrap;
line-height: 1;
}
.gpj-btn:hover {
border-color: var(--b);
background: var(--b);
color: #fff;
}
.gpj-btn.active {
background: var(--b);
border-color: var(--b);
color: #fff;
}
.gpj-btn.active .gpj-btn-count { color: rgba(255,255,255,.7); }
.gpj-btn-count {
font-size: 11px;
color: var(--m);
}
.gpj-btn:hover .gpj-btn-count { color: rgba(255,255,255,.75); } #gpj-grid {
display:grid;
grid-template-columns:repeat(3,1fr);
gap:24px;
}
@media(max-width:900px){ #gpj-grid{ grid-template-columns:repeat(2,1fr); gap:18px; } }
@media(max-width:540px){ #gpj-grid{ grid-template-columns:1fr; gap:14px; } } .gpj-card {
background:var(--w); border-radius:0;
box-shadow:var(--sh); overflow:hidden; cursor:pointer;
display:flex; flex-direction:column;
transition:transform var(--tr), box-shadow var(--tr);
border:1px solid var(--br);
}
.gpj-card:hover { transform:translateY(-3px); box-shadow:var(--sh2); }
.gpj-card.gpj-hidden { display:none; }
.gpj-card-img {
position:relative; height:210px;
background:var(--bp) center/cover no-repeat;
overflow:hidden; flex-shrink:0;
}
.gpj-card-no-img {
width:100%; height:100%;
display:flex; align-items:center; justify-content:center;
}
.gpj-card-hover {
position:absolute; inset:0;
background:rgba(0,113,207,.82);
display:flex; align-items:center; justify-content:center;
opacity:0; transition:opacity var(--tr);
}
.gpj-card:hover .gpj-card-hover { opacity:1; }
.gpj-card-hover span {
color:#fff; font-size:14px; font-weight:600;
border:2px solid rgba(255,255,255,.6);
padding:9px 20px; border-radius:0; letter-spacing:.03em;
}
.gpj-card-body {
padding:18px; display:flex;
flex-direction:column; gap:8px; flex:1;
}
.gpj-card-body h3 {
font-size:16px; font-weight:700;
color:var(--t); margin:0; line-height:1.3;
}
.gpj-excerpt {
font-size:13px; color:var(--m); margin:0;
line-height:1.6; flex:1;
display:-webkit-box; -webkit-line-clamp:3;
-webkit-box-orient:vertical; overflow:hidden;
}
.gpj-card-footer { display:flex; flex-direction:column; gap:8px; margin-top:auto; }
.gpj-tags { display:flex; flex-wrap:wrap; gap:4px; }
.gpj-tag {
font-size:11px; font-weight:600; padding:3px 8px;
border-radius:0; letter-spacing:.02em; white-space:nowrap;
}
.gpj-tag-s { background:var(--bp); color:var(--b); }
.gpj-tag-v { background:#f0fdf4; color:#166534; }
.gpj-card-meta {
display:flex; gap:10px; flex-wrap:wrap;
font-size:11px; color:var(--m);
} #gpj-none {
text-align:center; padding:80px 20px;
color:var(--m); font-size:15px;
}
#gpj-none button { margin-top:12px; } #gpj-page-cta {
text-align:center;
padding:70px 20px;
margin-top:60px;
background-image: url(https://gpjconsulting.co.uk/wp-content/uploads/2026/07/sea-2-scaled.avif);
background-size: cover;
background-position: center;
position: relative;
border-radius:0;
margin-bottom:60px;
}
#gpj-page-cta::before {
content: '';
position: absolute;
inset: 0;
background: rgba(10,30,61,0.55);
pointer-events: none;
}
#gpj-page-cta h3,
#gpj-page-cta p,
#gpj-page-cta a {
position: relative;
z-index: 1;
}
#gpj-page-cta h3 {
color:#fff; font-size:26px; font-weight:800;
margin:0 0 10px; line-height:1.2;
}
#gpj-page-cta p {
color:rgba(255,255,255,.75); font-size:15px;
margin:0 0 24px; max-width:400px; margin-inline:auto;
line-height:1.6;
}
.gpj-cta-btn {
display:inline-block;
background:#fff; color:var(--b);
font-weight:700; font-size:15px;
padding:14px 32px; border-radius:0;
text-decoration:none; letter-spacing:.02em;
transition:all var(--tr); border:2px solid #fff;
}
.gpj-cta-btn:hover {
background:transparent; color:#fff;
} #gpj-lb {
position:fixed; inset:0; z-index:99999;
display:flex; align-items:center; justify-content:center;
padding:16px;
opacity:0; pointer-events:none;
transition:opacity .22s ease;
}
#gpj-lb.open { opacity:1; pointer-events:all; }
#gpj-lb-bg {
position:absolute; inset:0;
background:rgba(8,16,32,.78);
backdrop-filter:blur(5px);
cursor:pointer;
}
#gpj-lb-box {
position:relative; z-index:1;
background:var(--w); border-radius:0;
width:100%; max-width:1020px;
max-height:92vh; overflow:hidden;
display:flex; flex-direction:column;
box-shadow:0 24px 80px rgba(0,0,0,.35);
transform:translateY(14px);
transition:transform .22s ease;
}
#gpj-lb.open #gpj-lb-box { transform:translateY(0); } #gpj-lb-close {
position:absolute; top:14px; right:14px; z-index:10;
background:rgba(255,255,255,.95); border:none;
border-radius:50%;
width:40px; height:40px; min-width:40px; min-height:40px;
display:flex; align-items:center; justify-content:center;
cursor:pointer;
box-shadow:0 2px 8px rgba(0,0,0,.18);
color:var(--t);
transition:background var(--tr), color var(--tr);
padding:0; line-height:1; flex-shrink:0;
}
#gpj-lb-close:hover { background:var(--b); color:#fff; }
#gpj-lb-close svg { display:block; flex-shrink:0; }
#gpj-lb-scroll { overflow:hidden; flex:1; display:flex; flex-direction:column; height:100%; } #gpj-lb-loading { display:flex; align-items:center; justify-content:center; padding:80px; }
.gpj-spin {
width:36px; height:36px;
border:3px solid var(--bp); border-top-color:var(--b);
border-radius:50%; animation:gpj-spin .65s linear infinite;
}
@keyframes gpj-spin { to{ transform:rotate(360deg); } } #gpj-lb-body {
display:grid;
grid-template-columns:55% 45%;
height:84vh;
overflow:hidden;
}
@media(max-width:680px){
#gpj-lb-body { grid-template-columns:1fr; height:auto; overflow:visible; }
#gpj-lb { padding:8px; }
#gpj-lb-box { max-height:96vh; border-radius:0; }
} #gpj-lb-gallery {
background:#08101e;
display:flex; flex-direction:column;
border-radius:0; overflow:hidden;
height:84vh;
flex-shrink:0;
}
@media(max-width:680px){
#gpj-lb-gallery { height:auto; max-height:280px; }
}
#gpj-lb-main {
position:relative; flex:1;
display:flex; align-items:center; justify-content:center;
overflow:hidden; min-height:300px;
}
#gpj-lb-img {
width:100%; height:100%;
object-fit:cover; display:block; max-height:none;
} #gpj-lb-prev, #gpj-lb-next {
position:absolute; top:50%; transform:translateY(-50%);
background:rgba(255,255,255,.14); border:none;
color:#fff; font-size:22px;
width:44px; height:44px; min-width:44px; min-height:44px;
border-radius:50%;
cursor:pointer;
display:flex; align-items:center; justify-content:center;
transition:background var(--tr);
padding:0; margin:0; line-height:44px;
text-align:center;
}
#gpj-lb-prev { left:10px; }
#gpj-lb-next { right:10px; }
#gpj-lb-prev:hover, #gpj-lb-next:hover { background:rgba(0,113,207,.8); }
#gpj-lb-counter {
position:absolute; bottom:10px; left:50%;
transform:translateX(-50%);
background:rgba(0,0,0,.5); color:#fff;
font-size:12px; padding:3px 10px; border-radius:10px;
font-family:inherit; white-space:nowrap;
}
#gpj-lb-thumbs {
display:flex; gap:4px; padding:8px;
overflow-x:auto; background:rgba(0,0,0,.35); flex-shrink:0;
scrollbar-width:thin; scrollbar-color:var(--b) transparent;
}
.gpj-thumb {
width:54px; height:54px; object-fit:cover;
border-radius:2px; cursor:pointer; flex-shrink:0;
border:2px solid transparent; opacity:.55;
transition:all var(--tr);
}
.gpj-thumb:hover, .gpj-thumb.active { border-color:var(--b); opacity:1; }
.gpj-lb-noimg {
width:100%; height:100%; min-height:300px;
display:flex; align-items:center; justify-content:center;
background:var(--bp);
} #gpj-lb-info {
padding:28px 26px 60px;
overflow-y:scroll;
display:flex;
flex-direction:column;
gap:16px;
height:84vh;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
box-sizing:border-box;
}
@media(max-width:680px){
#gpj-lb-info { height:auto; max-height:none; }
}
#gpj-lb-title {
font-size:22px; font-weight:800; color:var(--t);
margin:0; line-height:1.25; padding-right:36px;
}
#gpj-lb-badges { display:flex; flex-wrap:wrap; gap:5px; }
.gpj-lb-badge {
font-size:12px; font-weight:600; padding:4px 10px;
border-radius:0; letter-spacing:.02em;
}
.gpj-lb-bs { background:var(--bp); color:var(--b); }
.gpj-lb-bv { background:#f0fdf4; color:#166534; }
#gpj-lb-details {
display:grid; grid-template-columns:1fr 1fr;
gap:12px; margin:0;
padding:16px; background:var(--bg);
border-radius:0; border:1px solid var(--br);
}
.gpj-lb-dt { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--m); margin:0 0 2px; }
.gpj-lb-dd { font-size:15px; font-weight:600; color:var(--t); margin:0; }
#gpj-lb-desc {
font-size:14px; line-height:1.75; color:#374151;
border-top:1px solid var(--br); padding-top:18px;
}
#gpj-lb-desc p { margin:0 0 12px; }
#gpj-lb-desc p:last-child { margin-bottom:0; } #gpj-lb-cta {
display: block;
margin-top: 4px;
margin-bottom: 32px;
background-image: url(//gpjconsulting.co.uk/wp-content/uploads/2026/07/sjknfd.png);
background-size: cover;
background-position: center;
color: #fff;
text-align: center;
padding: 18px 20px;
font-weight: 700;
font-size: 14px;
text-decoration: none;
letter-spacing: .03em;
transition: opacity var(--tr);
border-top: 1px solid var(--br);
position: relative;
overflow: hidden;
}
#gpj-lb-cta::before {
content: '';
position: absolute; inset: 0;
background: rgba(0,0,0,0.25);
transition: background var(--tr);
}
#gpj-lb-cta:hover::before { background: rgba(0,0,0,0.15); }
#gpj-lb-cta span {
position: relative; z-index: 1;
} .gpj-sortable-handle {
cursor:grab; color:#aaa; padding:0 8px; display:inline-block;
}
.gpj-sortable-handle:active { cursor:grabbing; }