/*
Theme Name: Elite by Phyl
Theme URI: https://elitebyphyl.com
Author: Elite by Phyl Travel Consultants
Description: Travel consultancy theme for Elite by Phyl. Ships the complete site as Elementor templates - 238 pages covering 6 regions, 23 countries, 92 destinations and 92 sample itineraries, plus the core, service and legal pages - and a setup wizard that builds the whole thing. Requires Elementor and Elementor Pro.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ebp
Tags: elementor, travel, business, one-column
*/

/* --------------------------------------------------------------------------
   Base reset.

   Deliberately minimal — the design lives in the Elementor templates and in
   assets/css/brand.css. This file only clears the browser defaults that would
   otherwise fight the templates.
   -------------------------------------------------------------------------- */

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: Montserrat, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 17px;
	line-height: 1.75;
	color: #33475B;
	background: #FFFFFF;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/*
 * The guard against horizontal overflow belongs on the root element, not on
 * body. Setting overflow-x on body makes body the scroll container, and the
 * viewport then stops firing scroll on window -- which silently disables the
 * condensing header and the back-to-top button, with nothing in the console
 * to say why.
 */
html { overflow-x: hidden; }

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 .5em;
	font-family: Fraunces, Georgia, serif;
	font-weight: 600;
	line-height: 1.2;
	color: #0F2A44;
}

p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }

a { color: #0F2A44; }

img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

figure { margin: 0; }

button,
input,
select,
textarea { font: inherit; color: inherit; }

ul, ol { margin: 0 0 1em; padding-left: 1.25em; }

blockquote {
	margin: 0 0 1em;
	padding-left: 1.25em;
	border-left: 2px solid #C9A227;
}

/* Accessibility: visible skip link on focus. */
.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.skip-link:focus {
	position: fixed !important;
	top: 12px; left: 12px;
	z-index: 100000;
	width: auto; height: auto;
	padding: 12px 20px;
	clip: auto;
	background: #0F2A44;
	color: #fff;
	text-decoration: none;
	border-radius: 2px;
}

/* --------------------------------------------------------------------------
   Fallback header and footer.

   Shown only until the Elementor Theme Builder parts are published. Styled as
   a real navigation bar rather than a placeholder, so the site is usable from
   the moment the theme is activated. Colours come from the palette variables,
   so it follows whichever scheme is active.
   -------------------------------------------------------------------------- */
.ebp-fallback-header {
	background: var(--ebp-primary, #0F2A44);
	color: #fff;
}
.ebp-fallback-header__inner {
	display: flex;
	align-items: center;
	gap: 24px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 16px 24px;
}
.ebp-fallback-header__brand { flex: 0 0 auto; }
.ebp-fallback-header__brand img { max-height: 52px; width: auto; }

.ebp-wordmark { text-decoration: none; display: block; line-height: 1.15; }
.ebp-wordmark__name {
	font-family: Fraunces, Georgia, serif;
	font-size: 22px;
	font-weight: 600;
	color: #fff;
	/* Long auto-generated host names would otherwise push the nav off-screen. */
	display: block;
	max-width: 320px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Desktop: nav and CTA sit together on the right of the bar. */
.ebp-fallback-header__collapse {
	display: flex;
	align-items: center;
	gap: 28px;
	flex: 1 1 auto;
	justify-content: flex-end;
}

.ebp-fallback-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	justify-content: flex-end;
	list-style: none;
	margin: 0;
	padding: 0;
}
.ebp-fallback-nav a {
	color: #fff;
	text-decoration: none;
	font-size: 13.5px;
	font-weight: 500;
	letter-spacing: .04em;
	padding: 6px 0;
	border-bottom: 2px solid transparent;
	transition: color .2s ease, border-color .2s ease;
}
.ebp-fallback-nav a:hover,
.ebp-fallback-nav .current_page_item > a,
.ebp-fallback-nav .current-menu-item > a {
	color: var(--ebp-accent-light, #E3C766);
	border-bottom-color: var(--ebp-accent, #C9A227);
}

.ebp-fallback-header__cta { flex: 0 0 auto; }
.ebp-fallback-btn {
	display: inline-block;
	background: var(--ebp-accent, #C9A227);
	color: var(--ebp-on-accent, #0F2A44);
	text-decoration: none;
	padding: 12px 22px;
	border-radius: 2px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background-color .2s ease, color .2s ease;
}
.ebp-fallback-btn:hover {
	background: #fff;
	color: var(--ebp-primary, #0F2A44);
}

/* --------------------------------------------------------------------------
   Hamburger toggle. Hidden on desktop, where the full bar fits.
   -------------------------------------------------------------------------- */
.ebp-nav-toggle {
	display: none;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	padding: 0;
	background: none;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 3px;
	cursor: pointer;
	align-items: center;
	justify-content: center;
	transition: border-color .2s ease, background-color .2s ease;
}
.ebp-nav-toggle:hover { border-color: var(--ebp-accent, #C9A227); }
.ebp-nav-toggle:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

.ebp-nav-toggle__bars {
	display: block;
	position: relative;
	width: 20px;
	height: 14px;
}
.ebp-nav-toggle__bars span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #fff;
	border-radius: 2px;
	transition: transform .25s ease, opacity .2s ease, top .25s ease;
}
.ebp-nav-toggle__bars span:nth-child(1) { top: 0; }
.ebp-nav-toggle__bars span:nth-child(2) { top: 6px; }
.ebp-nav-toggle__bars span:nth-child(3) { top: 12px; }

/* Open state: bars fold into a cross. */
.ebp-fallback-header.is-open .ebp-nav-toggle__bars span:nth-child(1) {
	top: 6px;
	transform: rotate(45deg);
}
.ebp-fallback-header.is-open .ebp-nav-toggle__bars span:nth-child(2) { opacity: 0; }
.ebp-fallback-header.is-open .ebp-nav-toggle__bars span:nth-child(3) {
	top: 6px;
	transform: rotate(-45deg);
}

/* --------------------------------------------------------------------------
   Mobile: the bar keeps logo + burger, and the menu drops below it.
   -------------------------------------------------------------------------- */
@media (max-width: 880px) {
	.ebp-nav-toggle { display: flex; }

	.ebp-fallback-header__inner {
		flex-wrap: wrap;
		gap: 0;
		justify-content: space-between;
		padding: 14px 20px;
	}

	.ebp-fallback-header__collapse {
		flex: 1 0 100%;
		flex-direction: column;
		align-items: stretch;
		justify-content: flex-start;
		gap: 0;

		/* Collapsed by default, animated open. max-height rather than display so
		   the transition has something to interpolate. */
		max-height: 0;
		overflow: hidden;
		opacity: 0;
		transition: max-height .3s ease, opacity .2s ease, margin-top .3s ease;
	}
	.ebp-fallback-header.is-open .ebp-fallback-header__collapse {
		max-height: 70vh;
		overflow-y: auto;
		opacity: 1;
		margin-top: 14px;
		border-top: 1px solid rgba(255, 255, 255, .14);
	}

	.ebp-fallback-nav ul {
		flex-direction: column;
		gap: 0;
		justify-content: flex-start;
	}
	.ebp-fallback-nav li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
	.ebp-fallback-nav a {
		display: block;
		padding: 15px 2px;
		font-size: 15px;
		border-bottom: 0;
	}
	.ebp-fallback-nav a:hover,
	.ebp-fallback-nav .current_page_item > a,
	.ebp-fallback-nav .current-menu-item > a { border-bottom: 0; }

	.ebp-fallback-header__cta { padding: 18px 0 6px; }
	.ebp-fallback-btn { display: block; text-align: center; }

	.ebp-wordmark__name { max-width: calc(100vw - 130px); font-size: 20px; }
}

/* Lock the page behind an open menu. */
body.ebp-nav-open { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
	.ebp-fallback-header__collapse,
	.ebp-nav-toggle__bars span { transition: none; }
}

.ebp-fallback-footer {
	padding: 28px 24px;
	background: var(--ebp-deep, #0A1E31);
	color: #fff;
	text-align: center;
	font-size: 14px;
}
.ebp-fallback-footer a { color: var(--ebp-accent-light, #E3C766); text-decoration: none; }

/* Default WordPress content width, for any page not built in Elementor
   (e.g. a blog post before you style it). */
.ebp-default-content {
	max-width: 760px;
	margin: 0 auto;
	padding: 72px 24px;
}
.ebp-default-content .entry-title { margin-bottom: .35em; }
.ebp-default-content .entry-meta {
	margin-bottom: 2em;
	font-size: 14px;
	color: #6B7C8F;
}
