/* North Snow Removal – enhancements (2026-09-28) */

/* 1) Header "Get a Quote" button: make it clearly active */
.site-header .btn.btn-primary,
.site-header a.btn-primary {
  color: #091426 !important;
  font-weight: 700;
  opacity: 1 !important;
  box-shadow: 0 0 0 1px rgba(143, 227, 255, .55), 0 10px 28px rgba(143, 227, 255, .28);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.site-header .btn.btn-primary:hover,
.site-header a.btn-primary:hover {
  background: #bdf0ff;
  transform: translateY(-1px);
  box-shadow: 0 0 0 1px rgba(143, 227, 255, .8), 0 14px 34px rgba(143, 227, 255, .38);
}

/* 2) Faster, subtler reveal animations */
.reveal {
  transform: translateY(10px);
  transition: opacity .38s ease-out, transform .38s ease-out !important;
}
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* 3) Service area section + map */
#areas .coverage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
}
@media (max-width: 900px) {
  #areas .coverage { grid-template-columns: 1fr; }
}
.nsr-area-lead {
  color: var(--muted, #91a4bd);
  font-size: 1.02rem;
  line-height: 1.6;
  margin: 10px 0 22px;
  max-width: 34rem;
}
#areaTags.area-tags span { cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease; }
#areaTags.area-tags span:hover,
#areaTags.area-tags span.is-active {
  background: rgba(143, 227, 255, .14);
  border-color: rgba(143, 227, 255, .6);
  color: #fff;
}

