/* Mobile-only refinements. Everything lives inside the media query so tablet/desktop are untouched. */
@media (max-width: 767px) {

	/* Section headings: 51-57px wrapped onto two lines on phones */
	h2.sc_item_title,
	h2.sc_item_title .sc_item_title_text {
		font-size: 34px !important;
		line-height: 1.2 !important;
	}
	/* page intro headings (About Us, Visa Services, Air Tickets ...), not the Book-now cards */
	h2.elementor-heading-title:not(:has(.btn-txt-parent)) {
		font-size: 34px;
		line-height: 1.2;
	}
	/* inner-page banner title was crowding the side artwork */
	.sc_layouts_title_caption {
		font-size: 26px;
	}

	/* Contact page: 129px of empty space above the first block */
	.elementor-193 .elementor-element.elementor-element-f906b1a {
		padding-top: 40px !important;
	}

	/* Footer: side margins were 50px + 10px padding, leaving a narrow text column */
	footer.footer_wrap .elementor-top-section > .elementor-container {
		margin-left: 15px;
		margin-right: 15px;
	}
	/* space between stacked footer blocks (Links / Services / Contact) */
	footer.footer_wrap .elementor-inner-column + .elementor-inner-column .elementor-column-wrap {
		margin-top: 25px;
	}
	footer.footer_wrap h4.elementor-heading-title {
		margin-bottom: 10px;
	}

	/* Header: logo and hamburger share one row instead of stacking */
	header.top_panel .elementor-top-section.sc_layouts_row_fixed > .elementor-container > .elementor-row {
		flex-wrap: nowrap;
		align-items: center;
		justify-content: space-between;
	}
	header.top_panel .elementor-top-section.sc_layouts_row_fixed > .elementor-container {
		padding-left: 15px;
		padding-right: 15px;
	}
	header.top_panel .elementor-top-section.sc_layouts_row_fixed .elementor-row > .elementor-column {
		width: auto;
		flex: 0 0 auto;
	}
	/* third column only holds the "Book Your Trip" button, which is hidden on phones */
	header.top_panel .elementor-top-section.sc_layouts_row_fixed .elementor-row > .elementor-column:nth-child(3) {
		display: none;
	}
	header.top_panel .sc_layouts_logo img {
		max-height: 70px !important;
		width: auto;
	}

	/* Slide-out menu: side panel that opens from the right (was a full-screen drop-down) */
	.menu_mobile.menu_mobile_fullscreen {
		left: auto;
		right: 0;
		width: 86%;
		max-width: 360px;
		height: 100% !important;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform 0.35s ease, visibility 0s linear 0.35s !important;
		box-shadow: -8px 0 30px rgba(0, 0, 0, 0.35);
	}
	body.menu_mobile_opened .menu_mobile.menu_mobile_fullscreen {
		transform: none;
		visibility: visible;
		transition: transform 0.35s ease, visibility 0s !important;
	}
	.menu_mobile.menu_mobile_fullscreen .menu_mobile_inner {
		height: 100%;
		overflow-y: auto;
	}
	/* dim the page behind the panel; tapping it closes the menu */
	.menu_mobile_overlay {
		display: block !important;
		z-index: 100001;
		background: rgba(0, 0, 0, 0.55);
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.35s ease, visibility 0s linear 0.35s;
	}
	body.menu_mobile_opened .menu_mobile_overlay {
		opacity: 1;
		visibility: visible;
		transition: opacity 0.35s ease, visibility 0s;
	}

	/* Slide-out menu contents */
	.menu_mobile .menu_mobile_inner > .sc_layouts_logo {
		display: block;
		margin: 35px auto 15px;
	}
	.menu_mobile .menu_mobile_inner > .sc_layouts_logo img {
		width: 200px !important;
		max-width: 70% !important;
		height: auto !important;
		max-height: none !important;
	}
	.menu_mobile .menu_mobile_nav_area ul.menu_mobile_nav {
		max-width: 320px;
		margin: 0 auto;
	}
	.menu_mobile .menu_mobile_nav_area ul.menu_mobile_nav > li {
		border-bottom: 1px solid rgba(255, 255, 255, 0.14);
	}
	.menu_mobile .menu_mobile_nav_area ul.menu_mobile_nav > li:last-child {
		border-bottom: 0;
	}
	.menu_mobile .menu_mobile_nav_area ul.menu_mobile_nav > li > a {
		padding-top: 12px;
		padding-bottom: 12px;
	}
	.menu_mobile .menu_mobile_nav_area ul.menu_mobile_nav > li.current-menu-item > a,
	.menu_mobile .menu_mobile_nav_area ul.menu_mobile_nav > li.current-menu-ancestor > a {
		color: #4d9bff;
	}
	/* sub-menu: tinted panel with larger, easy-to-tap items */
	.menu_mobile .menu_mobile_nav_area .sub-menu {
		background: rgba(255, 255, 255, 0.07);
		border-radius: 10px;
		margin: 0 0 14px;
		padding: 6px 0;
	}
	.menu_mobile .menu_mobile_nav_area .sub-menu a {
		font-size: 17px !important;
		padding-top: 10px;
		padding-bottom: 10px;
	}
}