/* ==========================================================================
   POVEDALI O NÁS  —  Figma node 1:156

   Pás #f4f4f4, nadpis Inter Bold 30/48, podnadpis Inter Regular 18/24,
   pod nimi karusel kariet 320 × 230.4 s radiusom 10px a medzerou 40px.
   Piata karta vo Figme vyčnieva za okraj a je stlmená — naznačuje,
   že karusel pokračuje.
   ========================================================================== */

.pc-reviews {
	/* Figma: nadpis 50px od vrchu sekcie, spodok 3308 → 3371 */
	padding-block: 50px 63px;
	overflow: hidden;
}

.pc-reviews__title {
	font-size: var(--pc-fs-heading);
	font-weight: var(--pc-weight-bold);
	line-height: 48px;
}

.pc-reviews__subtitle {
	font-size: var(--pc-fs-tile);
	line-height: 24px;
}

/* ---- Navigácia -------------------------------------------------------- */
/* Figma: dve malé šípky 24.5px pod podnadpisom, zarovnané vľavo. */

.pc-reviews__nav {
	display: flex;
	align-items: center;
	gap: var(--pc-space-16);
	margin-top: 11px;
}

.pc-reviews__arrow {
	display: grid;
	place-items: center;
	width: 25px;
	height: 25px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
	transition: opacity var(--pc-duration) var(--pc-ease);
}

.pc-reviews__arrow:hover,
.pc-reviews__arrow:focus-visible {
	opacity: 0.6;
}

.pc-reviews__arrow svg {
	width: 100%;
	height: 100%;
}

/* Vo Figme je ľavá šípka zrkadlená z tej istej grafiky. */
.pc-reviews__arrow--prev svg {
	transform: scaleX(-1);
}

/* ---- Karusel ---------------------------------------------------------- */
/*
 * Viewport je zarovnaný na ľavý okraj kontajnera, ale doprava pokračuje
 * za okraj obrazovky — presne ako vo Figme, kde piata karta vyčnieva.
 */
.pc-reviews__viewport {
	margin-top: 27px;
	padding-inline: var(--pc-gutter);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.pc-reviews__viewport::-webkit-scrollbar {
	display: none;
}

.pc-reviews__track {
	display: flex;
	gap: 40px;
	width: max-content;
	max-width: none;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

/*
 * Zarovná prvú kartu na ľavý okraj kontajnera, rovnako ako nadpis.
 *
 * `100vw` počíta so šírkou okna vrátane zvislého posuvníka — na
 * podstránkach, kde je stránka dlhšia, to posunulo pás o šírku
 * posuvníka doľava a prvá karta sa orezala. `100%` počíta so šírkou
 * javiska, takže sedí vždy.
 */
@media (min-width: 1481px) {
	.pc-reviews__track {
		padding-inline-start: max(0px, calc((100% - var(--pc-container)) / 2 - var(--pc-gutter)));
	}
}

.pc-reviews__item {
	flex: 0 0 320px;
	scroll-snap-align: start;
}

.pc-reviews__item img {
	width: 320px;
	height: 230px;
	object-fit: cover;
	border-radius: 10px;
}

/* ==========================================================================
   RESPONZIVITA

   Karusel funguje na každej šírke — mení sa len veľkosť karty
   a odsadenie sekcie.
   ========================================================================== */

@media (max-width: 900px) {
	.pc-reviews {
		padding-block: var(--pc-space-32) var(--pc-space-48);
	}

	.pc-reviews__title {
		line-height: 1.2;
	}

	.pc-reviews__viewport {
		margin-top: var(--pc-space-24);
	}

	.pc-reviews__track {
		gap: var(--pc-space-16);
	}
}

@media (max-width: 420px) {
	.pc-reviews__item {
		flex-basis: 280px;
	}

	.pc-reviews__item img {
		width: 280px;
		height: 202px;
	}
}

/* ==========================================================================
   RECENZIE Z EXTERNEJ SLUŽBY (Trustindex)

   Vlastný karusel sa nepoužije — hodnotenia si vykresľuje a štýluje
   plugin. Tu je len rám: rovnaké odsadenie sekcie a nadpis.
   ========================================================================== */

.pc-reviews--embed .pc-reviews__head {
	padding-inline: 0;
}

.pc-reviews__embed {
	margin-top: var(--pc-space-32);
}

/* Widget býva na plnú šírku svojho obalu — nech nevystúpi z kontajnera. */
.pc-reviews__embed img,
.pc-reviews__embed iframe {
	max-width: 100%;
}

/* Tlačidlo „Napísať recenziu na Google“ pod widgetom (31.10.2026). */
.pc-reviews__write {
	display: flex;
	justify-content: center;
	margin-top: var(--pc-space-32);
}

@media (max-width: 700px) {
	.pc-reviews__write-btn {
		width: 100%;
	}
}