/* Projects map + job pages. Loaded only on /projects/ (when jobs exist) and /projects/<slug>/.
   Uses the tokens from digdig.css. Cache-busted automatically by tools/projects-map/build.mjs. */

/* ---------- Hub: map ---------- */
.dd-map-section{padding:56px 0 10px}
.dd-map-wrap{max-width:1280px;margin:0 auto;padding:0 32px}
.dd-map-heading{font-family:var(--dd-font-display);font-weight:900;font-size:clamp(24px,3.4vw,34px);text-transform:uppercase;color:#fff;margin:0 0 10px}
.dd-map-heading-sm{font-size:clamp(20px,2.6vw,26px);margin-bottom:22px}
.dd-map-lede{color:var(--dd-grey);margin:0 0 22px;font-size:16px;line-height:1.6;max-width:720px}

.dd-map-filters{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:flex-end;margin-bottom:18px}
.dd-map-filters label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--dd-grey-mid)}
.dd-map-filters select{appearance:none;background:var(--dd-panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23cfc7ba' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 12px center;color:var(--dd-cream);border:1px solid #3a352f;padding:11px 34px 11px 12px;font:600 15px var(--dd-font-body);min-width:150px;border-radius:0;cursor:pointer}
.dd-map-filters select:hover{border-color:var(--dd-grey-dark)}
.dd-map-reset{background:none;border:none;color:var(--dd-grey);text-decoration:underline;font:600 14px var(--dd-font-body);cursor:pointer;padding:11px 4px}
.dd-map-reset:hover{color:var(--dd-red)}
.dd-map-suburb-stat{display:none;margin:16px 0 0;padding:14px 18px;background:rgba(224,57,44,.12);border-left:3px solid var(--dd-red);font:700 16px/1.4 var(--dd-font-body);color:#fff}
.dd-map-suburb-stat[data-show="true"]{display:block}
.dd-map-suburb-stat strong{color:var(--dd-red);font-size:20px;font-family:var(--dd-font-display)}

.dd-map-stage{position:relative;border:1px solid #2a2622;background:var(--dd-panel)}
.dd-map{height:clamp(420px,68vh,640px);position:relative;background:var(--dd-panel)}
.dd-map-load{position:absolute;inset:0;margin:auto;width:max-content;height:max-content;background:var(--dd-red);color:#fff;border:none;padding:16px 28px;font:700 15px var(--dd-font-body);letter-spacing:.3px;text-transform:uppercase;cursor:pointer;z-index:2}
.dd-map-load:hover{background:var(--dd-red-dark)}
.dd-map .leaflet-container{background:#1b1917;font-family:var(--dd-font-body)}
/* Dark basemap from the standard OSM tiles; swap tile provider in projects-map.js if traffic outgrows OSM's policy. */
.dd-map .leaflet-tile-pane{filter:invert(1) hue-rotate(180deg) brightness(.92) contrast(.85) saturate(.55)}
.dd-map .leaflet-control-attribution{background:rgba(10,9,8,.75);color:var(--dd-grey-mid)}
.dd-map .leaflet-control-attribution a{color:var(--dd-grey)}
.dd-map .leaflet-bar a{background:var(--dd-panel);color:#fff;border-bottom-color:#3a352f}
.dd-map .leaflet-bar a:hover{background:var(--dd-red)}

.dd-pin-wrap{background:none;border:none}
.dd-pin{display:block;width:22px;height:22px;background:var(--dd-red);border:3px solid #fff;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.6);transition:transform .15s ease}
.dd-pin-wrap:hover .dd-pin,.dd-pin-wrap:focus-visible .dd-pin{transform:scale(1.2)}
.dd-pin-wrap[data-active="true"] .dd-pin{background:#fff;border-color:var(--dd-red);transform:scale(1.35)}

/* Photo-less historical dots — muted/smaller so the documented (photo) jobs read as the primary
   layer and these read as background coverage. Still clickable (small address-only popup). */
.dd-pin-muted{width:14px;height:14px;background:var(--dd-grey-dark);border:2px solid #fff;border-radius:50%;box-shadow:0 1px 5px rgba(0,0,0,.65);transition:transform .15s ease,background .15s ease}
.dd-pin-wrap-muted:hover .dd-pin-muted,.dd-pin-wrap-muted:focus-visible .dd-pin-muted{background:var(--dd-grey);transform:scale(1.4)}
.dd-pin-wrap-muted[data-active="true"] .dd-pin-muted{background:var(--dd-red);border-color:#fff;transform:scale(1.5)}
.dd-map .marker-cluster{background:rgba(224,57,44,.35)}
.dd-map .marker-cluster div{background:var(--dd-red);color:#fff;font:800 14px var(--dd-font-body);border:2px solid #fff}

.dd-map-panel{position:absolute;z-index:1000;top:14px;right:14px;width:min(340px,calc(100% - 28px));background:var(--dd-black);border-top:3px solid var(--dd-red);box-shadow:0 14px 40px rgba(0,0,0,.55)}
.dd-map-panel[hidden]{display:none}
.dd-map-panel img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.dd-map-panel-body{padding:16px 18px 18px}
.dd-map-panel h3{font-family:var(--dd-font-display);font-weight:800;font-size:19px;line-height:1.2;text-transform:uppercase;color:#fff;margin:0 0 8px}
.dd-map-panel p{margin:0 0 12px;font-size:14.5px;line-height:1.5;color:var(--dd-grey)}
.dd-map-panel .dd-map-panel-note{font-size:12.5px;color:var(--dd-grey-dark)}
.dd-map-panel-body-plain{padding-top:20px}
.dd-map-panel .dd-btn-red{padding:12px 20px;font-size:14px;text-transform:uppercase}
.dd-map-panel-close{position:absolute;top:8px;right:8px;background:rgba(20,19,18,.8);color:#fff;border:none;width:36px;height:36px;font-size:16px;cursor:pointer}
.dd-map-panel-close:hover{background:var(--dd-red)}

/* ---------- Hub: crawlable list ---------- */
.dd-joblist-wrap{padding-top:48px}
.dd-map-empty{color:var(--dd-grey);font-size:16px}
.dd-joblist-group{margin-bottom:34px}
.dd-joblist-group[hidden]{display:none}
.dd-joblist-group h3{font-family:var(--dd-font-display);font-weight:800;font-size:16px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dd-grey-mid);margin:0 0 8px;padding-bottom:8px;border-bottom:1px solid #2a2622}
.dd-joblist-count{margin:0 0 16px;font-size:14.5px;color:var(--dd-grey)}
.dd-joblist-highlights-h{font-size:11.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--dd-grey-dark);margin:0 0 12px}
.dd-joblist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.dd-jobcard{background:var(--dd-panel);display:flex;flex-direction:column;border-top:3px solid transparent}
.dd-jobcard[hidden]{display:none}
.dd-jobcard[data-active="true"]{border-top-color:var(--dd-red)}
.dd-jobcard-link{display:block;color:inherit;text-decoration:none;flex:1}
.dd-jobcard-link img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.dd-jobcard-body{display:flex;flex-direction:column;gap:5px;padding:14px 16px 8px}
.dd-jobcard-title{font-family:var(--dd-font-display);font-weight:800;font-size:16px;line-height:1.25;color:#fff;text-transform:uppercase}
a.dd-jobcard-link:hover .dd-jobcard-title{color:var(--dd-red)}
.dd-jobcard-meta{font-size:13.5px;color:var(--dd-grey-mid);line-height:1.45}
.dd-jobcard-show{background:none;border:none;border-top:1px solid #2a2622;color:var(--dd-grey);font:600 13px var(--dd-font-body);letter-spacing:.5px;text-transform:uppercase;padding:11px 16px;text-align:left;cursor:pointer}
.dd-jobcard-show:hover{color:var(--dd-red)}

/* ---------- Job page ---------- */
/* Hero + breadcrumb rules mirror the inline styles on /projects/ (job pages don't carry that block). */
.dd-hub-hero{position:relative;padding:150px 32px 60px;background:var(--dd-black-deep);text-align:center}
.dd-hub-hero-inner{max-width:820px;margin:0 auto}
.dd-hub-hero h1{font-family:var(--dd-font-display);font-weight:900;font-size:clamp(30px,4.8vw,52px);line-height:1.06;margin:14px 0 20px;text-transform:uppercase;color:#fff}
.dd-hub-lede{font-size:19px;line-height:1.62;color:var(--dd-grey);max-width:680px;margin:0 auto}
.dd-suburb-cta{text-align:center;padding:48px 32px 70px}
.dd-suburb-cta .dd-job-cta{max-width:280px;margin:0 auto 6px}
.dd-suburb-cta .dd-job-link{max-width:420px;margin:0 auto}
.dd-crumb{max-width:1080px;margin:0 auto;padding:22px 32px 0;font-size:13.5px;color:var(--dd-grey-dark)}
.dd-crumb a{color:var(--dd-grey);text-decoration:none}
.dd-crumb a:hover{color:var(--dd-red)}
.dd-job-hero{padding-bottom:36px}
.dd-job-layout{max-width:1180px;margin:0 auto;padding:36px 32px 0;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;align-items:start}
.dd-job-summary p{font-size:17.5px;line-height:1.7;color:var(--dd-cream);margin:0 0 18px}
.dd-jobvideo{aspect-ratio:16/9;background:#000;margin-bottom:28px}
.dd-jobvideo iframe,.dd-jobvideo-btn{display:block;width:100%;height:100%;border:0}
.dd-jobvideo-btn{position:relative;padding:0;background:#000;cursor:pointer}
.dd-jobvideo-btn img{width:100%;height:100%;object-fit:cover;opacity:.8}
.dd-jobvideo-play{position:absolute;inset:0;margin:auto;width:76px;height:76px;border-radius:50%;background:var(--dd-red);color:#fff;font-size:26px;display:flex;align-items:center;justify-content:center;padding-left:5px}
.dd-jobvideo-btn:hover .dd-jobvideo-play{background:var(--dd-red-dark)}
.dd-jobgallery{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:30px}
.dd-jobfig{margin:0}
.dd-jobfig img{display:block;width:100%;height:auto;background:var(--dd-panel)}
.dd-jobfig figcaption{font-size:13px;color:var(--dd-grey-mid);padding-top:7px}
.dd-job-side{position:sticky;top:96px;background:var(--dd-panel);padding:24px 24px 22px;border-top:3px solid var(--dd-red)}
.dd-job-facts{margin:0 0 14px}
.dd-job-facts div{padding:10px 0;border-bottom:1px solid #2a2622}
.dd-job-facts dt{font-size:11.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--dd-grey-dark)}
.dd-job-facts dd{margin:3px 0 0;font-size:16px;font-weight:600;color:#fff}
.dd-job-note{font-size:12.5px;color:var(--dd-grey-dark);margin:0 0 18px;line-height:1.5}
.dd-job-cta{display:block;text-align:center;padding:15px;font-size:15px;text-transform:uppercase;margin-bottom:14px}
.dd-job-link{display:block;color:var(--dd-grey);font-size:14.5px;padding:6px 0}
.dd-job-link:hover{color:var(--dd-red)}
.dd-jobrelated{max-width:1180px;margin:56px auto 0;padding:0 32px 70px}
.dd-jobrelated h2{font-family:var(--dd-font-display);font-weight:800;font-size:22px;text-transform:uppercase;color:#fff;margin:0 0 16px}
.dd-jobrelated ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.dd-jobrelated li{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:baseline;padding:12px 0;border-bottom:1px solid #2a2622}
.dd-jobrelated a{color:#fff;font-weight:700;text-decoration:none}
.dd-jobrelated a:hover{color:var(--dd-red)}
.dd-jobrelated span{font-size:13.5px;color:var(--dd-grey-mid)}
.dd-job-hero + .dd-crumb{max-width:1180px}

@media (max-width:880px){
  .dd-hub-hero{padding:120px 24px 44px}
  .dd-map-wrap{padding:0 20px}
  .dd-map{height:clamp(380px,62vh,560px)}
  .dd-map-filters select{min-width:0;width:100%}
  .dd-map-filters label{flex:1 1 42%}
  /* bottom sheet instead of a side card */
  .dd-map-panel{top:auto;right:0;bottom:0;left:0;width:auto;display:flex;max-height:46%}
  .dd-map-panel img{width:112px;height:auto;aspect-ratio:auto;align-self:stretch;object-fit:cover;flex:none}
  .dd-map-panel-body{padding:12px 44px 12px 14px;overflow:auto}
  .dd-map-panel h3{font-size:15px}
  .dd-map-panel p{font-size:13px;margin-bottom:8px}
  .dd-job-layout{grid-template-columns:1fr;gap:28px;padding:28px 20px 0}
  .dd-job-side{position:static;order:-1}
  .dd-jobgallery{grid-template-columns:1fr}
  .dd-jobrelated{padding:0 20px 56px}
}
