/*
 * Aircraft page — Figma "Airplane_main" (1920 frame, content column 1596 at
 * x=162). Values come from the Figma HTML export in _figma/aircraft_template.
 *
 * Every length is a multiple of --llap-u: one design pixel, 1px by default and
 * 1/1920 of the viewport above 2040px, where the whole site scales with vw.
 */

.elementor-widget-llap-block,
.llap-band {
	--llap-u: 1px;
	--llap-navy: #212c68;
	--llap-gold: #cfbe7b;
	--llap-grey: #f5f6f8;
	--llap-line: #dee0e9;
	--llap-text: #000;
	--llap-serif: "Playfair Display", Georgia, serif;
	--llap-sans: Montserrat, Arial, sans-serif;
}

@media (min-width: 2041px) {
	.elementor-widget-llap-block,
	.llap-band {
		--llap-u: 0.052083vw;
	}
}

/* ------------------------------------------------------------------ bands */

.e-con.llap-band {
	--llap-pt: 57;
	--llap-pb: 82;
	--padding-left: 16px;
	--padding-right: 16px;
	--content-width: calc(1596 * var(--llap-u));
	padding-top: calc(var(--llap-pt) * var(--llap-u));
	padding-bottom: calc(var(--llap-pb) * var(--llap-u));
}

/* Per-band top/bottom padding, measured in the Figma export. */
.e-con.llap-band.llap-needs-intro { --llap-pt: 79; --llap-pb: 97; }
.e-con.llap-band.llap-needs-specs { --llap-pt: 50; --llap-pb: 106; }
.e-con.llap-band.llap-needs-seat_plan { --llap-pt: 59; --llap-pb: 81; }
.e-con.llap-band.llap-needs-cabin { --llap-pt: 57; --llap-pb: 82; }
.e-con.llap-band.llap-needs-rent { --llap-pt: 63; --llap-pb: 82; }
.e-con.llap-band.llap-others { --llap-pt: 67; --llap-pb: 70; }
.e-con.llap-band.llap-needs-faq { --llap-pt: 71; --llap-pb: 65; }
.e-con.llap-band.llap-form { --llap-pt: 57; --llap-pb: 74; }

/* Heading → content gaps inside the flex bands (on the inner box, where
 * Elementor applies its own 20px default). */
.e-con.llap-others > .e-con-inner { gap: calc(35 * var(--llap-u)); }
.e-con.llap-form > .e-con-inner { gap: calc(34 * var(--llap-u)); }

/*
 * The --padding-* variables inherit into Elementor's .e-con-inner, which pads
 * itself with them too — padding would apply twice. Reset them one level down.
 */
.e-con.llap-band > .e-con-inner,
.e-con.llap-crumbs > .e-con-inner {
	--padding-top: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--padding-right: 0px;
	padding: 0;
}

.e-con.llap-band--grey {
	background-color: var(--llap-grey);
}

.e-con.llap-band--white {
	background-color: #fff;
}

.e-con.llap-hero-band {
	--padding-top: 0px;
	--padding-bottom: 0px;
	--padding-left: 0px;
	--padding-right: 0px;
	--gap: 0px;
}

.e-con.llap-crumbs {
	--llap-u: 1px;
	--padding-top: calc(26 * var(--llap-u));
	--padding-bottom: calc(26 * var(--llap-u));
	--padding-left: 16px;
	--padding-right: 16px;
	--content-width: calc(1596 * var(--llap-u));
	padding-top: calc(26 * var(--llap-u));
	padding-bottom: calc(26 * var(--llap-u));
	background: #fff;
}

.e-con.llap-crumbs .woocommerce-breadcrumb {
	margin: 0;
}

/* "Other aircraft" band: heading, carousel, outline button. */
.e-con.llap-others .llap-title,
.e-con.llap-form .llap-title {
	margin-bottom: 0;
}

.llap-btn .elementor-button {
	min-width: calc(226 * var(--llap-u, 1px));
	padding: calc(13 * var(--llap-u, 1px)) calc(30 * var(--llap-u, 1px));
	border: 2px solid #212c68;
	border-radius: calc(25 * var(--llap-u, 1px));
	background: transparent;
	font-family: Montserrat, Arial, sans-serif;
	font-size: calc(16 * var(--llap-u, 1px));
	font-weight: 400;
	line-height: 1.25;
	text-transform: uppercase;
	color: #212c68;
	fill: #212c68;
	transition: background-color 0.2s, color 0.2s;
}

