/*
 * Akvagrim — polish pass
 *
 * Loaded last, after akv-typography.css and akv-layout.css.
 *
 * Fixes in here:
 *   1. Entrance animations that never fire and leave text invisible
 *   2. Header: logo and menu on one line, slimmer bar
 *   3. Section eyebrows falling back to a serif with no Cyrillic
 *   4. Hero stat cards: tighter, larger caption, display face
 *   5. White wedges between a colour block and the shaped dark block below it
 *   6. Testimonials: heading visible, content lifted, nothing swallowed
 */


/* ================================================================
   1. ENTRANCE ANIMATIONS — failsafe reveal
   ================================================================

   The theme splits every heading into single letters (`pxl-split-text`)
   and stamps `opacity: 0` inline on each one, then relies on a GSAP
   scroll trigger to fade them in. On this build the trigger fires for
   only one heading in seven — the other six stay at zero opacity, so
   the heading is in the DOM, occupies its full height, and is simply
   never painted. `wow` blocks have the same problem via inline
   `visibility: hidden`.

   Measured on the home page: 6 of 7 split headings and 6 of 11 wow
   blocks were stuck hidden. "Что говорят родители и заказчики" was one
   of them — which is why the testimonials block looked empty.

   An `!important` declaration outranks an inline style, so this reveals
   them without touching the theme's JavaScript. The animation is given
   up on purpose: text that is always readable beats text that sometimes
   animates and usually disappears.
   ---------------------------------------------------------------- */

.pxl-split-text,
.pxl-split-text .split-line,
.pxl-split-text .split-line div,
.pxl-split-text .split-line span {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	filter: none !important;
}

.pxl-split-text {
	perspective: none !important;
}

.wow,
.elementor-invisible,
.pxl-image-single.wow,
.pxl-heading.wow,
.pxl-item--inner.wow {
	visibility: visible !important;
	opacity: 1 !important;
	animation-name: none !important;
}

/* The letters are laid out as inline-blocks with per-letter transforms.
   With the transforms dropped they must not collapse into each other. */
.pxl-split-text .split-line > div,
.pxl-split-text .split-line > span {
	display: inline !important;
}


/* ================================================================
   2. HEADER — logo and menu on one line, slimmer bar
   ================================================================

   The logo (216px) and the menu (1118px) sit in one flex row that is
   only 1148px wide, so the menu wrapped onto a second line and the bar
   grew to 158px tall. The menu links also carry `line-height: 102px`
   from the theme, which is what made the bar so deep.
   ---------------------------------------------------------------- */

/* One row, no wrapping. */
.elementor-1751 .elementor-element.elementor-element-3c4a721 > .elementor-element-populated {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 20px;
	padding: 0 8px !important;
}

