/* ==========================================================================
   RMC – style uzupełniające szablony Elementora (usługi, CTA w stopce).
   Wartości wzięte z projektu w Figmie („USŁUGA PODSTAWOWA/ZAAWANSOWANA PODSTRONA”).
   ========================================================================== */

:root {
	--rmc-granat: #013462;
	--rmc-granat-ciemny: #002146;
	--rmc-niebieski: #00B6F1;
	--rmc-tekst: #313131;
	--rmc-linia: #C5DCE3;
}

/* ---------- Ikona w ramce z narożnikami ([rmc_ikona]) ----------
   Ścieżki narożników jak w .icon-hex (Dodatkowy CSS), żeby hover zachowywał się identycznie. */
.rmc-ikona {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 110px;
	height: 110px;
}

.rmc-ikona__ramka {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: visible;
}

.rmc-ikona__ramka path {
	transition: d 0.5s ease;
}

.rmc-ikona .c1 { d: path("M0.75 12.8963 V6.01153 C0.75 3.10567 3.10567 0.75 6.01154 0.75 H8.03779 H12.8963"); }
.rmc-ikona .c2 { d: path("M110.75 12.8963 V6.01153 C110.75 3.10567 108.394 0.75 105.488 0.75 H103.462 H98.6037"); }
.rmc-ikona .c3 { d: path("M0.75 98.6037 V105.488 C0.75 108.394 3.10567 110.75 6.01154 110.75 H8.03779 H12.8963"); }
.rmc-ikona .c4 { d: path("M110.75 98.6037 V105.488 C110.75 108.394 108.394 110.75 105.488 110.75 H103.462 H98.6037"); }

.rmc-ikona:hover .c1 { d: path("M0.75 22.75 V6.01154 C0.75 3.10567 3.10567 0.75 6.01154 0.75 H13.95 H22.75"); }
.rmc-ikona:hover .c2 { d: path("M110.75 22.75 V6.01154 C110.75 3.10567 108.394 0.75 105.488 0.75 H97.55 H88.75"); }
.rmc-ikona:hover .c3 { d: path("M0.75 88.75 V105.488 C0.75 108.394 3.10567 110.75 6.01154 110.75 H13.95 H22.75"); }
.rmc-ikona:hover .c4 { d: path("M110.75 88.75 V105.488 C110.75 108.394 108.394 110.75 105.488 110.75 H97.55 H88.75"); }

.rmc-ikona__obraz {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	transition: transform 0.5s ease;
}

.rmc-ikona:hover .rmc-ikona__obraz {
	transform: scale(1.08);
}

.rmc-ikona__obraz svg,
.rmc-ikona__obraz img {
	display: block;
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
}

/* ---------- Hero usługi: lista punktów (np. „Nasza flota”) ---------- */
.rmc-usluga-lista {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
}

.rmc-usluga-lista li {
	position: relative;
	padding-left: 1.5rem;
	font-family: "ff-utility-web-pro", sans-serif;
	font-weight: 300;
	font-size: 1rem;
	line-height: 1.8;
	color: var(--rmc-granat-ciemny);
}

.rmc-usluga-lista li::before {
	content: "";
	position: absolute;
	left: 0.6rem;
	top: 0.85em;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: currentColor;
}

/* ---------- Sekcja „opis ze zdjęciem”: nagłówek i lista wpisywane w polu ACF ---------- */
.rmc-usluga-opis h3,
.rmc-usluga-opis h4 {
	margin: 0 0 2rem;
	font-family: "ddt", sans-serif;
	font-weight: 300;
	font-size: 1.25rem;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--rmc-granat);
}

.rmc-usluga-opis ul {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rmc-usluga-opis li {
	position: relative;
	padding-left: 1.5rem;
	font-weight: 300;
	font-size: 0.875rem;
	line-height: 1.8;
}

.rmc-usluga-opis li::before {
	content: "";
	position: absolute;
	left: 0.6rem;
	top: 0.85em;
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--rmc-niebieski);
}

/* ---------- Kroki współpracy: separator kreska–strzałka–kreska jak w projekcie ----------
   Elementor nie wyrenderuje ukrytego kroku, więc :last-child zawsze trafia w ostatni widoczny. */
.rmc-kroki > .e-con {
	position: relative;
	border: 0 !important;
}

.rmc-kroki > .e-con:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 8px;
	height: 100%;
	background:
		linear-gradient(var(--rmc-linia), var(--rmc-linia)) 0 0 / 1px calc(50% - 1.5rem) no-repeat,
		linear-gradient(var(--rmc-linia), var(--rmc-linia)) 0 100% / 1px calc(50% - 1.5rem) no-repeat,
		url("../img/krok-strzalka.svg") 0 50% / 8px 14px no-repeat;
}

@media (max-width: 767px) {
	.rmc-kroki > .e-con:not(:last-child)::after {
		display: none;
	}
	.rmc-kroki > .e-con:not(:last-child) {
		padding-bottom: 2.5rem !important;
		margin-bottom: 2.5rem;
		border-bottom: 1px solid var(--rmc-linia) !important;
	}
}

/* ---------- Kafelki (zalety / co otrzymujesz) ---------- */
.rmc-kafelki > .e-con {
	min-width: 0;
}

