.routing-page [hidden] { display:none!important; }
.routing-map { display:block; width:100%; height:auto; }
.routing-hero-map { display:flex; flex-direction:column; background:#f1f5f5; }
.routing-hero-map .routing-map { max-height:410px; }
.routing-hero-tag { order:-1; margin:14px; display:flex; align-items:center; gap:12px; background:#fff; border:1px solid #dce7ee; box-shadow:0 6px 18px #173b5612; border-radius:10px; padding:13px 16px; }
.routing-hero-tag>i { color:#087e70; font-size:1.6rem; }
.routing-hero-tag strong,.routing-hero-tag span { display:block; }
.routing-hero-tag strong { font-size:.86rem; }
.routing-hero-tag span { font-size:.65rem; color:#52677d; margin-top:3px; }
.routing-hero-stats { display:grid; grid-template-columns:repeat(3,1fr); padding:22px 12px; text-align:center; border-top:1px solid var(--solution-line); }
.routing-hero-stats>div+div { border-left:1px solid var(--solution-line); }
.routing-hero-stats strong { display:block; font-size:1.6rem; line-height:1.2; letter-spacing:-.04em; }
.routing-hero-stats span { font-size:.72rem; color:var(--solution-muted); }
.routing-demo { border:1px solid #d8e3ed; border-radius:14px; background:#fff; overflow:hidden; box-shadow:0 16px 48px #173b5609; }
.routing-stages { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--solution-line); }
.routing-stages button { border:0; border-bottom:3px solid transparent; padding:20px 12px; background:#fff; font-size:.86rem; color:var(--solution-muted); font-weight:650; }
.routing-stages button[aria-pressed=true] { background:#f1f7ff; color:#155fa0; border-bottom-color:#176fcb; }
.routing-stages button span { display:inline-flex; justify-content:center; align-items:center; width:26px; height:26px; border:1px solid #cddce8; border-radius:50%; margin-right:6px; font-size:.7rem; }
.routing-page button:focus-visible { outline:3px solid #155fa0; outline-offset:-4px; }
.routing-workspace { display:grid; grid-template-columns:1.35fr 1fr; }
.routing-map-wrap { background:#f1f5f5; display:flex; flex-direction:column; justify-content:center; position:relative; min-width:0; border-right:1px solid var(--solution-line); }
.routing-map-caption { padding:18px; text-align:center; font-size:.75rem; color:#52677d; }
.routing-sidebar { padding:28px; min-width:0; }
.routing-sidebar .solution-eyebrow { margin-bottom:10px; font-size:.65rem; }
.routing-page .routing-sidebar>p { font-size:.83rem; line-height:1.6; }
.routing-route-selector { display:flex; gap:6px; flex-wrap:wrap; margin:18px 0; }
.routing-route-selector button { border:1px solid #d6e1ed; border-radius:5px; background:white; color:#52677d; font-size:.7rem; padding:7px 9px; }
.routing-route-selector button[aria-pressed=true] { color:#155fa0; background:#edf5ff; border-color:#176fcb; }
.routing-sidebar [data-demo-summary] { border-top:1px solid #e1e8ee; padding-top:14px; font-size:.8rem; }
.routing-page .routing-sidebar [data-demo-summary] p { font-size:.75rem; margin:6px 0 16px; }
.routing-route-cards { display:grid; gap:10px; }
.routing-route-cards article { border:1px solid #e0e7ef; border-left:3px solid var(--route-color); border-radius:6px; padding:12px; }
.routing-route-cards article>div:first-child { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:5px; }
.routing-route-cards strong { font-size:.78rem; color:var(--route-color); }
.routing-route-cards span,.routing-route-cards small { font-size:.67rem; color:#52677d; }
.routing-page .routing-route-cards p { margin:7px 0; font-size:.74rem; line-height:1.5; }
.routing-route-cards p span { display:block; }
.routing-load { height:4px; background:#edf1f6; border-radius:3px; overflow:hidden; margin-bottom:5px; }
.routing-load span { display:block; height:100%; background:var(--route-color); }
.routing-insight { display:flex; align-items:flex-start; gap:9px; background:#f0f6fc; color:#345570; border-radius:6px; padding:12px; font-size:.74rem; line-height:1.65; margin-top:18px; }
.routing-insight i { color:#176fcb; }
.routing-demo-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:18px 24px; border-top:1px solid var(--solution-line); }
.routing-demo-footer>span { color:#52677d; font-size:.72rem; }
.routing-stop-list { padding:0; margin:15px 0 0; list-style:none; counter-reset:stop; }
.routing-stop-list li { display:flex; align-items:center; gap:10px; font-size:.8rem; padding:12px 0; border-bottom:1px solid #e0e7ef; counter-increment:stop; }
.routing-stop-list li::before { content:counter(stop); display:grid; place-items:center; background:var(--selected-color,#176fcb); color:white; flex:0 0 25px; height:25px; border-radius:50%; font-size:.7rem; font-weight:700; }
.routing-demo[data-stage=pedidos] .routing-path,.routing-demo[data-stage=pedidos] .routing-pin-number { display:none; }
.routing-demo[data-stage=pedidos] .routing-pin circle { fill:#61768a; }
.routing-demo .routing-muted { opacity:.18; }
.routing-features { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.routing-features article { padding:28px; border:1px solid var(--solution-line); border-radius:10px; }
.routing-features article>i { display:block; color:var(--solution-blue); font-size:1.6rem; margin-bottom:20px; }
.routing-page .routing-features p { font-size:.92rem; margin-bottom:0; }
.routing-review { border:1px solid #d5e1ec; border-radius:14px; background:#fff; box-shadow:0 14px 40px #173b5609; overflow:hidden; }
.routing-review-heading { display:flex; align-items:center; gap:15px; background:#f0f6fc; padding:26px; }
.routing-review-heading .solution-feature-icon { margin:0; }
.routing-review-heading strong,.routing-review-heading span:not(.solution-feature-icon) { display:block; }
.routing-review-heading span:not(.solution-feature-icon) { font-size:.8rem; color:#52677d; margin-top:4px; }
.routing-review ol { list-style:none; padding:0 26px; margin:0; }
.routing-review li { display:flex; gap:15px; align-items:center; padding:26px 0; border-bottom:1px solid var(--solution-line); }
.routing-review li>span { color:#7a8fa3; font-size:.8rem; }
.routing-review li>i { margin-left:auto; color:#087e70; font-size:1.25rem; }
.routing-page .routing-review li p { margin:5px 0 0; font-size:.8rem; }
.routing-review-ready { padding:25px; font-size:.82rem; color:#155fa0; }
@media(max-width:1199px) { .routing-sidebar { padding:20px; } .routing-workspace { grid-template-columns:1.15fr 1fr; } }
@media(max-width:991px) { .routing-workspace { grid-template-columns:1fr; } .routing-map-wrap { border-right:0; border-bottom:1px solid var(--solution-line); } .routing-map-wrap svg { max-height:460px; } .routing-route-cards { grid-template-columns:repeat(3,1fr); } .routing-features { grid-template-columns:repeat(2,1fr); } }
@media(max-width:767px) { .routing-stages button { padding:14px 5px; font-size:.7rem; line-height:1.5; } .routing-stages button span { display:flex; margin:0 auto 6px; } .routing-route-cards { grid-template-columns:1fr; } .routing-features { grid-template-columns:1fr; } .routing-hero-tag { margin:10px; padding:8px 10px; gap:8px; } .routing-hero-tag strong { font-size:.73rem; } .routing-hero-tag span { font-size:.57rem; } .routing-hero-tag>i { font-size:1.2rem; } .routing-sidebar { padding:20px; } .routing-demo-footer { padding:18px 20px; } .routing-review-heading,.routing-review-ready { padding:20px; } .routing-review ol { padding:0 20px; } }

/* Local cartography and route geometry share the same coordinate space. */
.routing-cartography { width:100%; min-width:0; background:#f1f0ea; }
.routing-map-source { display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px; padding:8px 12px; background:#ffffffd9; color:#617386; font-size:.65rem; }
.solution-page main .routing-map-source a { color:#52677d!important; text-decoration:underline!important; text-underline-offset:2px; }
.routing-hero-map .routing-map { max-height:none; }
.routing-map-wrap .routing-map { max-height:none; }
.routing-map-wrap { background:#f1f0ea; }
.routing-map-caption { background:#f7f9fc; }
.routing-stop-list strong,.routing-stop-list li span { display:block; }
.routing-stop-list strong { font-size:.79rem; font-weight:600; }
.routing-stop-list li span { font-size:.69rem; color:#617386; margin-top:4px; }
.routing-demo .routing-muted { opacity:.24; }
