  body { margin: 0;  font-family: 'Segoe UI', sans-serif;  background: linear-gradient(to bottom right, #c2e9fb, #a1c4fd, #cfd9ff);  color: #333;  padding: 15px;padding-bottom:5px; }
    header {  text-align: center;  margin-bottom: 20px;    }
    header h1 {color: #6a1b9a; font-size: 2.5rem; text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2); margin-top:-15px;    }
    .scroll-btn {position: fixed;right: 15px;width: 45px; height: 45px; border-radius: 50%;border: 1px solid #999; background: rgba(255, 255, 255, 0.2); color: #333;
      font-size: 20px; backdrop-filter: blur(4px); transition: 0.3s; box-shadow: 0 2px 6px rgba(0,0,0,0.2);}
    .scroll-btn:hover {  background: rgba(255, 255, 255, 0.4); transform: scale(1.1); }
       #up { bottom: 70px; }
      #down { bottom: 15px; }
    .nav a {background-color: #7b1fa2; color: #fff; text-decoration: none;  padding:8px 20px;  border-radius: 10px;  font-weight: bold;  display: inline-block; margin-top:-15px;    }
    .schedule {      max-width: 1000px;      margin: auto;      display: flex;      flex-direction: column;      gap: 05px;    }
    .bus-card {      background: #fff;      border-left: 6px solid #6a1b9a;      border-radius: 8px;      padding: 16px;      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);      transform: scale(0.95);      transform-origin: top;    }
    .bus-number {      font-size: 1.1rem;      font-weight: bold;      color: #512da8;    }
    .bus-origin {      font-weight: bold;      color: #0288d1;    }
    .bus-via {      font-style: italic;      color: #666;      margin-left: 5px;    }
    .driver-info {      margin-top: 5px;      font-size: 1rem;    }
    .driver-name {     font-weight: bold;      color: #6a1b9a;    }
    .driver-number {     font-weight: bold;      color: #6a1b9a;    } 
    
    
    /* MOBILE VIEW */
@media (max-width: 600px) {

  body {
    padding: 10px;
  }

  header h1 {
    font-size: 1.7rem;
    margin-top: -5px;
  }

  .nav a {
    padding: 6px 14px;
    font-size: 0.9rem;
  }

  .schedule {
    gap: 12px;
  }

  .bus-card {
    padding: 14px;
    transform: scale(1);   /* mobile la normal size */
  }

  .bus-number {
    font-size: 1rem;
  }

  .bus-origin {
    font-size: 1rem;
  }

  .bus-via {
    font-size: 0.9rem;
  }

  .driver-info {
    font-size: 0.9rem;
  }

  .scroll-btn {
    width: 38px;
    height: 38px;
    font-size: 16px;
    right: 10px;
  }

  #up { bottom: 65px; }
  #down { bottom: 12px; }

}