.llap-btn .elementor-button:hover,
.llap-btn .elementor-button:focus-visible {
	background: #212c68;
	color: #fff;
}

/* Form band: heading + the shared 4-field form (template 29313). */
.e-con.llap-form .elementor-widget-template {
	width: 100%;
	max-width: calc(1273 * var(--llap-u));
	margin-inline: auto;
}

@media (min-width: 2041px) {
	.e-con.llap-crumbs {
		--llap-u: 0.052083vw;
	}
}

/* ------------------------------------------------------------------- text */

/* Section heading: 36px, content starts 61 below its top. */
.llap-title {
	margin: 0 0 calc(15 * var(--llap-u));
	font-family: var(--llap-serif);
	font-size: calc(36 * var(--llap-u));
	font-weight: 600;
	line-height: calc(46 * var(--llap-u));
	color: var(--llap-navy);
}

/* Model name beside the gallery. */
.llap-title--lg {
	margin-bottom: calc(24 * var(--llap-u));
	font-size: calc(48 * var(--llap-u));
	line-height: calc(58 * var(--llap-u));
}

/* Centred headings (other aircraft, FAQ, form) are 48px in the design. */
.llap-title--center {
	margin-bottom: calc(43 * var(--llap-u));
	font-size: calc(48 * var(--llap-u));
	line-height: calc(64 * var(--llap-u));
	text-align: center;
}

.llap-rich {
	font-family: var(--llap-sans);
	font-size: calc(18 * var(--llap-u));
	font-weight: 400;
	line-height: calc(24 * var(--llap-u));
	color: var(--llap-text);
}

/* Paragraphs and lists: 12 apart (the export's bare line breaks read as
 * collapsed in the browser). */
.llap-rich p,
.llap-rich ul,
.llap-rich ol {
	margin: 0 0 calc(12 * var(--llap-u));
}

.llap-rich > :last-child {
	margin-bottom: 0;
}

.llap-rich ul,
.llap-rich ol {
	padding-left: 1.2em;
}

.llap-rich li {
	margin: 0;
}

/* List items sit 28 apart in the mockup (the export's 18px line height is
 * wrong): normal 24 line + 4 between items keeps wrapped items readable. */
.llap-rich li + li {
	margin-top: calc(4 * var(--llap-u));
}

.llap-rich a {
	color: var(--llap-navy);
	text-decoration: underline;
}

.llap-rich strong,
.llap-rich b {
	font-weight: 700;
}

.llap-lead {
	margin-bottom: calc(48 * var(--llap-u));
}

/* Two independent columns of sub-blocks: 738 | 162 gap | rest. */
.llap-cols {
	display: grid;
	grid-template-columns: calc(738 * var(--llap-u)) minmax(0, 1fr);
	column-gap: calc(162 * var(--llap-u));
	align-items: start;
}

.llap-col {
	display: flex;
	flex-direction: column;
	gap: calc(40 * var(--llap-u));
	min-width: 0;
}

.llap-col:empty {
	display: none;
}

/*
 * A section with a single sub-block (Agusta's «Салон и оснащение», and any
 * future aircraft whose text has only one <h3>) leaves the right column empty,
 * and its text stays stranded in the 738px well with a hole beside it. When
 * that happens the block takes the full width and its body flows into two
 * columns instead, so the second paragraph lands on the right.
 *
 * The condition is "the second column is empty", not "the text is short":
 * that is exactly when the hole appears, and it holds for any text length.
 * A lone block of a SINGLE paragraph is left alone (`* + *`) — splitting one
 * short paragraph in half reads worse than the hole does.
 *
 * Desktop only: below 1025px .llap-cols is a plain stack (see the responsive
 * block), and these rules would break it back apart.
 */