.elementor-1751 .elementor-element.elementor-element-8e9705c {
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.elementor-1751 .elementor-element.elementor-element-8e9705c > .elementor-widget-container {
	margin: 0 !important;
}

.elementor-1751 .elementor-element.elementor-element-af89afa {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.elementor-1751 .elementor-element.elementor-element-af89afa .pxl-nav-menu {
	width: 100% !important;
}

.elementor-1751 .elementor-element.elementor-element-af89afa .pxl-nav-menu .pxl-menu-primary {
	display: flex !important;
	flex-wrap: nowrap !important;
	justify-content: flex-end !important;
	align-items: center !important;
	text-align: right !important;
}

/* Slimmer bar: the 102px line-height was the whole height of the row. */
.elementor-1751 .elementor-element.elementor-element-af89afa .pxl-nav-menu .pxl-menu-primary > li > a {
	line-height: 58px !important;
	padding: 0 13px !important;
	font-size: 16px !important;
	white-space: nowrap;
}

/* The pink dots between items cost ~90px of width the row does not have. */
.elementor-1751 .pxl-nav-menu.fr-icon-spacer .pxl-menu-primary > li > a .menu-icon-spacer {
	display: none !important;
}

/* The pill itself and the empty spacer row underneath it. */
.elementor-1751 .elementor-element.elementor-element-3503a5c {
	padding: 0 30px 0 26px !important;
}

.elementor-1751 .elementor-element.elementor-element-cbfa311 {
	--spacer-size: 62px !important;
}

/* Logo scaled to the new bar height. */
.elementor-1749 .pxl-logo a,
.elementor-1751 .pxl-logo a,
.elementor-1753 .pxl-logo a,
.elementor-1755 .pxl-logo a {
	width: 186px !important;
	min-width: 186px !important;
	height: 46px !important;
}

@media (max-width: 1024px) {
	.elementor-1751 .elementor-element.elementor-element-af89afa .pxl-nav-menu .pxl-menu-primary > li > a {
		padding: 0 9px !important;
		font-size: 15px !important;
	}
}


/* ================================================================
   3. SECTION EYEBROWS — give them a Cyrillic face
   ================================================================

   "Пакеты и цены", "Отзывы", "Что мы предлагаем" and the rest are
   `.pxl-item--subtitle`. The theme assigns them a Latin-only family, so
   Russian fell through to the browser's default serif — which is the
   small, cramped, out-of-place lettering visible above every block.
   ---------------------------------------------------------------- */

/* The real cause: Elementor's font field for these subtitles holds
   `font-family: "Маркетолог ТРЦ", Sans-serif` — a line of Russian copy
   pasted into the family box instead of a typeface name. No such font
   exists, so every eyebrow fell back to the browser default.
   Fix it in Elementor too (Стиль → Подзаголовок → Шрифт); this rule is
   the safety net, and it is what makes them look deliberate today.

   `:not(… *)` excludes the hero's own heading widget, so its script
   logotype is left completely alone rather than overridden with a guess. */
.pxl-item--subtitle:not(.elementor-element-6555d8a *),
.pxl-item--subtitle:not(.elementor-element-6555d8a *) .pxl-item--subtext,
.pxl-item--subtitle:not(.elementor-element-6555d8a *) span {
	font-family: var(--akv-font-display) !important;
}

.pxl-item--subtitle:not(.elementor-element-6555d8a *) {
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0.10em;
	text-transform: uppercase;
	line-height: 1.35;
}


/* ================================================================
   4. HERO STAT CARDS — 450 000 сум / 7 дней / Ташкент
   ================================================================ */

.akv-hero-stat {
	padding: 15px 18px 16px !important;
	line-height: 1.2;
}

.akv-hero-stat strong {
	display: block;
	font-family: var(--akv-font-display);
	font-size: 22px !important;
	font-weight: 700;
	line-height: 1.12 !important;
	margin: 0 0 3px !important;
	letter-spacing: -0.01em;
}

.akv-hero-stat span,
.elementor-975 .elementor-element-31980fa .akv-hero-stat span {
	display: block;
	font-family: var(--akv-font-display) !important;
	font-size: 17px !important;
	font-weight: 500;
	line-height: 1.24 !important;
	margin: 0 !important;
	opacity: 0.9;
}


/* ================================================================
   5. WHITE WEDGES BETWEEN SECTIONS
   ================================================================

   The dark blocks are painted with a PNG whose top edge is a diagonal;
   everything above that edge is transparent. Because the colour block
   above stops at a straight line, the transparent wedge showed the white
   page behind it — up to 250px deep on the left at 1440px, and deeper
   still on a wide monitor.

   Fix: grow the colour block's painted box downwards with padding, then
   cancel exactly the same amount with a negative margin. Nothing moves —
   the gradient simply carries on underneath the shaped block, so the
   wedge now reveals colour instead of white, at every window width.
   ---------------------------------------------------------------- */

/* --- hero → "Яркие выездные форматы" ---
   The pull-up lives on the lower section, not as a margin-bottom up here:
   adjacent negative margins collapse to whichever is most negative, so a
   -420 here would have swallowed the -200 the dark block already carries
   and dropped it 200px down the page. */
.elementor-975 .elementor-element.elementor-element-eee2550 {
	padding-bottom: 554px !important;   /* 134 original + 420 bleed */
	overflow: visible !important;
}

.elementor-975 .elementor-element.elementor-element-b96ac26 {
	margin-top: -620px !important;      /* -200 original + -420 bleed */
}

/* The decorative side shapes are sized to the section, so keep them at the
   height they had before the bleed was added. */
.elementor-975 .elementor-element.elementor-element-eee2550 > .pxl-overlay--image {
	height: calc(100% - 420px) !important;
}

/* --- pink CTA → "Честные цены" ---
   An earlier pass put a separate diagonal wedge above this block. A 135°
   gradient drawn across a 132px-tall wedge resolves to different colours
   than the same gradient drawn across the 1180px section, so the two met
   on a visible seam — two pinks and a pale line between them. Gone now:
   the block grows upwards into the same space with its own single
   gradient, so there is one pink and no seam anywhere.

   Top padding is also cut from 80px to 36px and the heading lifted, which
   is what takes the emptiness out of the block. */
.elementor-975 .elementor-element.elementor-element-0e92980 {
	position: relative;
	overflow: visible !important;
	background-image: linear-gradient(135deg, #FEACC6 0%, #D794E9 100%) !important;

	/* The diagonal top edge is cut out of THIS block with clip-path, so the
	   shape comes from the same single painted gradient. The earlier attempt
	   drew the wedge as a separate ::before with its own gradient, which is
	   what produced two pinks and a seam — one gradient across a 132px strip
	   resolves to different colours than the same gradient across the block. */
	margin-top: -132px !important;
	padding-top: 150px !important;      /* 132 given back + 18 breathing room */
	clip-path: polygon(0 132px, 100% 0, 100% 100%, 0 100%);

	/* Bleed carries the pink under the shaped dark block below; the negative
	   margin brings that block up to sit right under the buttons. */
	padding-bottom: 554px !important;
	margin-bottom: -655px !important;
}

.elementor-975 .elementor-element.elementor-element-9a74441 {
	margin-top: 0 !important;
}

/* The shaped block has to paint over the bleed, not under it. */
.elementor-975 .elementor-element.elementor-element-ef592ed,
.elementor-975 .elementor-element.elementor-element-b96ac26 {
	position: relative;
	z-index: 2;
}


/* ================================================================
   6. TESTIMONIALS — "Что говорят родители и заказчики"
   ================================================================

   Three separate problems met in this block:
     - the heading was invisible (section 1 above fixes that)
     - the right-hand column holds a demo photo of a man in an office
       that the broken animation left hidden, so half the block was blank
     - the section had no bottom padding, so the pink block below cut
       "Постоянный клиент" in half
   ---------------------------------------------------------------- */

.elementor-975 .elementor-element.elementor-element-44b1f96 {
	padding: 40px 0 72px !important;
}

/* Keep the office stock photo out — the quote takes the full width instead
   of sitting next to an empty half. Remove this rule once real photos land. */
.elementor-975 .elementor-element.elementor-element-3ac5a8f {
	display: none !important;
}

.elementor-975 .elementor-element.elementor-element-ab747d7 {
	width: 100% !important;
	max-width: 940px;
	margin: 0 auto !important;
}

/* The avatar slot holds a stock headshot of a stranger credited as
   "Александр и Малика". It collapsed to a 4px dot; rather than scale up
   someone else's face under a real customer's name, drop the slot. */
.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--avatar,
.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--image {
	display: none !important;
}

/* The heading block carried a -30px nudge and the carousel a 179px top
   margin — together they opened a hole the invisible heading hid inside. */
.elementor-975 .elementor-element.elementor-element-469cf99 > .elementor-widget-container {
	margin: 0 0 8px !important;
}

.elementor-975 .elementor-element.elementor-element-8dff8cd > .elementor-widget-container {
	margin-top: 24px !important;
}

/* Inside the quote: give the text room and stop the name column collapsing. */
.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-testimonial-carousel {
	padding-bottom: 8px;
}

.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--content,
.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--desc {
	font-size: 20px;
	line-height: 1.55;
}

.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--name,
.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--title {
	font-size: 18px;
	line-height: 1.3;
	white-space: nowrap;
}

.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--position,
.elementor-975 .elementor-element.elementor-element-44b1f96 .pxl-item--job {
	font-size: 16px;
	line-height: 1.35;
}

/* The carousel arrows were pinned to an absolute offset measured against
   the old, taller block. */
.elementor-975 .elementor-element.elementor-element-252cd74 {
	position: static !important;
	margin-top: 18px;
}


/* ================================================================
   7. SIZES THAT WERE STILL TOO SMALL
   ================================================================ */

.akv-home-metrics span,
.akv-home-final-box > span,
.akv-tg-cta p,
.akv-price-table td,
.akv-footer-handle {
	font-size: 17px;
	line-height: 1.45;
}

.akv-chip,
.akv-rainbow-divider-label {
	font-size: 15px;
}

.akv-rainbow-frame-caption {
	font-size: 16px;
}

@media (max-width: 767px) {
	.akv-hero-stat strong {
		font-size: 20px !important;
	}

	.akv-hero-stat span,
	.elementor-975 .elementor-element-31980fa .akv-hero-stat span {
		font-size: 16px !important;
	}

	.pxl-heading .pxl-item--subtitle,
	.pxl-item--subtitle {
		font-size: 15px;
	}

	/* The bleed is measured for desktop diagonals; phones need far less. */
	.elementor-975 .elementor-element.elementor-element-eee2550 {
		padding-bottom: 314px !important;
		margin-bottom: -180px !important;
	}

	.elementor-975 .elementor-element.elementor-element-eee2550 > .pxl-overlay--image {
		height: calc(100% - 180px) !important;
	}

	.elementor-975 .elementor-element.elementor-element-0e92980 {
		padding-bottom: 300px !important;
		margin-bottom: -220px !important;
	}
}


/* ================================================================
   8. SECOND PASS — 17.09
   ================================================================ */

/* ---- 8.1 Logo tagline at 12px on screen -----------------------
   The SVG is 420×104 and is scaled to fit the logo box, so a size set
   inside it is not the size that lands on screen: at a 46px-tall box the
   previous `font-size="12"` rendered at 12 × 46/104 ≈ 5px.
   The box is now 52px tall and the tagline is 24 SVG units, which lands
   at exactly 24 × 52/104 = 12px. The query string forces browsers to drop
   the version of the file they already cached. */
.elementor-1749 .pxl-logo a,
.elementor-1751 .pxl-logo a,
.elementor-1753 .pxl-logo a,
.elementor-1755 .pxl-logo a,
.pxl-logo-mobile a {
	width: 210px !important;
	min-width: 210px !important;
	height: 52px !important;
	background-image: url("../brand/akvagrim-logo.svg?v=3") !important;
}

@media (max-width: 768px) {
	.elementor-1749 .pxl-logo a,
	.elementor-1751 .pxl-logo a,
	.elementor-1753 .pxl-logo a,
	.elementor-1755 .pxl-logo a,
	.pxl-logo-mobile a {
		width: 188px !important;
		min-width: 188px !important;
		height: 47px !important;
	}
}


/* ---- 8.2 "Яркие выездные форматы для вашего события" ----------
   Ran to three lines inside a 520px measure, and the third line landed on
   top of the rainbow card panel below it. Wider measure → two lines, and
   the block is lifted clear of the panel. */
.elementor-975 .elementor-element.elementor-element-ad2bfc3 .pxl-heading--inner,
.elementor-975 .elementor-element.elementor-element-ad2bfc3 .pxl-item--title {
	max-width: 840px !important;
	margin-left: auto;
	margin-right: auto;
}

.elementor-975 .elementor-element.elementor-element-ad2bfc3 {
	margin-top: -15px !important;
	position: relative;
	z-index: 3;
}

.elementor-975 .elementor-element.elementor-element-7c7a15f {
	margin-top: 22px !important;
}


/* ---- 8.3 The stray black dots ---------------------------------
   Two divider widgets sit between "Детские сады", "Гипоаллергенные
   краски" and "Корпоративы" and render as a lone dot each. */
.elementor-975 .elementor-element.elementor-element-f440266,
.elementor-975 .elementor-element.elementor-element-1d4ad33 {
	display: none !important;
}

/* The three remaining lines were spaced by those dividers. */
.elementor-975 .elementor-element.elementor-element-07cad86,
.elementor-975 .elementor-element.elementor-element-c1b9524,
.elementor-975 .elementor-element.elementor-element-0123650 {
	margin-bottom: 14px !important;
}


/* ---- 8.4 Counter and progress bar -----------------------------
   akv-reveal.js writes the real values in (250+, 70%). This gives them a
   shape worth reading: the number in the brand gradient, the bar filled
   with it rather than left as a grey trough. */
.elementor-975 .elementor-element.elementor-element-4d42604 .pxl-counter--number {
	font-size: 54px;
	line-height: 1.02;
	font-weight: 800;
	font-family: var(--akv-font-display);
	background: linear-gradient(120deg, #FF8F2C 0%, #FF3672 48%, #7701FE 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	letter-spacing: -0.02em;
}

.elementor-975 .elementor-element.elementor-element-4d42604 .pxl-counter--title,
.elementor-975 .elementor-element.elementor-element-4d42604 .pxl-counter--text {
	font-family: var(--akv-font-display);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
	color: #4A4356;
	margin-top: 6px;
}

.elementor-975 .elementor-element.elementor-element-4d42604 {
	width: auto !important;
	min-width: 190px;
}

.elementor-975 .elementor-element.elementor-element-193c4a2 .pxl-progressbar--wrap {
	height: 12px;
	border-radius: 999px;
	background: #EFE7F3;
	overflow: hidden;
}

.elementor-975 .elementor-element.elementor-element-193c4a2 .pxl--progressbar {
	height: 100%;
	border-radius: 999px;
	background-color: transparent !important;
	background-image: linear-gradient(90deg, #FFB03A 0%, #FF3672 52%, #7701FE 100%) !important;
	transition: width 1.1s cubic-bezier(.22,.61,.36,1);
}

.elementor-975 .elementor-element.elementor-element-193c4a2 .pxl--title,
.elementor-975 .elementor-element.elementor-element-193c4a2 .pxl--value {
	font-family: var(--akv-font-display);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
}

@media (prefers-reduced-motion: reduce) {
	.elementor-975 .elementor-element.elementor-element-193c4a2 .pxl--progressbar {
		transition: none;
	}
}


/* ---- 8.5 "Почему выбирают Akvagrim.uz" ------------------------
   The heading ran to five lines at 54px. Smaller, and the stock photo of
   a man giving a thumbs-up — with its invented "New Audience Members 1.2k"
   dashboard baked into the same file — is dropped. Nothing replaces it
   yet; it comes back as a real photo of your own work. */
.elementor-975 .elementor-element.elementor-element-594cf59 .pxl-item--title {
	font-size: 40px !important;
	line-height: 1.16 !important;
	max-width: 15ch;
}

.elementor-975 .elementor-element.elementor-element-a230443 {
	display: none !important;
}

/* The script line sat across his face; centre it in the space he leaves. */
.elementor-975 .elementor-element.elementor-element-29cbc7a {
	margin-top: 150px !important;
}

@media (max-width: 1024px) {
	.elementor-975 .elementor-element.elementor-element-594cf59 .pxl-item--title {
		font-size: 34px !important;
		max-width: none;
	}

	.elementor-975 .elementor-element.elementor-element-29cbc7a {
		margin-top: 40px !important;
	}
}

@media (max-width: 767px) {
	.elementor-975 .elementor-element.elementor-element-ad2bfc3 .pxl-item--title {
		max-width: none;
	}

	.elementor-975 .elementor-element.elementor-element-4d42604 .pxl-counter--number {
		font-size: 42px;
	}

	.elementor-975 .elementor-element.elementor-element-0e92980 {
		margin-top: -54px !important;
		padding-top: 76px !important;
		clip-path: polygon(0 54px, 100% 0, 100% 100%, 0 100%);
		padding-bottom: 300px !important;
		margin-bottom: -375px !important;
	}
}


/* ================================================================
   9. THIRD PASS — remaining items from 17.09
   ================================================================ */

/* ---- 9.1 Rainbow panel still rode up over the heading ---------
   The panel carries margin-top: -73px so it tucks under a short heading.
   With the Russian heading it climbed into the second line instead. */
.elementor-975 .elementor-element.elementor-element-4661079 {
	margin-top: 26px !important;
}

.elementor-975 .elementor-element.elementor-element-7c7a15f {
	margin-top: 0 !important;
}


/* ---- 9.2 "Приезжаем вовремя…" ---------------------------------
   Six lines at 40px inside a 532px column. The right-hand half is empty
   now that the stock photo is gone, so the text column takes more of the
   row and the heading drops to a readable size. */
.elementor-975 .elementor-element.elementor-element-c850fb2 {
	width: 58% !important;
}

.elementor-975 .elementor-element.elementor-element-c130e45 {
	width: 42% !important;
}

.elementor-975 .elementor-element.elementor-element-594cf59 .pxl-heading--inner,
.elementor-975 .elementor-element.elementor-element-594cf59 .pxl-item--title {
	max-width: 100% !important;
}

.elementor-975 .elementor-element.elementor-element-594cf59 .pxl-item--title {
	font-size: 34px !important;
	line-height: 1.2 !important;
}

/* The two floating cards read "New Audience Members / 1.2k" over a stock
   line chart — an invented analytics dashboard from the demo. Nothing on
   this page is measured in audience members. */
.elementor-975 .elementor-element.elementor-element-4a1cb2e,
.elementor-975 .elementor-element.elementor-element-8708541 {
	display: none !important;
}

@media (max-width: 1024px) {
	.elementor-975 .elementor-element.elementor-element-c850fb2,
	.elementor-975 .elementor-element.elementor-element-c130e45 {
		width: 100% !important;
	}

	.elementor-975 .elementor-element.elementor-element-594cf59 .pxl-item--title {
		font-size: 30px !important;
	}
}

@media (max-width: 767px) {
	.elementor-975 .elementor-element.elementor-element-4661079 {
		margin-top: 18px !important;
	}
}

/* The heading stack inside the CTA carried demo-sized gaps of its own. */
.elementor-975 .elementor-element.elementor-element-0e92980 .pxl-item--subtitle {
	margin-bottom: 10px !important;
}

.elementor-975 .elementor-element.elementor-element-0e92980 .pxl-heading--inner {
	padding-top: 0 !important;
}


/* ---- 9.3 The three label lines under the counter --------------
   "Детские сады / Гипоаллергенные краски / Корпоративы" repeat what the
   services block above already says and cost the row its height. */
.elementor-975 .elementor-element.elementor-element-07cad86,
.elementor-975 .elementor-element.elementor-element-c1b9524,
.elementor-975 .elementor-element.elementor-element-0123650 {
	display: none !important;
}

/* The call-to-action button carried the spacing of the list above it. */
.elementor-975 .elementor-element.elementor-element-494abc4 {
	margin-top: 26px !important;
}

/* Clearance for the restored diagonal, so it never reaches the carousel arrows. */
.elementor-975 .elementor-element.elementor-element-44b1f96 {
	padding-bottom: 96px !important;
}


/* ================================================================
   10. FOURTH PASS — 17.09 (sonnet session)
   ================================================================ */

/* ---- 10.1 "Честные цены на услуги аквагрима в Ташкенте" --------
   55px font inside a 560px measure forced three lines, and the block
   sat 265px down from the top of its own dark panel — most of that space
   was empty. Smaller font, wider measure (two lines), lifted up.
   The price cards were the real bug: at three lines + 265px of padding,
   the cards ran 245px past the BOTTOM of this section's own background,
   so "Выбрать формат" sat on the plain white page instead of the dark
   panel. Lifting the heading reclaims exactly that space — the panel's
   background is `background-size: cover`, so padding-bottom controls its
   height directly, no separate shape layer to coordinate. */
.elementor-975 .elementor-element.elementor-element-ef592ed {
	padding-top: 260px !important;
	padding-bottom: 250px !important;
}

.elementor-975 .elementor-element.elementor-element-ef592ed .pxl-heading--inner {
	max-width: 760px !important;
}

.elementor-975 .elementor-element.elementor-element-ef592ed .pxl-item--title {
	font-size: 42px !important;
	line-height: 1.22 !important;
}

@media (max-width: 1024px) {
	.elementor-975 .elementor-element.elementor-element-ef592ed .pxl-item--title {
		font-size: 34px !important;
	}
}

@media (max-width: 767px) {
	.elementor-975 .elementor-element.elementor-element-ef592ed {
		padding-top: 56px !important;
		padding-bottom: 260px !important;
	}

	.elementor-975 .elementor-element.elementor-element-ef592ed .pxl-heading--inner {
		max-width: 100% !important;
	}

	.elementor-975 .elementor-element.elementor-element-ef592ed .pxl-item--title {
		font-size: 28px !important;
	}
}


/* ---- 10.2 Seam below the pricing block -------------------------
   An earlier attempt faded the dark panel into white with a gradient
   ::after — it read as a dirty grey smudge rather than a clean edge, and
   pulling the next section up by -215px to meet it crowded that section's
   own decorative wave right underneath the cards. Reverted to a plain,
   crisp edge: the dark panel simply ends, the next section keeps its own
   natural top padding, nothing is forced together. A flat boundary
   between two differently-coloured sections is an ordinary, unremarkable
   thing — the blur was the problem, not the absence of one. */


/* ================================================================
   11. FIFTH PASS — 17.09 (second sonnet session)
   ================================================================ */

/* ---- 11.1 Pink block's top diagonal — the accent stripe ---------
   Every dark panel on this page (ef592ed, b96ac26…) has a thin
   orange→pink→violet line baked into its own background PNG, right at
   the diagonal cut. The pink block's top edge is a plain CSS clip-path
   with no equivalent — next to the dark panels it reads as a bare,
   unfinished cut instead of the same "flowing" diagonal.

   This paints that missing line as its own thin band, clipped to a
   parallelogram that runs exactly alongside the block's own cut
   (same two points, offset 10px further into the visible area), so it
   sits right on the seam without needing a second image asset. */
.elementor-975 .elementor-element.elementor-element-0e92980::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 142px;
	background: linear-gradient(90deg, #FFA800 0%, #FE0054 45%, #6000FF 100%);
	clip-path: polygon(0 132px, 100% 0, 100% 10px, 0 142px);
	pointer-events: none;
	z-index: 1;
}

.elementor-975 .elementor-element.elementor-element-0e92980 > * {
	position: relative;
	z-index: 2;
}

@media (max-width: 767px) {
	.elementor-975 .elementor-element.elementor-element-0e92980::before {
		height: 64px;
		clip-path: polygon(0 54px, 100% 0, 100% 8px, 0 62px);
	}
}


/* ================================================================
   12. SIXTH PASS — 17.09 (third sonnet session)
   ================================================================ */

/* ---- 12.1 Sticky header on scroll — same fix as the static one ------
   The on-scroll sticky bar is a SEPARATE Elementor template (post 1753),
   not a clone of the one already fixed (1751) — so none of that earlier
   work reached it. Its menu links carried the theme's original
   `line-height: 90px`, which is the entire 93px bar height by itself;
   that's the "different shape, full width" jump she's seeing when the
   page scrolls past the hero. Same fix, same reasoning, new IDs. */
.elementor-1753 .elementor-element.elementor-element-cc6f091 > .elementor-element-populated {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 20px;
}

.elementor-1753 .elementor-element.elementor-element-8aab0f8 {
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.elementor-1753 .elementor-element.elementor-element-0aed226 {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

.elementor-1753 .elementor-element.elementor-element-0aed226 .pxl-nav-menu {
	width: 100% !important;
}

.elementor-1753 .elementor-element.elementor-element-0aed226 .pxl-nav-menu .pxl-menu-primary {
	display: flex !important;
	flex-wrap: nowrap !important;
	justify-content: flex-end !important;
	align-items: center !important;
	text-align: right !important;
}

.elementor-1753 .elementor-element.elementor-element-0aed226 .pxl-nav-menu .pxl-menu-primary > li > a {
	line-height: 58px !important;
	padding: 0 13px !important;
	font-size: 16px !important;
	white-space: nowrap;
}

.elementor-1753 .pxl-nav-menu.fr-icon-spacer .pxl-menu-primary > li > a .menu-icon-spacer {
	display: none !important;
}

.pxl-header-elementor-sticky .pxl-header-content {
	padding: 0 24px !important;
}

@media (max-width: 1024px) {
	.elementor-1753 .elementor-element.elementor-element-0aed226 .pxl-nav-menu .pxl-menu-primary > li > a {
		padding: 0 9px !important;
		font-size: 15px !important;
	}
}

/* ---- 12.2 Pill header — symmetric padding -----------------------
   The pill itself carries a fixed height:87px from Elementor, but its
   content (menu text + logo) only needs 58px — with nothing centering
   it vertically, all 29px of slack landed below the text and none above
   (measured: 1px above, 28px below). Height set to fit the content with
   a small, equal pad on both sides instead of a fixed taller box. */
.elementor-1751 .elementor-element.elementor-element-3503a5c {
	height: 70px !important;
	min-height: 0 !important;
	max-height: 70px !important;
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}


/* ================================================================
   13. SEVENTH PASS — 17.09 (carousel → static grid)
   ================================================================ */

/* ---- 13.1 "Яркие выездные форматы": all six cards, no slider ----
   This widget renders six `service` posts into a Swiper carousel with
   slidesPerView:3 — but the theme's `service-1` layout ships NO arrows
   and NO pagination dots for it (confirmed: `.pxl-navigation-carousel`
   is absent inside this widget, while the testimonials carousel next
   door does have one). Slides 4-6 were laid out at left:1390/1783/2177px
   inside an overflow:hidden track, i.e. rendered but permanently
   unreachable for a visitor. Nothing was ever deleted — they simply had
   no way to be scrolled to.

   Fix: unwrap the track into a plain wrapping flex grid, so all six sit
   on the page at once. Swiper stays initialised but has no autoplay and
   no loop here, so it never fights these rules after first paint; the
   `!important` widths also outrank the inline `width:393px` Swiper
   stamps on each slide when the viewport is resized. */

.elementor-975 .elementor-element-69976d5 .pxl-carousel-inner,
.elementor-975 .elementor-element-69976d5 .pxl-swiper-container {
	overflow: visible !important;
	height: auto !important;
}

.elementor-975 .elementor-element-69976d5 .pxl-swiper-wrapper {
	display: flex !important;
	flex-wrap: wrap !important;
	transform: none !important;
	height: auto !important;
	/* Row 2's band starts 115px above its row, so the gap has to clear
	   row 1's full card box (437px) or the band cuts across its titles. */
	row-gap: 120px;
}

.elementor-975 .elementor-element-69976d5 .pxl-swiper-slide {
	flex: 0 0 33.3333% !important;
	width: 33.3333% !important;
	max-width: 33.3333% !important;
	height: auto !important;
	margin-right: 0 !important;
}

/* No slider left to drive, so any stray control would be a dead button. */
.elementor-975 .elementor-element-69976d5 .pxl-navigation-carousel,
.elementor-975 .elementor-element-69976d5 .swiper-pagination,
.elementor-975 .elementor-element-69976d5 .pxl-swiper-pagination {
	display: none !important;
}

@media (max-width: 991px) {
	.elementor-975 .elementor-element-69976d5 .pxl-swiper-slide {
		flex: 0 0 50% !important;
		width: 50% !important;
		max-width: 50% !important;
	}
}

@media (max-width: 575px) {
	.elementor-975 .elementor-element-69976d5 .pxl-swiper-slide {
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: 100% !important;
	}
}

/* ---- 13.2 Rainbow band for the second row -----------------------
   The band is inner-section 4661079: 1250px wide, 305px tall, radius
   160px, filled with h4-bg-section3.jpg. It is deliberately short — it
   covers only the top ~190px of a card, so the card TITLES fall below it
   onto the dark background and stay readable. (Stretching one tall band
   over both rows was tried and reverted: it put row 1's grey titles on
   magenta and they became unreadable.)

   So row 2 gets its own band instead, as a pseudo-element on the
   carousel widget — same width, height, radius and image, offset to sit
   behind row 2 exactly as the original sits behind row 1:
     band 1 starts 115px above its row, ends 190px into it
     row pitch = card box 437px + row-gap 120px = 557px
     → top: 557 - 115 = 442px from the widget's own top */
.elementor-975 .elementor-element.elementor-element-69976d5::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 442px;
	height: 305px;
	border-radius: 160px;
	background: url("/wp-content/uploads/2024/05/h4-bg-section3.jpg") 50% 50% / cover no-repeat;
	z-index: 0;
	pointer-events: none;
}

/* The cards have to paint over their own band. */
.elementor-975 .elementor-element.elementor-element-69976d5 .pxl-swiper-slider {
	position: relative;
	z-index: 1;
}

/* The 115px overhang and 305px height hold at every width — only the card
   box shrinks, so only the offset needs retuning. Measured card heights:
   437px at 1440+, 421px at 1200, 375px at 1024 (+120px row-gap each). */
@media (max-width: 1399px) and (min-width: 1200px) {
	.elementor-975 .elementor-element.elementor-element-69976d5::after {
		top: 426px;
	}
}

@media (max-width: 1199px) and (min-width: 992px) {
	.elementor-975 .elementor-element.elementor-element-69976d5::after {
		top: 380px;
	}
}

/* Below 992px the grid reflows to two columns (then one), so a band
   pinned to a three-across layout no longer lines up with anything.
   With no band to clear, the 120px row gap is just dead scroll. */
@media (max-width: 991px) {
	.elementor-975 .elementor-element.elementor-element-69976d5::after {
		display: none;
	}

	.elementor-975 .elementor-element-69976d5 .pxl-swiper-wrapper {
		row-gap: 40px;
	}
}


/* ================================================================
   14. BLOG ARTICLES — typography for real content
   ================================================================

   The theme's demo post ("Blog Details", fake "26 Apr/24", "3 Comments",
   generic tags) is cosmetic junk fixed per-post (real date/comments come
   free with a real post; tags are set correctly when the post is
   created). This block is the other half: the post BODY itself had zero
   typography — one plain 19px paragraph, no distinction for headings,
   quotes, or calls to action. Scoped to body.single-post so it only
   touches real articles, never portfolio/service singles. */

body.single-post .pxl-item--content {
	font-size: 19px;
	line-height: 1.75;
	color: #2b2438;
}

/* Bigger, bolder opening paragraph — the one WordPress marks as the
   excerpt/lead when it's the first child. */
body.single-post .pxl-item--content > p:first-of-type {
	font-size: 22px;
	line-height: 1.6;
	font-weight: 600;
	color: #1d0e2e;
}

body.single-post .pxl-item--content h2 {
	font-family: var(--akv-font-display);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.25;
	color: #1d0e2e;
	margin: 48px 0 20px;
	padding-left: 18px;
	border-left: 6px solid transparent;
	border-image: linear-gradient(180deg, #FF3672 0%, #7701FE 100%) 1;
}

body.single-post .pxl-item--content h2:first-child {
	margin-top: 0;
}

body.single-post .pxl-item--content ul {
	list-style: none;
	margin: 20px 0;
	padding: 0;
}

body.single-post .pxl-item--content ul li {
	position: relative;
	padding: 4px 0 4px 32px;
	margin-bottom: 10px;
}

body.single-post .pxl-item--content ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 12px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: linear-gradient(135deg, #FF3672 0%, #7701FE 100%);
}

/* Highlighted key-insight callout — the "фотозона не нужна" kind of
   line that should stop the reader, not blend into the paragraph. */
body.single-post .pxl-item--content .akv-callout {
	background: linear-gradient(135deg, rgba(255, 54, 114, 0.08) 0%, rgba(119, 1, 254, 0.08) 100%);
	border: 1px solid rgba(119, 1, 254, 0.18);
	border-radius: 20px;
	padding: 24px 28px;
	margin: 28px 0;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	color: #1d0e2e;
}

/* "Which venues" / feature grid — small cards inside the article body,
   not a full Elementor layout, just HTML the post editor can paste. */
body.single-post .pxl-item--content .akv-mini-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 16px;
	margin: 24px 0;
}

body.single-post .pxl-item--content .akv-mini-card {
	background: #faf7fd;
	border: 1px solid #ece3f6;
	border-radius: 16px;
	padding: 18px 20px;
	font-size: 17px;
	line-height: 1.5;
}

body.single-post .pxl-item--content .akv-mini-card strong {
	display: block;
	font-size: 18px;
	margin-bottom: 4px;
	color: #7701FE;
}

/* CTA button for inside article content — same brand gradient as the
   rest of the site, but unscoped so it works outside elementor-975. */
body.single-post .pxl-item--content .akv-article-cta {
	display: inline-block;
	margin-top: 12px;
	padding: 16px 34px;
	border-radius: 50px;
	background: linear-gradient(135deg, #FF3672 0%, #7701FE 100%);
	color: #fff !important;
	font-weight: 700;
	font-size: 17px;
	text-decoration: none !important;
	box-shadow: 0 14px 30px rgba(119, 1, 254, 0.28);
	transition: transform 0.2s ease;
}

body.single-post .pxl-item--content .akv-article-cta:hover {
	transform: translateY(-2px);
}

/* "Читайте также" — internal links styled as small cards, not a bare
   bullet list, so related-article links read as intentional design. */
body.single-post .pxl-item--content .akv-related {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 16px;
	margin: 32px 0;
	padding: 24px;
	background: #faf7fd;
	border-radius: 20px;
}

body.single-post .pxl-item--content .akv-related-label {
	grid-column: 1 / -1;
	font-size: 13px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #7701FE;
	margin-bottom: 4px;
}

body.single-post .pxl-item--content .akv-related a {
	display: block;
	font-size: 16px;
	font-weight: 700;
	color: #1d0e2e !important;
	text-decoration: none !important;
	padding: 14px 16px;
	background: #fff;
	border-radius: 12px;
	border: 1px solid #ece3f6;
	transition: border-color 0.2s ease;
}

body.single-post .pxl-item--content .akv-related a:hover {
	border-color: #FF3672;
}

@media (max-width: 767px) {
	body.single-post .pxl-item--content {
		font-size: 17px;
	}

	body.single-post .pxl-item--content > p:first-of-type {
		font-size: 19px;
	}

	body.single-post .pxl-item--content h2 {
		font-size: 24px;
	}

	body.single-post .pxl-item--content .akv-callout {
		font-size: 18px;
	}
}

/* ==========================================================================
   15. ФИРМЕННЫЕ ИКОНКИ УСЛУГ
   Тема отдаёт шрифтовые иконки (монитор с шестерёнкой, лампочка, мегафон) —
   они корпоративно-технические и не про детский праздник. Подменяем их
   своими SVG в фирменном градиенте, не трогая данные постов: каждая услуга
   опознаётся по своему исходному классу flaticon-*.
   Файлы: assets/icons/akv-*.svg
   ========================================================================== */

.pxl-post--icon i.flaticon {
	display: inline-block;
	width: 64px;
	height: 64px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
}

/* гасим глиф шрифта, оставляя только фон-картинку */
.pxl-post--icon i.flaticon::before,
.pxl-post--icon i.flaticon::after {
	content: '' !important;
	display: none !important;
}

/* Детский аквагрим на день рождения */
.pxl-post--icon i.flaticon-it {
	background-image: url('../icons/akv-birthday.svg');
}

/* Аквагрим для детских садов и школ */
.pxl-post--icon i.flaticon-innovation {
	background-image: url('../icons/akv-kids.svg');
}

/* Семейный праздник с аквагримом */
.pxl-post--icon i.flaticon-production {
	background-image: url('../icons/akv-butterfly.svg');
}

/* Тематические вечеринки и шоу-образы */
.pxl-post--icon i.flaticon-graphic-design {
	background-image: url('../icons/akv-mask.svg');
}

/* Аквагрим для ресторанов и ТРЦ */
.pxl-post--icon i.flaticon-marketing {
	background-image: url('../icons/akv-icecream.svg');
}

/* Корпоративы, фестивали и городские события */
.pxl-post--icon i.flaticon-branding {
	background-image: url('../icons/akv-festival.svg');
}

@media (max-width: 767px) {
	.pxl-post--icon i.flaticon {
		width: 52px;
		height: 52px;
	}
}

/* ==========================================================================
   16. ГЛАВНАЯ — «Коротко о том, как выбрать формат» (виджет bffe202)
   Тот же баг, что и у 69976d5: тема рисует карусель без стрелок/точек
   навигации, поэтому слайды за пределами первого экрана физически
   недостижимы для посетителя. limit поднят до 9 (settings виджета),
   здесь — разворачиваем трек в статичную сетку 3×3, как и там.
   ========================================================================== */

.elementor-975 .elementor-element-bffe202 .pxl-carousel-inner,
.elementor-975 .elementor-element-bffe202 .pxl-swiper-container {
	overflow: visible !important;
	height: auto !important;
}

.elementor-975 .elementor-element-bffe202 .pxl-swiper-wrapper {
	display: flex !important;
	flex-wrap: wrap !important;
	transform: none !important;
	height: auto !important;
	row-gap: 40px;
}

.elementor-975 .elementor-element-bffe202 .pxl-swiper-slide {
	flex: 0 0 33.3333% !important;
	width: 33.3333% !important;
	max-width: 33.3333% !important;
	height: auto !important;
	margin-right: 0 !important;
	padding: 0 14px;
	box-sizing: border-box;
}

.elementor-975 .elementor-element-bffe202 .pxl-navigation-carousel,
.elementor-975 .elementor-element-bffe202 .swiper-pagination,
.elementor-975 .elementor-element-bffe202 .pxl-swiper-pagination {
	display: none !important;
}

@media (max-width: 991px) {
	.elementor-975 .elementor-element-bffe202 .pxl-swiper-slide {
		flex: 0 0 50% !important;
		width: 50% !important;
		max-width: 50% !important;
	}
}

@media (max-width: 575px) {
	.elementor-975 .elementor-element-bffe202 .pxl-swiper-slide {
		flex: 0 0 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 0;
	}
}