/* Nowoka — Audit modal (popup 3125) shell visuals.
   Ported 1:1 from the approved reference (time-triggered-modal-final-code-only),
   a real HTML/CSS/JS build, not a mockup. Reference technique: one continuous
   black-gradient canvas (fd1d5ec) with a white SVG curve drawn on top (not a
   hard column split), and the editorial/form blocks absolute-positioned on
   top of that shared canvas at the reference's own literal px offsets — the
   canvas is fluid-width (aspect-ratio locked) but everything inside it keeps
   the reference's fixed-px geometry, exactly as the reference itself does. */

#ct-popup-3125 {
	--am-ink: #101518;
	--am-paper: #fbfaf5;
	--am-lime: #c8f425;
	--am-lime-dark: #a9cf03;
	--am-pink: #f32662;
}

/* ---------- Outer shell ---------- */

#ct-popup-3125 .ct-popup-inner {
	/* Width depends only on viewport WIDTH — not height. The reference's own
	   formula also factored in a `(100vh...) * 1.67665` term to derive width
	   from height, which technically matches its own intent (never overflow
	   a short window) but has an unwanted side effect: opening/enlarging the
	   browser's docked devtools panel shrinks the page's available height
	   without changing its width, and that term would shrink the whole
	   modal in response — which reads as a bug, not a feature, to anyone
	   testing with devtools open. Dropped so the modal's size never reacts
	   to vertical space; `max-height` + `overflow-y` below is the safety net
	   for genuinely short viewports instead (see next comment). */
	width: min(1120px, calc(100vw - 48px));
	aspect-ratio: 1120 / 668;
	max-width: 1120px;
	border-radius: 27px;
	/* Last-resort safety net for real short viewports (not devtools) — since
	   width/aspect-ratio no longer shrink for height, a genuinely short
	   window would otherwise push content off both edges of this
	   position:fixed element with no way to reach it. Because the editorial
	   and form panels are positioned with fixed-px offsets (not
	   percentages) against the canvas, if this ever actually clamps, they
	   extend past the canvas and become reachable via scroll instead of the
	   whole design shrinking — only the decorative background curve
	   (percentage-based) would look slightly compressed in that rare case. */
	max-height: calc(100vh - 48px);
	/* This popup has no configured Blocksy backdrop, so the page behind it
	   otherwise renders undimmed — box-shadow spread stands in for a real
	   full-viewport overlay, colour-matched to the reference's backdrop. */
	box-shadow: 0 0 0 9999px rgba(11, 15, 17, 0.78), 0 32px 76px rgba(0, 0, 0, 0.42);
	/* Time-based trigger fires before any scroll, so dead-center-of-viewport
	   can land on the still-fully-visible site header; nudge clears it. */
	top: calc(50% + 24px) !important;
	overflow-x: hidden;
	overflow-y: auto;
}

/* The two panels below are now position:absolute (out of flow), so nothing
   contributes to the canvas's auto height — and percentage heights only
   resolve if every ancestor between the canvas and the aspect-ratio-locked
   .ct-popup-inner also has a definite (non-auto) height. Blocksy/Elementor's
   own wrapper chain (article.post-3125 > .entry-content.ct-popup-content >
   .elementor > fd1d5ec) breaks that chain at the block-level entry-content
   wrapper, so it's forced explicitly here. */
#ct-popup-3125 article.post-3125,
#ct-popup-3125 .entry-content.ct-popup-content,
#ct-popup-3125 .elementor.elementor-3125 {
	height: 100%;
}

#ct-popup-3125 .elementor-element-fd1d5ec {
	display: block !important;
	position: relative !important;
	isolation: isolate;
	overflow: hidden;
	border-radius: 27px;
	height: 100%;
	color: #fff;
	background:
		radial-gradient(ellipse 42% 30% at 43% 103%, rgba(151, 185, 33, 0.22), transparent 71%),
		radial-gradient(ellipse 25% 48% at 5% 45%, rgba(0, 0, 0, 0.32), transparent 75%),
		linear-gradient(106deg, #0b1013 0%, #101719 39%, #151b18 49%, #101518 58%);
}

