/* INFLITE Charters Polish v1.3.0, hover and refinement layer. */

:root {
	--ease: cubic-bezier(0.625, 0.05, 0, 1);
	--accent: #550000;        /* accent on light grounds */
	--accent-light: #B99D75;  /* accent on dark grounds. Gold, 6.97:1 on #151719, 8.14:1 on #000 */
	--accent-hover: #8C2F2F;  /* hover border on light grounds */
	--ink: #1A1B1A;
}

::selection { background: var(--accent); color: #fff; }

/* Buttons: Marcellus label (matches Heletranz), smooth colour transitions, gentle lift. */
.elementor-button {
	transition:
		transform .3s var(--ease),
		box-shadow .3s var(--ease),
		background-color .35s var(--ease),
		color .35s var(--ease),
		border-color .35s var(--ease);
}
.elementor-button .elementor-button-text {
	font-family: 'Marcellus', serif !important;
	letter-spacing: 1.4px;
}
.elementor-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.16);
}

/* Image zoom on hover (framework card-zoom pattern). */
.elementor-widget-image { overflow: hidden; }
.elementor-widget-image img { transition: transform .7s var(--ease); }
.elementor-widget-image:hover img { transform: scale(1.04); }

/* Lift for image cards and gallery tiles (class added by polish.js). */
.ch-lift {
	transition: transform .6s var(--ease), box-shadow .6s var(--ease);
}
.ch-lift:hover {
	transform: translateY(-6px);
	box-shadow: 0 22px 44px rgba(0, 0, 0, 0.22);
}

/* Nav and footer links: smooth colour, slight tracking ease. */
.elementor-nav-menu a,
.elementor-location-footer a,
.elementor-icon-list-item a {
	transition: color .25s var(--ease), letter-spacing .25s var(--ease);
}

/* Social icons: gold wash on hover. */
.elementor-social-icon {
	transition: background-color .3s var(--ease), transform .3s var(--ease);
}
.elementor-social-icon:hover { transform: translateY(-2px); }

/* Icon boxes: icon nudge. */
.elementor-icon-box-icon .elementor-icon {
	transition: transform .4s var(--ease), color .3s var(--ease);
}
.elementor-widget-icon-box:hover .elementor-icon-box-icon .elementor-icon {
	transform: translateY(-4px);
}

/* Keep horizontal overflow clipped (parallax and lifts never cause scrollbars). */
body { overflow-x: clip; }

/* ---- Modern layer: glass header, ambient blur gradients, progressive scrim ---- */

/* Glass sticky header: root goes translucent + backdrop blur; the white nav row
   becomes transparent so the glass shows. Dark top bar stays solid. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.ch-anim .elementor-location-header > .e-con {
		background: rgba(255, 255, 255, 0.78) !important;
		-webkit-backdrop-filter: blur(16px) saturate(1.5);
		backdrop-filter: blur(16px) saturate(1.5);
	}
	.ch-anim .elementor-location-header > .e-con > .e-con:last-child {
		background: transparent !important;
	}
}

/* ---- Transparent header over hero pages (classes set by polish.js) ---- */

/* Smooth handover between transparent and glass states. */
.elementor-location-header > .e-con,
.elementor-location-header .e-con {
	transition: background-color .35s var(--ease), box-shadow .35s var(--ease),
		-webkit-backdrop-filter .35s var(--ease), backdrop-filter .35s var(--ease);
}
.elementor-location-header .elementor-nav-menu--main a.elementor-item,
.elementor-location-header .elementor-menu-toggle i,
.elementor-location-header .elementor-menu-toggle svg {
	transition: color .3s var(--ease), fill .3s var(--ease);
}

