/* ─── MARQUEE STRIP ───────────────────────────────────────── */
 .travel-section .marquee-strip {
     background: #0f0f0f;
     color: #c8ff00;
     padding: 10px 0;
     overflow: hidden;
     white-space: nowrap;
 }

 .travel-section .marquee-track {
     display: inline-flex;
     animation: travel-marquee 18s linear infinite;
 }

 .travel-section .marquee-track span {
     font-size: 3.78rem;
     font-weight: 800;
     letter-spacing: 0.18em;
     text-transform: uppercase;
     padding: 0 16px;
     color: yellow;
 }

 .travel-section .marquee-track .marquee-dot {
     color: yellow;
     font-size: 4rem;
     padding: 0 2px;
 }

 @keyframes travel-marquee {
     0% {
         transform: translateX(0);
     }

     100% {
         transform: translateX(-50%);
     }
 }

 /* ─── HERO WRAPPER ────────────────────────────────────────── */
 .travel-section .travel-hero {
     position: relative;
     background: #f7f7f5;
     overflow: hidden;
     padding: 48px 40px 0;
     min-height: 520px;
 }

 /* ─── BG WATERMARK TEXT ───────────────────────────────────── */
 .travel-section .hero-bg-text {
     position: absolute;
     top: 25%;
     left: 50%;
     transform: translate(-50%, -46%);
     font-size: 282px;
     color: rgba(0, 0, 0, 0.07);
     white-space: nowrap;
     letter-spacing: 0.04em;
     pointer-events: none;
     user-select: none;
     font-weight: 700;
     z-index: 0;
 }

 .container-4 {
     max-width: 100%;
 }

 /* ─── HEADING ─────────────────────────────────────────────── */
 .travel-section .hero-heading {
     position: relative;
     z-index: 2;
     font-size: clamp(0.85rem, 2vw, 5.2rem);
     font-weight: 800;
     letter-spacing: 0.08em;
     text-transform: uppercase;
     color: #0f0f0f;
     display: flex;
     align-items: center;
     gap: 10px;
     margin-bottom: 0;
 }

 .travel-section .hero-heading .hero-arrow {
     font-style: normal;
     font-size: 1.15em;
     line-height: 1;
 }

 /* ─── IMAGE WRAP ──────────────────────────────────────────── */
 .travel-section .hero-img-wrap {
     position: relative;
     z-index: 1;
     display: flex;
     align-items: flex-end;
     justify-content: center;
     width: 100%;
 }

 .travel-section .hero-img-wrap img {
     /* width: 100%; */
     /* max-width: 680px; */
     display: block;
     object-fit: contain;
     filter: drop-shadow(0 24px 48px rgba(0, 0, 0, 0.13));
     transition: transform 0.6s cubic-bezier(.23, 1.4, .32, 1);
 }

 .travel-section .hero-img-wrap:hover img {
     transform: translateY(-10px) scale(1.02);
 }

 /* ─── BOTTOM FADE ─────────────────────────────────────────── */
 .travel-section .hero-fade {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     height: 80px;
     background: linear-gradient(to top, #f7f7f5, transparent);
     z-index: 2;
     pointer-events: none;
 }

 /* ─── RESPONSIVE ──────────────────────────────────────────── */

 /* LG and below */
 @media (max-width: 991.98px) {
     .travel-section .travel-hero {
         padding: 36px 28px 0;
         min-height: 420px;
     }

     .travel-section .hero-img-wrap img {
         max-width: 520px;
     }
 }

 /* MD and below */
 @media (max-width: 767.98px) {
     .travel-section .travel-hero {
         padding: 28px 20px 0;
         min-height: 360px;
     }

     .travel-section .hero-bg-text {
         font-size: clamp(55px, 20vw, 100px);
     }

     .travel-section .hero-img-wrap img {
         max-width: 420px;
     }

     .travel-section .marquee-track span {
         font-size: 0.7rem;
         padding: 0 12px;
     }
 }

 /* SM and below */
 @media (max-width: 575.98px) {
     .travel-section .travel-hero {
         padding: 22px 16px 0;
         min-height: 280px;
     }

     .travel-section .hero-bg-text {
         font-size: clamp(44px, 22vw, 80px);
     }

     .travel-section .hero-img-wrap img {
         max-width: 100%;
     }

     .travel-section .hero-fade {
         height: 50px;
     }

     .travel-section .marquee-track span {
         font-size: 0.65rem;
         padding: 0 10px;
     }

     .travel-section .marquee-strip {
         padding: 8px 0;
     }
 }