@media (max-width: 1024px) {
	.rmc-kafelki > .e-con {
		padding-bottom: 3rem !important;
	}
}

/* ---------- Niebieska sekcja CTA nad stopką ----------
   Domyślnie linia 1 niebieska (strona główna); usługi wyróżniają linię 2. */
.rmc-cta-linia2 #footer-hero .elementor-element-e512df4 .elementor-heading-title {
	color: #FFFFFF;
}

.rmc-cta-linia2 #footer-hero .elementor-element-762e102 .elementor-heading-title {
	color: var(--rmc-niebieski);
}

/* ---------- Treść wpisu: długie adresy URL nie mogą rozpychać strony na telefonie ---------- */
.snet-post-content {
	overflow-wrap: anywhere;
}

/* ---------- O nas: metalowe koło w „Surowce w ciągłym ruchu” ----------
   Dodatkowy CSS podaje ścieżkę od roota (/wp-content/...), która nie działa, gdy strona stoi
   w podkatalogu (localhost/rmc). Ścieżka względna do pliku motywu działa wszędzie. */
.stage .metal-wheel {
	background-image: url("../images/circle-metal.svg");
}

/* ---------- Wpis bez śródtytułów: bez pustego „Spisu treści” (klasa z inc/wpis.php) ---------- */
.rmc-bez-spisu .elementor-964 .elementor-element-c04a5eb {
	display: none;
}

/* Strona główna, „Poznaj wartość swojego materiału” — wiersz pod wykresem wg Figmy
   („Cynk ▲ +0,65%”: Light 16, interlinia 180%, odstępy 4%), z dołożoną ceną, o którą prosił klient */
.rmc-cena-surowca {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .25rem .75rem;
	font-family: "ff-utility-web-pro", sans-serif;
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.8;
	letter-spacing: .04em;
	color: #F9FBFE;
	text-decoration: none;
}
.rmc-cena-surowca:hover,
.rmc-cena-surowca:focus-visible {
	color: #F9FBFE;
}
.rmc-cena-surowca__cena {
	font-weight: 400;
}
.rmc-cena-surowca__jedn {
	opacity: .7;
}
.rmc-cena-surowca__zmiana.is-up {
	color: #5CE9FF;
}
.rmc-cena-surowca__zmiana.is-down {
	color: #FF8A8A;
}

/* Baza wiedzy — karta wpisu (szablon pętli #934): cała karta klikalna, hover, etykieta „Nowy wpis” */
.elementor-934 .elementor-element-0a711a3 {
	position: relative;
	transition: background-color .35s ease, box-shadow .35s ease, transform .35s ease;
}
.elementor-934 .elementor-element-8c40aaf a::after {
	/* link tytułu rozciągnięty na całą kartę — klik w dowolne miejsce otwiera wpis */
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}
.elementor-934 .elementor-element-d8b78ff {
	position: relative;
	overflow: hidden;
	border-radius: .75rem;
}
.elementor-934 .elementor-element-13cb843 img {
	transition: transform .6s cubic-bezier(.22,.61,.36,1);
}
.elementor-934 .elementor-element-8c40aaf .elementor-heading-title,
.elementor-934 .elementor-element-8c40aaf a {
	transition: color .3s ease;
}
@media (hover: hover) {
	.elementor-934 .elementor-element-0a711a3:hover {
		background-color: #FFFFFF80 !important;
	}
	.elementor-934 .elementor-element-0a711a3:hover .elementor-element-13cb843 img {
		transform: scale(1.06);
	}
	.elementor-934 .elementor-element-0a711a3:hover .elementor-element-8c40aaf a,
	.elementor-934 .elementor-element-0a711a3:hover .elementor-element-8c40aaf .elementor-heading-title {
		color: #00B6F1;
	}
}
.elementor-934 .elementor-element-0a711a3:focus-within {
	box-shadow: 0 0 0 2px #00B6F1;
}

.elementor-934 .elementor-element-cb308e5 {
	position: relative;
}
/* „NOWY WPIS” wg Figmy: Utility Pro 10 px, odstępy 67 %, #00B6F2, w ramce 157×22 z narożnikami */
.rmc-nowy-wpis {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 157px;
	height: 22px;
	padding: 0 14px 0 calc(14px + .67em);
	font-family: "ff-utility-web-pro", sans-serif;
	font-size: 10px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: .67em;
	text-transform: uppercase;
	color: #00B6F2;
	pointer-events: none;
	--r: #00B6F2;
	background:
		linear-gradient(var(--r), var(--r)) left top / 8px 1.25px,
		linear-gradient(var(--r), var(--r)) left top / 1.25px 8px,
		linear-gradient(var(--r), var(--r)) right top / 8px 1.25px,
		linear-gradient(var(--r), var(--r)) right top / 1.25px 8px,
		linear-gradient(var(--r), var(--r)) left bottom / 8px 1.25px,
		linear-gradient(var(--r), var(--r)) left bottom / 1.25px 8px,
		linear-gradient(var(--r), var(--r)) right bottom / 8px 1.25px,
		linear-gradient(var(--r), var(--r)) right bottom / 1.25px 8px;
	background-repeat: no-repeat;
}

/* Wpis blogowy (#964) — spis treści wg Figmy (WPIS BLOGOWY → Frame 342): tytuł DDT 24 granat,
   pozycje „1. Tekst” w jednej linii, cienka linia nad każdą pozycją, aktywna w gradiencie marki */