/* Layered procedural texture: engraved curls + paper grain, masked to the
   black (left) side only so it never bleeds under the white form panel. */
#ct-popup-3125 .elementor-element-fd1d5ec::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	opacity: 0.66;
	background-image:
		repeating-radial-gradient(ellipse at 42% 52%, transparent 0 7px, rgba(184, 210, 116, 0.055) 7.4px 8.1px, transparent 8.5px 15px),
		repeating-radial-gradient(ellipse at 18% 84%, transparent 0 11px, rgba(214, 238, 150, 0.045) 11.5px 12.2px, transparent 12.7px 22px),
		repeating-linear-gradient(119deg, transparent 0 5px, rgba(255, 255, 255, 0.022) 5.5px 6px, transparent 6.4px 10px);
	background-size: 57px 41px, 78px 53px, auto;
	background-position: 13px 7px, -9px 19px, 0 0;
	mix-blend-mode: soft-light;
	-webkit-mask-image: linear-gradient(90deg, #000 0 48%, transparent 57%);
	mask-image: linear-gradient(90deg, #000 0 48%, transparent 57%);
}

#ct-popup-3125 .elementor-element-fd1d5ec::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse at 44% 101%, rgba(178, 205, 47, 0.17), transparent 32%);
	-webkit-mask-image: linear-gradient(90deg, #000 0 48%, transparent 57%);
	mask-image: linear-gradient(90deg, #000 0 48%, transparent 57%);
}

/* Decorative SVG layers (curve, ornament pattern, particle field, quote mark)
   are injected at runtime by popup-audit-context.js — see .white-surface,
   .ornament-texture, .particle-field, .quote-mark below. Kept out of the
   stored Elementor content so no _elementor_data / cache-clear round trip
   is needed for this pass. */

#ct-popup-3125 .white-surface {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

#ct-popup-3125 .ornament-texture {
	position: absolute;
	inset: 0 auto 0 0;
	z-index: -1;
	width: 51.5%;
	height: 100%;
	pointer-events: none;
	opacity: 0.6;
	mix-blend-mode: soft-light;
	-webkit-mask-image: linear-gradient(90deg, #000 0 84%, transparent 100%);
	mask-image: linear-gradient(90deg, #000 0 84%, transparent 100%);
}

#ct-popup-3125 .particle-field {
	position: absolute;
	inset: 0 auto 0 0;
	z-index: 1;
	width: 51.5%;
	height: 100%;
	overflow: visible;
	pointer-events: none;
	opacity: 0.72;
	mix-blend-mode: screen;
	-webkit-mask-image: linear-gradient(90deg, #000 0 82%, transparent 96%);
	mask-image: linear-gradient(90deg, #000 0 82%, transparent 96%);
}

#ct-popup-3125 .particle-field circle {
	vector-effect: non-scaling-stroke;
	will-change: transform;
}

#ct-popup-3125 .quote-mark {
	position: absolute;
	z-index: -1;
	left: 2px;
	top: -1px;
	width: 184px;
	height: 143px;
	filter: drop-shadow(0 7px 8px rgba(0, 0, 0, 0.4));
	user-select: none;
}

/* ---------- Left editorial panel ---------- */

#ct-popup-3125 .elementor-element-1c3f31c {
	position: absolute !important;
	left: 96px;
	top: 93px;
	width: 360px;
	z-index: 2;
	background: none !important;
	background-image: none !important;
	padding: 0 !important;
	/* Elementor flex containers add their own gap between children on top
	   of any margin (margins don't collapse in flex layout) — zeroed so the
	   explicit reference-matched margins below are the only spacing. */
	gap: 0 !important;
}

#ct-popup-3125 .elementor-element-e8987f7 {
	position: relative;
	z-index: 1;
	display: inline-flex !important;
	width: max-content !important;
	max-width: 100%;
	min-height: 42px;
	align-items: center;
	padding: 8px 16px !important;
	border: 1px solid var(--am-lime-dark) !important;
	border-radius: 999px !important;
	background: rgba(14, 19, 21, 0.88) !important;
}