.nsr-check {
  margin-top: 26px;
  padding: 20px;
  border: 1px solid var(--line, rgba(143, 227, 255, .14));
  border-radius: var(--radius, 18px);
  background: linear-gradient(180deg, rgba(23, 48, 79, .75), rgba(18, 38, 65, .75));
  box-shadow: var(--shadow, 0 24px 80px rgba(0, 0, 0, .28));
  max-width: 34rem;
}
.nsr-check h3 { margin: 0 0 4px; font-size: 1.05rem; color: var(--text, #f4f8fc); }
.nsr-check p.nsr-check-sub { margin: 0 0 14px; color: var(--muted, #91a4bd); font-size: .92rem; }
.nsr-check form { display: flex; gap: 10px; }
.nsr-check input {
  flex: 1; min-width: 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(143, 227, 255, .25);
  background: rgba(9, 20, 38, .7);
  color: var(--text, #f4f8fc);
  font: inherit;
}
.nsr-check input:focus { outline: none; border-color: var(--ice, #8fe3ff); box-shadow: 0 0 0 3px rgba(143, 227, 255, .18); }
.nsr-check button {
  padding: 12px 16px;
  border: 0;
  border-radius: 12px;
  background: var(--ice, #8fe3ff);
  color: #091426;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.nsr-check button[disabled] { opacity: .6; cursor: progress; }
@media (max-width: 480px) { .nsr-check form { flex-direction: column; } }
.nsr-check-result { margin-top: 12px; font-size: .95rem; line-height: 1.5; min-height: 1.2em; color: var(--text, #f4f8fc); }
.nsr-check-result.ok { color: var(--green, #7be0a6); }
.nsr-check-result.near { color: var(--amber, #ffb238); }
.nsr-check-result.no { color: #ff9b9b; }
.nsr-check-result a.nsr-inline-cta {
  display: inline-block; margin-top: 8px; color: #091426; background: var(--ice, #8fe3ff);
  padding: 8px 12px; border-radius: 10px; font-weight: 700; text-decoration: none;
}

.service-map.nsr-map-wrap {
  aspect-ratio: 4 / 3 !important;
  border-radius: 24px !important;
  max-width: none;
  border: 1px solid rgba(143, 227, 255, .3);
  background: #0b1a2e;
  overflow: hidden;
  position: relative;
}
.service-map.nsr-map-wrap::before,
.service-map.nsr-map-wrap::after { display: none !important; }
@media (max-width: 900px) { .service-map.nsr-map-wrap { aspect-ratio: 1 / 1 !important; } }
#serviceMap.nsr-map { position: absolute; inset: 0; width: 100%; height: 100%; background: #0b1a2e; border-radius: inherit; }
.nsr-map .leaflet-tile { filter: invert(1) hue-rotate(185deg) brightness(.92) contrast(.88) saturate(.55); }
.nsr-map .leaflet-control-attribution { background: rgba(9, 20, 38, .75) !important; color: #7f93ad !important; font-size: 10px; }
.nsr-map .leaflet-control-attribution a { color: #a9c3dd !important; }
.nsr-map .leaflet-control-zoom a {
  background: rgba(18, 38, 65, .92) !important; color: var(--text, #f4f8fc) !important;
  border-color: rgba(143, 227, 255, .2) !important;
}
.nsr-map .leaflet-control-zoom a:hover { background: rgba(35, 66, 104, .95) !important; }

.nsr-pin { position: relative; }
.nsr-pin-dot {
  position: absolute; left: -7px; top: -7px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--ice, #8fe3ff); box-shadow: 0 0 0 4px rgba(143, 227, 255, .25), 0 0 18px rgba(143, 227, 255, .8);
}
.nsr-pin-dot::after {
  content: ""; position: absolute; inset: -4px; border-radius: 50%;
  border: 2px solid rgba(143, 227, 255, .6); animation: nsrPulse 2.4s ease-out infinite;
}
.nsr-pin-label {
  position: absolute; left: 14px; top: -14px; white-space: nowrap;
  padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: .02em;
  background: rgba(9, 20, 38, .9); color: #fff; border: 1px solid rgba(143, 227, 255, .35);
}
.nsr-home-dot {
  position: absolute; left: -8px; top: -8px; width: 16px; height: 16px; border-radius: 50%;
  background: var(--amber, #ffb238); border: 3px solid #091426; box-shadow: 0 0 0 3px rgba(255, 178, 56, .45);
}
@keyframes nsrPulse { from { transform: scale(1); opacity: .9; } to { transform: scale(2.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .nsr-pin-dot::after { animation: none; } }

.nsr-map-legend {
  position: absolute; left: 14px; top: 14px; z-index: 500;
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: 12px;
  background: rgba(9, 20, 38, .85); border: 1px solid rgba(143, 227, 255, .25);
  color: var(--text, #f4f8fc); font-size: 12px; font-weight: 600;
  backdrop-filter: blur(6px);
}
.nsr-map-legend i { width: 12px; height: 12px; border-radius: 50%; background: rgba(143, 227, 255, .25); border: 1.5px dashed var(--ice, #8fe3ff); }
.nsr-map-hint {
  position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 500;
  padding: 7px 12px; border-radius: 999px; font-size: 12px;
  background: rgba(9, 20, 38, .8); color: #c9d8e8; border: 1px solid rgba(143, 227, 255, .2);
  pointer-events: none; transition: opacity .25s ease;
}
.nsr-map-wrap.is-active .nsr-map-hint { opacity: 0; }

/* 4) Cookie consent */
.nsr-cc {
  position: fixed; left: 20px; bottom: 20px; z-index: 10000;
  width: min(420px, calc(100vw - 32px));
  padding: 20px; border-radius: 18px;
  background: rgba(15, 32, 56, .97); color: var(--text, #f4f8fc);
  border: 1px solid rgba(143, 227, 255, .25);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
  font-size: .92rem; line-height: 1.5;
  transform: translateY(12px); opacity: 0; transition: opacity .25s ease, transform .25s ease;
}
.nsr-cc.show { opacity: 1; transform: none; }
.nsr-cc h4 { margin: 0 0 6px; font-size: 1rem; }
.nsr-cc p { margin: 0 0 14px; color: #b7c6d8; }
.nsr-cc-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.nsr-cc-actions button {
  flex: 1 1 auto; padding: 10px 14px; border-radius: 12px; font: inherit; font-weight: 700; cursor: pointer;
}
.nsr-cc-accept { background: var(--ice, #8fe3ff); color: #091426; border: 0; }
.nsr-cc-decline { background: transparent; color: var(--text, #f4f8fc); border: 1px solid rgba(143, 227, 255, .35); }
.nsr-cc-accept:hover { background: #bdf0ff; }
.nsr-cc-decline:hover { background: rgba(143, 227, 255, .08); }
.nsr-cc-link { background: none; border: 0; padding: 0; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; opacity: .8; }
.nsr-cc-link:hover { opacity: 1; }
@media (max-width: 600px) {
  .nsr-cc { left: 16px; right: 16px; bottom: 96px; width: auto; }
}

/* stacking fix */
#serviceMap.nsr-map { z-index: 1; }
.service-map .nsr-map-legend, .service-map .nsr-map-hint { z-index: 1001 !important; }

/* ===== 2026-09-28 (b): pickup truck scenes, hero background, mobile ===== */
.hero::before {
  background-image: linear-gradient(90deg, rgba(9,20,38,.98) 0%, rgba(9,20,38,.93) 38%, rgba(9,20,38,.3) 72%, rgba(9,20,38,.56) 100%), url("assets/hero-winter.svg?v=2") !important;
}
.weather-card { position: relative; overflow: visible !important; }
.nsr-card-truck {
  position: absolute; left: 0; right: 0; bottom: calc(100% - 9px);
  aspect-ratio: 520 / 200; pointer-events: none; z-index: 2;
}
.nsr-card-truck svg { display: block; width: 100%; height: 100%; overflow: visible; }
@media (max-width: 900px) {
  .weather-card { margin-top: calc((100vw - 32px) * .36); }
}
.cta-banner__truck svg { display: block; width: 100%; height: 100%; }