:root{
    --blue-900:#0f172a;
    --blue-700:#1d3fd6;
    --blue-600:#2952ea;
    --blue-500:#3b63f0;
    --orange-500:#f2762e;
    --orange-400:#f5924f;
    --ink:#0f172a;
    --gray-700:#475569;
    --gray-500:#64748b;
    --gray-300:#cbd5e1;
    --gray-200:#e2e8f0;
    --gray-100:#f1f5f9;
    --gray-50:#f8fafc;
    --white:#ffffff;
    --green:#16a34a;
    --radius-lg:20px;
    --radius-md:14px;
    --radius-sm:10px;
    --shadow-md:0 10px 30px -10px rgba(15,23,42,.12);
    --shadow-lg:0 24px 60px -16px rgba(15,23,42,.18);
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--ink);
    background:var(--white);
    line-height:1.5;
  }
  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  ul{list-style:none;margin:0;padding:0;}
  button{font-family:inherit;cursor:pointer;}
  .container{
    max-width:1200px;
    margin:0 auto;
    padding:0 24px;
  }
  .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:13px 22px;
    border-radius:999px;
    font-weight:600;
    font-size:15px;
    border:none;
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
    white-space:nowrap;
  }
  .btn:hover{transform:translateY(-1px);}
  .btn-primary{
    background:linear-gradient(135deg,var(--blue-600),var(--blue-500));
    color:#fff;
    box-shadow:0 10px 24px -8px rgba(41,82,234,.55);
  }
  .btn-primary:hover{box-shadow:0 14px 30px -8px rgba(41,82,234,.65);}
  .btn-outline{
    background:#fff;
    color:var(--blue-600);
    border:1.5px solid var(--gray-200);
  }
  .btn-outline:hover{border-color:var(--blue-500);}
  .btn-dark{
    background:var(--blue-900);
    color:#fff;
  }
  .eyebrow{
    display:inline-block;
    font-size:12.5px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--blue-600);
    background:rgba(41,82,234,.08);
    padding:6px 14px;
    border-radius:999px;
    margin-bottom:16px;
  }
  .section{padding:96px 0;}
  .section-head{
    max-width:640px;
    margin:0 auto 56px;
    text-align:center;
  }
  .section-head h2{
    font-size:clamp(28px,3.6vw,40px);
    margin:0 0 14px;
    letter-spacing:-.02em;
  }
  .section-head p{
    color:var(--gray-500);
    font-size:17px;
    margin:0;
  }

  /* Topbar */
  .topbar{
    background:var(--blue-900);
    color:#cbd5e1;
    font-size:13.5px;
  }
  .topbar .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-top:10px;
    padding-bottom:10px;
    gap:12px;
    flex-wrap:wrap;
  }
  .topbar strong{color:var(--orange-400);font-weight:600;}
  .topbar-contact{display:flex;gap:22px;flex-wrap:wrap;}
  .topbar-contact span{display:inline-flex;align-items:center;gap:6px;}

  /* Header */
  header.site{
    position:sticky;top:0;z-index:50;
    background:rgba(255,255,255,.9);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--gray-200);
  }
  .nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 0;
    gap:24px;
  }
  .logo{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:21px;
    font-weight:800;
    letter-spacing:-.02em;
  }
  .logo-mark{
    width:36px;height:36px;
    border-radius:10px;
    background:linear-gradient(135deg,var(--blue-600),var(--orange-500));
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:18px;font-weight:800;
    flex-shrink:0;
  }
  .nav-links{
    display:flex;
    align-items:center;
    gap:34px;
    font-weight:600;
    font-size:15px;
    color:var(--gray-700);
  }
  .nav-links a{padding:6px 0;border-bottom:2px solid transparent;transition:color .15s;}
  .nav-links a:hover, .nav-links a.active{color:var(--blue-600);}
  .nav-links a.active{border-color:var(--blue-600);}
  .nav-right{display:flex;align-items:center;gap:18px;}
  .nav-right .account{font-weight:600;font-size:15px;color:var(--gray-700);}
  .nav-toggle{display:none;background:none;border:none;padding:8px;}
  .nav-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;}

  /* Hero */
  .hero{
    position:relative;
    overflow:hidden;
    padding:72px 0 90px;
    background:
      radial-gradient(1100px 480px at 15% -10%, rgba(41,82,234,.10), transparent 60%),
      radial-gradient(900px 420px at 100% 10%, rgba(242,118,46,.12), transparent 55%);
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:56px;
    align-items:center;
  }
  .badge-pill{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#fff;
    border:1px solid var(--gray-200);
    padding:7px 16px 7px 8px;
    border-radius:999px;
    font-size:13.5px;
    font-weight:600;
    box-shadow:var(--shadow-md);
    margin-bottom:26px;
  }
  .badge-pill .tag{
    background:var(--blue-600);
    color:#fff;
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    padding:4px 9px;
    border-radius:999px;
  }
  .hero h1{
    font-size:clamp(38px,5vw,58px);
    line-height:1.06;
    letter-spacing:-.03em;
    margin:0 0 22px;
  }
  .hero h1 .grad{
    background:linear-gradient(100deg,var(--blue-600),var(--orange-500));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .hero p.lead{
    font-size:18px;
    color:var(--gray-500);
    max-width:520px;
    margin:0 0 34px;
  }
  .track-form{
    display:flex;
    align-items:center;
    gap:10px;
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:999px;
    padding:8px 8px 8px 20px;
    box-shadow:var(--shadow-md);
    max-width:520px;
  }
  .track-form input{
    flex:1;
    border:none;
    outline:none;
    font-size:15px;
    font-family:inherit;
    background:transparent;
    padding:10px 0;
  }
  .hero-stats{
    display:flex;
    align-items:center;
    gap:26px;
    margin-top:28px;
    flex-wrap:wrap;
    color:var(--gray-700);
    font-size:14.5px;
    font-weight:600;
  }
  .hero-stats .stars{color:var(--orange-500);letter-spacing:2px;}
  .hero-stats span{display:inline-flex;align-items:center;gap:7px;}
  .dot-ok{width:8px;height:8px;border-radius:50%;background:var(--green);display:inline-block;}

  /* Tracking card */
  .track-card{
    position:relative;
    background:#fff;
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-lg);
    border:1px solid var(--gray-200);
    padding:26px;
  }
  .track-card-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .track-card-top .label{font-size:12.5px;color:var(--gray-500);font-weight:600;}
  .track-card-top .num{font-size:22px;font-weight:800;letter-spacing:-.01em;margin-top:2px;}
  .status-pill{
    background:#dcfce7;color:#15803d;
    font-size:12px;font-weight:700;
    padding:5px 12px;border-radius:999px;
  }
  .route{
    display:flex;align-items:center;gap:8px;
    color:var(--gray-500);font-size:14px;margin:10px 0 16px;
  }
  .progress-bar{
    height:6px;border-radius:999px;background:var(--gray-200);
    overflow:hidden;margin-bottom:22px;
  }
  .progress-bar>span{
    display:block;height:100%;width:78%;
    background:linear-gradient(90deg,var(--blue-600),var(--orange-500));
    border-radius:999px;
  }
  .timeline{position:relative;padding-left:26px;}
  .timeline::before{
    content:"";position:absolute;left:9px;top:6px;bottom:6px;width:2px;
    background:var(--gray-200);
  }
  .timeline li{position:relative;padding-bottom:20px;}
  .timeline li:last-child{padding-bottom:0;}
  .timeline li::before{
    content:"";position:absolute;left:-26px;top:2px;width:18px;height:18px;
    border-radius:50%;background:#fff;border:2px solid var(--gray-300);
  }
  .timeline li.done::before{border-color:var(--green);background:var(--green);}
  .timeline li.active::before{border-color:var(--blue-600);background:var(--blue-600);}
  .timeline li .t-title{font-weight:700;font-size:14.5px;}
  .timeline li.active .t-title{color:var(--blue-600);}
  .timeline li .t-sub{font-size:13px;color:var(--gray-500);margin-top:2px;}
  .floating-chip{
    position:absolute;
    right:-14px;bottom:-18px;
    background:#fff;border:1px solid var(--gray-200);
    border-radius:16px;padding:12px 18px;
    box-shadow:var(--shadow-md);
    display:flex;align-items:center;gap:10px;
  }
  .floating-chip .ic{
    width:34px;height:34px;border-radius:10px;
    background:#ffedd5;color:var(--orange-500);
    display:flex;align-items:center;justify-content:center;font-size:16px;
  }
  .floating-chip .l1{font-size:11.5px;color:var(--gray-500);}
  .floating-chip .l2{font-size:14px;font-weight:700;}

  /* Stats strip */
  .stats-strip{
    background:var(--blue-900);
    color:#fff;
    padding:52px 0;
  }
  .stats-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    text-align:center;
  }
  .stats-grid .num{
    font-size:clamp(28px,4vw,40px);
    font-weight:800;
    background:linear-gradient(100deg,#8fb0ff,var(--orange-400));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .stats-grid .lbl{color:#94a3b8;font-size:14px;margin-top:6px;font-weight:600;}

  /* Features */
  .features-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
  }
  .feature-card{
    background:var(--gray-50);
    border:1px solid var(--gray-200);
    border-radius:var(--radius-md);
    padding:30px 26px;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  }
  .feature-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-md);
    border-color:transparent;
    background:#fff;
  }
  .feature-icon{
    width:46px;height:46px;
    border-radius:12px;
    display:flex;align-items:center;justify-content:center;
    font-size:22px;
    margin-bottom:18px;
    background:linear-gradient(135deg,var(--blue-600),var(--blue-500));
    color:#fff;
  }
  .feature-card:nth-child(3n+2) .feature-icon{background:linear-gradient(135deg,var(--orange-500),var(--orange-400));}
  .feature-card:nth-child(3n) .feature-icon{background:linear-gradient(135deg,#0ea5a3,#22c1a3);}
  .feature-card h3{font-size:18px;margin:0 0 10px;}
  .feature-card p{color:var(--gray-500);font-size:14.5px;margin:0;}

  /* How it works */
  .steps{
    background:var(--gray-50);
  }
  .steps-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:28px;
    position:relative;
  }
  .step{
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:var(--radius-md);
    padding:28px 22px;
    text-align:left;
    position:relative;
  }
  .step-num{
    width:38px;height:38px;
    border-radius:50%;
    background:var(--blue-900);
    color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-weight:800;font-size:15px;
    margin-bottom:16px;
  }
  .step h3{font-size:16.5px;margin:0 0 8px;}
  .step p{color:var(--gray-500);font-size:14px;margin:0;}

  /* Testimonials */
  .testimonials-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
  }
  .testi-card{
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:var(--radius-md);
    padding:28px;
    box-shadow:var(--shadow-md);
  }
  .testi-stars{color:var(--orange-500);letter-spacing:2px;margin-bottom:14px;}
  .testi-card p{font-size:15px;color:var(--gray-700);margin:0 0 20px;}
  .testi-author{display:flex;align-items:center;gap:12px;}
  .avatar{
    width:40px;height:40px;border-radius:50%;
    background:linear-gradient(135deg,var(--blue-600),var(--orange-500));
    color:#fff;display:flex;align-items:center;justify-content:center;
    font-weight:700;font-size:15px;
  }
  .testi-author .name{font-weight:700;font-size:14.5px;}
  .testi-author .role{font-size:13px;color:var(--gray-500);}

  /* FAQ */
  .faq-wrap{max-width:760px;margin:0 auto;}
  .faq-item{
    border-bottom:1px solid var(--gray-200);
  }
  .faq-q{
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    background:none;border:none;
    padding:22px 4px;
    font-size:16.5px;font-weight:600;
    text-align:left;
    color:var(--ink);
  }
  .faq-q .plus{
    font-size:20px;color:var(--blue-600);
    transition:transform .2s ease;
    flex-shrink:0;margin-left:16px;
  }
  .faq-item.open .faq-q .plus{transform:rotate(45deg);}
  .faq-a{
    max-height:0;overflow:hidden;
    transition:max-height .25s ease;
  }
  .faq-a p{
    margin:0 0 22px;
    color:var(--gray-500);
    font-size:14.5px;
    padding-right:30px;
  }

  /* CTA */
  .cta{
    background:linear-gradient(120deg,var(--blue-700),var(--blue-500) 60%,var(--orange-500));
    border-radius:28px;
    margin:0 24px;
    padding:64px 40px;
    text-align:center;
    color:#fff;
    max-width:1152px;
    margin-inline:auto;
  }
  .cta h2{font-size:clamp(26px,3.4vw,36px);margin:0 0 14px;}
  .cta p{color:rgba(255,255,255,.85);margin:0 0 30px;font-size:16px;}
  .cta-actions{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;}
  .cta .btn-outline{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.35);}
  .cta .btn-outline:hover{background:rgba(255,255,255,.2);}
  .cta .btn-primary{background:#fff;color:var(--blue-700);box-shadow:none;}

  /* Footer */
  footer.site{
    background:var(--blue-900);
    color:#94a3b8;
    padding:70px 0 26px;
    font-size:14.5px;
  }
  .footer-grid{
    display:grid;
    grid-template-columns:1.6fr 1fr 1fr 1.3fr;
    gap:40px;
    padding-bottom:44px;
    border-bottom:1px solid rgba(148,163,184,.15);
  }
  .footer-brand .logo{color:#fff;}
  .footer-brand p{max-width:280px;margin:16px 0 20px;line-height:1.6;}
  .status-ok{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#cbd5e1;}
  footer h4{color:#fff;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;margin:0 0 18px;}
  footer ul li{margin-bottom:12px;}
  footer ul a:hover{color:#fff;}
  .contact-item{margin-bottom:16px;}
  .contact-item .l1{font-size:12.5px;color:#64748b;}
  .contact-item .l2{color:#e2e8f0;font-weight:600;font-size:14px;margin-top:2px;}
  .footer-bottom{
    display:flex;justify-content:space-between;align-items:center;
    padding-top:26px;font-size:13px;flex-wrap:wrap;gap:12px;
  }

  /* Page hero (inner pages) */
  .page-hero{
    background:
      radial-gradient(1100px 480px at 15% -20%, rgba(59,99,240,.35), transparent 60%),
      radial-gradient(900px 420px at 100% 0%, rgba(242,118,46,.28), transparent 55%),
      var(--blue-900);
    color:#fff;
    padding:64px 0 58px;
    text-align:center;
  }
  .page-hero .crumb{
    font-size:13.5px;
    color:#93a5e8;
    font-weight:600;
    margin-bottom:14px;
  }
  .page-hero .crumb a{color:#cbd5e1;}
  .page-hero .crumb a:hover{color:#fff;}
  .page-hero h1{
    font-size:clamp(30px,4.2vw,46px);
    letter-spacing:-.02em;
    margin:0 0 14px;
  }
  .page-hero p{
    color:#b9c3dd;
    max-width:560px;
    margin:0 auto;
    font-size:16.5px;
  }

  /* Tracking page: search bar embedded in the dark hero */
  .tracking-hero{padding-bottom:52px;}
  .hero-search{
    max-width:640px;
    margin:32px auto 0;
    display:flex;
    align-items:center;
    gap:12px;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.16);
    border-radius:14px;
    padding:8px 8px 8px 18px;
    backdrop-filter:blur(6px);
  }
  .hero-search .search-ic{
    width:20px;height:20px;flex-shrink:0;
    color:#8b98bd;
  }
  .hero-search input{
    flex:1;
    border:none;outline:none;background:transparent;
    font-size:15px;font-family:inherit;
    color:#fff;
    padding:10px 0;
  }
  .hero-search input::placeholder{color:#8b98bd;}
  .btn-orange{
    background:var(--orange-500);
    color:#fff;
    box-shadow:0 10px 24px -8px rgba(242,118,46,.55);
  }
  .btn-orange:hover{background:var(--orange-400);}

  /* Value / team / job cards */
  .value-grid, .team-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
  }
  .value-card{
    background:var(--gray-50);
    border:1px solid var(--gray-200);
    border-radius:var(--radius-md);
    padding:26px 22px;
  }
  .value-card .feature-icon{margin-bottom:14px;}
  .value-card h3{font-size:16.5px;margin:0 0 8px;}
  .value-card p{color:var(--gray-500);font-size:14px;margin:0;}

  .team-card{text-align:center;}
  .team-card .avatar{
    width:76px;height:76px;font-size:24px;margin:0 auto 14px;
  }
  .team-card h3{font-size:16px;margin:0 0 4px;}
  .team-card p{color:var(--gray-500);font-size:13.5px;margin:0;}

  .job-list{display:flex;flex-direction:column;gap:16px;max-width:820px;margin:0 auto;}
  .job-card{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:var(--radius-md);
    padding:24px 26px;
    transition:box-shadow .18s ease, transform .18s ease;
  }
  .job-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
  .job-card h3{font-size:17px;margin:0 0 8px;}
  .job-meta{display:flex;gap:10px;flex-wrap:wrap;}
  .job-tag{
    font-size:12px;font-weight:700;
    padding:4px 11px;border-radius:999px;
    background:rgba(41,82,234,.08);color:var(--blue-600);
  }
  .job-tag.alt{background:#ffedd5;color:var(--orange-500);}

  /* Forms */
  .form-card{
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-md);
    padding:36px;
  }
  .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  .field{margin-bottom:20px;}
  .field label{
    display:block;font-size:13.5px;font-weight:700;
    margin-bottom:8px;color:var(--ink);
  }
  .field input, .field textarea, .field select{
    width:100%;
    font-family:inherit;
    font-size:15px;
    padding:12px 14px;
    border:1.5px solid var(--gray-200);
    border-radius:var(--radius-sm);
    outline:none;
    transition:border-color .15s ease;
    background:#fff;
    color:var(--ink);
  }
  .field input:focus, .field textarea:focus, .field select:focus{border-color:var(--blue-500);}
  .field textarea{resize:vertical;min-height:130px;}
  .form-success{
    display:none;
    align-items:center;
    gap:10px;
    background:#dcfce7;
    color:#15803d;
    font-weight:600;
    font-size:14.5px;
    padding:14px 18px;
    border-radius:var(--radius-sm);
    margin-bottom:22px;
  }
  .form-success.show{display:flex;}

  /* Contact info cards */
  .contact-cards{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
    margin-bottom:56px;
  }
  .contact-card{
    background:var(--gray-50);
    border:1px solid var(--gray-200);
    border-radius:var(--radius-md);
    padding:26px;
    text-align:center;
  }
  .contact-card .feature-icon{margin:0 auto 16px;}
  .contact-card h3{font-size:15.5px;margin:0 0 8px;}
  .contact-card p{color:var(--gray-500);font-size:14px;margin:0;}

  /* Auth card */
  .auth-wrap{max-width:440px;margin:0 auto;}
  .tab-switch{
    display:flex;
    background:var(--gray-100);
    border-radius:999px;
    padding:5px;
    margin-bottom:28px;
  }
  .tab-switch button{
    flex:1;
    border:none;background:none;
    padding:11px 0;
    font-weight:700;
    font-size:14.5px;
    color:var(--gray-500);
    border-radius:999px;
    transition:background .15s ease, color .15s ease;
  }
  .tab-switch button.active{background:#fff;color:var(--blue-600);box-shadow:var(--shadow-md);}
  .auth-panel{display:none;}
  .auth-panel.active{display:block;}
  .field-check{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--gray-500);margin-bottom:22px;}
  .form-foot{text-align:center;font-size:14px;color:var(--gray-500);margin-top:18px;}
  .form-foot a{color:var(--blue-600);font-weight:600;}

  /* Tracking page */
  .track-search{
    max-width:640px;margin:0 auto 50px;
    display:flex;gap:10px;
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:999px;
    padding:8px 8px 8px 22px;
    box-shadow:var(--shadow-md);
  }
  .track-search input{flex:1;border:none;outline:none;font-size:15px;font-family:inherit;}
  .track-empty{
    max-width:520px;margin:0 auto;text-align:center;
    color:var(--gray-500);font-size:15px;
  }
  .track-empty .ic{font-size:38px;margin-bottom:16px;}
  .track-empty .box-ic{
    width:64px;height:64px;
    color:var(--gray-300);
    margin:0 auto 20px;
    display:block;
  }

  /* Detailed tracking result — stacked cards */
  .tr-card{
    background:#fff;
    border:1px solid var(--gray-200);
    border-radius:var(--radius-lg);
    box-shadow:var(--shadow-md);
    padding:26px 28px;
    margin-bottom:20px;
  }
  .tr-card-head{
    display:flex;align-items:center;gap:10px;
    font-weight:700;font-size:15.5px;
    margin-bottom:20px;
  }
  .tr-card-head svg{width:20px;height:20px;color:var(--blue-600);flex-shrink:0;}

  /* Package details */
  .pkg-details-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;}
  .pkg-field{display:flex;gap:12px;align-items:flex-start;}
  .pkg-field svg{width:18px;height:18px;color:var(--gray-400);flex-shrink:0;margin-top:2px;}
  .pf-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500);margin-bottom:3px;}
  .pf-value{font-size:14.5px;font-weight:700;color:var(--ink);}

  /* Route information */
  .route-info-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;}
  .route-box{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-sm);padding:16px 18px;}
  .rb-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--gray-500);margin-bottom:8px;}
  .rb-name{font-weight:700;font-size:15px;margin-bottom:4px;}
  .rb-line{font-size:13px;color:var(--gray-500);line-height:1.5;}
  .rb-link{font-size:13px;color:var(--blue-600);font-weight:600;display:inline-flex;align-items:center;gap:5px;margin-top:10px;}
  .rb-link svg{width:14px;height:14px;}
  .route-arrow{width:22px;height:22px;color:var(--gray-300);justify-self:center;flex-shrink:0;}
  .current-loc-tag{
    display:flex;align-items:center;gap:8px;
    margin-top:18px;color:var(--orange-500);font-weight:700;font-size:13.5px;
  }
  .current-loc-tag svg{width:17px;height:17px;flex-shrink:0;}

  /* Live map */
  .map-wrap{position:relative;height:320px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--gray-200);}
  #tr-map{width:100%;height:100%;background:var(--gray-100);}
  .map-overlay-pill{
    position:absolute;bottom:14px;left:50%;transform:translateX(-50%);
    background:rgba(255,255,255,.97);border:1px solid var(--gray-200);
    box-shadow:var(--shadow-md);border-radius:999px;
    padding:9px 18px;font-size:13px;font-weight:700;color:var(--ink);
    white-space:nowrap;z-index:1000;
  }
  .map-badge{display:inline-flex;align-items:center;gap:7px;background:#dcfce7;color:#15803d;font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;}
  .map-badge .dot{width:6px;height:6px;border-radius:50%;background:#15803d;animation:tr-pulse 1.6s infinite;}
  @keyframes tr-pulse{0%,100%{opacity:1;}50%{opacity:.25;}}
  .map-dot{width:14px;height:14px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px rgba(0,0,0,.15);}
  .map-dot.origin{background:var(--blue-600);}
  .map-dot.dest{background:var(--orange-500);}
  .map-truck{
    width:30px;height:30px;border-radius:50%;
    background:var(--blue-600);color:#fff;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 4px 10px rgba(0,0,0,.25);
  }
  .map-truck svg{width:16px;height:16px;}
  .map-progress{margin-top:20px;}
  .mp-cities{display:flex;justify-content:space-between;font-size:13px;font-weight:700;color:var(--gray-700);margin-bottom:8px;}
  .mp-foot{display:flex;justify-content:space-between;font-size:12.5px;color:var(--gray-500);margin-top:8px;}

  /* Timeline with icon badges (tracking result page only) */
  .evt-list{position:relative;list-style:none;margin:0;padding:0;}
  .evt-list::before{
    content:"";position:absolute;left:19px;top:6px;bottom:6px;width:2px;
    background:var(--gray-200);
  }
  .evt-list li{position:relative;display:flex;gap:14px;padding-bottom:24px;}
  .evt-list li:last-child{padding-bottom:0;}
  .t-icon{
    width:38px;height:38px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:#fff;border:2px solid var(--gray-300);color:var(--gray-400);
    flex-shrink:0;position:relative;z-index:1;
  }
  .t-icon svg{width:17px;height:17px;}
  .evt-list li.done .t-icon{border-color:var(--green);background:var(--green);color:#fff;}
  .evt-list li.active .t-icon{border-color:var(--blue-600);background:var(--blue-600);color:#fff;}
  .t-body{padding-top:5px;}
  .t-title{font-weight:700;font-size:14.5px;}
  .evt-list li.active .t-title{color:var(--blue-600);}
  .t-desc{font-size:13px;color:var(--gray-500);margin-top:3px;}
  .t-meta{font-size:12px;color:var(--gray-400);margin-top:6px;display:flex;align-items:center;gap:5px;}
  .t-meta-ic{width:12px;height:12px;flex-shrink:0;}

  /* Mobile */
  @media (max-width:980px){
    .hero-grid{grid-template-columns:1fr;}
    .track-card{max-width:520px;margin:0 auto;}
    .features-grid, .testimonials-grid{grid-template-columns:repeat(2,1fr);}
    .steps-grid{grid-template-columns:repeat(2,1fr);}
    .stats-grid{grid-template-columns:repeat(2,1fr);}
    .footer-grid{grid-template-columns:repeat(2,1fr);}
    .value-grid, .team-grid{grid-template-columns:repeat(2,1fr);}
    .contact-cards{grid-template-columns:1fr;}
  }
  @media (max-width:720px){
    .nav-links, .nav-right .account{display:none;}
    .nav-toggle{display:block;}
    .topbar .container{justify-content:center;text-align:center;}
    .features-grid, .testimonials-grid, .steps-grid{grid-template-columns:1fr;}
    .cta{padding:48px 24px;}
    .footer-grid{grid-template-columns:1fr;}
    .section{padding:64px 0;}
    .value-grid, .team-grid{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    .form-card{padding:26px 20px;}
    .job-card{flex-direction:column;align-items:flex-start;}
    .tr-card{padding:20px;}
    .pkg-details-grid{grid-template-columns:1fr;}
    .route-info-grid{grid-template-columns:1fr;}
    .route-arrow{transform:rotate(90deg);margin:0 auto;}
    .map-wrap{height:240px;}
  }