#ct-popup-3125 .elementor-element-e8987f7 .popup-badge {
	color: #fff;
	font-size: 14.2px;
	font-weight: 800;
	white-space: nowrap;
}

#ct-popup-3125 .audit-modal-headline {
	margin: 22px 0 15px;
	font-family: "Nimbus Roman", "Times New Roman", Georgia, serif;
	font-size: clamp(26px, 3.1vw, 34px);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -0.025em;
	color: #fff;
}

#ct-popup-3125 .audit-modal-headline__prefix,
#ct-popup-3125 .audit-modal-headline__lead,
#ct-popup-3125 .audit-modal-headline__context {
	display: block;
}

#ct-popup-3125 .audit-modal-headline__prefix,
#ct-popup-3125 .audit-modal-headline__lead {
	color: #fff;
}

#ct-popup-3125 .audit-modal-headline__context {
	color: var(--am-lime);
}

#ct-popup-3125 .elementor-element-5ff1a82 {
	position: relative;
	z-index: 1;
	width: 314px;
	max-width: 100%;
	margin: 0 !important;
}

#ct-popup-3125 .elementor-element-5ff1a82 .popup-badge {
	color: #f5f5e8;
	font-size: 14.5px;
	line-height: 1.48;
	font-weight: 400;
}

/* Benefit rows */

#ct-popup-3125 .elementor-element-a1b2c37 {
	position: relative;
	z-index: 1;
	width: 326px;
	max-width: 100%;
	margin: 20px 0 0 !important;
	gap: 0 !important;
}

#ct-popup-3125 .elementor-element-a1b2c31,
#ct-popup-3125 .elementor-element-a1b2c33,
#ct-popup-3125 .elementor-element-a1b2c35 {
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	padding: 9px 0 10px !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25) !important;
}

#ct-popup-3125 .elementor-element-a1b2c35 {
	border-bottom: 0 !important;
}

#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-icon,
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-icon,
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-icon {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 1px solid var(--am-lime);
	background: transparent !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-icon .elementor-icon,
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-icon .elementor-icon,
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-icon .elementor-icon {
	display: none;
}

#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-icon::before,
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-icon::before,
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-icon::before {
	font-size: 12px;
	font-weight: 800;
	color: var(--am-lime);
}

#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-icon::before { content: "01"; }
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-icon::before { content: "02"; }
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-icon::before { content: "03"; }

#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-title,
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-title,
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-title,
#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-title a,
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-title a,
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-title a {
	color: #fff;
	font-size: 13.5px;
	font-weight: 800;
	line-height: 1.12;
	margin-bottom: 3px !important;
}

#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-description,
#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-description,
#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-description {
	margin-bottom: 0 !important;
	color: rgba(255, 255, 255, 0.84);
	font-size: 11.2px;
	line-height: 1.35;
	white-space: nowrap;
}

/* ---------- Right form panel ---------- */

#ct-popup-3125 .elementor-element-1fa46a9 {
	position: absolute !important;
	left: 504px;
	top: 95px;
	width: 588px;
	height: 524px;
	z-index: 3;
	display: block !important;
	padding: 55px 29px 34px !important;
	border: 1px solid #d4d7d6 !important;
	border-radius: 24px !important;
	background: rgba(255, 255, 255, 0.82) !important;
	color: var(--am-ink);
	box-shadow: 0 16px 25px rgba(20, 24, 25, 0.15);
	min-height: 0 !important;
	overflow: hidden;
}

#ct-popup-3125 .elementor-element-4f2916d {
	width: 100%;
	height: 100%;
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
}

/* Close button — sits inside the modal's rounded corner, matching the
   reference (not overlapping it). */
