/* Nattivus: train arrival routes. Uses the site's existing font. */
.nvar-arrival-route {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 22px 0 28px;
  padding: 26px 28px 25px;
  border: 1px solid #e1e8e4;
  border-radius: 14px;
  background: #fff;
  color: #2f3d38;
  text-align: left;
}
.nvar-arrival-route * { box-sizing: border-box; }
.nvar-arrival-route .nvar-title {
  display: block;
  margin: 0 0 24px;
  padding: 0;
  color: #2f3d38;
  font-size: 21px;
  font-weight: 500;
  line-height: 1.35;
}
.nvar-arrival-route .nvar-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr) minmax(0,1fr) minmax(0,1fr);
  align-items: start;
  width: 100%;
}
.nvar-arrival-route .nvar-grid-destination {
  grid-template-columns: minmax(0,1fr) minmax(0,3fr) minmax(0,1fr);
}
.nvar-arrival-route .nvar-stop {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
  padding-top: 57px;
  text-align: center;
}
.nvar-arrival-route .nvar-dot {
  width: 9px;
  height: 9px;
  margin-bottom: 12px;
  border: 1.5px solid #a5a5a5;
  border-radius: 50%;
  background: #fff;
}
.nvar-arrival-route .nvar-city { max-width: 100%; overflow-wrap: break-word; font-size: 18px; font-weight: 500; line-height: 1.35; }
.nvar-arrival-route .nvar-leg {
  display: grid;
  grid-template-rows: 32px 24px 11px;
  justify-items: center;
  min-width: 0;
  color: #767676;
}
.nvar-arrival-route .nvar-vehicle { display: grid; place-items: center; width: 32px; height: 32px; }
.nvar-arrival-route .nvar-vehicle svg { display: block; width: 27px; height: 27px; }
.nvar-arrival-route .nvar-mode { padding-top: 3px; font-size: 12px; font-weight: 400; line-height: 1.4; color: #6c7a73; }
.nvar-arrival-route .nvar-arrow { position: relative; width: 100%; height: 11px; }
.nvar-arrival-route .nvar-arrow::before { content: ''; position: absolute; left: 0; right: 2px; top: 5px; border-top: 1.25px solid #50c9b1; }
.nvar-arrival-route .nvar-arrow::after { content: ''; position: absolute; right: 2px; top: 2px; width: 7px; height: 7px; border-top: 1.25px solid #50c9b1; border-right: 1.25px solid #50c9b1; transform: rotate(45deg); }
@media (max-width: 430px) {
  .nvar-arrival-route { padding: 22px 16px; }
  .nvar-arrival-route .nvar-title { font-size: 19px; margin-bottom: 23px; }
  .nvar-arrival-route .nvar-city { font-size: 15px; }
}



/* Compact editorial routes: shared metadata, explicit heading positions. */
.nvir-route { display:flex;align-items:center;gap:13px;max-width:430px;width:100%;box-sizing:border-box;margin:12px 0 18px;padding-top:20px;color:#59655f;font-size:14px;font-weight:400;line-height:1.3; }
.nvir-route .nvir-stop { flex:0 1 auto;min-width:0;overflow-wrap:anywhere; }
.nvir-route .nvir-leg { display:block;position:relative;flex:1 0 28px;height:1px;min-width:28px; }
.nvir-route .nvir-icon { position:absolute;left:50%;bottom:7px;transform:translateX(-50%);width:19px;height:19px;color:#767676;line-height:0; }
.nvir-route .nvir-icon svg { display:block;width:100%;height:100%; }
.nvir-route .nvir-line { display:block;position:relative;width:100%;height:1px;background:#50c9b1; }
.nvir-route .nvir-line::after { content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid #50c9b1;border-right:1px solid #50c9b1;transform:rotate(45deg); }
@media(max-width:560px) { .nvir-route { gap:9px;font-size:13px;padding-top:18px; } .nvir-route .nvir-icon { width:17px;height:17px; } }