/* SureShow Street Route Motion v4.2
   True street/block motion with real trailing paths computed in JS.
   Routes are visible but still background-level. */
:root{
  --ss-navy:#0A1B3D; --ss-blue:#0D6DFF; --ss-green:#22C55E;
  --ss-green-bright:#2AF27E; --ss-yellow:#FFE14A; --ss-yellow-core:#FFD21F;
  --ss-road:rgba(89,105,130,.28); --ss-road-soft:rgba(89,105,130,.16);
}
.ss-street-v42-section{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#fff 0%,#f7fbff 48%,#fff 100%)}
.ss-street-v42-section::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at var(--ss-glow-x,82%) 35%,rgba(13,109,255,.10),transparent 28rem),radial-gradient(circle at var(--ss-success-x,82%) 72%,rgba(34,197,94,.08),transparent 26rem),radial-gradient(circle at 12% 82%,rgba(255,225,74,.06),transparent 21rem)}
.ss-street-v42-section.ss-pin-left{--ss-glow-x:18%;--ss-success-x:18%}
.ss-street-v42-section{--ss-panel-glass-top:.70;--ss-panel-glass-bottom:.54;--ss-bubble-glass:.64;--ss-reply-glass-top:.70;--ss-reply-glass-bottom:.60}
.ss-street-v42-layer{position:absolute;inset:-3% -4%;z-index:0;pointer-events:none;user-select:none;opacity:1}
.ss-street-v42-section>*:not(.ss-street-v42-layer){position:relative;z-index:2}
.ss-street-v42-layer svg{display:block;width:100%;height:100%;overflow:visible}
.ss-v42-road{fill:none;stroke:var(--ss-road);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:8 12;opacity:.78}
.ss-v42-road-soft{fill:none;stroke:var(--ss-road-soft);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:6 13;opacity:.55}
.ss-v42-trail{fill:none;stroke:var(--ss-yellow);stroke-width:5.2;stroke-linecap:round;stroke-linejoin:round;opacity:.9;filter:drop-shadow(0 0 5px rgba(255,225,74,.8)) drop-shadow(0 0 18px rgba(255,210,31,.42))}
.ss-v42-trail.green{stroke:var(--ss-green-bright);opacity:.78;filter:drop-shadow(0 0 6px rgba(42,242,126,.58)) drop-shadow(0 0 18px rgba(42,242,126,.30))}
.ss-v42-orb-glow{fill:rgba(255,225,74,.26);filter:blur(.25px)}
.ss-v42-orb-core{fill:var(--ss-yellow-core);filter:drop-shadow(0 0 7px rgba(255,225,74,.95)) drop-shadow(0 0 20px rgba(255,210,31,.55))}
.ss-v42-orb.confirmed .ss-v42-orb-glow{fill:rgba(42,242,126,.24)}
.ss-v42-orb.confirmed .ss-v42-orb-core{fill:var(--ss-green-bright);filter:drop-shadow(0 0 7px rgba(42,242,126,.8)) drop-shadow(0 0 20px rgba(42,242,126,.42))}
.ss-v42-orb-echo{fill:none;stroke:rgba(42,242,126,.58);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.ss-v42-orb.pulse .ss-v42-orb-echo{animation:ssV42OrbEcho .8s ease-out 1}
@keyframes ssV42OrbEcho{0%{opacity:.85;transform:scale(.8)}100%{opacity:0;transform:scale(2.8)}}
.ss-v42-pin{opacity:.94;filter:drop-shadow(0 18px 34px rgba(13,109,255,.34)) drop-shadow(0 0 24px rgba(13,109,255,.22))}
.ss-v42-pin-body{fill:var(--ss-blue);transition:fill .35s ease, filter .35s ease}
.ss-v42-pin.success{filter:drop-shadow(0 18px 34px rgba(34,197,94,.28)) drop-shadow(0 0 28px rgba(42,242,126,.30))}
.ss-v42-pin.success .ss-v42-pin-body{fill:var(--ss-green);filter:drop-shadow(0 0 18px rgba(42,242,126,.45))}
.ss-v42-pin-face{fill:rgba(255,255,255,.22);stroke:rgba(255,255,255,.96);stroke-width:4.5}
.ss-v42-pin-hand{stroke:#fff;stroke-width:4;stroke-linecap:round}
.ss-v42-pin-center{fill:#fff}
.ss-v42-pin-ripple{fill:none;stroke:rgba(42,242,126,.66);stroke-width:2.5;opacity:0;transform-box:fill-box;transform-origin:center}.ss-v42-pin.success .ss-v42-pin-ripple.r1{animation:ssV42Ripple 1.05s ease-out 1}.ss-v42-pin.success .ss-v42-pin-ripple.r2{animation:ssV42Ripple 1.25s ease-out .10s 1}.ss-v42-pin.success .ss-v42-pin-ripple.r3{animation:ssV42Ripple 1.45s ease-out .20s 1}.ss-v42-pin.success .ss-v42-pin-ripple.r4{animation:ssV42Ripple 1.65s ease-out .30s 1}
@keyframes ssV42Ripple{0%{opacity:.9;transform:scale(.55)}68%{opacity:.32}100%{opacity:0;transform:scale(2.35)}}
.ss-v42-node-ring{fill:rgba(13,109,255,.055);stroke:rgba(13,109,255,.16);stroke-width:1.3}.ss-v42-node-dot{fill:rgba(13,109,255,.50)}
.ss-v42-glass,.ss-street-v42-section .ss-glass-card{background:linear-gradient(180deg,rgba(255,255,255,.89),rgba(255,255,255,.72));border:1px solid rgba(13,109,255,.12);box-shadow:0 24px 70px rgba(10,27,61,.11),0 0 0 1px rgba(255,255,255,.68) inset;backdrop-filter:blur(15px) saturate(135%);-webkit-backdrop-filter:blur(15px) saturate(135%)}
.ss-street-v42-section.route-dark{background:linear-gradient(180deg,#07152f 0%,#0a1b3d 100%)}.ss-street-v42-section.route-dark .ss-v42-road{stroke:rgba(190,205,236,.28)}.ss-street-v42-section.route-dark .ss-v42-road-soft{stroke:rgba(190,205,236,.16)}
@media(max-width:820px){.ss-street-v42-layer{inset:-2% -14%;}.ss-v42-road{stroke-width:2.35;opacity:.72}.ss-v42-trail{stroke-width:5.6}.ss-v42-pin{opacity:.96}}
@media(prefers-reduced-motion:reduce){.ss-v42-orb,.ss-v42-trail{display:none}.ss-v42-pin-ripple{opacity:.12}}

/* SureShow site integration: keep high-brightness hero motion out of copy. */
.map-hero.ss-street-v42-section .ss-street-v42-layer{
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,transparent 36%,rgba(0,0,0,.32) 46%,#000 58%);
  mask-image:linear-gradient(90deg,transparent 0%,transparent 36%,rgba(0,0,0,.32) 46%,#000 58%);
}
@media(max-width:820px){
  .map-hero.ss-street-v42-section .ss-street-v42-layer{
    transform:translateY(-3%);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,transparent 16%,rgba(0,0,0,.36) 28%,#000 42%);
    mask-image:linear-gradient(180deg,transparent 0%,transparent 16%,rgba(0,0,0,.36) 28%,#000 42%);
  }
}

.ss-street-v42-section .step,
.ss-street-v42-section .card,
.ss-street-v42-section .status-card,
.ss-street-v42-section .flow-visual span,
.ss-street-v42-section .domino-visual span,
.ss-street-v42-section .sms-box,
.ss-street-v42-section .sms-message.light{
  background:linear-gradient(180deg,rgba(255,255,255,var(--ss-panel-glass-top)),rgba(248,250,252,var(--ss-panel-glass-bottom)));
  border-color:rgba(13,109,255,.16);
  box-shadow:0 18px 46px rgba(10,27,61,.09),0 0 0 1px rgba(255,255,255,.55) inset;
  backdrop-filter:blur(10px) saturate(130%);
  -webkit-backdrop-filter:blur(10px) saturate(130%);
}
.ss-street-v42-section .sms-box{
  color:#071934;
  background:linear-gradient(180deg,rgba(255,255,255,var(--ss-panel-glass-top)),rgba(248,250,252,var(--ss-panel-glass-bottom)));
  border:1px solid rgba(13,109,255,.14);
  box-shadow:0 22px 58px rgba(10,27,61,.11),0 0 0 1px rgba(255,255,255,.58) inset;
  backdrop-filter:blur(13px) saturate(135%);
  -webkit-backdrop-filter:blur(13px) saturate(135%);
}
.ss-street-v42-section .sms-message{
  color:#17243a;
  background:rgba(255,255,255,var(--ss-bubble-glass));
  border:1px solid rgba(13,109,255,.08);
  box-shadow:0 10px 26px rgba(10,27,61,.07);
  backdrop-filter:blur(8px) saturate(130%);
  -webkit-backdrop-filter:blur(8px) saturate(130%);
}
.ss-street-v42-section .sms-message.reply{
  color:#064428;
  background:linear-gradient(180deg,rgba(209,250,229,var(--ss-reply-glass-top)),rgba(187,247,208,var(--ss-reply-glass-bottom)));
  border-color:rgba(34,197,94,.18);
}
.ss-street-v42-section .step h3,
.ss-street-v42-section .card h3,
.ss-street-v42-section .domino-visual span,
.ss-street-v42-section .flow-visual span{
  color:#071934;
}
.ss-street-v42-section .step p,
.ss-street-v42-section .card p,
.ss-street-v42-section .card li{
  color:#34445d;
}
.ss-street-v42-section > .route-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
}
@media(max-width:820px){
  .ss-street-v42-section .step,
  .ss-street-v42-section .card,
  .ss-street-v42-section .status-card,
  .ss-street-v42-section .flow-visual span,
  .ss-street-v42-section .domino-visual span,
  .ss-street-v42-section .sms-box,
  .ss-street-v42-section .sms-message.light{
    backdrop-filter:blur(12px) saturate(130%);
    -webkit-backdrop-filter:blur(12px) saturate(130%);
  }
}
