/* Falcon - mega menu (Elementor Pro popup 5726, opened from header button 7559550d in template 5727) - issue #35 (Iggy, 16 Oct)
   Desktop: a panel on the right instead of a full-screen cover. Partner area on the left of the panel, menu links in
   two columns on the right (near the menu button) at a smaller size, contacts and socials below. The rest of the page stays visible behind a
   light sand overlay; clicking the overlay, moving the mouse away (mega-menu.js), Esc or Close all shut it.
   Mobile and tablet keep the existing full-screen layout. Link order (Tours and Activities first) is set by mega-menu.js.
   Keep it ASCII-only and backslash-free. */

@media (min-width: 1025px) {
	/* The modal itself becomes the page overlay; the panel hangs from the top right corner. */
	#elementor-popup-modal-5726 {
		justify-content: flex-end;
		align-items: flex-start;
		/* Light sand overlay (Iggy, 16 Oct): the navy edges of the panel stand out against it. */
		background-color: rgba(242, 234, 218, .62);
		-webkit-backdrop-filter: blur(3px);
		backdrop-filter: blur(3px);
		/* Fade the overlay in so it does not flash (Iggy). Restarts every time Elementor shows the modal. */
		animation: ftt-mm-overlay-in .6s cubic-bezier(.25, .1, .25, 1) both;
	}
	#elementor-popup-modal-5726 .dialog-widget-content {
		position: relative;
		width: min(1120px, calc(100vw - 32px));
		max-height: calc(100vh - 24px);
		margin: 12px 12px 0 0;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		border-radius: 0; /* the site never uses rounded corners (Iggy) */
		box-shadow: 0 24px 60px -12px rgba(17, 37, 71, .45);
	}
	#elementor-popup-modal-5726 .dialog-message {
		width: 100%;
		height: auto;
	}

	/* Grid (Iggy, 16 Oct follow-up): partner card on the left, links in two columns on the right, then contacts and
	   socials in a navy strip across the bottom. The navy column is flattened (display: contents) so its pieces can be
	   placed in the panel's own grid; the panel itself carries the navy, the links cell the sand. */
	#elementor-popup-modal-5726 .elementor-element-3c6556b8 {
		grid-template-columns: 360px minmax(0, 1fr);
		grid-template-rows: auto 1fr auto auto;
		grid-template-areas:
			"logo    links"
			"partner links"
			"contact contact"
			"social  social";
		min-height: 0;
		height: auto;
		/* Sand behind the partner card and links (Iggy, 16 Oct evening); only the contacts strip below stays navy. */
		background-color: #f2eada;
	}
	#elementor-popup-modal-5726 .elementor-element-62e3c8ad {
		display: contents;
	}
	#elementor-popup-modal-5726 .elementor-element-62e3c8ad > :first-child {
		grid-area: logo;
		align-self: start;
		display: block;
		width: fit-content;
		padding: 0;
		margin: 28px 28px 0;
	}
	#elementor-popup-modal-5726 .elementor-element-62e3c8ad > :first-child img {
		max-width: 76px;
	}
	/* The white logo PNG shows in navy on sand: mega-menu.js sets --ftt-mm-logo to the image URL, and the link paints
	   navy through it as a mask. The image itself stays in place (invisible) for size, alt text and the link. */
	#elementor-popup-modal-5726 .elementor-element-62e3c8ad > a.ftt-mm-logo {
		background-color: #112547;
		-webkit-mask: var(--ftt-mm-logo) center / contain no-repeat;
		mask: var(--ftt-mm-logo) center / contain no-repeat;
	}
	#elementor-popup-modal-5726 .elementor-element-62e3c8ad > a.ftt-mm-logo img {
		opacity: 0;
	}
	#elementor-popup-modal-5726 .elementor-element-17f5c0cf {
		grid-area: links;
		min-height: 0;
		height: auto;
		padding: 76px 40px 28px;
		gap: 24px;
		justify-content: flex-start;
		border-left: 3px solid #ffc64b; /* the gold divider, now between partner and links */
	}

	/* Close sits inside the panel's top right corner instead of floating over the page. */
	#elementor-popup-modal-5726 .elementor-element-329b7017 {
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 2;
		/* Gold on sand was too faint (Iggy): navy text, icon and outline instead. */
		color: #112547;
		background-color: transparent;
		border-color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-329b7017 .chip-label,
	#elementor-popup-modal-5726 .elementor-element-329b7017 * {
		color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-329b7017 svg,
	#elementor-popup-modal-5726 .elementor-element-329b7017 svg * {
		fill: currentColor;
		stroke: currentColor;
	}
	#elementor-popup-modal-5726 .elementor-element-329b7017:hover,
	#elementor-popup-modal-5726 .elementor-element-329b7017:focus-visible {
		background-color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-329b7017:hover *,
	#elementor-popup-modal-5726 .elementor-element-329b7017:focus-visible * {
		color: #f2eada;
	}

	/* Links: smaller heading, the three groups side by side in three columns. */
	#elementor-popup-modal-5726 .elementor-element-1cacbcb2 {
		margin: 0;
	}
	#elementor-popup-modal-5726 .elementor-element-1cacbcb2 h2 {
		font-size: 30px;
		line-height: 1.1;
	}
	#elementor-popup-modal-5726 .menu-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 22px 32px;
		margin: 0;
	}
	#elementor-popup-modal-5726 .menu-col {
		gap: 2px;
	}
	#elementor-popup-modal-5726 .menu-link {
		font-size: 20px;
		line-height: 1.35;
		padding-top: 2px;
		padding-bottom: 2px;
	}
	#elementor-popup-modal-5726 .elementor-element-2894caca {
		margin-top: auto;
		flex-wrap: wrap;
		row-gap: 6px;
	}

	/* Partner card: wider, so the button and links sit on one line. */
	#elementor-popup-modal-5726 .elementor-element-686d66bf {
		grid-area: partner;
		align-self: start;
		margin: 20px 28px 28px;
		padding: 24px 22px;
		width: auto;
		max-width: none;
	}
	#elementor-popup-modal-5726 .elementor-element-686d66bf h3 {
		font-size: 28px;
	}
	/* Partner card on sand: navy text, burgundy accents like the links column, navy outline. */
	#elementor-popup-modal-5726 .elementor-element-686d66bf {
		border-color: rgba(17, 37, 71, .2);
	}
	#elementor-popup-modal-5726 .elementor-element-686d66bf h3,
	#elementor-popup-modal-5726 .elementor-element-686d66bf h3 * {
		color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-686d66bf .meta,
	#elementor-popup-modal-5726 .elementor-element-686d66bf h3 em {
		color: #82224c;
	}
	#elementor-popup-modal-5726 .elementor-element-686d66bf .body-sm {
		color: rgba(17, 37, 71, .78);
	}
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse {
		color: #112547;
		border-bottom-color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse svg,
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse svg * {
		fill: #112547;
		color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-58e81e7d {
		flex-wrap: wrap;
		gap: 10px 18px;
	}

	/* Contacts and socials: a strip below the menus, across the full panel width. */
	#elementor-popup-modal-5726 .elementor-element-2982615b {
		grid-area: contact;
		display: grid;
		grid-template-columns: repeat(5, auto);
		justify-content: space-between;
		align-items: start;
		gap: 16px 24px;
		margin: 0;
		padding: 26px 28px 8px;
		border-top: 3px solid #ffc64b;
		background-color: #112547;
	}
	#elementor-popup-modal-5726 .elementor-element-2982615b > :first-child:not(.contact-line) {
		grid-column: 1 / -1; /* the "Talk to us" label */
	}
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line {
		margin: 0;
		min-width: 0;
	}
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line a {
		font-size: 15px;
		white-space: nowrap;
	}
	/* WhatsApp's falcon arrow made its link taller, so its text sat lower than the number and emails: scale the arrow
	   to the text and centre it, so all the link texts share one line. */
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line a {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		align-self: start;
	}
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line .falcon-fly,
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line .falcon-fly svg {
		width: 16px;
		height: 16px;
	}
	/* Phone, WhatsApp and email on one line (Iggy): every label takes two lines' height, so a label that wraps
	   ("Bookings & travel enquiries") no longer pushes its value down. Icons and labels share the top line. */
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line > .meta {
		min-height: 2em;
		grid-row: 1;
		grid-column: 2;
	}
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line > :first-child {
		grid-row: 1 / span 2;
		grid-column: 1;
		align-self: start;
	}
	#elementor-popup-modal-5726 .elementor-element-2982615b .contact-line > :last-child {
		grid-row: 2;
		grid-column: 2;
	}
	#elementor-popup-modal-5726 .elementor-element-29a73e87 {
		grid-area: social;
		margin: 0;
		padding: 12px 28px 26px;
		gap: 6px;
		background-color: #112547;
		/* All seven on one line (Iggy), spread across the strip. */
		flex-wrap: nowrap;
		justify-content: space-between;
	}
	#elementor-popup-modal-5726 .elementor-element-29a73e87 .social-link {
		flex: 0 1 auto;
		min-width: 0;
		padding: 4px 10px;
		font-size: 12px;
		white-space: nowrap;
	}

	/* Partner card links on hover: burgundy text, underline and falcon instead of a sideways shift (issue #46). */
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse:hover,
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse:focus-visible,
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse:hover svg,
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse:hover svg *,
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse:focus-visible svg,
	#elementor-popup-modal-5726 .elementor-element-58e81e7d .link-cta-inverse:focus-visible svg * {
		color: #82224c;
		fill: #82224c;
		border-bottom-color: #82224c;
	}
}