/* At the top of a hero page: fully transparent chrome, white nav and button. */
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header > .e-con {
	background: transparent !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	box-shadow: none !important;
}
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .e-con {
	background: transparent !important;
}
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .elementor-nav-menu--main a.elementor-item {
	color: #fff !important;
}
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .elementor-nav-menu--main a.elementor-item:hover,
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .elementor-nav-menu--main a.elementor-item.elementor-item-active {
	/* transparent header sits over dark hero imagery: needs the light tint */
	color: var(--accent-light) !important;
}
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .elementor-button {
	/* Over hero imagery the button goes solid white with dark text.
	   No white outline: an outlined button here inherits currentColor and
	   reads as a hairline box rather than a control. */
	background-color: #fff !important;
	color: var(--ink) !important;
	border-color: #fff !important;
}
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .elementor-menu-toggle i,
html.chx-hero-page:not(.chx-scrolled) .elementor-location-header .elementor-menu-toggle svg {
	color: #fff !important;
	fill: #fff !important;
}

/* Ambient blur gradients on light content sections (class set by polish.js). */
.chx-ambient {
	position: relative;
	overflow: clip;
}
.chx-ambient::before,
.chx-ambient::after {
	content: '';
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	z-index: 0;
}
.chx-ambient::before {
	top: -120px; right: -80px; width: 540px; height: 540px;
	background: radial-gradient(circle at center, rgba(185, 157, 117, 0.30), rgba(185, 157, 117, 0) 65%);
	filter: blur(70px);
}
.chx-ambient::after {
	bottom: -140px; left: -100px; width: 500px; height: 500px;
	background: radial-gradient(circle at center, rgba(83, 98, 78, 0.20), rgba(83, 98, 78, 0) 65%);
	filter: blur(80px);
}
.chx-ambient > * { position: relative; z-index: 1; }

/* Progressive blur scrim at the base of hero-scale image sections. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.chx-scrim { position: relative; }
	.chx-scrim::after {
		content: '';
		position: absolute;
		left: 0; right: 0; bottom: 0;
		height: 32%;
		pointer-events: none;
		z-index: 1;
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px);
		-webkit-mask-image: linear-gradient(to bottom, transparent, #000 80%);
		mask-image: linear-gradient(to bottom, transparent, #000 80%);
	}
	.chx-scrim > .e-con { position: relative; z-index: 2; }
}

/* Fixed progressive blur pinned to the viewport bottom edge. */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	body::after {
		content: '';
		position: fixed;
		left: 0; right: 0; bottom: 0;
		height: 84px;
		pointer-events: none;
		z-index: 98; /* below the sticky header (99) */
		-webkit-backdrop-filter: blur(7px);
		backdrop-filter: blur(7px);
		-webkit-mask-image: linear-gradient(to bottom, transparent, #000 78%);
		mask-image: linear-gradient(to bottom, transparent, #000 78%);
	}
}

/* Full-bleed split rows: text columns align to the 1240 grid on wide screens
   (classes set by polish.js) instead of running toward the viewport edge. */
@media (min-width: 1350px) {
	.chx-gutter-left  { padding-left:  max(80px, calc((100vw - 1240px) / 2)) !important; }
	.chx-gutter-right { padding-right: max(80px, calc((100vw - 1240px) / 2)) !important; }
}

/* SplitText line masks: prevent descender clipping on Marcellus. */
.chx-line { padding-bottom: 0.12em; margin-bottom: -0.12em; }

/* Laptop nav density: keep the 7-item menu on one line between 1025 and 1440px. */
@media (min-width: 1025px) and (max-width: 1440px) {
	.elementor-location-header .elementor-nav-menu--main a.elementor-item {
		font-size: 11.5px !important;
		padding-left: 5px !important;
		padding-right: 5px !important;
		letter-spacing: 0.2px !important;
	}
	.elementor-location-header .elementor-widget-image img { max-width: 128px; }
	.elementor-location-header .elementor-button {
		padding-top: 10px !important; padding-bottom: 10px !important;
		padding-left: 18px !important; padding-right: 18px !important;
	}
	.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu { flex-wrap: nowrap; white-space: nowrap; }
}

/* Reduced motion: kill transitions along with the scripted layer. */
@media (prefers-reduced-motion: reduce) {
	.elementor-button,
	.elementor-widget-image img,
	.ch-lift,
	.elementor-social-icon,
	.elementor-icon-box-icon .elementor-icon { transition: none !important; }
}

/* =========================================================
   Fleet breakout cards
   Approved concept A, "nose over the roof": the aircraft cutout
   overhangs the top edge of its card and lifts on hover.

   Anchored on the plane widget's own class and matched upward with
   :has(), because Elementor containers do not emit custom classes.
     card  = .e-con:has(> .e-con > .chx-fleetcard__plane)
     stage = .e-con:has(> .chx-fleetcard__plane)

   Plane rules are scoped `.e-con > ...` on purpose: Elementor ships
   `.elementor-widget { position: relative }` at the same specificity
   and loads after this file, so a bare class selector loses.
   ========================================================= */

/* --- the card --- */
.e-con:has(> .e-con > .chx-fleetcard__plane) {
	position: relative;
	overflow: visible !important;
	margin-top: 120px;            /* clearance: overhang is bounded to 92px below */
	transition: border-color .5s var(--ease);
}
.e-con:has(> .e-con > .chx-fleetcard__plane):hover {
	border-color: var(--accent-hover) !important;
}

/* --- the stage: the empty band the aircraft sits over --- */
.e-con:has(> .chx-fleetcard__plane) {
	position: relative;
	overflow: visible !important;
	min-height: 132px;
	height: 132px;                /* fixed, so every card's copy starts level */
	flex: 0 0 auto;
}

/* Ground shadow, tightens as the aircraft takes weight off the wheels. */
.e-con:has(> .chx-fleetcard__plane)::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 34px;
	width: 58%;
	height: 14px;
	transform: translateX(-50%);
	background: radial-gradient(ellipse at center, rgba(0,0,0,0.26), rgba(0,0,0,0) 70%);
	transition: transform .6s var(--ease), opacity .6s var(--ease);
	pointer-events: none;
}

