/* Bus rental landing — new sections (occasions, road journey) */
.huc-busx {
    --busx-ink: var(--huc-darkGray-clr, #1C293E);
    --busx-orange: var(--huc-orange-clr, #ff6a00);
    --busx-night: #0d1626;
    --busx-paper: #fff8f1;
    --busx-line: color-mix(in srgb, var(--busx-ink) 14%, transparent);
    padding: clamp(2.5rem, 2rem + 3vw, 4.5rem) 0;
    position: relative;
}

/* ---------- shared head ---------- */
.huc-busx-head { text-align: center; max-width: 44rem; margin: 0 auto clamp(1.75rem, 1.4rem + 1.5vw, 2.75rem); }
.huc-busx-eyebrow {
    display: inline-flex; align-items: center; gap: .45rem;
    padding: .3rem .9rem; border-radius: 999px;
    font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--busx-orange); background: rgba(255, 106, 0, .1);
    margin-bottom: .9rem;
}
.huc-busx-eyebrow--light { background: rgba(255, 255, 255, .1); color: #ffb779; }
.huc-busx-title {
    font-family: var(--font-secondary, 'Poppins', sans-serif);
    font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.3rem); font-weight: 800; line-height: 1.2;
    color: var(--busx-ink); margin: 0 0 .65rem;
}
.huc-busx-sub { font-size: .95rem; line-height: 1.65; color: var(--huc-gray-clr, #4a4a4a); margin: 0; }
.huc-busx-head--light .huc-busx-title { color: #fff; }
.huc-busx-head--light .huc-busx-sub { color: rgba(255, 255, 255, .72); }


/* ---------- 2. occasion tickets ---------- */
.huc-busx-occ__track { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; }
.huc-busx-ticket {
    --notch: 14px;
    position: relative; display: flex; flex-direction: column; gap: .8rem;
    background: #fff; border: 1.5px solid var(--busx-line); border-radius: 20px;
    padding: 1.2rem 1.2rem 0; overflow: hidden;
    transform: rotate(calc((var(--i) - 2.5) * .35deg));
    transition: transform .25s ease, box-shadow .25s ease;
}
.huc-busx-ticket:hover { transform: rotate(0) translateY(-6px); box-shadow: 0 18px 34px rgba(28, 41, 62, .14); }
.huc-busx-ticket__top { display: flex; align-items: center; gap: .6rem; }
.huc-busx-ticket__icon {
    width: 2.5rem; height: 2.5rem; border-radius: 12px; display: grid; place-items: center;
    background: rgba(255, 106, 0, .12); color: var(--busx-orange); font-size: 1.15rem; flex: none;
}
.huc-busx-ticket__tag { font-weight: 800; font-size: .8rem; color: var(--busx-ink); }
.huc-busx-ticket__no { margin-left: auto; font-size: .68rem; font-weight: 700; color: #a39b90; letter-spacing: .06em; }
.huc-busx-ticket__title { font-family: var(--font-secondary, 'Poppins', sans-serif); font-size: 1.1rem; font-weight: 800; color: var(--busx-ink); margin: 0; }
.huc-busx-ticket__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; flex: 1; }
.huc-busx-ticket__list li { display: flex; gap: .5rem; font-size: .84rem; line-height: 1.5; color: var(--huc-gray-clr, #4a4a4a); }
.huc-busx-ticket__list i { color: var(--huc-green-clr, #37B757); flex: none; margin-top: .15rem; }
.huc-busx-ticket__stub {
    position: relative; margin: .2rem -1.2rem 0; padding: .9rem 1.2rem;
    border-top: 2px dashed var(--busx-line); background: var(--busx-paper);
    display: flex; flex-direction: column; gap: .15rem;
}
.huc-busx-ticket__stub::before, .huc-busx-ticket__stub::after {
    content: ""; position: absolute; top: calc(var(--notch) / -1 - 1px); width: calc(var(--notch) * 2); height: calc(var(--notch) * 2);
    border-radius: 50%; background: var(--huc-bg-clr, #fff); border: 1.5px solid var(--busx-line);
}
.huc-busx-ticket__stub::before { left: calc(var(--notch) * -1.5); }
.huc-busx-ticket__stub::after { right: calc(var(--notch) * -1.5); }
.huc-busx-ticket__stub-label { font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; color: #a39b90; }
.huc-busx-ticket__stub-val { font-weight: 800; font-size: .88rem; color: var(--busx-orange); }

/* ---------- 3. road journey ---------- */
.huc-busx-road { background: var(--busx-night); overflow: hidden; }
.huc-busx-road::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background:
        radial-gradient(circle at 15% 20%, rgba(255, 255, 255, .55) 0 1px, transparent 2px),
        radial-gradient(circle at 70% 10%, rgba(255, 255, 255, .45) 0 1px, transparent 2px),
        radial-gradient(circle at 88% 35%, rgba(255, 255, 255, .5) 0 1.5px, transparent 2px),
        radial-gradient(circle at 40% 6%, rgba(255, 255, 255, .4) 0 1px, transparent 2px);
}
.huc-busx-road > .container { position: relative; }
.huc-busx-road__map { position: relative; padding-top: 5.5rem; }
.huc-busx-road__lane {
    position: absolute; left: 0; right: 0; top: 1.4rem; height: 3.6rem;
    background: #1f2a3d; border-radius: 12px; border-top: 3px solid #36445d; border-bottom: 3px solid #36445d;
}
.huc-busx-road__dash {
    position: absolute; left: 1rem; right: 1rem; top: 50%; height: 4px; transform: translateY(-50%);
    background: repeating-linear-gradient(90deg, #ffd89b 0 22px, transparent 22px 44px);
}
.huc-busx-road__bus {
    position: absolute; top: 50%; left: calc(var(--p) * (100% - 3.4rem)); transform: translateY(-50%);
    width: 3.4rem; height: 3.4rem; display: grid; place-items: center;
    font-size: 1.9rem; color: var(--busx-orange); filter: drop-shadow(0 0 14px rgba(255, 106, 0, .65));
    transition: left .15s linear, top .15s linear;
}
.huc-busx-road__stops {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(var(--busx-stops, 4), minmax(0, 1fr)); gap: 1rem;
}
.huc-busx-stop { display: flex; flex-direction: column; align-items: center; text-align: center; gap: .8rem; opacity: .72; transition: opacity .35s ease, transform .35s ease; }
.huc-busx-stop.is-lit { opacity: 1; transform: translateY(-4px); }
.huc-busx-stop:not(.is-lit) .huc-busx-stop__step { color: rgba(255, 183, 121, .55); }
.huc-busx-stop:not(.is-lit) .huc-busx-stop__title { color: rgba(255, 255, 255, .78); }
.huc-busx-stop:not(.is-lit) .huc-busx-stop__text { color: rgba(255, 255, 255, .55); }
.huc-busx-stop__pin {
    width: 3.2rem; height: 3.2rem; border-radius: 50%; display: grid; place-items: center; font-size: 1.25rem;
    background: #1f2a3d; color: #fff; border: 2px solid #36445d; margin-top: .4rem;
    transition: background .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.huc-busx-stop.is-lit .huc-busx-stop__pin { background: var(--busx-orange); border-color: #ffb779; box-shadow: 0 0 0 6px rgba(255, 106, 0, .22); }
.huc-busx-stop__body { display: flex; flex-direction: column; gap: .3rem; }
.huc-busx-stop__step { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; color: #ffb779; }
.huc-busx-stop__title { color: #fff; font-size: .98rem; font-weight: 800; }
.huc-busx-stop__text { color: rgba(255, 255, 255, .7); font-size: .8rem; line-height: 1.55; }

/* ---------- responsive ---------- */
@media (max-width: 991.98px) {
    .huc-busx-occ__track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
    /* road turns vertical: bus drives down the page */
    .huc-busx-road__map { padding: 0 0 0 4.5rem; }
    .huc-busx-road__lane { top: 0; bottom: 0; left: 0; right: auto; width: 3.4rem; height: auto; border: 0; border-left: 3px solid #36445d; border-right: 3px solid #36445d; }
    .huc-busx-road__dash { left: 50%; right: auto; top: 1rem; bottom: 1rem; width: 4px; height: auto; transform: translateX(-50%);
        background: repeating-linear-gradient(180deg, #ffd89b 0 18px, transparent 18px 36px); }
    .huc-busx-road__bus { left: 50%; top: calc(var(--p) * (100% - 3.4rem)); transform: translateX(-50%) rotate(90deg); }
    .huc-busx-road__stops { grid-template-columns: minmax(0, 1fr); gap: 1.6rem; }
    .huc-busx-stop { flex-direction: row; text-align: left; align-items: flex-start; }
    .huc-busx-stop__pin { flex: none; margin-top: 0; }
    .huc-busx-stop.is-lit { transform: translateX(4px); }
}
@media (max-width: 575.98px) {
    .huc-busx-occ__track {
        display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 1rem;
        margin: 0 -.75rem; padding: .5rem .75rem 1rem; scrollbar-width: none;
    }
    .huc-busx-occ__track::-webkit-scrollbar { display: none; }
    .huc-busx-ticket { flex: 0 0 82%; scroll-snap-align: center; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .huc-busx * { animation: none !important; transition: none !important; }
    .huc-busx-ticket { transform: none; }
}