/* Road Sweeper layout — page-only overrides. Shared navigation stays unchanged. */
body.jjs-topsoil-layout { --sw-width:1280px; --sw-gutter:clamp(20px,4vw,48px); --sw-space:clamp(48px,6vw,88px); }
.jjs-topsoil-layout .sweeper-main { background:#f7f6f2; }
.jjs-topsoil-layout .sweeper-main :is(section,article,aside,div,picture) { min-width:0; }
.jjs-topsoil-layout .sweeper-section { padding:var(--sw-space) var(--sw-gutter); }
.jjs-topsoil-layout .sweeper-inner { max-width:var(--sw-width); margin-inline:auto; }
.jjs-topsoil-layout .sweeper-heading { max-width:24ch; margin:0 0 30px; font-size:clamp(29px,3.2vw,44px); line-height:1.13; letter-spacing:-.035em; text-wrap:balance; }
.jjs-topsoil-layout .why-section .sweeper-heading,
.jjs-topsoil-layout .jjs-sweeper-work__heading { margin-inline:auto; }
.jjs-topsoil-layout .eyebrow { color:#805e00; line-height:1.5; }
.jjs-topsoil-layout .sweeper-main :is(h1,h2,h3) { overflow-wrap:break-word; }
.jjs-topsoil-layout .sweeper-main p { text-wrap:pretty; }
/* The photograph has its own space; the copy never sits on top of the truck. */
.jjs-topsoil-layout .sweeper-hero { display:grid; grid-template-columns:minmax(var(--sw-gutter),1fr) minmax(0,640px) minmax(0,640px) minmax(var(--sw-gutter),1fr); min-height:0; align-items:stretch; background:#141414; }
.jjs-topsoil-layout .sweeper-hero::after { display:none; }
.jjs-topsoil-layout .sweeper-hero > picture { position:relative; inset:auto; grid-column:3 / 5; grid-row:1; width:100%; height:100%; min-height:480px; }
.jjs-topsoil-layout .sweeper-hero img { width:100%; height:100%; object-fit:cover; object-position:center; }
.jjs-topsoil-layout .sweeper-hero__inner { grid-column:2; grid-row:1; width:auto; margin:0; align-self:center; padding:clamp(48px,5vw,72px) clamp(24px,4vw,64px) clamp(48px,5vw,72px) 0; }
.jjs-topsoil-layout .sweeper-hero h1 { font-size:clamp(42px,4.5vw,64px); line-height:1.02; margin:0 0 24px; max-width:none; text-wrap:balance; }
.jjs-topsoil-layout .sweeper-hero h1::after { margin-top:24px; }
.jjs-topsoil-layout .sweeper-hero p { font-size:clamp(17px,1.7vw,20px); line-height:1.65; font-weight:400; max-width:42ch; margin-bottom:28px; color:#e6e6e6; }
.jjs-topsoil-layout .sweeper-main .gold-btn { min-height:48px; justify-content:center; text-align:center; line-height:1.4; border-radius:4px; }
.jjs-topsoil-layout .sweeper-main .gold-btn:hover { background:#805e00; }
.jjs-topsoil-layout .sweeper-main a:focus-visible { outline:3px solid #c59829; outline-offset:5px; }
/* Services and emergency support. Collapse before either column becomes cramped. */
.jjs-topsoil-layout .services-emergency { grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr); gap:clamp(28px,4vw,56px); }
.jjs-topsoil-layout .service-list { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px; }
.jjs-topsoil-layout .service-pill { min-height:68px; padding:17px 18px; font-size:15px; line-height:1.4; gap:12px; box-shadow:none; }
.jjs-topsoil-layout .emergency-panel { padding:clamp(24px,3vw,38px); box-shadow:0 12px 30px rgb(0 0 0 / .09); }
.jjs-topsoil-layout .emergency-title { gap:18px; align-items:flex-start; }
.jjs-topsoil-layout .emergency-title .clock { width:64px; height:64px; flex-basis:64px; font-size:22px; color:#e1b84a; border-color:#c59829; }
.jjs-topsoil-layout .emergency-panel h2 { font-size:clamp(23px,2.4vw,30px); line-height:1.12; margin-bottom:12px; text-wrap:balance; }
.jjs-topsoil-layout .emergency-panel p { line-height:1.65; font-size:16px; }
.jjs-topsoil-layout .check-list { gap:15px; padding-top:24px; line-height:1.5; }
/* Five benefits: generous cards on desktop, paired cards at intermediate widths. */
.jjs-topsoil-layout .why-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px; }
.jjs-topsoil-layout .why-card { grid-column:span 2; padding:30px 26px; box-shadow:none; background:#faf9f6; }
.jjs-topsoil-layout .why-card:nth-child(4) { grid-column:2 / span 2; }
.jjs-topsoil-layout .why-card:nth-child(5) { grid-column:4 / span 2; }
.jjs-topsoil-layout .why-card .why-icon { width:48px; height:48px; margin:0 auto 18px; color:#805e00; }
.jjs-topsoil-layout .why-card h3 { font-size:19px; line-height:1.25; margin-bottom:12px; }
.jjs-topsoil-layout .why-card p { font-size:15px; line-height:1.7; }
/* Environmental and specialist services get separate full-width treatments. */
.jjs-topsoil-layout .feature-split { grid-template-columns:minmax(0,1fr); gap:32px; }
.jjs-topsoil-layout :is(.environment-card,.backblack-card) { box-shadow:0 10px 28px rgb(0 0 0 / .035); }
.jjs-topsoil-layout .environment-card { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; }
.jjs-topsoil-layout .environment-card > picture { display:block; width:100%; height:100%; min-height:340px; background:#efede6; }
.jjs-topsoil-layout .environment-card img { width:100%; height:100%; min-height:0; object-fit:contain; object-position:center; }
.jjs-topsoil-layout .environment-copy { padding:clamp(28px,4vw,52px); }
.jjs-topsoil-layout :is(.environment-copy h2,.backblack-copy h2) { font-size:clamp(27px,3vw,38px); line-height:1.15; text-transform:none; letter-spacing:-.025em; text-wrap:balance; }
.jjs-topsoil-layout :is(.environment-copy p,.backblack-copy p) { font-size:16px; line-height:1.7; margin:16px 0; }
.jjs-topsoil-layout .green-list { gap:13px; font-size:16px; line-height:1.5; }
.jjs-topsoil-layout .backblack-copy { padding:clamp(28px,4vw,48px); padding-bottom:26px; max-width:920px; }
.jjs-topsoil-layout .backblack-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; padding:0 clamp(20px,3vw,40px) 24px; }
.jjs-topsoil-layout .backblack-shot { aspect-ratio:4 / 5; background:#eeece5; }
.jjs-topsoil-layout .backblack-shot picture { display:block; width:100%; height:100%; }
.jjs-topsoil-layout .backblack-shot img { width:100%; height:100%; object-fit:contain; }
.jjs-topsoil-layout .backblack-shot span { left:12px; bottom:12px; padding:8px 11px; font-size:12px; }
.jjs-topsoil-layout .ideal-strip { margin:0 clamp(20px,3vw,40px) 32px; padding:20px; gap:12px 22px; font-size:14px; line-height:1.5; background:#f5eedc; }
.jjs-topsoil-layout .ideal-strip strong { width:auto; }
.jjs-topsoil-layout .safety-card { grid-template-columns:64px minmax(0,1fr) auto; padding:30px; gap:24px; margin-top:32px; border-width:1px; }
.jjs-topsoil-layout .safety-symbol { width:64px; height:64px; }
.jjs-topsoil-layout .safety-card h2 { font-size:clamp(23px,2.5vw,30px); line-height:1.2; text-transform:none; }
.jjs-topsoil-layout .safety-card p { font-size:16px; line-height:1.65; max-width:82ch; }
.jjs-topsoil-layout .aed-badge { grid-column:auto; font-size:18px; }
/* Work gallery: retain all five projects and keep full original photos visible. */
.jjs-topsoil-layout .jjs-sweeper-work__header { margin-bottom:36px; }
.jjs-topsoil-layout .jjs-sweeper-work__heading { margin-bottom:14px; }
.jjs-topsoil-layout .jjs-sweeper-work__grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:24px; }
.jjs-topsoil-layout .jjs-sweeper-work__card { display:flex; flex-direction:column; grid-column:span 2; box-shadow:0 8px 20px rgb(0 0 0 / .035); }
.jjs-topsoil-layout .jjs-sweeper-work__card:nth-child(4) { grid-column:2 / span 2; }
.jjs-topsoil-layout .jjs-sweeper-work__card:nth-child(5) { grid-column:4 / span 2; }
.jjs-topsoil-layout .jjs-sweeper-work__photo { aspect-ratio:4 / 3; background:#efede7; }
.jjs-topsoil-layout .jjs-sweeper-work__photo img { object-fit:contain; }
.jjs-topsoil-layout .jjs-sweeper-work__body { padding:26px; }
.jjs-topsoil-layout .jjs-sweeper-work__title { font-size:21px; line-height:1.2; text-transform:none; letter-spacing:-.015em; text-wrap:balance; }
.jjs-topsoil-layout .jjs-sweeper-work__description { font-size:16px; line-height:1.65; }
.jjs-topsoil-layout .jjs-sweeper-work__location { line-height:1.5; }
/* Quotation and coverage remain at the end, with aligned page gutters. */
.jjs-topsoil-layout .sweeper-cta { padding:clamp(36px,5vw,64px) var(--sw-gutter); background:#171717; }
.jjs-topsoil-layout .sweeper-cta__inner { max-width:var(--sw-width); gap:32px; align-items:center; flex-direction:row; }
.jjs-topsoil-layout .sweeper-cta h2 { font-size:clamp(28px,3.2vw,40px); line-height:1.15; margin-bottom:16px; max-width:25ch; }
.jjs-topsoil-layout .sweeper-cta p { line-height:1.65; max-width:58ch; }
.jjs-topsoil-layout .cta-actions { flex-shrink:0; width:auto; }
.jjs-topsoil-layout .areas-cover { max-width:var(--sw-width); margin:48px auto !important; padding:32px !important; background:#fff !important; border:1px solid #e2ded4; border-left:4px solid var(--gold); border-radius:6px !important; }
.jjs-topsoil-layout .areas-cover h2 { font-size:clamp(26px,2.5vw,32px); line-height:1.2; margin:0 0 18px; }
.jjs-topsoil-layout .areas-cover p { font-size:16px; line-height:1.9; margin:14px 0 0; }
@media (max-width:1376px) {
 .jjs-topsoil-layout .areas-cover { margin-inline:var(--sw-gutter) !important; }
}
@media (max-width:1099px) {
 .jjs-topsoil-layout .services-emergency { grid-template-columns:minmax(0,1fr); }
 .jjs-topsoil-layout .emergency-panel { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:28px; }
 .jjs-topsoil-layout .emergency-title { border-bottom:0; padding-bottom:0; }
 .jjs-topsoil-layout .check-list { padding-top:0; }
 .jjs-topsoil-layout .why-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .jjs-topsoil-layout .why-card:nth-child(n) { grid-column:span 2; }
 .jjs-topsoil-layout .why-card:last-child { grid-column:2 / span 2; }
 .jjs-topsoil-layout .jjs-sweeper-work__grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .jjs-topsoil-layout .jjs-sweeper-work__card:nth-child(n) { grid-column:span 2; }
 .jjs-topsoil-layout .jjs-sweeper-work__card:last-child { grid-column:2 / span 2; }
}
@media (max-width:759px) {
 .jjs-topsoil-layout .sweeper-hero { grid-template-columns:minmax(0,1fr); }
 .jjs-topsoil-layout .sweeper-hero__inner { grid-column:1; grid-row:1; padding:38px var(--sw-gutter); }
 .jjs-topsoil-layout .sweeper-hero h1 { font-size:clamp(40px,8vw,58px); max-width:15ch; }
 .jjs-topsoil-layout .sweeper-hero p { max-width:48ch; }
 .jjs-topsoil-layout .sweeper-hero > picture { grid-column:1; grid-row:2; min-height:0; height:auto; aspect-ratio:4 / 3; }
 .jjs-topsoil-layout .sweeper-hero img { object-fit:contain; }
 .jjs-topsoil-layout .emergency-panel { display:block; }
 .jjs-topsoil-layout .emergency-title { border-bottom:1px solid #805e00; padding-bottom:24px; }
 .jjs-topsoil-layout .check-list { padding-top:24px; }
 .jjs-topsoil-layout .environment-card { grid-template-columns:minmax(0,1fr); }
 .jjs-topsoil-layout .environment-card > picture { min-height:0; height:auto; aspect-ratio:4 / 3; }
 .jjs-topsoil-layout .environment-copy { padding:28px 24px; }
 .jjs-topsoil-layout .backblack-gallery { gap:10px; padding-inline:16px; }
 .jjs-topsoil-layout .backblack-shot span { left:6px; bottom:6px; padding:6px 7px; font-size:10px; }
 .jjs-topsoil-layout .safety-card { grid-template-columns:52px minmax(0,1fr); gap:18px; padding:24px; text-align:left; }
 .jjs-topsoil-layout .safety-symbol { width:52px; height:52px; margin:0; }
 .jjs-topsoil-layout .safety-symbol svg { width:38px; height:38px; }
 .jjs-topsoil-layout .aed-badge { grid-column:2; justify-self:start; padding:7px 14px; }
 .jjs-topsoil-layout .sweeper-cta__inner { flex-direction:column; align-items:stretch; }
 .jjs-topsoil-layout .cta-actions { width:100%; }
 .jjs-topsoil-layout .cta-actions a { width:100%; }
}
@media (max-width:599px) {
 .jjs-topsoil-layout .why-grid,
 .jjs-topsoil-layout .jjs-sweeper-work__grid { grid-template-columns:minmax(0,1fr); gap:18px; }
 .jjs-topsoil-layout .why-card:nth-child(n),
 .jjs-topsoil-layout .jjs-sweeper-work__card:nth-child(n) { grid-column:auto; }
 .jjs-topsoil-layout .why-card { display:grid; grid-template-columns:44px minmax(0,1fr); column-gap:18px; text-align:left; padding:24px; }
 .jjs-topsoil-layout .why-card .why-icon { width:44px; height:44px; grid-row:1 / 3; margin:0; }
 .jjs-topsoil-layout .why-card h3 { font-size:18px; margin:0 0 10px; }
 .jjs-topsoil-layout .backblack-gallery { grid-template-columns:minmax(0,1fr); padding-inline:20px; gap:18px; }
 .jjs-topsoil-layout .backblack-shot { aspect-ratio:auto; }
 .jjs-topsoil-layout .backblack-shot picture { height:auto; }
 .jjs-topsoil-layout .backblack-shot img { height:auto; }
 .jjs-topsoil-layout .backblack-shot span { left:12px; bottom:12px; font-size:12px; padding:8px 12px; }
 .jjs-topsoil-layout .jjs-sweeper-work__body { padding:24px; }
 .jjs-topsoil-layout .areas-cover { padding:24px !important; }
}
@media (max-width:379px) {
 .jjs-topsoil-layout .service-list { grid-template-columns:minmax(0,1fr) !important; }
 .jjs-topsoil-layout .emergency-title { flex-direction:column; }
 .jjs-topsoil-layout .safety-card { grid-template-columns:minmax(0,1fr); }
 .jjs-topsoil-layout .aed-badge { grid-column:1; }
}
@media (prefers-reduced-motion:reduce) { .jjs-topsoil-layout { scroll-behavior:auto; } }

/* Topsoil-specific fixes override older page and tablet !important rules. */
.jjs-topsoil-layout .topsoil-main .sweeper-hero { min-height:0 !important; }
.jjs-topsoil-layout .topsoil-main .sweeper-hero__inner { width:auto !important; padding:clamp(48px,5vw,72px) clamp(24px,4vw,64px) clamp(48px,5vw,72px) 0 !important; }
.jjs-topsoil-layout .topsoil-main .sweeper-hero h1 { font-size:clamp(42px,4.5vw,64px) !important; line-height:1.02 !important; max-width:none; }
.jjs-topsoil-layout .topsoil-main .sweeper-hero p { font-size:clamp(17px,1.7vw,20px) !important; }
/* Crop only the embedded editor controls, leaving the uploaded image unchanged. */
.jjs-topsoil-layout .topsoil-main .sweeper-hero > picture { align-self:center; min-height:0; height:auto; aspect-ratio:1536 / 934; overflow:hidden; }
.jjs-topsoil-layout .topsoil-main .sweeper-hero img { position:absolute; inset:auto; top:0; left:0; width:100%; height:auto; object-fit:fill !important; transform:translateY(-7.259528%); }
.jjs-topsoil-layout .topsoil-main .service-list { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
.jjs-topsoil-layout .feature-svg-icon { width:64px; height:64px; margin:0 auto 20px; box-shadow:none; }
.jjs-topsoil-layout .feature-svg-icon svg { width:48px; height:48px; }
.jjs-topsoil-layout .topsoil-main .topsoil-feature-split .environment-card { display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; align-items:center; }
.jjs-topsoil-layout .topsoil-main .topsoil-feature-split .environment-card > picture { height:auto !important; min-height:0 !important; }
.jjs-topsoil-layout .topsoil-main .topsoil-feature-split .environment-card > picture img { height:auto !important; min-height:0 !important; max-height:none !important; object-fit:contain !important; }
.jjs-topsoil-layout .topsoil-main .topsoil-options-card { min-height:0; }
.jjs-topsoil-layout .topsoil-main .backblack-gallery { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px !important; align-items:stretch; }
.jjs-topsoil-layout .topsoil-main .backblack-shot { aspect-ratio:4 / 5; background:#eeece5 !important; }
.jjs-topsoil-layout .topsoil-main .backblack-shot img { object-fit:contain !important; }
/* Third supply image has black bands in the file. Mask them without changing pixels. */
.jjs-topsoil-layout .topsoil-main .backblack-shot:nth-child(3) { display:flex; align-items:center; }
.jjs-topsoil-layout .topsoil-main .backblack-shot:nth-child(3) picture { position:relative; aspect-ratio:1536 / 1016; height:auto !important; overflow:hidden; flex:none; }
.jjs-topsoil-layout .topsoil-main .backblack-shot:nth-child(3) img { position:absolute; top:0; left:0; width:100% !important; height:auto !important; transform:translateY(-5.821025%); }
/* Four work examples use a 2x2 layout with the original screenshot masks. */
.jjs-topsoil-layout .jjs-service-work { padding:var(--sw-space) var(--sw-gutter); background:#fff; }
.jjs-topsoil-layout .jjs-service-work__inner { max-width:var(--sw-width); margin-inline:auto; }
.jjs-topsoil-layout .jjs-service-work__header { max-width:850px; margin-bottom:36px; }
.jjs-topsoil-layout .jjs-service-work__heading { font-size:clamp(29px,3.2vw,44px); line-height:1.13; letter-spacing:-.035em; }
.jjs-topsoil-layout .jjs-service-work__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1100px; gap:24px; margin-inline:auto; }
.jjs-topsoil-layout .jjs-service-work__card:nth-child(n) { display:flex; flex-direction:column; align-items:stretch; grid-column:auto; box-shadow:0 8px 20px rgb(0 0 0 / .035); }
.jjs-topsoil-layout .jjs-service-work__photo { aspect-ratio:4 / 3; }
.jjs-topsoil-layout .jjs-service-work__capture { width:var(--photo-width,100%); }
.jjs-topsoil-layout .jjs-service-work__body { padding:26px; }
.jjs-topsoil-layout .jjs-service-work__title { font-size:21px; line-height:1.2; text-transform:none; letter-spacing:-.015em; }
.jjs-topsoil-layout .jjs-service-work__description { font-size:16px; line-height:1.65; }
@media (max-width:759px) {
 .jjs-topsoil-layout .topsoil-main .sweeper-hero__inner { padding:38px var(--sw-gutter) !important; }
 .jjs-topsoil-layout .topsoil-main .sweeper-hero h1 { font-size:clamp(38px,8vw,58px) !important; }
 .jjs-topsoil-layout .topsoil-main .topsoil-feature-split .environment-card { grid-template-columns:minmax(0,1fr) !important; }
}
@media (max-width:599px) {
 .jjs-topsoil-layout .topsoil-main .service-list { grid-template-columns:minmax(0,1fr) !important; }
 .jjs-topsoil-layout .feature-svg-icon { grid-row:1 / 3; width:48px; height:48px; margin:0; }
 .jjs-topsoil-layout .feature-svg-icon svg { width:36px; height:36px; }
 .jjs-topsoil-layout .why-card { grid-template-columns:48px minmax(0,1fr); }
 .jjs-topsoil-layout .topsoil-main .backblack-gallery { grid-template-columns:minmax(0,1fr); }
 .jjs-topsoil-layout .topsoil-main .backblack-shot { aspect-ratio:auto; }
 .jjs-topsoil-layout .topsoil-main .backblack-shot:not(:nth-child(3)) picture,
 .jjs-topsoil-layout .topsoil-main .backblack-shot:not(:nth-child(3)) img { height:auto !important; }
 .jjs-topsoil-layout .jjs-service-work__grid { grid-template-columns:minmax(0,1fr); gap:18px; }
 .jjs-topsoil-layout .jjs-service-work__photo { aspect-ratio:auto; }
 .jjs-topsoil-layout .jjs-service-work__capture { width:100%; }
 .jjs-topsoil-layout .jjs-service-work__body { padding:24px; }
}
/* Avoid empty image space and a cramped usage column on smaller tablets. */
.jjs-topsoil-layout .topsoil-main .topsoil-feature-split .environment-card > picture { aspect-ratio:auto; }
@media (max-width:1000px) {
 .jjs-topsoil-layout .topsoil-main .topsoil-feature-split .environment-card { grid-template-columns:minmax(0,1fr) !important; }
}
@media (min-width:600px) and (max-width:1000px) {
 .jjs-topsoil-layout .environment-card .green-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 24px; }
}