@media (min-width: 1025px) {
	.llap-cols:has(> .llap-col:empty) {
		display: block;
	}

	.llap-cols:has(> .llap-col:empty) .llap-sub:has(.llap-rich > * + *) .llap-rich {
		columns: 2;
		column-gap: calc(162 * var(--llap-u));
	}

	/* Paragraphs stay whole; a long list may still split across the columns. */
	.llap-cols:has(> .llap-col:empty) .llap-rich > p,
	.llap-cols:has(> .llap-col:empty) .llap-rich li {
		break-inside: avoid;
	}
}

.llap-sub__title {
	margin: 0 0 calc(12 * var(--llap-u));
	font-family: var(--llap-sans);
	font-size: calc(24 * var(--llap-u));
	font-weight: 700;
	line-height: calc(24 * var(--llap-u));
	color: var(--llap-navy);
}

/* ------------------------------------------------------------------- hero */

.elementor-widget-llap-block:has(> .llap-hero) {
	width: 100%;
}

.llap-hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: calc(499 * var(--llap-u));
	overflow: hidden;
	background: var(--llap-navy);
}

.llap-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
}

.llap-hero .llap-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100% !important;
	object-fit: cover;
	object-position: center;
}

.llap-hero__inner {
	position: relative;
	z-index: 1;
	max-width: calc(1227 * var(--llap-u));
	padding: calc(40 * var(--llap-u)) 16px;
	text-align: center;
	color: #fff;
}

.llap-hero__title {
	margin: 0;
	font-family: var(--llap-serif);
	font-size: calc(48 * var(--llap-u));
	font-weight: 600;
	line-height: calc(58 * var(--llap-u));
	color: #fff;
}

.llap-hero__sub {
	max-width: calc(995 * var(--llap-u));
	margin: calc(42 * var(--llap-u)) auto 0;
	font-family: var(--llap-sans);
	font-size: calc(24 * var(--llap-u));
	line-height: calc(36 * var(--llap-u));
	color: #fff;
}

.llap-hero__password {
	margin-top: calc(24 * var(--llap-u));
	font-family: var(--llap-sans);
	font-size: calc(18 * var(--llap-u));
}

.llap-hero__password input[type="password"] {
	padding: 8px 12px;
	border: 1px solid #fff;
	border-radius: 30px;
}

/* ----------------------------------------------------------- intro/gallery */

.llap-intro {
	display: grid;
	grid-template-columns: calc(867 * var(--llap-u)) minmax(0, 1fr);
	column-gap: calc(103 * var(--llap-u));
	align-items: center;
}

.llap-intro--no-gallery {
	grid-template-columns: 1fr;
}

.llap-intro__text {
	max-width: calc(647 * var(--llap-u));
}

.llap-gallery {
	min-width: 0;
}

.llap-gallery__main {
	position: relative;
	display: block;
	touch-action: pan-y; /* horizontal swipes go to aircraft-page.js */
	aspect-ratio: 867 / 509;
	overflow: hidden;
	cursor: zoom-in;
}

.llap-gallery .llap-gallery__img,
.llap-gallery__thumb img {
	display: block;
	width: 100%;
	max-width: none;
	height: 100% !important;
	object-fit: cover;
}

/* Crossfade: the incoming photo lies over the current one and fades in. */
.llap-gallery .llap-gallery__img--next {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity 0.35s ease;
}

.llap-gallery .llap-gallery__img--next.is-in {
	opacity: 1;
}

.llap-gallery__thumbs {
	--llap-thumb-gap: calc(16 * var(--llap-u));
	display: flex;
	gap: var(--llap-thumb-gap);
	margin-top: calc(14 * var(--llap-u));
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scrollbar-width: none; /* slid by click / drag instead, see aircraft-page.js */
	-ms-overflow-style: none;
	-webkit-user-select: none;
	user-select: none;
}

.llap-gallery__thumbs::-webkit-scrollbar {
	display: none;
}

.llap-gallery__thumbs.is-dragging {
	cursor: grabbing;
}

.llap-gallery__thumbs.is-dragging .llap-gallery__thumb {
	cursor: grabbing;
}

.llap-gallery__thumb img {
	-webkit-user-drag: none;
	pointer-events: none;
}

.llap-gallery__thumb {
	flex: 0 0 calc((100% - 4 * var(--llap-thumb-gap)) / 5);
	aspect-ratio: 161 / 95;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	overflow: hidden;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.15s;
}

