/* Sutty Slabbing site v2.5 additions (3 Nov 2026): Latest jobs page and home section, plant hire cards, service cards with photos, gallery pages, photo viewer. Uses the colour tokens from site.css. */
.muted{color:var(--muted)}
.tag{display:inline-block;padding:5px 10px;border:1px solid var(--line2);border-radius:999px;color:var(--soft);font-size:11px}
img.fit{height:auto}

/* top bar: Latest jobs link */
nav a{white-space:nowrap}
nav a.nv-dot:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acc);margin-right:7px;vertical-align:1px;box-shadow:0 0 0 4px rgba(63,200,210,.18)}

/* Latest jobs page: Facebook-style posts */
.feed{max-width:680px;margin:0 auto;display:grid;gap:22px}
.fbpost{background:var(--card);border:1px solid var(--line2);border-radius:18px;padding:20px;scroll-margin-top:110px}
.fbh{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.fbh .av{width:44px;height:44px;border-radius:50%;background:var(--acc);color:var(--acc-ink);display:grid;place-items:center;font-size:14px;font-weight:700;flex:0 0 44px}
.fbh b{display:block;font-size:15px}.fbh small{color:var(--muted);font-size:11px}
.fbpost h2{font-size:clamp(1.6rem,3.4vw,2.2rem);margin-bottom:10px}
.fbpost>p{color:var(--soft)}
.fbm{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:16px -20px 0}
.fbm a{display:block;position:relative;overflow:hidden;cursor:zoom-in}
.fbm a:first-child{grid-column:1/-1}
.fbm img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block}
.fbm a:first-child img{aspect-ratio:4/3}
.fbm .more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(7,15,19,.62);color:#fff;font-size:12px}
.fbm .lb-only{display:none}
.fbact{border-top:1px solid var(--line2);margin-top:16px;padding-top:4px}
.feed-end{text-align:center;color:var(--muted);margin-top:8px}

/* Home: latest job row */
.lj-row{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.lj-row h2{font-size:clamp(2rem,4.2vw,3.4rem)}

/* Plant hire cards */
#plant-hire .s-head{margin-bottom:0}
.hire2{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hire2 li{background:var(--card);border:1px solid var(--line2);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:8px;scroll-margin-top:110px}
.hire2 figure{margin:-18px -18px 8px;overflow:hidden;border-radius:18px 18px 0 0}
.hire2 figure img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.hire2 h3{font-size:1.9rem}.hire2 p{margin:0;color:var(--soft)}.hire2 .model{color:var(--acc)}
.hire2 .chips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 10px}
.hire2 .btn{align-self:flex-start;margin-top:auto}
.hire-both{margin-top:20px;color:var(--soft);display:flex;gap:14px;align-items:center;flex-wrap:wrap;max-width:none}
.hirefig{display:grid;gap:12px}

/* Landscaping cards with a photo on top */
.svc.svc-a{grid-template-columns:repeat(3,1fr);gap:16px}
.svc-a a{padding:0;overflow:hidden}
.svc-a .ci img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .5s var(--ease-out)}
.svc-a a:hover .ci img{transform:scale(1.03)}
.svc-a .cb{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}

/* Gallery pages, grouped by job */
.gal-count{color:var(--acc);margin-top:14px}
.gc{margin-bottom:44px}
.gc-h{font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:16px;display:flex;gap:12px;align-items:baseline;flex-wrap:wrap}
.gc-h span{font-size:12px}
.gc-h a{color:inherit;text-decoration:none}.gc-h a:hover{text-decoration:underline}
.gc-g{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gi{display:block;position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/3;cursor:zoom-in;background:var(--card)}
.gi img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease-out)}
.gi:hover img{transform:scale(1.03)}
.gi .ba-tag{position:absolute;left:8px;top:8px;background:rgba(7,15,19,.75);color:#fff;padding:4px 9px;border-radius:999px;font-size:10px}

/* Photo viewer */
.lb{position:fixed;inset:0;z-index:200;background:rgba(4,9,11,.94);display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.lb[hidden]{display:none}
html.lb-on{overflow:hidden}
.lb-fig{margin:0;max-width:min(1400px,100%);display:grid;gap:10px;justify-items:center}
.lb-fig img{max-width:100%;max-height:calc(100vh - 120px);max-height:calc(100dvh - 120px);width:auto;height:auto;border-radius:10px}
.lb-cap{display:flex;gap:12px;align-items:baseline;color:#ECF1F7;font-size:14px;flex-wrap:wrap;justify-content:center;text-align:center}
.lb-n{color:#82DBE2}
.lb button{position:absolute;border:0;background:rgba(255,255,255,.1);color:#fff;width:48px;height:48px;border-radius:50%;font-size:28px;line-height:1;cursor:pointer}
.lb button:hover{background:rgba(255,255,255,.2)}
.lb-x{top:max(16px,env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px))}
.lb-p{left:max(12px,env(safe-area-inset-left,0px));top:50%;transform:translateY(-50%)}
.lb-nx{right:max(12px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%)}
.lb button[hidden]{display:none}

@media (max-width:1060px){
  .svc.svc-a{grid-template-columns:repeat(2,1fr)}
  .lj-row{grid-template-columns:1fr;gap:24px}
  .gc-g{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:760px){
  .svc.svc-a{grid-template-columns:1fr}
  .fbpost{padding:16px}.fbm{margin:14px -16px 0}
  .hire2{grid-template-columns:1fr}
  .gc-g{grid-template-columns:repeat(2,1fr);gap:8px}
  .lb button{width:42px;height:42px;font-size:24px}
  .lb-p,.lb-nx{top:auto;bottom:max(16px,env(safe-area-inset-bottom,0px));transform:none}
}
@media (prefers-reduced-motion:reduce){.svc-a .ci img,.gi img{transition:none}}

/* v2.6 (3 Nov 2026): Jordan's logo */
.logo-img{display:block;height:50px;width:auto;max-width:none;flex:none}
.site-head:not(.solid) .logo-img{filter:drop-shadow(0 1px 8px rgba(0,0,0,.55))}
.foot-logo{display:block;height:64px;width:auto;margin-bottom:14px}
.fbh .av{background:#070F13;border:1px solid var(--line2);overflow:hidden}
.fbh .av img{width:30px;height:auto}
@media (max-width:760px){.logo-img{height:36px}}
@media (max-width:360px){.logo-img{height:30px}}