@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800;900&display=swap');

:root{
    --blue:#0B4EA2;
    --blue-dark:#073B7A;
    --blue-light:#EAF3FF;
    --yellow:#F5C542;
    --text:#172033;
    --muted:#667085;
    --bg:#F6F8FB;
    --white:#fff;
    --line:#E6EAF0;
    --green:#16A34A;
    --shadow:0 10px 35px rgba(16,40,72,.08);
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:var(--bg);
    color:var(--text);
    font-family:'Be Vietnam Pro',Arial,sans-serif;
    font-size:14px;
    line-height:1.55;
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input,
select{
    font-family:inherit;
}


/* =========================
HEADER
========================= */

header{
    position:sticky;
    top:0;
    z-index:100;
    background:#fff;
    border-bottom:1px solid var(--line);
    box-shadow:0 3px 18px rgba(0,0,0,.05);
}

.nav{
    width:min(1200px,94%);
    min-height:72px;
    margin:auto;

    display:flex;
    align-items:center;
    gap:35px;
}

.vxe-logo{
    display:flex;
    align-items:center;
    flex-shrink:0;
}

.vxe-logo img{
    width:185px;
    max-height:55px;
    object-fit:contain;
}

.nav nav{
    display:flex;
    align-items:center;
    gap:28px;
    flex:1;
}

.nav nav a{
    position:relative;
    padding:25px 0;

    color:#344054;
    font-weight:700;
    font-size:14px;

    transition:.2s;
}

.nav nav a:hover{
    color:var(--blue);
}

.nav nav a:first-child{
    color:var(--blue);
}

.nav nav a:first-child:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:17px;

    height:3px;
    border-radius:10px;

    background:var(--yellow);
}

.hotline{
    color:var(--blue);
    font-weight:800;
    white-space:nowrap;
}

.vxe-login{
    padding:10px 17px;
    border:1px solid #D8E1ED;
    border-radius:9px;

    color:var(--blue);
    font-weight:800;

    transition:.2s;
}

.vxe-login:hover{
    background:var(--blue-light);
}

.vxe-register{
    padding:11px 18px;
    border-radius:9px;

    color:#fff;
    background:var(--blue);

    font-weight:800;

    transition:.2s;
}

.vxe-register:hover{
    background:var(--blue-dark);
}


/* =========================
HERO
========================= */

.hero{
    position:relative;
    overflow:hidden;

    min-height:480px;

    color:#fff;

    background:
        linear-gradient(
            90deg,
            rgba(3,38,83,.98) 0%,
            rgba(11,78,162,.92) 52%,
            rgba(11,78,162,.65) 100%
        );

    padding:65px 0 115px;
}

.hero:before{
    content:"";

    position:absolute;
    inset:0;

    background:
        radial-gradient(
            circle at 82% 20%,
            rgba(245,197,66,.20),
            transparent 22%
        ),
        radial-gradient(
            circle at 90% 90%,
            rgba(255,255,255,.12),
            transparent 28%
        );
}

.hero:after{
    content:"";

    position:absolute;

    width:500px;
    height:500px;

    border-radius:50%;

    right:-220px;
    top:-250px;

    border:70px solid rgba(255,255,255,.05);
}

.hero-inner{
    position:relative;
    z-index:2;

    width:min(1200px,94%);
    margin:auto;
}

.eyebrow{
    display:inline-flex;
    align-items:center;

    padding:7px 13px;

    border-radius:30px;

    background:rgba(255,255,255,.11);
    border:1px solid rgba(255,255,255,.15);

    color:#FFE27A;

    font-size:12px;
    font-weight:900;
    letter-spacing:1px;
}

.hero h1{
    max-width:700px;

    margin:17px 0 12px;

    font-size:48px;
    line-height:1.13;
    letter-spacing:-1.5px;

    font-weight:900;
}

.hero h1 strong{
    color:var(--yellow);
}

.hero p{
    margin:0;

    max-width:650px;

    color:rgba(255,255,255,.84);

    font-size:17px;
}


/* =========================
SEARCH BOX
========================= */

.search-wrapper{
    position:relative;
    z-index:5;

    margin-top:38px;
}

.search-tabs{
    display:flex;
    gap:5px;

    margin-left:20px;
}

.search-tab{
    padding:11px 20px;

    border-radius:10px 10px 0 0;

    background:#fff;

    color:var(--blue);

    font-weight:900;
}

.search{
    display:grid;
    grid-template-columns:1fr 1fr 1fr auto;
    gap:10px;

    padding:14px;

    background:#fff;

    border-radius:15px;

    box-shadow:
        0 18px 45px rgba(0,20,60,.22);
}

.search-field{
    min-width:0;

    padding:11px 14px;

    background:#F7F9FC;

    border:1px solid #E6EAF0;

    border-radius:10px;
}

.search label{
    display:block;

    margin-bottom:4px;

    color:#98A2B3;

    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
}

.search select,
.search input{
    width:100%;

    border:0;
    outline:0;

    background:transparent;

    color:var(--text);

    font-size:14px;
    font-weight:700;
}