/* Selecting and pressing react at once; only hover eases. */
.llap-gallery__thumb.is-active,
.llap-gallery__thumb:active {
	transition: none;
}

.llap-gallery__thumb:hover,
.llap-gallery__thumb:focus-visible,
.llap-gallery__thumb.is-active {
	opacity: 1;
	background: none;
}

.llap-gallery__thumb.is-active {
	outline: 2px solid var(--llap-gold);
	outline-offset: -2px;
}

/* ------------------------------------------------------------------ specs */

.llap-table-wrap {
	overflow-x: auto;
	padding-top: calc(6 * var(--llap-u)); /* a margin would collapse into the heading's */
	margin-bottom: calc(59 * var(--llap-u));
}

/*
 * Header 45 (20/700), 7 of air, rows 50 (18/30) zebra-striped, an 8px grey
 * bar under the last row. Label column 621 wide with a 3px white divider,
 * values centred in the rest.
 */
.llap-specs {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	table-layout: fixed;
	border-bottom: calc(8 * var(--llap-u)) solid var(--llap-grey);
	font-family: var(--llap-sans);
	font-size: calc(18 * var(--llap-u));
	line-height: calc(30 * var(--llap-u));
	color: var(--llap-text);
}

.llap-specs col.llap-specs__label {
	width: calc(621 * var(--llap-u));
}

.llap-specs th,
.llap-specs td {
	height: calc(50 * var(--llap-u));
	padding: calc(10 * var(--llap-u)) calc(33 * var(--llap-u));
	border: 0;
	background: none;
	font-weight: 400;
	text-align: left;
	vertical-align: middle;
}

.llap-specs td,
.llap-specs thead th + th {
	text-align: center;
}

.llap-specs thead th {
	height: calc(52 * var(--llap-u)); /* 45 visible + the 7 transparent border */
	padding-top: calc(11 * var(--llap-u));
	padding-bottom: calc(10 * var(--llap-u));
	box-sizing: border-box;
	border-bottom: calc(7 * var(--llap-u)) solid transparent;
	background: var(--llap-line);
	background-clip: padding-box;
	font-size: calc(20 * var(--llap-u));
	font-weight: 700;
	line-height: calc(24 * var(--llap-u));
	color: var(--llap-navy);
}

/*
 * The theme's reset.css draws a hairline over the header plate:
 * `table colgroup + thead tr:first-child th { border-block-start: 1px ... }`.
 * Our table has a <colgroup>, and that selector outranks the `border: 0` above,
 * so the line has to be cancelled at a specificity above it (the :first-child
 * here is what does that). It is not in the design.
 */
.llap-specs thead tr:first-child th,
.llap-specs thead tr:first-child td {
	border-block-start: 0;
}

.llap-specs tbody tr:nth-child(odd) > * {
	background: var(--llap-grey);
}

.llap-specs tbody tr:nth-child(even) > * {
	background: #fff;
}

.llap-specs th + td,
.llap-specs thead th + th {
	border-left: calc(3 * var(--llap-u)) solid #fff;
}

/* On a grey band the zebra flips so rows stay distinguishable. */
.llap-band--grey .llap-specs tbody tr:nth-child(odd) > * {
	background: #fff;
}

.llap-band--grey .llap-specs tbody tr:nth-child(even) > * {
	background: var(--llap-grey);
}

.llap-band--grey .llap-specs {
	border-bottom-color: #fff;
}

/* -------------------------------------------------------------- seat plan */

.llap-plan {
	display: block;
	max-width: calc(1450 * var(--llap-u));
	margin: calc(58 * var(--llap-u)) auto 0;
	cursor: zoom-in;
}

.llap-plan .llap-plan__img {
	display: block;
	width: 100%;
	height: auto !important;
}

/* -------------------------------------------------------------------- FAQ */

.llap-faq {
	display: flex;
	flex-direction: column;
	gap: calc(23 * var(--llap-u));
}

.llap-faq__item {
	border: 1px solid var(--llap-navy);
	background: transparent;
}