/* --- the aircraft --- */
.e-con > .chx-fleetcard__plane {
	position: absolute;
	left: 50%;
	bottom: 48px;
	width: 78%;
	height: 176px;                /* caps how far the aircraft can overhang */
	transform: translateX(-50%);
	transition: transform .9s var(--ease);
	pointer-events: none;
	overflow: visible !important;
}
/* contain + bottom anchoring: the aircraft sits on the stage whatever its aspect,
   and can never rise more than (height + bottom - stage) above the card. */
.e-con > .chx-fleetcard__plane img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center bottom;
	filter: drop-shadow(0 22px 26px rgba(0, 0, 0, 0.25));
	transition: none !important;
}
/* Never let the global image-zoom rule fight the lift. */
.e-con > .chx-fleetcard__plane:hover img { transform: none !important; }

.e-con:has(> .e-con > .chx-fleetcard__plane):hover .chx-fleetcard__plane {
	transform: translateX(-50%) translateY(-6px);
}
.e-con:has(> .e-con > .chx-fleetcard__plane):hover .e-con:has(> .chx-fleetcard__plane)::after {
	transform: translateX(-50%) scale(0.86, 0.9);
	opacity: 0.55;
}

/* Tall silhouettes (boxy helicopters, nose-on jets) need less width to read the same size. */
.e-con > .chx-fleetcard__plane--tall { width: 66%; }
.e-con > .chx-fleetcard__plane--wide { width: 92%; }

/* --- cards still waiting on a usable side-profile photo --- */
/* Same card rhythm, but a plain cover image instead of a breakout. */
.e-con > .chx-fleetcard__plane--photo {
	position: relative;
	left: auto;
	right: auto;
	bottom: auto;
	width: 100%;
	transform: none;
}
.e-con > .chx-fleetcard__plane--photo img {
	width: 100%;
	height: 230px;
	object-fit: cover;
	object-position: center center;
	filter: none;
}
.e-con:has(> .chx-fleetcard__plane--photo) { height: 230px; min-height: 230px; }
.e-con:has(> .chx-fleetcard__plane--photo)::after { display: none; }
.e-con:has(> .e-con > .chx-fleetcard__plane--photo):hover .chx-fleetcard__plane--photo {
	transform: none;
}

