/**
 * PW Motion — karty z dużym numerem w tle.
 *
 * Numer przestaje być drobną etykietą nad tytułem i staje się elementem
 * graficznym karty: wielką, kontarową cyfrą w prawym górnym rogu. Jest
 * czysto dekoracyjny, więc nie łapie kursora i nie wchodzi w kolejność
 * czytania — leży pod treścią karty.
 *
 * Klasy:
 *   .pw-numcard — kontener karty (kontekst pozycjonowania),
 *   .pw-bignum  — widget nagłówka z samą liczbą.
 */

body .pw-numcard {
	overflow: hidden;
	/* Miejsce po cyfrze, która wyszła z układu — inaczej tytuł podjeżdża pod samą krawędź. */
	padding-top: clamp(78px, 7.2vw, 96px) !important;
}

.pw-numcard .pw-bignum,
.pw-numlow .pw-bignum {
	position: absolute;
	top: clamp(10px, 1.4vw, 16px);
	right: clamp(14px, 1.8vw, 22px);
	margin: 0;
	width: auto !important;
	max-width: none;
	pointer-events: none;
	user-select: none;
	z-index: 0;
}

.pw-numcard .pw-bignum .elementor-heading-title,
.pw-numlow .pw-bignum .elementor-heading-title {
	font-family: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: clamp(56px, 5.6vw, 80px) !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0.01em !important;
	/* Sam obrys: wypełnienie znika, zostaje cienka kreska w kolorze tła strony. */
	color: transparent !important;
	-webkit-text-stroke: 2px rgba(148, 176, 200, 0.22);
	text-shadow: none;
}

/* Przeglądarka bez obrysu tekstu dostaje wersję wypełnioną, tylko bardzo stłumioną. */
@supports not (-webkit-text-stroke: 1px black) {
	.pw-numcard .pw-bignum .elementor-heading-title,
	.pw-numlow .pw-bignum .elementor-heading-title {
		color: rgba(148, 176, 200, 0.13) !important;
	}
}

/*
 * Wariant: cyfra w prawym dolnym rogu karty.
 *
 * Osobna klasa, a nie odmiana pw-numcard, bo tamta dokłada zapas miejsca
 * u góry karty. Tutaj zapas potrzebny jest na dole, a padding u góry zostaje
 * taki, jaki ustawiono karcie w Elementorze.
 */
body .pw-numlow {
	overflow: hidden;
	padding-bottom: clamp(78px, 7.2vw, 96px) !important;
}

.pw-numlow .pw-bignum {
	top: auto;
	bottom: clamp(2px, 0.8vw, 10px);
}

/* Treść karty zawsze nad cyfrą. */
.pw-numcard > .elementor-element:not(.pw-bignum),
.pw-numcard > .e-con:not(.pw-bignum),
.pw-numlow > .elementor-element:not(.pw-bignum),
.pw-numlow > .e-con:not(.pw-bignum) {
	position: relative;
	z-index: 1;
}

@media (max-width: 767px) {
	body .pw-numcard {
		padding-top: 74px !important;
	}

	.pw-numcard .pw-bignum .elementor-heading-title,
	.pw-numlow .pw-bignum .elementor-heading-title {
		font-size: 58px !important;
	}

	body .pw-numlow {
		padding-bottom: 74px !important;
	}
}