.search button{
    min-width:170px;

    border:0;
    border-radius:10px;

    background:var(--yellow);

    color:#15233A;

    font-size:14px;
    font-weight:900;

    cursor:pointer;

    transition:.2s;
}

.search button:hover{
    transform:translateY(-1px);

    box-shadow:0 8px 18px rgba(245,197,66,.25);
}


/* =========================
MAIN
========================= */

main{
    position:relative;
    z-index:4;

    width:min(1200px,94%);

    margin:auto;

    padding:48px 0;
}

.section-head{
    display:flex;
    justify-content:space-between;
    align-items:end;

    margin-bottom:22px;
}

.section-head h2{
    margin:0;

    font-size:27px;
    font-weight:900;
    letter-spacing:-.7px;
}

.section-head p{
    margin:5px 0 0;

    color:var(--muted);
}


/* =========================
ROUTES
========================= */

.grid{
    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:18px;
}

.route-card{
    position:relative;

    padding:23px;

    background:#fff;

    border:1px solid var(--line);

    border-radius:17px;

    box-shadow:var(--shadow);

    transition:.25s;
}

.route-card:hover{
    transform:translateY(-4px);

    border-color:#C9DCF4;

    box-shadow:0 16px 35px rgba(16,40,72,.12);
}

.route-card .arrow{
    color:var(--blue);

    font-size:15px;
    font-weight:900;
}

.route-card h3{
    margin:10px 0 5px;

    font-size:17px;
}

.price{
    color:var(--blue);

    font-size:20px;
    font-weight:900;
}


/* =========================
FEATURES
========================= */

.features{
    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:16px;

    margin-top:48px;
}

.feature-card{
    padding:23px;

    background:#fff;

    border:1px solid var(--line);

    border-radius:17px;

    box-shadow:var(--shadow);
}

.feature-icon{
    width:48px;
    height:48px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:13px;

    background:var(--blue-light);

    font-size:24px;
}

.feature-card h3{
    margin:13px 0 5px;

    font-size:15px;
}

.feature-card p{
    margin:0;

    color:var(--muted);

    font-size:13px;
}


/* =========================
TRIP LIST
========================= */

.trip{
    display:grid;

    grid-template-columns:1.4fr 1fr auto;

    gap:20px;

    align-items:center;

    padding:21px;

    margin:12px 0;

    background:#fff;

    border:1px solid var(--line);

    border-radius:17px;

    box-shadow:var(--shadow);
}

.trip .time{
    font-size:20px;
    font-weight:900;
}

.trip .meta{
    color:var(--muted);
    font-size:13px;
}

.trip .price{
    font-size:20px;
}


/* =========================
BOOKING
========================= */

.booking{
    display:grid;

    grid-template-columns:1fr 350px;

    gap:20px;
}

.booking>div,
.booking form{
    padding:25px;

    background:#fff;

    border:1px solid var(--line);

    border-radius:18px;

    box-shadow:var(--shadow);
}

.booking form{
    display:flex;
    flex-direction:column;
    gap:12px;

    height:max-content;
}

.booking input{
    width:100%;

    padding:13px;

    border:1px solid var(--line);

    border-radius:9px;
}

.seats{
    display:grid;

    grid-template-columns:repeat(3,78px);

    gap:12px;

    justify-content:center;

    padding:20px;
}

.seat{
    height:68px;

    border:2px solid #CCD6E4;

    border-radius:12px;

    background:#fff;

    color:var(--blue);

    font-weight:900;

    cursor:pointer;
}

.seat:hover{
    border-color:var(--blue);
}

.seat.sel{
    background:var(--yellow);
    border-color:#D7AA1F;
}

.seat.booked{
    background:#AAB3C0;
    border-color:#AAB3C0;

    color:#fff;

    cursor:not-allowed;
}


/* =========================
TICKET
========================= */

.ticket{
    max-width:620px;

    margin:30px auto;

    padding:30px;

    background:#fff;

    border:1px solid var(--line);

    border-radius:18px;

    box-shadow:var(--shadow);
}

.ticket h1{
    color:var(--blue);
}

.qr{
    width:160px;
    height:160px;

    display:grid;
    place-items:center;

    margin:22px auto;

    background:#F0F4F9;

    border:1px dashed #9AA8BA;
}


/* =========================
FOOTER
========================= */

footer{
    margin-top:50px;

    padding:48px 0;

    background:#061D3D;

    color:#CBD8E8;
}

.footer-inner{
    width:min(1200px,94%);

    margin:auto;

    display:grid;

    grid-template-columns:2fr 1fr 1fr;

    gap:40px;
}

.footer-brand{
    margin-bottom:10px;

    color:#fff;

    font-size:24px;
    font-weight:900;
}

footer h4{
    margin:0 0 12px;

    color:#fff;
}

footer p{
    margin:5px 0;

    font-size:13px;
}


/* =========================
MOBILE
========================= */