/* Spec tables inside fleet cards: clean rows, not a boxed grid.
   WordPress block styles put a grey border and fill on every cell. */
.e-con:has(> .e-con > .chx-fleetcard__plane) .elementor-widget-text-editor table,
.e-con:has(> .e-con > .chx-fleetcard__plane) .elementor-widget-text-editor tr {
	border: 0 !important;
	background: transparent !important;
}
.e-con:has(> .e-con > .chx-fleetcard__plane) .elementor-widget-text-editor td {
	border: 0 !important;
	border-bottom: 1px solid #E4DFD7 !important;
	background: transparent !important;
	padding: 10px 0 !important;
}
.e-con:has(> .e-con > .chx-fleetcard__plane) .elementor-widget-text-editor tr:last-child td {
	border-bottom: 0 !important;
}

@media (max-width: 1024px) {
	.e-con:has(> .e-con > .chx-fleetcard__plane) { margin-top: 96px; }
	.e-con > .chx-fleetcard__plane { width: 74%; bottom: 42px; height: 156px; }
	.e-con > .chx-fleetcard__plane--tall { width: 64%; }
	.e-con > .chx-fleetcard__plane--photo { width: 100%; }
}

@media (max-width: 767px) {
	.e-con:has(> .e-con > .chx-fleetcard__plane) { margin-top: 92px; }
	.e-con:has(> .chx-fleetcard__plane) { height: 112px; min-height: 112px; }
	.e-con > .chx-fleetcard__plane { width: 72%; bottom: 36px; height: 128px; }
	.e-con > .chx-fleetcard__plane--tall { width: 62%; }
	.e-con > .chx-fleetcard__plane--wide { width: 86%; }
	.e-con > .chx-fleetcard__plane--photo { width: 100%; }
	.e-con > .chx-fleetcard__plane--photo img { height: 200px; }
	.e-con:has(> .chx-fleetcard__plane--photo) { height: 200px; min-height: 200px; }
}

@media (prefers-reduced-motion: reduce) {
	.e-con > .chx-fleetcard__plane,
	.e-con:has(> .chx-fleetcard__plane)::after { transition: none !important; }
}

/* =========================================================
   Aircraft page hero card
   Mauritz's extension of the fleet card: a small aircraft sits on the
   top-right roofline of an expanded card carrying features and copy.
   ========================================================= */

.e-con:has(> .e-con > .chx-heroaircraft) {
	position: relative;
	overflow: visible !important;
	margin-top: 150px;
}

.e-con:has(> .chx-heroaircraft) {
	position: absolute;
	top: 0;
	right: 0;
	width: 46%;
	height: 0;
	min-height: 0;
	padding: 0 !important;
	pointer-events: none;
	z-index: 2;
}

.e-con > .chx-heroaircraft {
	position: absolute;
	right: 6%;
	bottom: -26px;              /* overhangs the card roofline */
	width: 100%;
	transition: transform 1s var(--ease);
	pointer-events: none;
	overflow: visible !important;
}
.e-con > .chx-heroaircraft img {
	filter: drop-shadow(0 26px 34px rgba(0, 0, 0, 0.3));
	transition: none !important;
}
.e-con:has(> .e-con > .chx-heroaircraft):hover .chx-heroaircraft {
	transform: translateY(-8px);
}