.elementor-964 .elementor-element-2e97371 .elementor-toc__header {
	padding: 0 0 36px;
	border: 0;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__header-title {
	color: #013462;
	font-size: 1.5rem;
	line-height: 1;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__body {
	padding: 0;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-wrapper {
	margin: 0;
	padding: 0;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item {
	margin: 0;
	padding: 11px 0;
	border-top: 1px solid rgba(1, 52, 98, .12);
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item .elementor-toc__list-item {
	/* śródtytuły h3/h4 — bez własnej linii, z wcięciem, żeby nie udawały rozdziałów */
	border-top: 0;
	padding: 6px 0 0 1.25rem;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item-text-wrapper {
	display: flex;
	align-items: baseline;
	gap: .25em;
	font-family: "ff-utility-web-pro", sans-serif;
	font-size: 1rem;
	font-weight: 300;
	line-height: 1.6;
	letter-spacing: -.5px;
	color: #04093E;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item-text-wrapper::before {
	/* numer w tym samym kolorze i rozmiarze co tekst (Elementor dawał blady, osobny znacznik) */
	position: static;
	flex: none;
	margin: 0;
	width: auto;
	color: inherit;
	font: inherit;
	opacity: 1;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item-text {
	color: #04093E;
	line-height: 1.6;
	transition: color .2s ease;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item-text:hover {
	color: #00B6F1;
}
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item-text-wrapper:has(.elementor-item-active),
.elementor-964 .elementor-element-2e97371 .elementor-toc__list-item-text.elementor-item-active {
	color: #00B6F1;
	background: linear-gradient(90deg, #00B6F1 0%, #5CE9FF 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-decoration: none;
}

/* Strona główna, „Twój partner na rynku” — kolumny 311 px jak w Figmie (rozciągały się do ~342 px) */
@media (min-width: 1025px) {
	.elementor-2 .elementor-element-f6541e4 > .e-con,
	.elementor-2 .elementor-element-f6541e4 > .e-con-inner > .e-con {
		flex: 0 0 311px;
		width: 311px;
	}
}

/* Strona główna, „Surowce w ciągłym ruchu” — pozycje z Figmy: tekst od y≈239, okrąg od x≈673 / y≈197
   (sekcja centrowała obie kolumny w pionie, więc tekst wisiał ~130 px za nisko). 10 px to górna ramka sekcji. */
@media (min-width: 1025px) {
	.elementor-2 .elementor-element-d8ce9c9 {
		align-self: flex-start;
		margin-top: 229px;
	}
	.elementor-2 .elementor-element-a8e9302 {
		align-self: flex-start;
		margin-top: 187px;
		margin-left: -94px;
	}
}

/* ===== Strona główna, hero — pozycje 1:1 z Figmą (MAINPAGE → SZEROKO, 1440 px) ===== */
.rmc-hero-link .elementor-button {
	padding: 0;
	background: none;
}
.rmc-hero-link .elementor-button-content-wrapper {
	gap: 18px;
}
.rmc-hero-link .elementor-button-icon svg {
	width: 4.5px;
	height: 9px;
}
@media (min-width: 1025px) {
	/* tekst w prawym górnym rogu od y=213, link 36 px pod nim */
	.elementor-2 .elementor-element-c55a313 {
		margin-top: 179px !important;
		gap: 36px;
	}
	.elementor-2 .elementor-element-43b1616 {
		width: 425px;
	}
	/* Hero miało dół 0, bo treść mieściła się w min. wysokości 1230 px. Po dodaniu przycisków
	   CTA treść ją przerasta i statystyki dotykały następnej sekcji. */
	.elementor-2 .elementor-element-83aab15 {
		padding-bottom: 140px !important;
	}
	/* nagłówek pod blokiem CTA; po dodaniu przycisków (2026-10-21) więcej powietrza niż w Figmie */
	.elementor-2 .elementor-element-d11f474 {
		padding-top: 160px !important;
	}
	.elementor-2 .elementor-element-c3a9f21 {
		align-self: flex-start;
		margin-left: calc(100% - 424px);
	}
	/* przycisk wyśrodkowany w pionie z podpisem, lewa krawędź na x=955 */
	.elementor-2 .elementor-element-a712caf {
		align-items: center !important;
		padding-top: 30px !important;
		padding-bottom: 137px !important;
	}
	.elementor-2 .elementor-element-a7d1e8e {
		margin-right: 82.5px;
	}
}
/* Klient (2026-10-22): hasło h1 i pasek „Odzysk metali / …” wyżej, obok bloku CTA, z mniejszym
   odstępem pod paskiem. Blok CTA zostaje na miejscu — ma z-index 1000, więc nachodzący na niego
   kontener nagłówka nie zasłania przycisków. Wysunięcie dobrane tak, żeby statystyki zaczynały się
   80 px pod ostatnim linkiem CTA (wyżej weszłyby pod „Dobierz spektrometr”). Min. wysokość hero
   zdjęta, bo po podciągnięciu treści zostawiała pustkę pod statystykami.
   Dopiero od 1280 px h1 mieści się obok CTA (prawa kolumna zaczyna się wtedy na x=816,
   h1 kończy na 782); węższe ekrany zostają bez zmian. */
@media (min-width: 1280px) {
	.elementor-2 .elementor-element-83aab15 {
		min-height: 0 !important;
	}
	.elementor-2 .elementor-element-d11f474 {
		margin-top: -492px !important;
	}
	.elementor-2 .elementor-element-a712caf {
		padding-bottom: 80px !important;
	}
	/* lewa kolumna jeszcze trochę wyżej (klient), ale statystyki zostają 80 px pod CTA —
	   dlatego transform, a nie większy ujemny margines */
	.elementor-2 .elementor-element-d11f474,
	.elementor-2 .elementor-element-a712caf {
		transform: translateY(-50px);
	}
}

/* ===== Strona główna, „Czym się zajmujemy” wg Figmy (WĄSKO): karty od y=437, w hoverze
   najechana karta rozszerza się do 472 px, pozostałe zwężają do 330 px ===== */
@media (min-width: 981px) {
	.elementor-2 .elementor-element-fa53925 {
		padding-top: 184px !important;
	}
	.elementor-2 .elementor-element-fa53925 > .rmc__item {
		flex: 1 1 0 !important;
		transition: background-color .35s ease, height .45s cubic-bezier(.22,.61,.36,1), flex-basis .45s cubic-bezier(.22,.61,.36,1), flex-grow .45s cubic-bezier(.22,.61,.36,1);
	}
	.elementor-2 .elementor-element-fa53925:hover > .rmc__item {
		flex: 0 0 330px !important;
	}
	.elementor-2 .elementor-element-fa53925:hover > .rmc__item:hover {
		flex: 0 0 472px !important;
	}
}

/* ===== Rozszerzona treść usługi ([rmc_usluga_tresc]): urządzenia, oferta laboratorium.
   Nagłówki, kolory i fonty jak w sekcjach szablonu #831, żeby bloki nie odstawały. ===== */
.rmc-tresc-sekcja,
.rmc-tresc-widget,
.rmc-tresc-widget .elementor-shortcode {
	width: 100%;
}

.rmc-tresc-sekcja:has(.elementor-shortcode:empty) {
	display: none;
}

.rmc-blok {
	padding: 120px 20px 0;
	font-family: "ff-utility-web-pro", sans-serif;
	font-weight: 300;
	font-size: 1rem;
	line-height: 1.8;
	color: #001739;
}

.rmc-blok--szary {
	margin-top: 120px;
	padding-bottom: 120px;
	background: #F2F5F6;
}

.rmc-blok--szary + .rmc-blok {
	padding-top: 120px;
}

/* Biały blok na końcu części treści stoi tuż nad sekcją szablonu – bez tego tekst dotykał jej tła. */
.rmc-tresc > .rmc-blok:last-child:not(.rmc-blok--szary) {
	padding-bottom: 120px;
}

.rmc-blok__in {
	max-width: 1320px;
	margin: 0 auto;
}

.rmc-blok__in > :last-child {
	margin-bottom: 0;
}

.rmc-blok__naglowek {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
	margin-bottom: 56px;
}

.rmc-blok h2 {
	margin: 0;
	max-width: 860px;
	font-family: "ddt", sans-serif;
	font-weight: 300;
	font-size: 2.75rem;
	line-height: 1.2;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--rmc-granat);
}

/* nadtytuł z kreską z lewej, jak .title__span */
.rmc-blok__nad {
	position: relative;
	flex: 0 0 auto;
	margin: 12px 0 0;
	padding-left: 190px;
	font-weight: 500;
	font-size: 0.75rem;
	line-height: 1.2;
	letter-spacing: 0.56em;
	text-transform: uppercase;
	color: #009FE3;
}

.rmc-blok__nad::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 162px;
	height: 2px;
	background: var(--rmc-niebieski);
}

.rmc-blok__wstep {
	max-width: 860px;
	margin-bottom: 56px;
}

.rmc-blok p {
	margin: 0 0 1.25rem;
}

.rmc-blok p:last-child {
	margin-bottom: 0;
}

.rmc-blok strong {
	font-weight: 500;
	color: var(--rmc-granat);
}

.rmc-blok a:not(.rmc-przycisk) {
	color: #009FE3;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.rmc-blok h3 {
	margin: 0 0 1rem;
	font-family: "ddt", sans-serif;
	font-weight: 300;
	font-size: 1.5rem;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--rmc-granat);
}

.rmc-blok h4 {
	margin: 1.5rem 0 0.75rem;
	font-family: "ddt", sans-serif;
	font-weight: 300;
	font-size: 1.125rem;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--rmc-granat);
}

/* lista z niebieską kropką jak w .rmc-usluga-opis */
.rmc-blok ul {
	margin: 0 0 1.25rem;
	padding: 0;
	list-style: none;
}

.rmc-blok li {
	position: relative;
	padding-left: 1.5rem;
	font-size: 0.9375rem;
	line-height: 1.7;
}

.rmc-blok li + li {
	margin-top: 0.4rem;
}

.rmc-blok li::before {
	content: "";
	position: absolute;
	left: 0.6rem;
	top: 0.8em;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--rmc-niebieski);
}

.rmc-lista-kol {
	columns: 2;
	column-gap: 48px;
}

.rmc-lista-kol li {
	break-inside: avoid;
}

/* ---------- karty urządzeń / obszarów ---------- */
.rmc-karty {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.rmc-karty--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.rmc-karta {
	display: flex;
	flex-direction: column;
	padding: 40px;
	background: #fff;
	border: 1px solid var(--rmc-linia);
	border-radius: 12px;
}

.rmc-blok--szary .rmc-karta {
	border-color: transparent;
}

.rmc-karta__typ {
	margin: 0 0 0.75rem !important;
	font-weight: 500;
	font-size: 0.75rem;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: #009FE3;
}

.rmc-karta > ul {
	margin-top: 0.5rem;
}

.rmc-karta__dol {
	margin-top: auto;
	padding-top: 1.5rem;
}

/* specyfikacja: wiersze parametr – wartość */
.rmc-spec {
	margin: 0.5rem 0 0;
	font-size: 0.875rem;
	line-height: 1.5;
}

.rmc-spec > div {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	gap: 1rem;
	padding: 0.6rem 0;
	border-bottom: 1px solid var(--rmc-linia);
}

.rmc-spec dt {
	font-weight: 500;
	color: var(--rmc-granat);
}

.rmc-spec dd {
	margin: 0;
}

/* tabela kalibracji */
.rmc-tabela-wrap {
	overflow-x: auto;
}

.rmc-tabela {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9375rem;
	line-height: 1.6;
	background: #fff;
}

.rmc-tabela th,
.rmc-tabela td {
	padding: 16px 20px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--rmc-linia);
}

.rmc-tabela th {
	font-weight: 500;
	font-size: 0.75rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #fff;
	background: var(--rmc-granat);
}

.rmc-tabela td:first-child {
	width: 30%;
	font-weight: 500;
	color: var(--rmc-granat);
}

/* wyróżnienie (gwarancja, kalibracje na życzenie) */
.rmc-wyroznienia {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin-bottom: 56px;
}

.rmc-wyroznienie {
	padding: 32px;
	border-radius: 12px;
	color: #fff;
	background: linear-gradient(267.46deg, #002C6A 0.62%, #0A6FB0 103.71%);
}

.rmc-wyroznienie strong {
	display: block;
	margin-bottom: 0.5rem;
	font-family: "ddt", sans-serif;
	font-weight: 300;
	font-size: 2rem;
	line-height: 1.1;
	text-transform: uppercase;
	color: #fff;
}

.rmc-wyroznienie p {
	font-size: 0.9375rem;
	line-height: 1.6;
}

.rmc-przycisk {
	display: inline-flex;
	align-items: center;
	min-height: 52px;
	padding: 0 28px;
	border-radius: 6px;
	font-weight: 500;
	font-size: 0.875rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff !important;
	background: linear-gradient(267.46deg, #002C6A 0.62%, #5AE1FF 103.71%);
	transition: opacity .2s ease;
}

.rmc-przycisk:hover {
	opacity: .85;
}

.rmc-dwie-kol {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px 64px;
}

@media (max-width: 1024px) {
	.rmc-karty--3,
	.rmc-wyroznienia {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.rmc-blok {
		padding-top: 72px;
	}
	.rmc-blok--szary {
		margin-top: 72px;
		padding-bottom: 72px;
	}
	.rmc-blok--szary + .rmc-blok {
		padding-top: 72px;
	}
	.rmc-blok__naglowek {
		flex-direction: column-reverse;
		gap: 1rem;
		margin-bottom: 32px;
	}
	.rmc-blok h2 {
		font-size: 1.75rem;
	}
	.rmc-blok__nad {
		margin: 0;
		padding-left: 0;
	}
	.rmc-blok__nad::before {
		display: none;
	}
	.rmc-karty,
	.rmc-karty--3,
	.rmc-wyroznienia,
	.rmc-dwie-kol {
		grid-template-columns: 1fr;
	}
	.rmc-karta {
		padding: 28px 24px;
	}
	.rmc-lista-kol {
		columns: 1;
	}
	.rmc-spec > div {
		grid-template-columns: 1fr;
		gap: 0.15rem;
	}
	.rmc-tabela th,
	.rmc-tabela td {
		padding: 12px 14px;
	}
}

/* ===== Kontakt: adres i mapa w karcie oddziału (sekcja „Działy i oddziały”) ===== */
.rmc-kontakt-adres {
	width: 100%;
	padding-left: calc(75px + 32px); /* ikona + odstęp w nagłówku karty */
}

.rmc-kontakt-adres .elementor-heading-title {
	color: var(--rmc-tekst);
}

.rmc-kontakt-mapa {
	width: 100%;
	margin-top: 2.5rem;
}

.rmc-kontakt-mapa iframe {
	display: block;
	width: 100%;
	height: 320px;
	border: 0;
	border-radius: 12px;
}

/* Kolejna osoba z tego samego działu stoi obok pierwszej (klient, 2026-10-21) — nazwa działu
   zostaje niewidoczna, żeby imiona w obu kolumnach były na jednej wysokości. */
.rmc-kontakt-naglowek-ukryty {
	visibility: hidden;
}

@media (max-width: 767px) {
	.rmc-kontakt-adres {
		padding-left: 0;
	}
	.rmc-kontakt-mapa iframe {
		height: 240px;
	}
	/* Na telefonie kolumny są jedna pod drugą — pusty nagłówek byłby tylko dziurą. */
	.rmc-kontakt-naglowek-ukryty {
		display: none;
	}
}

/* ===== Adresy: numer budynku i piętro zawsze w jednym wierszu – piętro nie może zostać samo ===== */
.rmc-nowrap {
	white-space: nowrap;
}

/* ===== Usługi: informacja pod listą urządzeń, że oferta nie kończy się na pokazanych modelach ===== */
.rmc-blok p.rmc-oferta-info {
	margin: 40px 0 0;
	padding: 24px 28px;
	border-left: 3px solid #00B6F1;
	border-radius: 0 12px 12px 0;
	background: rgba(0, 182, 241, 0.08);
	color: #013462;
	font-size: 1rem;
	line-height: 1.7;
}
.rmc-blok p.rmc-oferta-info a {
	color: #00B6F1;
	font-weight: 600;
}

/* Tekst z kilkoma akapitami w widgecie Elementora – globalne style zerują marginesy <p>, więc akapity zlewały się w jeden blok. */
.rmc-akapity p + p {
	margin-top: 1em;
}

.rmc-akapity p.rmc-akapity__przycisk {
	margin-top: 2.5rem;
}

/* ===== Kontakt: link /kontakt/?dzial=…#formularz — formularz nie może schować się pod stałym menu ===== */
#formularz {
	scroll-margin-top: 120px;
}

/* Lista przed przyciskiem w tekście sekcji (Nasze materiały → „Surowce z gwarancją jakości”). */
.rmc-akapity ul {
	margin-bottom: 1.75rem;
}

/* ===== Strona główna, hero — przyciski „Sprzedaj / Kup” (klient, 2026-10-21) =====
 * Blok trzyma szerokość kolumny z hasłem (425 px), żeby nie wychodził w lewo na zdjęcie.
 * Przyciski są niższe niż standardowe 72 px, bo w hero stoją dwa jeden pod drugim. */
.elementor-2 .rmc-hero-cta__przyciski,
.elementor-2 .rmc-hero-cta__male {
	width: 100%;
	max-width: 425px;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	align-items: stretch;
}
.elementor-2 .rmc-hero-cta__przyciski {
	gap: 12px !important;
}
.elementor-2 .rmc-hero-cta__przycisk {
	width: 100%;
}
/* Globalny CSS ma .elementor-widget-button.button__primary a.elementor-button z !important (72 px, 79 px boki) */
.elementor-2 .elementor-widget-button.rmc-hero-cta__przycisk a.elementor-button {
	width: 100% !important;
	min-height: 0 !important;
	height: 56px !important;
	padding: 0 24px !important;
	justify-content: flex-start !important;
}
.elementor-2 .rmc-hero-cta__przycisk .elementor-button-content-wrapper {
	justify-content: flex-start;
}
.elementor-2 .rmc-hero-cta__tekst {
	margin: 0 !important;
	padding: 0 !important;
}
.elementor-2 .rmc-hero-cta__tekst p {
	margin: 0;
}
/* „Zleć badanie” i „Dobierz…” jako lista linków */
.elementor-2 .rmc-hero-cta__male {
	gap: 14px !important;
}
.elementor-2 .rmc-hero-cta__male .elementor-widget {
	align-self: flex-start !important;
}
@media (min-width: 1025px) {
	.elementor-2 .elementor-element-c55a313 > .rmc-hero-cta__tekst {
		width: 425px;
	}
	.elementor-2 .elementor-element-c55a313 > .rmc-hero-cta__przyciski {
		margin-top: -8px;
	}
}

/* ===== Kontakt — nagłówek karty oddziału: adres zaraz pod nazwą =====
 * Ikona, nazwa i adres siedzą w jednym zawijanym flexie; odstęp 32 px między wierszami
 * odsuwał adres ~50 px od nazwy. Adres podciągamy pod nazwę (ikona ma 79 px, nazwa 43 px). */
@media (min-width: 768px) {
	.rmc-oddzial-naglowek {
		row-gap: 0 !important;
	}
	.rmc-oddzial-naglowek > .elementor-widget-heading:last-child {
		margin-top: -14px;
	}
}

/* ===== Analiza materiałowa: opinie eksperckie na początku strony (klient, 2026-10-26) ===== */
.rmc-ekspertyzy {
	margin-bottom: 56px; /* stoi tuż pod nagłówkiem sekcji, nad kolumnami */
	padding: 40px;
	border-left: 3px solid #00B6F1;
	border-radius: 0 12px 12px 0;
	background: rgba(0, 182, 241, 0.08);
}

.rmc-ekspertyzy p {
	max-width: 860px;
}

.rmc-ekspertyzy ul {
	columns: 2;
	column-gap: 48px;
	max-width: 860px;
	margin-bottom: 0;
}

.rmc-ekspertyzy li {
	break-inside: avoid;
}

/* „I wiele innych” pod kartami aparatury – lista urządzeń nie jest zamknięta */
.rmc-blok p.rmc-wiele-innych {
	margin: 40px 0 0;
	font-family: "ddt", sans-serif;
	font-weight: 300;
	font-size: 1.5rem;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--rmc-granat);
}

.rmc-blok p.rmc-wiele-innych::after {
	content: "…";
	color: #00B6F1;
}

/* Partner Naukowy: zdjęcie obok opisu */
.rmc-partner {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: 48px;
	align-items: center;
	max-width: 1080px;
	margin-bottom: 56px;
}

.rmc-partner__zdjecie {
	margin: 0;
}

.rmc-partner__zdjecie img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 12px;
}

@media (max-width: 767px) {
	.rmc-ekspertyzy {
		margin-bottom: 40px;
		padding: 28px 24px;
	}
	.rmc-ekspertyzy ul {
		columns: 1;
	}
	.rmc-partner {
		grid-template-columns: 1fr;
		gap: 24px;
	}
	.rmc-partner__zdjecie {
		max-width: 240px;
	}
}

/* Hero: „Dobierz spektrometr lub radiometr” na telefonie łamie się na dwie linie — Elementor
   centruje wtedy tekst przycisku, a link ma stać do lewej jak „Zleć badanie” (klient, 2026-10-26). */
.elementor-2 .rmc-hero-cta__male .elementor-button {
	text-align: left;
}
.elementor-2 .rmc-hero-cta__male .elementor-button-content-wrapper {
	justify-content: flex-start;
}
/* Elementor daje tym linkom line-height 10 px — przy dwóch liniach tekst wchodził na „Odzysk metali”.
   Tylko poniżej desktopu: tam link mieści się w jednej linii, a klient pilnuje układu bloku CTA. */
@media (max-width: 1024px) {
	.elementor-2 .rmc-hero-cta__male .elementor-button,
	.elementor-2 .rmc-hero-cta__male .elementor-button-text {
		line-height: 1.35;
	}
	.elementor-2 .rmc-hero-cta__male {
		margin-bottom: 24px;
	}
}

/* Symbol rodzaju promieniowania (α, β, γ, n, X) — wersaliki zamieniłyby α w „A”, a γ w „Γ”. */
.rmc-karta__typ.rmc-karta__symbol {
	font-size: 1.75rem;
	line-height: 1;
	letter-spacing: 0;
	text-transform: none;
}


/* Klikalne nagłówki (tytuły wpisów w sliderze aktualności, nagłówki usług na głównej) – wyglądają jak dotąd */
.rmc-card__title a,
.rmc-naglowek-link a { color: inherit; text-decoration: none; transition: opacity .2s; }
.rmc-card__title a:hover,
.rmc-naglowek-link a:hover { opacity: .7; }

/* Okruszki w hero podstron (nad małym nagłówkiem i H1) – drobne, w kolorze okruszków wpisów (#964) */
.rmc-okruszki { font-family: ff-utility-web-pro, sans-serif; font-size: .75rem; letter-spacing: .02em; line-height: 1.4; color: #90A1B9; }
.rmc-okruszki a { color: inherit; text-decoration: none; transition: color .2s; }
.rmc-okruszki a:hover { color: #014F7C; }

/* Logo w stopce (#424): plik ma 488 px szerokości, a wysokość 86 px – ramka zostawała szeroka i logo
   rysowało się na jej środku, wcięte względem tekstu pod nim */
.elementor-424 .elementor-element-a3372e6 img { width: auto; object-position: left center; }

/* Przełącznik języka w menu (inc/jezyki.php) – flaga + kod na ciemnym, półprzezroczystym pasku menu */
.rmc-jezyki { position: relative; display: inline-flex; justify-content: flex-end; font-family: ff-utility-web-pro, sans-serif; }
.rmc-jezyki__biezacy {
	display: inline-flex; align-items: center; padding: .5rem .25rem; margin: 0;
	background: transparent !important; border: 0 !important; border-radius: 0; box-shadow: none;
	color: #fff !important; font-size: .8125rem; font-weight: 500; letter-spacing: .08em; line-height: 1; cursor: pointer;
}
.rmc-jezyki__flaga { display: block; width: 20px; height: 14px; object-fit: cover; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255,255,255,.25); }
.rmc-jezyki__lista {
	position: absolute; top: 100%; right: 0; min-width: 9.5rem; margin: .25rem 0 0; padding: .375rem; list-style: none;
	background: #fff; border-radius: 8px; box-shadow: 0 12px 32px rgba(0,18,39,.25);
	opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .15s, transform .15s, visibility 0s .15s;
}
/* most nad szczeliną między przyciskiem a listą, żeby hover nie gasł po drodze */
.rmc-jezyki__lista::before { content: ""; position: absolute; left: 0; right: 0; top: -.5rem; height: .5rem; }
.rmc-jezyki.is-open .rmc-jezyki__lista,
.rmc-jezyki:focus-within .rmc-jezyki__lista { opacity: 1; visibility: visible; transform: none; transition: opacity .15s, transform .15s; }
@media (hover: hover) {
	.rmc-jezyki:hover .rmc-jezyki__lista { opacity: 1; visibility: visible; transform: none; transition: opacity .15s, transform .15s; }
}
.rmc-jezyki__lista a { display: flex; align-items: center; gap: .625rem; padding: .5rem .625rem; border-radius: 6px; color: #002146; font-size: .875rem; text-decoration: none; white-space: nowrap; }
.rmc-jezyki__lista a:hover { background: #EEF4F7; }
.rmc-jezyki__lista .rmc-jezyki__flaga { box-shadow: 0 0 0 1px rgba(0,33,70,.12); }
.rmc-jezyki-widget { justify-self: end; }
.rmc-jezyki-widget .elementor-shortcode { display: flex; justify-content: flex-end; }

/* Hero głównej na telefonie: link w dwóch linijkach („Dobierz spektrometr lub radiometr”) – strzałka
   przy pierwszej linijce, nie w połowie wysokości; tekst bliżej strzałki */
@media (max-width: 1024px) {
	.rmc-hero-linki .elementor-button-content-wrapper { align-items: flex-start; gap: .75rem; }
	.rmc-hero-linki .elementor-button-icon { align-self: flex-start; align-items: flex-start; height: auto; margin-top: .4em; }
}

/* Menu (#14) na tablecie/telefonie: flaga po lewej, logo na środku, hamburger po prawej.
   Kolejność zmieniona tylko wizualnie (order) – na komputerze zostaje logo | menu | flaga.
   Logo: wysokość 40 px + contain zostawiało ramkę obrazka na całą kolumnę – ramka szeroka jak logo. */
.elementor-14 .elementor-element-0f36f9a img { width: auto; }
@media (max-width: 1024px) {
	.elementor-14 .rmc__navbar > .e-con-inner > .rmc-jezyki-widget { order: 1; justify-self: start; }
	.elementor-14 .rmc__navbar > .e-con-inner > .elementor-element-0f36f9a { order: 2; justify-self: center; }
	.elementor-14 .rmc__navbar > .e-con-inner > .elementor-element-df5f278 { order: 3; justify-self: end; }
	/* lista języków otwiera się w prawo – flaga stoi przy lewej krawędzi */
	.rmc-jezyki__lista { right: auto; left: 0; }
}

/* Hero głównej na telefonie: każdy przycisk/link w jednej linii – czcionka zmniejsza się z szerokością
   ekranu, ale nie poniżej 11 px („Dobierz spektrometr lub radiometr” to najdłuższy) */
@media (max-width: 767px) {
	.elementor-2 .elementor-element-748f443 .elementor-button,
	.rmc-hero-linki .elementor-button { white-space: nowrap; }
	.elementor-2 .elementor-element.rmc-hero-linki .elementor-widget-button .elementor-button { font-size: clamp(11px, 3.6vw, 14px); letter-spacing: .02em; }
}

/* Formularze CF7 na telefonie: Dodatkowy CSS daje przyciskowi stały padding 8.1rem po bokach,
   przez co „Wyślij wiadomość” (Kontakt) wychodził poza ekran – tu szerokość kolumny */
@media (max-width: 767px) {
	.wpcf7 .wpcf7-submit { width: 100%; max-width: 100%; padding-left: 1.25rem; padding-right: 1.25rem; }
}

/* Telefon: slidery (karty klas, aktualności, kafelki) celowo wystają za prawą krawędź, ale przez to
   cała strona dawała się przesunąć w bok o kilka–kilkadziesiąt px. clip (nie hidden) nie tworzy
   kontenera przewijania, więc fixed menu i sticky działają jak dotąd, a slidery przewijają się dalej. */
@media (max-width: 1024px) {
	html, body { overflow-x: clip; }
}

/* Spis treści we wpisach: przewinięcie do nagłówka zostawia miejsce na przyklejone menu (80 px + oddech),
   wcześniej nagłówek lądował pod menu */
.snet-post-content .elementor-menu-anchor,
.snet-post-content :is(h2, h3, h4) { scroll-margin-top: 110px; }

/* Linki „Zleć badanie” / „Dobierz spektrometr…” w hero: ta sama zamiana strzałki co w .button__primary
   (strzałka przejeżdża na prawo, tekst na lewo). Tylko komputer z myszką – na tablecie/telefonie
   strzałka jest przyklejona do pierwszej linijki (reguły wyżej) i hover i tak nie istnieje. */
@media (hover: hover) and (min-width: 1025px) {
	.rmc-hero-link .elementor-button-content-wrapper {
		--arrow-w: 4.5px;
		--arrow-gap: 18px;
		--swap-dur: .5s;
		--swap-ease: cubic-bezier(.65, 0, .35, 1);
		position: relative;
		display: inline-flex;
		align-items: center;
		gap: 0;
	}
	.rmc-hero-link .elementor-button-icon {
		position: absolute;
		top: 50%;
		left: 0;
		display: flex;
		width: var(--arrow-w);
		margin: 0;
		transform: translateY(-50%);
		transition: left var(--swap-dur) var(--swap-ease);
	}
	.rmc-hero-link .elementor-button-text {
		display: inline-block;
		padding-left: calc(var(--arrow-w) + var(--arrow-gap));
		transition: transform var(--swap-dur) var(--swap-ease);
	}
	.rmc-hero-link a.elementor-button:hover .elementor-button-icon,
	.rmc-hero-link a.elementor-button:focus-visible .elementor-button-icon { left: calc(100% - var(--arrow-w)); }
	.rmc-hero-link a.elementor-button:hover .elementor-button-text,
	.rmc-hero-link a.elementor-button:focus-visible .elementor-button-text { transform: translateX(calc(-1 * (var(--arrow-w) + var(--arrow-gap)))); }
}
@media (prefers-reduced-motion: reduce) {
	.rmc-hero-link .elementor-button-icon,
	.rmc-hero-link .elementor-button-text { transition: none; }
}
