/* =====================================================================
   p-oriente.css — /fumigacion-oriente-estado-de-mexico/ · efecto firma «Ruta»
   El estado inicial del efecto vive SOLO bajo .rt--vivo (lo pone p-oriente.js):
   sin JS o con movimiento reducido la ruta se ve completa y todas las paradas encendidas.
   ===================================================================== */
.rt-hero .h1{font-size:clamp(2.6rem,5.2vw,5.3rem)}

/* ---------- boleto de la ruta (hero) ---------- */
.rt-ticket{position:relative;justify-self:center;width:min(100%,400px);padding:1.4rem 1.5rem 1.2rem;border-radius:22px;background:#fff;color:var(--estudio);box-shadow:0 40px 80px -30px rgba(0,0,0,.65);transform:rotate(1.6deg)}
.rt-ticket::before,.rt-ticket::after{content:"";position:absolute;top:4.15rem;width:22px;height:22px;border-radius:50%;background:var(--estudio)}
.rt-ticket::before{left:-11px}.rt-ticket::after{right:-11px}
.rt-tk-top{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-bottom:1.05rem;margin-bottom:.6rem;border-bottom:2px dashed rgba(1,47,74,.22);font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--gris)}
.rt-tk-top b{font:400 1.45rem/1 var(--f-display);letter-spacing:.02em;color:var(--estudio)}
.rt-tk-list{counter-reset:tk 1}
.rt-tk-list li{position:relative;display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.62rem 0 .62rem 2.1rem;border-bottom:1px solid #E3EEF5;font-weight:600;font-size:.98rem}
.rt-tk-list li::before{counter-increment:tk;content:counter(tk,decimal-leading-zero);position:absolute;left:0;top:.6rem;font:400 1.05rem/1 var(--f-display);color:var(--magenta)}
.rt-tk-list li:last-child{border-bottom:0}
.rt-tk-list b{flex:none;font-variant-numeric:tabular-nums;color:var(--pcd)}
.rt-tk-pie{margin-top:.6rem;font-size:.76rem;line-height:1.4;color:var(--gris)}
.fx .rt-ticket{animation:rtTk 1.2s var(--ease) .35s both}
@keyframes rtTk{from{opacity:0;transform:translateY(40px) rotate(6deg)}}

.rt-prose{margin-top:clamp(1.8rem,3.5vw,2.6rem)}

/* ---------- la ruta: mapa anclado + paradas ---------- */
.rt-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:start}
.rt-map{position:sticky;top:calc(var(--hdr) + 1.2rem);display:flex;flex-direction:column;height:calc(100vh - var(--hdr) - 2.4rem);height:calc(100svh - var(--hdr) - 2.4rem);max-height:780px;margin:0}
.rt-frame{position:relative;flex:1;min-height:0;border-radius:28px;background:radial-gradient(120% 90% at 30% 85%,#07324F,#001B2E 70%);box-shadow:inset 0 0 0 1px rgba(37,244,238,.2),0 40px 80px -40px rgba(0,0,0,.8);overflow:hidden}
.rt-svg{position:absolute;inset:0;width:100%;height:100%}
.rt-svg .mu{fill:rgba(255,255,255,.03);stroke:rgba(169,199,218,.28);stroke-width:1;stroke-dasharray:3 4}
.rt-svg .mu-izt{fill:rgba(37,244,238,.1);stroke:var(--cian);stroke-width:1.4}
.rt-svg .la{fill:none;stroke:rgba(254,44,85,.55);stroke-width:2;stroke-dasharray:6 5}
.rt-svg .ml{font:700 9.5px var(--f-body);letter-spacing:.16em;fill:rgba(169,199,218,.6)}
.rt-svg .ml-lago{font-style:italic;font-weight:500;font-size:11px;letter-spacing:.04em;fill:rgba(37,244,238,.6)}
.rt-svg .ml-la{fill:rgba(254,44,85,.75)}
.rt-svg .rt-cas{fill:none;stroke:#001B2E;stroke-width:11;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.rt-svg .rt-base{fill:none;stroke:rgba(255,255,255,.22);stroke-width:2.5;stroke-dasharray:1 7;stroke-linecap:round}
.rt-svg .rt-line{fill:none;stroke:var(--cian);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}
.rt-pt .o{fill:#001B2E;stroke:var(--cian);stroke-width:2.5;transition:stroke .4s,fill .4s}
.rt-pt .i{fill:none;stroke:var(--cian);stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.rt-pt .nm{font:700 9.5px var(--f-body);fill:#fff}
.rt-pt .lb{font:600 13px var(--f-body);fill:#fff;paint-order:stroke;stroke:#001B2E;stroke-width:4px;stroke-linejoin:round;transition:fill .4s}
.rt-pt.is-base .o{fill:var(--magenta);stroke:#fff}
.rt-svg .l-sm{display:none}
.rt-van{opacity:0}
.rt-van .vh{fill:rgba(254,44,85,.28);transform-box:fill-box;transform-origin:center}
.rt-van .vd{fill:var(--magenta);stroke:#fff;stroke-width:2}
/* encendido (solo con JS y sin movimiento reducido) */
.rt--vivo .rt-van{opacity:1;transition:opacity .4s}
.rt--vivo .rt-pt:not(.is-on) .o{stroke:rgba(169,199,218,.4)}
.rt--vivo .rt-pt:not(.is-on) .lb{fill:rgba(255,255,255,.5)}
.rt--vivo .rt-pt.is-on .i{animation:rtHalo 1.3s ease-out}
@keyframes rtHalo{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(2.6)}}
@media (prefers-reduced-motion:no-preference){.rt--vivo .rt-van .vh{animation:rtVan 1.8s ease-out infinite}}
@keyframes rtVan{0%{transform:scale(.7);opacity:.9}100%{transform:scale(2);opacity:0}}

.rt-hud{position:relative;display:flex;margin-top:.7rem;flex-wrap:wrap;align-items:center;gap:.25rem .65rem;padding:.6rem .85rem;border-radius:12px;background:rgba(0,17,29,.86);box-shadow:inset 0 0 0 1px rgba(37,244,238,.3);font-size:.86rem;color:var(--bruma)}
.rt-hud b{color:#fff;font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.rt-dot{width:9px;height:9px;border-radius:50%;background:var(--rec);flex:none}
.rt-pie{margin-top:.7rem;font-size:.74rem;line-height:1.4;color:var(--niebla)}

.rt-stop{display:flex;align-items:center;min-height:min(70vh,640px);padding-block:1.2rem}
.rt-stop:first-child{min-height:min(50vh,440px);align-items:flex-start;padding-top:0}
.rt-card{position:relative;width:100%;padding:clamp(1.4rem,2.4vw,2.1rem);border-radius:26px;background:rgba(255,255,255,.045);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:background-color .5s,box-shadow .5s}
.rt-card h3{margin:.75rem 0 .8rem;font-size:clamp(1.7rem,2.4vw,2.3rem)}
.rt-card p{color:var(--niebla);line-height:1.65}
.rt-card p+p{margin-top:.8rem}
.rt-card strong{color:#fff}
.rt-card .rt-k{display:flex;align-items:center;gap:.75rem;font-size:.74rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cian)}
.rt-k b{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(37,244,238,.12);font:400 1.3rem/1 var(--f-display);letter-spacing:.02em;color:#fff;transition:background-color .4s}
.rt-card .rt-tags{margin-top:1.1rem;padding-top:.85rem;border-top:1px solid rgba(255,255,255,.1);font-size:.92rem}
.rt-tags a,.rt-lnk{color:#fff;font-weight:600;text-decoration:underline;text-decoration-color:var(--cian);text-decoration-thickness:2px;text-underline-offset:.2em}
.rt-lnk{padding:0;border:0;background:none;font:inherit;font-weight:600;cursor:pointer;text-align:left}
.rt-lnk:hover,.rt-tags a:hover{text-decoration-color:currentColor}
.rt--vivo .rt-stop.is-act .rt-card{background:rgba(37,244,238,.07);box-shadow:inset 0 0 0 1.5px rgba(37,244,238,.55),0 30px 60px -30px rgba(0,0,0,.6)}
.rt--vivo .rt-stop.is-act .rt-k b{background:var(--magenta)}

.rt-otros{margin-top:1.4rem}
.faq-side .btn-white svg{fill:var(--wa)}
.rt-cierre{display:grid;grid-template-columns:minmax(0,1.2fr) auto;gap:1.2rem 3rem;align-items:center;margin-top:clamp(2.4rem,5vw,3.6rem);padding-top:clamp(2rem,4vw,2.8rem);border-top:1px solid rgba(255,255,255,.12)}
.rt-cierre .ctas{margin-top:0}

@media (max-width:1023px){
  .rt-hero .phero-grid,.rt-cierre{grid-template-columns:minmax(0,1fr)}
  .rt-ticket{margin-top:.6rem}
}
@media (max-width:900px){
  .rt-wrap{display:block}
  .rt-map{top:var(--hdr);z-index:3;height:48vh;height:48svh;max-height:none;margin-inline:calc(var(--gut) * -1);padding:.4rem var(--gut) .5rem;background:var(--madrugada)}
  .rt-frame{border-radius:20px}
  .rt-pie{margin-top:.35rem;font-size:.66rem}
  .rt-stops{position:relative;z-index:1;display:grid;gap:1rem;margin-top:1rem}
  .rt-stop,.rt-stop:first-child{min-height:0;padding:0}
  .rt-svg .l-lg{display:none}
  .rt-svg .l-sm{display:inline}
  .rt-svg .lb{font-size:21px;stroke-width:5px}
  .rt-svg .ml{font-size:13px}
  .rt-svg .ml-lago{font-size:15px}
  .rt-hud{margin-top:.4rem;padding:.35rem .65rem;font-size:.74rem}
  .rt-hud b{font-size:.68rem}
}