/* Hover glitch (issue #46): the site-wide link hover slides the text 10px and the falcon takes off. Inside the menu that
   shoved the neighbouring link sideways and flickered over the blurred overlay, so the links keep still here and only
   their colour changes. All screen sizes. */
#elementor-popup-modal-5726 .link-cta-inverse,
#elementor-popup-modal-5726 .link-cta-inverse:hover,
#elementor-popup-modal-5726 .link-cta-inverse:focus-visible {
	padding-inline-start: 0;
	transition: color .2s ease, border-color .2s ease;
}
#elementor-popup-modal-5726 .falcon-link:hover .falcon-fly,
#elementor-popup-modal-5726 .falcon-link:focus-visible .falcon-fly {
	animation: none;
}

@keyframes ftt-mm-overlay-in {
	from {
		background-color: rgba(242, 234, 218, 0);
		-webkit-backdrop-filter: blur(0);
		backdrop-filter: blur(0);
	}
	to {
		background-color: rgba(242, 234, 218, .62);
		-webkit-backdrop-filter: blur(3px);
		backdrop-filter: blur(3px);
	}
}

@media (min-width: 1025px) and (prefers-reduced-motion: reduce) {
	#elementor-popup-modal-5726,
	#elementor-popup-modal-5726 .dialog-widget-content { animation: none; }
}