/* Stat strip inside the hero card. */
.chx-herostats { display: flex; flex-wrap: wrap; gap: 0; }
.chx-herostat {
	flex: 1 1 25%;
	border-left: 1px solid var(--chx-rule, #E4DFD7);
	padding: 0 0 0 20px;
}
.chx-herostat:first-child { border-left: 0; padding-left: 0; }

@media (max-width: 1024px) {
	.e-con:has(> .e-con > .chx-heroaircraft) { margin-top: 120px; }
	.e-con:has(> .chx-heroaircraft) { width: 58%; }
	.e-con > .chx-heroaircraft { right: 4%; bottom: -18px; }
}

@media (max-width: 767px) {
	.e-con:has(> .e-con > .chx-heroaircraft) { margin-top: 92px; }
	.e-con:has(> .chx-heroaircraft) { width: 84%; }
	.e-con > .chx-heroaircraft { right: 2%; bottom: -12px; }
	.chx-herostat { flex: 1 1 50%; padding-left: 16px; }
	.chx-herostat:nth-child(3) { border-left: 0; padding-left: 0; }
	.chx-herostat:nth-child(n+3) { margin-top: 22px; }
}

@media (prefers-reduced-motion: reduce) {
	.e-con > .chx-heroaircraft { transition: none !important; }
}

/* Spec table on an aircraft page, same clean rows as the fleet cards. */
.chx-spectable table, .chx-spectable tr {
	border: 0 !important;
	background: transparent !important;
	width: 100% !important;
}
.chx-spectable td {
	border: 0 !important;
	border-bottom: 1px solid #E4DFD7 !important;
	background: transparent !important;
	padding: 13px 0 !important;
}
.chx-spectable tr:last-child td { border-bottom: 0 !important; }

/* Full-bleed photograph. */
.chx-fullbleed img { width: 100%; height: auto; display: block; }


/* Elementor's button border colour key is `border_color`, not `button_border_color`.
   Set the wrong one and border-color falls back to currentColor, which paints a
   white hairline on dark grounds. Every bordered button must set `border_color`. */

/* =========================================================
   Split-photograph intro
   One photograph masked across two staggered panels. Both panels share a
   background sized to span both plus the gap, so the gap reads as a cut
   through a single photo rather than two photos side by side. Panel B is
   nudged down and its background nudged up by the same amount, which keeps
   the picture continuous across the break.

   Source images want a ~3:2 aspect. Much wider than that and the background
   will not cover the panel height.
   ========================================================= */
.chx-split {
	--gap: 24px;
	--stagger: 44px;
	--img-a: 1.45;            /* source image aspect, width / height */
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--gap);
}
.chx-split__panel {
	/* Height is derived from width, never fixed. The background spans both
	   panels, so its rendered height grows with the viewport; a fixed panel
	   height would crop more and more of the photo as the screen widens and
	   push the subject out of frame. aspect-ratio keeps the crop constant. */
	aspect-ratio: calc(var(--img-a) / 2);
	/* Without this the grid stretches each panel to the row height. Panel B's
	   available height is reduced by its top margin, and aspect-ratio then
	   back-computes a narrower width, so the two panels stop matching. */
	align-self: start;
	background-image: var(--src);
	background-repeat: no-repeat;
	background-size: calc(200% + var(--gap)) auto;
	transition: background-size 1.2s var(--ease);
}
/* --shift slides the photograph across both panels together, which moves where
   the cut falls without breaking continuity. Negative pushes the subject right
   into panel A, positive pushes it left into panel B. Use it when the gap would
   otherwise slice through an aircraft. */
.chx-split__panel--a {
	/* edge-offset longhand: "left Npx" moves the image right by N. A bare
	   percentage here would resolve against (container - image), not the
	   container, and collapse the panel. */
	background-position-x: left var(--shift, 0px);
	background-position-y: 50%;
}
.chx-split__panel--b {
	margin-top: var(--stagger);
	background-position-x: right calc(-1 * var(--shift, 0px));
	background-position-y: calc(50% - var(--stagger));
}
.chx-split:hover .chx-split__panel { background-size: calc(206% + var(--gap)) auto; }
.chx-split__credit {
	grid-column: 1 / -1;
	display: flex; justify-content: space-between;
	padding-top: 16px;
	font-family: var(--font-body, 'Jost', sans-serif);
	font-size: 12px; letter-spacing: 2px; text-transform: uppercase;
	color: #5B5F5C;
}

@media (max-width: 1024px) { .chx-split { --stagger: 32px; } }
@media (max-width: 767px)  { .chx-split { --stagger: 22px; --gap: 14px; } }
@media (prefers-reduced-motion: reduce) {
	.chx-split__panel { transition: none; }
	.chx-split:hover .chx-split__panel { background-size: calc(200% + var(--gap)) auto; }
}