#ct-popup-3125 .ct-toggle-close {
	position: absolute !important;
	width: 54px !important;
	height: 54px !important;
	min-width: 54px !important;
	min-height: 54px !important;
	border-radius: 50% !important;
	background: #ffffff !important;
	border: 1.5px solid var(--am-lime-dark) !important;
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.11) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	top: 16px !important;
	right: 10px !important;
	z-index: 8 !important;
}

#ct-popup-3125 .ct-toggle-close .ct-icon path {
	fill: var(--am-ink);
}

#ct-popup-3125 .ct-toggle-close:focus-visible {
	outline: 2px solid var(--am-lime);
	outline-offset: 2px;
}

/* ---------- Responsive ---------- */
/* The reference's own single breakpoint is 760px, but that only covers true
   phone widths. Its fixed-px absolute layout (editorial/form panels) is
   sized for a ~1120px canvas and needs the canvas to actually reach close
   to that to avoid the form card's right edge clipping past the canvas
   edge — which only happens once the viewport is >=1168px (the point where
   `min(1120px, calc(100vw - 48px), ...)` can equal 1120px). Below that,
   ordinary tablets and small laptop windows were using the two-panel
   desktop layout without the width to support it, clipping the form card.
   Raised to 1200px (small safety margin) so the whole 761px-1199px band
   also gets the safe single-column stacked layout instead. */

@media (max-width: 1200px) {
	#ct-popup-3125 .ct-popup-inner {
		width: min(700px, calc(100vw - 32px));
		aspect-ratio: auto;
		max-height: calc(100vh - 16px);
		overflow-y: auto;
		border-radius: 20px;
	}

	#ct-popup-3125 .elementor-element-fd1d5ec {
		height: auto;
	}

	#ct-popup-3125 .white-surface,
	#ct-popup-3125 .particle-field {
		display: none !important;
	}

	#ct-popup-3125 .ornament-texture {
		width: 100% !important;
		opacity: 0.46;
	}

	#ct-popup-3125 .elementor-element-1c3f31c,
	#ct-popup-3125 .elementor-element-1fa46a9 {
		position: relative !important;
		inset: auto;
		left: auto;
		top: auto;
		width: auto !important;
		height: auto !important;
	}

	#ct-popup-3125 .elementor-element-1c3f31c {
		padding: 74px 22px 27px !important;
		background: var(--am-ink) !important;
	}

	#ct-popup-3125 .elementor-element-5ff1a82,
	#ct-popup-3125 .elementor-element-a1b2c37 {
		width: 100%;
	}

	#ct-popup-3125 .quote-mark {
		top: -46px;
	}

	#ct-popup-3125 .audit-modal-headline {
		/* This stacked layout now also covers wider tablet widths (up to
		   the 1200px breakpoint above), not just narrow phones — clamp
		   instead of a single fixed size so the headline doesn't stay
		   phone-small on a much wider card. */
		font-size: clamp(28px, 5.2vw, 34px);
	}

	#ct-popup-3125 .elementor-element-a1b2c32 .elementor-icon-box-description,
	#ct-popup-3125 .elementor-element-a1b2c34 .elementor-icon-box-description,
	#ct-popup-3125 .elementor-element-a1b2c36 .elementor-icon-box-description {
		white-space: normal;
	}

	#ct-popup-3125 .elementor-element-1fa46a9 {
		margin: 0;
		padding: 34px 20px 28px !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: var(--am-paper) !important;
		box-shadow: none !important;
	}

	#ct-popup-3125 .button-particle-field {
		display: none !important;
	}

	#ct-popup-3125 .ct-toggle-close {
		position: fixed;
		top: 16px;
		right: 16px;
		width: 48px;
		height: 48px;
	}
}

@media (prefers-reduced-motion: reduce) {
	#ct-popup-3125,
	#ct-popup-3125 * {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}

	#ct-popup-3125 .particle-field,
	#ct-popup-3125 .button-particle-field {
		display: none !important;
	}
}