.llap-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: calc(24 * var(--llap-u));
	padding: calc(34 * var(--llap-u)) calc(36 * var(--llap-u)) calc(37 * var(--llap-u)) calc(41 * var(--llap-u));
	font-family: var(--llap-sans);
	font-size: calc(24 * var(--llap-u));
	font-weight: 700;
	line-height: calc(24 * var(--llap-u));
	color: #222d68;
	cursor: pointer;
	list-style: none;
}

/* Gold on hover, like every other FAQ on the site (client request 22.09.2026).
   The chevron is stroked with currentColor, so it follows the text. */
.llap-faq__q {
	transition: color 0.2s;
}

.llap-faq__q:hover {
	color: var(--llap-gold);
}

.llap-faq__item[open] .llap-faq__q {
	padding-bottom: calc(23 * var(--llap-u));
}

.llap-faq__q::-webkit-details-marker {
	display: none;
}

.llap-faq__icon {
	flex: 0 0 auto;
	width: calc(21 * var(--llap-u));
	height: calc(10 * var(--llap-u));
	stroke-width: 3;
	transition: transform 0.2s;
}

.llap-faq__item[open] .llap-faq__icon {
	transform: rotate(180deg);
}

.llap-faq__a {
	padding: 0 calc(112 * var(--llap-u)) calc(25 * var(--llap-u)) calc(41 * var(--llap-u));
}

/* ------------------------------------------------------------- responsive */

@media (max-width: 1279px) {
	.llap-intro {
		grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
		column-gap: 48px;
	}

	.llap-cols {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 64px;
	}
}

@media (max-width: 1024px) {
	.llap-intro {
		grid-template-columns: 1fr;
		row-gap: 32px;
	}

	.llap-intro__text {
		max-width: none;
	}

	.llap-title--lg,
	.llap-title--center {
		font-size: 36px;
		line-height: 44px;
	}
}

@media (max-width: 767px) {
	.e-con.llap-band {
		padding-top: 40px !important;
		padding-bottom: 40px !important;
	}

	.e-con.llap-others > .e-con-inner,
	.e-con.llap-form > .e-con-inner {
		gap: 24px;
	}

	.llap-title {
		margin-bottom: 12px;
		font-size: 26px;
		line-height: 32px;
	}

	.llap-title--lg,
	.llap-title--center {
		font-size: 28px;
		line-height: 34px;
	}

	.llap-title--center {
		margin-bottom: 24px;
	}

	.llap-rich {
		font-size: 16px;
		line-height: 22px;
	}

	.llap-rich li + li {
		margin-top: 4px;
	}

	.llap-lead {
		margin-bottom: 28px;
	}

	.llap-cols {
		display: flex;
		flex-direction: column;
		gap: 28px;
	}

	.llap-col {
		display: contents;
	}

	.llap-sub {
		order: var(--llap-order, 0);
	}

	.llap-sub__title {
		margin-bottom: 8px;
		font-size: 20px;
		line-height: 24px;
	}

	.llap-hero {
		min-height: 420px;
	}

	.llap-hero__title {
		font-size: 30px;
		line-height: 36px;
	}

	.llap-hero__sub {
		margin-top: 20px;
		font-size: 16px;
		line-height: 24px;
	}

	.llap-gallery__thumbs {
		--llap-thumb-gap: 8px;
		margin-top: 8px;
	}

	.llap-gallery__thumb {
		flex-basis: calc((100% - 3 * var(--llap-thumb-gap)) / 3.5);
	}

	.llap-table-wrap {
		margin-bottom: 32px;
	}

	.llap-specs {
		font-size: 15px;
		line-height: 20px;
	}

	.llap-specs col.llap-specs__label {
		width: 50%;
	}

	.llap-specs th,
	.llap-specs td {
		height: auto;
		padding: 10px 12px;
	}

	.llap-specs thead th {
		font-size: 16px;
		line-height: 20px;
	}

	.llap-plan {
		margin-top: 24px;
	}

	.llap-faq {
		gap: 12px;
	}

	.llap-faq__q,
	.llap-faq__item[open] .llap-faq__q {
		padding: 16px;
		font-size: 17px;
		line-height: 22px;
	}

	.llap-faq__item[open] .llap-faq__q {
		padding-bottom: 10px;
	}

	.llap-faq__a {
		padding: 0 16px 16px;
	}
}
