/* Auto & transport world: instrument cluster and the roadside moment. */
.wd-hero--dash .wd-hero-grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); }
.wa { position: relative; padding: 10px 0 24px; }
.wa-panel { position: relative; padding: 18px 14px 6px; border-radius: 200px 200px 34px 34px / 120px 120px 34px 34px; background: radial-gradient(ellipse 70% 80% at 50% 20%, #13223A, #070B14 75%); border: 1px solid rgba(106,205,224,.22); box-shadow: 0 40px 100px rgba(0,0,0,.6), inset 0 2px 0 rgba(238,241,246,.06), inset 0 -20px 40px rgba(0,0,0,.4); }
.wa-svg { display: block; width: 100%; height: auto; }
.wa-arc { fill: none; stroke: rgba(238,241,246,.08); stroke-width: 10; stroke-linecap: round; }
.wa-arc-hot { fill: none; stroke: url(#ix-grad); stroke-width: 10; stroke-linecap: round; stroke-dasharray: 0 100; transition: stroke-dasharray 1.6s cubic-bezier(.16,1,.3,1); filter: drop-shadow(0 0 8px rgba(106,205,224,.55)); }
.wa-ticks path { stroke: rgba(238,241,246,.45); stroke-linecap: round; }
.wa-ticks text { fill: #9AA8BC; font-family: var(--font-mono); font-size: 11px; }
.wa-lbl { fill: #9AA8BC; font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; }
.wa-val { fill: #fff; font-family: var(--font-heading); font-size: 38px; font-weight: 800; letter-spacing: -.02em; }
.wa-unit { fill: #6ACDE0; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; }
.wa-needle { transform: rotate(-135deg); transition: transform 1.6s cubic-bezier(.34,1.3,.5,1); }
.wa-needle path { fill: #3CC9A8; filter: drop-shadow(0 0 6px rgba(60,201,168,.8)); }
.wa-hub { fill: #0B1220; stroke: #3CC9A8; stroke-width: 3; }
.wa-screen { position: absolute; left: 50%; top: 20%; width: 21%; transform: translateX(-50%); padding: 12px 12px 10px; border-radius: 12px; background: #04070D; border: 1px solid rgba(106,205,224,.28); box-shadow: inset 0 0 24px rgba(52,163,188,.12); }
.wa-screen-k { display: block; margin-bottom: 8px; font-family: var(--font-mono); font-size: .52rem; letter-spacing: .14em; text-transform: uppercase; color: #3CC9A8; }
.wa-screen ol { list-style: none; margin: 0; padding: 0; min-height: 132px; }
.wa-screen li { display: none; flex-direction: column; gap: 2px; padding: 6px 0; border-top: 1px solid rgba(238,241,246,.08); font-family: var(--font-mono); }
.wa-screen li.on, .wa-screen li.on + li, .wa-screen li.on + li + li { display: flex; }
.wa-screen li.on { animation: waIn .5s ease both; }
@keyframes waIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.wa-screen li b { font-size: .7rem; color: #fff; }
.wa-screen li span { font-family: var(--font-heading); font-size: .72rem; font-weight: 700; color: #C4D0DD; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wa-screen li em { font-style: normal; font-size: .54rem; letter-spacing: .06em; color: #6ACDE0; }
.wa-lights { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 14px; }
.wa-lights span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border-radius: 99px; background: rgba(238,241,246,.04); border: 1px solid rgba(238,241,246,.1); font-family: var(--font-mono); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; color: #9AA8BC; }
.wa-lights svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.wa-lights span.on { color: #3CC9A8; border-color: rgba(60,201,168,.35); box-shadow: 0 0 14px rgba(60,201,168,.18); }

/* roadside */
.wa-rs { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; align-items: center; }
.wa-phone-wrap { display: flex; justify-content: center; }
.wa-phone { width: 300px; padding: 12px; border-radius: 44px; background: #0B1220; box-shadow: 0 40px 90px rgba(11,18,32,.35); }
.wa-ph-top { display: flex; justify-content: space-between; padding: 6px 16px 10px; font-family: var(--font-heading); font-size: .72rem; font-weight: 700; color: #EEF1F6; }
.wa-ph-q { display: flex; align-items: center; gap: 8px; margin: 0 4px 10px; padding: 11px 14px; border-radius: 99px; background: #fff; font-family: Arial, sans-serif; font-size: .82rem; color: #202124; }
.wa-ph-q svg { width: 16px; height: 16px; fill: none; stroke: #5B6B82; stroke-width: 2.4; stroke-linecap: round; }
.wa-map { position: relative; height: 170px; border-radius: 18px 18px 0 0; background: #EDF2F7; overflow: hidden; }
.wa-map svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.wa-pin { position: absolute; width: 30px; height: 30px; margin: -30px 0 0 -15px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: #9AA8BC; box-shadow: 0 6px 14px rgba(11,18,32,.3); }
.wa-pin b { position: absolute; inset: 0; display: grid; place-items: center; transform: rotate(45deg); font-family: var(--font-heading); font-size: .72rem; font-weight: 800; color: #fff; }
.wa-pin--you { background: #19728A; width: 38px; height: 38px; margin: -38px 0 0 -19px; animation: waBob 2.4s ease-in-out infinite; }
@keyframes waBob { 0%, 100% { transform: rotate(-45deg) translate(0, 0); } 50% { transform: rotate(-45deg) translate(3px, -3px); } }
.wa-car { position: absolute; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: #3CC9A8; box-shadow: 0 0 0 6px rgba(60,201,168,.25); }
.wa-list { list-style: none; margin: 0; padding: 8px; border-radius: 0 0 26px 26px; background: #fff; }
.wa-list li { position: relative; padding: 10px 70px 10px 10px; border-bottom: 1px solid #EEF1F6; font-family: Arial, sans-serif; }
.wa-list li:last-child { border-bottom: 0; }
.wa-list b { display: block; font-size: .8rem; color: #202124; }
.wa-list span { font-size: .68rem; color: #5F6368; }
.wa-list em { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); padding: 6px 12px; border-radius: 99px; border: 1px solid #DADCE0; font-style: normal; font-size: .7rem; font-weight: 700; color: #1a73e8; }
.wa-list li.on { background: rgba(60,201,168,.1); border-radius: 12px; }
.wa-list li.on em { background: #19728A; border-color: #19728A; color: #fff; }
.wa-rs-copy h2 { font-family: var(--font-heading); font-size: clamp(1.9rem, 3.4vw, 2.6rem); font-weight: 800; line-height: 1.1; letter-spacing: -.035em; color: var(--gx-ink); margin: 16px 0 18px; }
.wa-rs-copy > p { margin: 0 0 20px; font-size: 1rem; line-height: 1.7; color: var(--gx-body); }
.wa-rs-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.wa-rs-l li { padding: 16px 18px; border-radius: 16px; background: var(--gx-card); border: 1px solid var(--gx-line); }
.wa-rs-l b { display: block; font-family: var(--font-heading); font-size: .95rem; color: var(--gx-ink); }
.wa-rs-l span { display: block; margin-top: 4px; font-size: .84rem; line-height: 1.5; color: var(--gx-body); }
.wa-rs-note { text-align: left; }

@media (max-width: 1100px) {
    .wd-hero--dash .wd-hero-grid { grid-template-columns: minmax(0, 1fr); }
    .wa { max-width: 720px; }
    .wa-rs { grid-template-columns: minmax(0, 1fr); gap: 36px; }
}
@media (max-width: 760px) {
    .wa-panel { padding: 10px 6px 4px; border-radius: 120px 120px 22px 22px / 70px 70px 22px 22px; }
    .wa-screen { position: static; width: auto; transform: none; margin: 4px 8px 10px; }
    .wa-screen ol { min-height: 0; }
    .wa-lights span { font-size: .52rem; padding: 6px 10px; }
    .wa-rs-l { grid-template-columns: minmax(0, 1fr); }
    .wa-phone { width: 280px; }
}
@media (prefers-reduced-motion: reduce) { .wa-needle, .wa-arc-hot { transition: none; } .wa-pin--you { animation: none; } }
.wa-rs-copy > p.gx-footnote { font-size: .76rem; margin: 14px 0 0; }