@media(max-width:950px){

    .nav{
        gap:18px;
    }

    .nav nav{
        gap:16px;
    }

    .hotline{
        display:none;
    }

    .search{
        grid-template-columns:1fr 1fr;
    }

    .search button{
        min-height:52px;
    }

    .grid{
        grid-template-columns:1fr 1fr;
    }

    .features{
        grid-template-columns:1fr 1fr;
    }

    .footer-inner{
        grid-template-columns:1fr 1fr;
    }
}


@media(max-width:650px){

    header{
        position:relative;
    }

    .nav{
        min-height:64px;
    }

    .vxe-logo img{
        width:145px;
    }

    .nav nav{
        display:none;
    }

    .vxe-login{
        margin-left:auto;

        padding:8px 10px;

        font-size:12px;
    }

    .vxe-register{
        padding:9px 11px;

        font-size:12px;
    }

    .hero{
        padding:42px 0 75px;
    }

    .hero h1{
        font-size:33px;
    }

    .hero p{
        font-size:14px;
    }

    .search-tabs{
        margin-left:10px;
    }

    .search{
        grid-template-columns:1fr;

        padding:10px;

        border-radius:13px;
    }

    .search button{
        height:52px;
    }

    main{
        padding:35px 0;
    }

    .grid,
    .features{
        grid-template-columns:1fr;
    }

    .trip{
        grid-template-columns:1fr;
    }

    .booking{
        grid-template-columns:1fr;
    }

    .footer-inner{
        grid-template-columns:1fr;
    }
}
/* CHECKOUT */
.checkout-page{width:min(1100px,94%);margin:0 auto;padding:48px 0 80px}.checkout-head h1{font-size:34px;margin:8px 0}.checkout-head p{color:var(--muted)}.eyebrow-blue{display:inline-block;padding:6px 11px;border-radius:20px;background:#eaf3ff;color:var(--blue);font-weight:900;font-size:11px;letter-spacing:.5px}.checkout-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:25px}.checkout-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:var(--shadow)}.checkout-card h2{margin:0 0 20px;font-size:19px}.checkout-route{font-size:20px;font-weight:900;padding:15px;background:#f7f9fc;border-radius:12px;margin-bottom:16px}.checkout-route span{color:var(--blue);padding:0 8px}.checkout-meta{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid #eef1f5}.checkout-meta span{color:var(--muted)}.checkout-total{display:flex;justify-content:space-between;align-items:center;margin-top:18px;font-size:15px}.checkout-total strong{font-size:25px;color:var(--blue)}.pay-option{display:block;margin-bottom:12px}.pay-option button,.pay-link{width:100%;display:flex;flex-direction:column;gap:5px;text-align:left;padding:17px;border:1px solid #dce3ec;border-radius:13px;background:#fff;cursor:pointer;color:var(--text);font-size:14px}.pay-option button:hover,.pay-link:hover{border-color:var(--blue);background:#f8fbff}.pay-option span{font-size:12px;color:var(--muted)}.payment-note{font-size:12px;color:var(--muted);line-height:1.6;margin-top:18px}.checkout-alert{margin-top:20px;padding:13px 16px;background:#fff1f0;color:#b42318;border:1px solid #ffd4d1;border-radius:10px}@media(max-width:800px){.checkout-grid{grid-template-columns:1fr}.checkout-head h1{font-size:27px}}

.vxe-user-pill{display:flex;align-items:center;gap:8px;padding:5px 10px 5px 5px;background:#f5f8fc;border:1px solid #e0e6ef;border-radius:11px;font-weight:800;color:#344054;max-width:160px}.vxe-user-avatar{width:31px;height:31px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eaf3ff;color:var(--blue);font-size:12px}.vxe-user-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-logout-form{margin:0}.vxe-logout{border:1px solid #ffd2ce;background:#fff7f6;color:#c43227;border-radius:9px;padding:9px 12px;font:800 12px inherit;cursor:pointer}.vxe-logout:hover{background:#fff0ee}@media(max-width:900px){.vxe-user-name{display:none}.vxe-user-pill{padding:4px}.vxe-logout{padding:8px 9px}}
.admin-success{padding:12px 15px;background:#ecfdf3;border:1px solid #abefc6;color:#067647;border-radius:10px;margin:15px 0}.management-grid{display:grid;grid-template-columns:300px 1fr;gap:20px}.management-form{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:var(--shadow);height:max-content}.management-form h2{font-size:18px;margin:0 0 15px}.management-form input,.management-form select{width:100%;height:44px;border:1px solid #dce3ec;border-radius:9px;margin-bottom:10px;padding:0 11px}.danger-btn{border:0;background:#fff1f0;color:#c43227;border-radius:8px;padding:7px 10px;cursor:pointer}@media(max-width:900px){.management-grid{grid-template-columns:1fr}}
.ticket-page{width:min(780px,94%);margin:auto;padding:45px 0 80px}.ticket-card{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 18px 55px rgba(16,40,72,.10);overflow:hidden}.ticket-brand{padding:22px 26px;background:linear-gradient(110deg,#073b7a,#0b4ea2);color:#fff;font-weight:900;font-size:22px}.ticket-brand span{float:right;font-size:12px;color:#ffe27a;margin-top:5px}.ticket-code{text-align:center;font-size:27px;font-weight:900;color:var(--blue);padding:25px 20px 15px}.ticket-route{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:20px 26px;background:#f7f9fc}.ticket-route div:last-child{text-align:right}.ticket-route small,.ticket-grid small{display:block;color:#98a2b3;font-size:10px;font-weight:800;margin-bottom:5px}.ticket-route b{font-size:18px}.ticket-route strong{color:var(--blue);font-size:25px}.ticket-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#eef1f5}.ticket-grid>div{background:#fff;padding:16px 20px}.ticket-grid b{display:block}.ticket-total{display:flex;justify-content:space-between;padding:22px 26px;border-top:1px dashed #d7dee8}.ticket-total strong{font-size:24px;color:var(--blue)}.ticket-qr{text-align:center;padding:15px}.qr-box{display:inline-flex;width:120px;height:120px;align-items:center;justify-content:center;border:8px solid #111;background:#fff;font-weight:900;font-size:14px;word-break:break-all}.ticket-qr p{color:var(--muted);font-size:12px}.ticket-actions{display:flex;justify-content:center;gap:10px;padding:20px 26px 28px}.ticket-success{margin:18px 25px 0;padding:11px 14px;border-radius:9px;background:#ecfdf3;color:#067647}@media(max-width:600px){.ticket-route{gap:10px;padding:17px}.ticket-grid{grid-template-columns:1fr}.ticket-route b{font-size:15px}.ticket-brand{font-size:18px}.ticket-brand span{font-size:10px}}

/* =========================
   PAYMENT QR
========================= */

.payment-card {
    margin-top: 20px;
    background: #f8fbff;
    border: 1px solid #dbe7f5;
    border-radius: 18px;
    padding: 20px;
}

.payment-title {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5eaf1;
}

.payment-title > span {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eaf3ff;
    font-size: 21px;
}

.payment-title h3 {
    margin: 0;
    font-size: 17px;
    font-weight: 800;
    color: #101828;
}

.payment-title p {
    margin: 4px 0 0;
    color: #667085;
    font-size: 13px;
}

.payment-content {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 25px;
    align-items: center;
    padding-top: 22px;
}

.payment-qr {
    text-align: center;
}

.payment-qr img {
    display: block;
    width: 240px;
    height: 240px;
    object-fit: contain;
    margin: auto;
    border-radius: 14px;
    background: white;
    padding: 6px;
    border: 1px solid #e1e7ef;
}

.qr-note {
    margin-top: 10px;
    font-size: 12px;
    color: #667085;
}

.payment-info {
    background: #fff;
    border-radius: 14px;
    padding: 5px 16px;
    border: 1px solid #e7ecf3;
}

.payment-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    padding: 13px 0;
    border-bottom: 1px solid #edf0f5;
}

.payment-row:last-child {
    border-bottom: 0;
}

.payment-row span {
    color: #667085;
    font-size: 13px;
}

.payment-row strong {
    color: #101828;
    font-size: 14px;
    text-align: right;
}

.payment-amount {
    color: #0b4ea2 !important;
    font-size: 19px !important;
}

.transfer-content strong {
    color: #0b4ea2;
    background: #edf5ff;
    padding: 7px 10px;
    border-radius: 7px;
}

.payment-warning {
    margin: 14px 0 8px;
    padding: 12px;
    border-radius: 9px;
    background: #fff8e6;
    border: 1px solid #f4d78c;
    color: #765600;
    font-size: 12px;
    line-height: 1.6;
}


/* =========================
   PAYMENT BUTTON
========================= */

.pay-option {
    margin-top: 12px;
}

.pay-option button,
.pay-link {
    width: 100%;
    min-height: 62px;
    border: 1px solid #dce3ec;
    background: #fff;
    border-radius: 12px;
    padding: 12px 16px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    cursor: pointer;
    transition: .2s;
}

.pay-option button:hover,
.pay-link:hover {
    border-color: #0b4ea2;
    background: #f7fbff;
    transform: translateY(-1px);
}

.pay-option b {
    color: #101828;
    font-size: 14px;
}

.pay-option span {
    color: #667085;
    font-size: 12px;
    margin-top: 4px;
}

.payment-note {
    margin-top: 16px;
    padding: 12px;
    border-radius: 10px;
    background: #f5f7fa;
    color: #667085;
    font-size: 12px;
    line-height: 1.6;
}


/* =========================
   MOBILE
========================= */

@media (max-width: 700px) {

    .payment-content {
        grid-template-columns: 1fr;
    }

    .payment-qr img {
        width: 230px;
        height: 230px;
    }

    .payment-info {
        padding: 5px 12px;
    }

    .payment-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    .payment-row strong {
        text-align: left;
    }

    .checkout-grid {
        grid-template-columns: 1fr !important;
    }
}
/* =========================================================
   VEXEONLINE - TICKET LOOKUP / SUPPORT / MOBILE
========================================================= */
.vxe-user-pill{display:flex;align-items:center;gap:8px;padding:6px 10px 6px 7px;border:1px solid #e4e7ec;border-radius:999px;background:#fff}
.vxe-user-avatar{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eaf2ff;color:#0b4ea2;font-size:12px;font-weight:900}
.vxe-user-name{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:800;color:#344054}
.vxe-logout-form{margin:0}
.vxe-logout{height:40px;padding:0 14px;border:1px solid #e4e7ec;border-radius:9px;background:#fff;color:#344054;font-size:13px;font-weight:800;cursor:pointer}
.vxe-logout:hover{border-color:#0b4ea2;color:#0b4ea2;background:#f8fbff}

.lookup-page,.support-page{max-width:1120px;margin:0 auto;padding:42px 20px 70px}
.lookup-hero{background:linear-gradient(135deg,#eef6ff,#fff);border:1px solid #dce8f6;border-radius:26px;padding:44px 38px;box-shadow:0 18px 50px rgba(16,24,40,.06)}
.lookup-hero-inner{max-width:900px;margin:auto;text-align:center}
.eyebrow-blue{display:inline-block;color:#0b4ea2;font-size:11px;font-weight:900;letter-spacing:1px}
.lookup-hero h1,.support-hero h1{margin:8px 0 8px;font-size:38px;line-height:1.1;font-weight:900;color:#101828}
.lookup-hero p,.support-hero p{margin:0 auto;color:#667085;line-height:1.7;font-size:14px;max-width:650px}
.lookup-form{margin:28px auto 0;display:grid;grid-template-columns:1fr 1fr auto;gap:12px;text-align:left}
.lookup-field label{display:block;margin-bottom:7px;color:#344054;font-size:12px;font-weight:800}
.lookup-field input{width:100%;height:52px;border:1px solid #d9e0ea;border-radius:12px;padding:0 14px;font-size:14px;outline:0;background:#fff}
.lookup-field input:focus{border-color:#0b4ea2;box-shadow:0 0 0 4px rgba(11,78,162,.08)}
.lookup-form button,.support-contact button{height:52px;border:0;border-radius:12px;background:#0b4ea2;color:#fff;padding:0 22px;font-size:13px;font-weight:900;cursor:pointer;align-self:end}
.lookup-form button:hover,.support-contact button:hover{background:#073b78}
.lookup-error,.support-success{margin-top:16px;padding:12px 14px;border-radius:11px;font-size:13px}
.lookup-error{background:#fff1f0;border:1px solid #ffd5d2;color:#b42318}
.support-success{background:#ecfdf3;border:1px solid #abefc6;color:#067647}
.lookup-result{margin-top:22px;background:#fff;border:1px solid #e4e7ec;border-radius:22px;padding:28px;box-shadow:0 10px 35px rgba(16,24,40,.05)}
.lookup-result-head{display:flex;align-items:center;justify-content:space-between;gap:20px}
.lookup-result h2{margin:5px 0 0;color:#0b4ea2;font-size:26px}
.lookup-status{padding:7px 12px;border-radius:999px;font-size:11px;font-weight:900}
.lookup-status.is-paid{background:#ecfdf3;color:#027a48}
.lookup-status.is-pending{background:#fff8e6;color:#8a6100}
.lookup-route{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;margin:25px 0;padding:20px;border-radius:16px;background:#f8fafc}
.lookup-route div:last-child{text-align:right}
.lookup-route small,.lookup-grid small{display:block;color:#98a2b3;font-size:10px;font-weight:900;margin-bottom:5px}
.lookup-route strong{font-size:18px;color:#101828}
.lookup-route>span{font-size:22px;color:#0b4ea2;font-weight:900}
.lookup-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.lookup-grid>div{padding:15px;border:1px solid #eef1f5;border-radius:12px}
.lookup-grid strong{font-size:13px;color:#344054}
.lookup-total{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:18px;border-top:1px solid #eef1f5}
.lookup-total span{color:#667085;font-size:13px}
.lookup-total strong{font-size:22px;color:#0b4ea2}
.lookup-actions{display:flex;gap:10px;margin-top:20px}
.lookup-primary,.lookup-secondary{height:44px;display:inline-flex;align-items:center;justify-content:center;padding:0 18px;border-radius:10px;font-size:13px;font-weight:900}
.lookup-primary{background:#0b4ea2;color:#fff}.lookup-secondary{background:#fff;color:#0b4ea2;border:1px solid #d9e0ea}

.support-page{max-width:1120px}
.support-hero{text-align:center;padding:36px 20px}
.support-hotline{max-width:420px;margin:25px auto 0;display:flex;align-items:center;gap:14px;text-align:left;padding:16px 18px;border-radius:18px;background:#fff;border:1px solid #e4e7ec;box-shadow:0 12px 35px rgba(16,24,40,.06)}
.support-phone-icon{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#eaf2ff;color:#0b4ea2;font-size:21px}
.support-hotline small{display:block;color:#98a2b3;font-size:10px;font-weight:900}.support-hotline a{display:block;color:#0b4ea2;font-size:20px;font-weight:900}.support-hotline span{display:block;color:#667085;font-size:11px;margin-top:2px}
.support-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px}
.support-card{background:#fff;border:1px solid #e4e7ec;border-radius:18px;padding:24px;box-shadow:0 8px 25px rgba(16,24,40,.04)}
.support-card-icon{font-size:25px;margin-bottom:12px}.support-card h2{margin:0 0 7px;font-size:17px}.support-card p{margin:0 0 14px;color:#667085;font-size:13px;line-height:1.6}.support-card a{color:#0b4ea2;font-size:13px;font-weight:900}
.support-contact{display:grid;grid-template-columns:.8fr 1.2fr;gap:30px;margin-top:24px;background:#fff;border:1px solid #e4e7ec;border-radius:22px;padding:28px;box-shadow:0 8px 25px rgba(16,24,40,.04)}
.support-contact h2{margin:8px 0;color:#101828;font-size:24px}.support-contact p{color:#667085;font-size:13px;line-height:1.6}.support-contact form{display:flex;flex-direction:column;gap:10px}.support-form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.support-contact input,.support-contact textarea{width:100%;border:1px solid #d9e0ea;border-radius:11px;padding:13px;font:inherit;font-size:13px;outline:0}.support-contact textarea{resize:vertical}.support-contact input:focus,.support-contact textarea:focus{border-color:#0b4ea2;box-shadow:0 0 0 4px rgba(11,78,162,.08)}.support-contact button{width:max-content}.support-error{color:#b42318;font-size:11px}.support-faq{margin-top:24px;background:#fff;border:1px solid #e4e7ec;border-radius:22px;padding:25px}.support-faq h2{margin:0 0 12px}.support-faq details{border-top:1px solid #eef1f5;padding:14px 0}.support-faq summary{cursor:pointer;font-size:13px;font-weight:800;color:#344054}.support-faq p{color:#667085;font-size:12px;line-height:1.6;margin:9px 0 0}

@media(max-width:900px){
 .vxe-user-name{display:none}.vxe-logout{height:38px;padding:0 10px;font-size:11px}
 .lookup-page,.support-page{padding:25px 14px 50px}
 .lookup-hero{padding:30px 18px;border-radius:20px}
 .lookup-hero h1,.support-hero h1{font-size:30px}
 .lookup-form{grid-template-columns:1fr;gap:10px}
 .lookup-form button{width:100%}
 .lookup-grid{grid-template-columns:1fr 1fr}
 .support-grid{grid-template-columns:1fr}
 .support-contact{grid-template-columns:1fr;padding:20px}
}
@media(max-width:560px){
 .lookup-result{padding:18px;border-radius:18px}.lookup-result-head{align-items:flex-start;flex-direction:column}.lookup-route{grid-template-columns:1fr;gap:10px}.lookup-route div:last-child{text-align:left}.lookup-route>span{transform:rotate(90deg);width:max-content}.lookup-grid{grid-template-columns:1fr}.lookup-actions{flex-direction:column}.lookup-primary,.lookup-secondary{width:100%}
 .support-form-row{grid-template-columns:1fr}.support-contact button{width:100%}.support-hero{padding:25px 8px}
}

/* =========================================================
   VEXEONLINE HOME - MODERN BOOKING UI
========================================================= */
.home-hero{position:relative;min-height:555px;overflow:hidden;background-image:url('/images/banner-vexeonline.png');background-size:cover;background-position:center}
.home-hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,35,75,.94) 0%,rgba(7,59,120,.82) 48%,rgba(7,59,120,.42) 100%)}
.home-hero-inner{position:relative;z-index:2;width:min(1200px,94%);margin:auto;padding:66px 0 85px}.hero-copy{max-width:700px;color:#fff}.hero-badge{display:inline-flex;padding:8px 14px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(255,255,255,.1);color:#ffe27a;font-size:11px;font-weight:900;letter-spacing:1px}.hero-copy h1{font-size:47px;line-height:1.12;letter-spacing:-1.4px;margin:18px 0 12px;font-weight:900}.hero-copy h1 span{color:#f5c542}.hero-copy p{margin:0;color:rgba(255,255,255,.86);font-size:16px}.home-search-card{margin-top:38px;background:#fff;border-radius:18px;padding:0 16px 14px;box-shadow:0 24px 60px rgba(0,15,45,.28)}.home-search-tabs{display:flex;gap:22px;height:54px;align-items:center;border-bottom:1px solid #edf1f5}.home-search-tabs span,.home-search-tabs a{height:54px;display:flex;align-items:center;font-size:13px;font-weight:900}.home-search-tabs .active{color:#0b4ea2;border-bottom:3px solid #f5c542}.home-search-tabs a{color:#667085}.home-search-form{display:grid;grid-template-columns:1.05fr 34px 1.05fr 1fr 145px;gap:8px;align-items:center;padding-top:13px}.home-search-field{min-width:0;padding:10px 12px;border:1px solid #e3e8ef;border-radius:11px;background:#f8fafc}.home-search-field label{display:block;color:#98a2b3;font-size:10px;font-weight:900;text-transform:uppercase;margin-bottom:4px}.home-search-field select,.home-search-field input{width:100%;border:0;outline:0;background:transparent;color:#1d2939;font-size:13px;font-weight:800}.swap-route{width:34px;height:34px;border-radius:50%;border:1px solid #dbe4ef;background:#fff;color:#0b4ea2;font-size:18px;cursor:pointer}.home-search-button{height:52px;border:0;border-radius:11px;background:#f5c542;color:#15233a;font-weight:900;cursor:pointer}.home-search-button:hover{filter:brightness(.97);transform:translateY(-1px)}.quick-searches{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 2px 0;color:#98a2b3;font-size:11px}.quick-searches a{color:#0b4ea2;font-weight:800;background:#f1f6fd;border-radius:999px;padding:5px 9px}.home-main{padding-top:26px}.trust-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#e7edf4;border:1px solid #e7edf4;border-radius:18px;overflow:hidden;box-shadow:0 10px 35px rgba(16,40,72,.06);margin-bottom:54px}.trust-strip>div{background:#fff;display:flex;align-items:center;gap:12px;padding:19px}.trust-strip b{width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:#eaf3ff;font-size:20px}.trust-strip strong,.trust-strip small{display:block}.trust-strip strong{font-size:13px;color:#1d2939}.trust-strip small{font-size:11px;color:#98a2b3;margin-top:2px}.home-section{margin-top:58px}.section-title-row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}.section-kicker{color:#0b4ea2;font-size:10px;font-weight:900;letter-spacing:1.2px}.section-title-row h2{margin:5px 0 3px;font-size:28px;line-height:1.2;letter-spacing:-.6px}.section-title-row p{margin:0;color:#667085;font-size:13px}.section-more{color:#0b4ea2;font-size:12px;font-weight:900;white-space:nowrap}.popular-route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.popular-route-card{display:block;background:#fff;border:1px solid #e4e9f0;border-radius:18px;overflow:hidden;box-shadow:0 8px 26px rgba(16,40,72,.05);transition:.22s}.popular-route-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(16,40,72,.11);border-color:#c8dcf3}.route-visual{height:105px;display:flex;align-items:center;justify-content:center;gap:18px;background:linear-gradient(135deg,#eaf3ff,#f8fbff);color:#0b4ea2}.route-visual span{width:45px;height:45px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #d7e5f5;font-size:18px;font-weight:900}.route-visual i{font-style:normal;font-size:20px}.route-card-body{padding:17px}.route-name{font-size:15px;font-weight:900;color:#1d2939}.route-name span{color:#0b4ea2}.route-sub{font-size:11px;color:#98a2b3;margin:5px 0 12px}.route-card-body strong{color:#0b4ea2;font-size:15px}.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.offer-card{position:relative;min-height:205px;overflow:hidden;border-radius:20px;padding:25px;color:#fff;box-shadow:0 14px 35px rgba(16,40,72,.1)}.offer-card span{font-size:10px;font-weight:900;letter-spacing:1px;opacity:.85}.offer-card h3{font-size:22px;margin:10px 0 7px}.offer-card p{max-width:290px;margin:0;color:rgba(255,255,255,.82);font-size:12px;line-height:1.6}.offer-card a{display:inline-block;margin-top:17px;font-size:12px;font-weight:900}.offer-blue{background:linear-gradient(135deg,#0b4ea2,#1769c9)}.offer-yellow{background:linear-gradient(135deg,#d7a91c,#f5c542);color:#172033}.offer-yellow p{color:rgba(23,32,51,.72)}.offer-dark{background:linear-gradient(135deg,#092f5f,#0c457f)}.offer-shape{position:absolute;right:-15px;top:-24px;width:120px;height:120px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);font-size:38px;font-weight:900}.benefits-section{padding:5px 0}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.benefit-card{position:relative;background:#fff;border:1px solid #e4e9f0;border-radius:18px;padding:23px;min-height:205px}.benefit-number{position:absolute;right:17px;top:15px;color:#dbe8f8;font-size:24px;font-weight:900}.benefit-icon{width:48px;height:48px;border-radius:14px;background:#edf5ff;display:flex;align-items:center;justify-content:center;font-size:23px}.benefit-card h3{margin:14px 0 6px;font-size:16px}.benefit-card p{margin:0;color:#667085;font-size:12px;line-height:1.65}.reviews-section{padding-bottom:8px}.rating-summary{display:flex;align-items:center;gap:10px}.rating-summary>strong{font-size:31px;color:#0b4ea2}.rating-summary span{color:#f0b400;font-size:15px}.rating-summary small{display:block;color:#98a2b3;font-size:9px;text-align:right}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.review-card{background:#fff;border:1px solid #e4e9f0;border-radius:18px;padding:22px;box-shadow:0 8px 25px rgba(16,40,72,.04)}.review-head{display:flex;align-items:center;gap:10px}.review-avatar{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eaf3ff;color:#0b4ea2;font-weight:900}.review-head div:nth-child(2){flex:1}.review-head strong,.review-head span{display:block}.review-head strong{font-size:13px}.review-head span{color:#98a2b3;font-size:10px}.review-head>b{color:#f0b400;font-size:12px}.review-card p{margin:17px 0 0;color:#667085;font-size:12px;line-height:1.7}.partner-banner{margin-top:60px;padding:30px 34px;border-radius:22px;background:linear-gradient(120deg,#073b78,#0b4ea2);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:25px;box-shadow:0 18px 45px rgba(11,78,162,.18)}.partner-banner .section-kicker{color:#ffe27a}.partner-banner h2{margin:7px 0;font-size:27px}.partner-banner p{margin:0;color:rgba(255,255,255,.78);font-size:12px}.partner-actions{display:flex;gap:9px;flex-shrink:0}.partner-primary,.partner-secondary{height:45px;padding:0 17px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:900}.partner-primary{background:#f5c542;color:#172033}.partner-secondary{border:1px solid rgba(255,255,255,.25);color:#fff;background:rgba(255,255,255,.08)}.mini-cta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:20px}.mini-cta{display:flex;align-items:center;gap:12px;padding:17px;background:#fff;border:1px solid #e4e9f0;border-radius:15px}.mini-cta>span{font-size:22px}.mini-cta div{flex:1}.mini-cta strong,.mini-cta small{display:block}.mini-cta strong{font-size:13px}.mini-cta small{font-size:10px;color:#98a2b3;margin-top:2px}.mini-cta>b{color:#0b4ea2}.partner-page{width:min(1050px,94%);margin:auto;padding:45px 0 80px}.partner-hero{text-align:center;padding:25px 15px 35px}.partner-hero h1{font-size:38px;margin:10px 0}.partner-hero p{max-width:680px;margin:auto;color:#667085;font-size:14px;line-height:1.7}.partner-content{display:grid;grid-template-columns:1fr 420px;gap:22px;align-items:start}.partner-benefits{display:grid;grid-template-columns:1fr;gap:14px}.partner-benefits>div{background:#fff;border:1px solid #e4e9f0;border-radius:17px;padding:23px}.partner-benefits b{font-size:25px}.partner-benefits h3{margin:10px 0 5px}.partner-benefits p{margin:0;color:#667085;font-size:12px}.partner-form-card{background:#fff;border:1px solid #e4e9f0;border-radius:20px;padding:25px;box-shadow:0 12px 35px rgba(16,40,72,.07)}.partner-form-card h2{margin:0 0 5px}.partner-form-card>p{margin:0 0 18px;color:#667085;font-size:12px}.partner-form-card form{display:flex;flex-direction:column;gap:11px}.partner-form-card label{font-size:11px;font-weight:900;color:#344054}.partner-form-card input,.partner-form-card textarea{display:block;width:100%;margin-top:6px;border:1px solid #d9e0ea;border-radius:10px;padding:12px;font:inherit;font-size:13px;outline:0}.partner-form-card textarea{resize:vertical}.partner-form-card button{height:46px;border:0;border-radius:10px;background:#0b4ea2;color:#fff;font-weight:900;cursor:pointer}.partner-form-card button:hover{background:#073b78}
@media(max-width:900px){.home-hero{min-height:640px}.home-hero-inner{padding-top:42px}.hero-copy h1{font-size:35px}.home-search-form{grid-template-columns:1fr 1fr}.swap-route{display:none}.home-search-button{grid-column:1/-1}.trust-strip{grid-template-columns:1fr 1fr}.popular-route-grid,.offer-grid,.review-grid{grid-template-columns:1fr 1fr}.benefit-grid{grid-template-columns:1fr 1fr}.partner-banner{align-items:flex-start;flex-direction:column}.partner-actions{width:100%}.partner-primary,.partner-secondary{flex:1}.mini-cta-grid{grid-template-columns:1fr}.partner-content{grid-template-columns:1fr}.partner-hero h1{font-size:31px}}
@media(max-width:560px){.home-hero{min-height:690px;background-position:60% center}.home-hero-overlay{background:linear-gradient(180deg,rgba(3,35,75,.93),rgba(7,59,120,.8))}.home-hero-inner{width:calc(100% - 24px);padding-top:30px}.hero-copy h1{font-size:31px}.hero-copy p{font-size:13px}.home-search-card{margin-top:25px;padding:0 11px 12px}.home-search-form{grid-template-columns:1fr}.home-search-button{grid-column:auto}.home-search-tabs{height:48px}.home-search-tabs span,.home-search-tabs a{height:48px}.quick-searches{display:none}.trust-strip{grid-template-columns:1fr}.trust-strip>div{padding:15px}.home-main{width:calc(100% - 24px);padding-top:12px}.section-title-row{align-items:flex-start;flex-direction:column}.section-title-row h2{font-size:24px}.popular-route-grid,.offer-grid,.benefit-grid,.review-grid{grid-template-columns:1fr}.offer-card{min-height:185px}.partner-banner{padding:25px 20px}.partner-banner h2{font-size:22px}.partner-actions{flex-direction:column}.partner-primary,.partner-secondary{width:100%}.rating-summary{align-self:flex-start}.partner-page{width:calc(100% - 24px);padding-top:25px}}