/* -------------------------------------------------------------
   Placeholders: CSS-only raštų fonai + numatytųjų vaizdų pagalbinės klasės
   Priklauso nuo main.css kintamųjų (--stone-*, --granite-*).
   ------------------------------------------------------------- */

/* Placeholder <img>, kurį grąžina at_image_or_placeholder() */
.at-ph-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Bazinis raštuotas blokas */
.ph {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 180px;
	background-color: var(--stone-100, #F2F1ED);
	background-repeat: repeat;
	background-position: center;
	overflow: hidden;
}

/* Švelnus šviesos pliūpsnis centre, kad neatrodytų plokščiai */
.ph::before {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at 50% 42%, rgba(255, 255, 255, .75) 0%, rgba(255, 255, 255, 0) 68%);
	pointer-events: none;
}

/* Raštų variantai */
.ph--stone {
	background-image: url("../img/patterns/stone-hex.svg");
	background-size: 120px 104px;
}

.ph--paving {
	background-image: url("../img/patterns/paving.svg");
	background-size: 120px 120px;
}

.ph--gravel {
	background-image: url("../img/patterns/gravel.svg");
	background-size: 80px 80px;
}

.ph--path {
	background-image: url("../img/patterns/path.svg");
	background-size: 160px 80px;
}

.ph--topo {
	background-image: url("../img/patterns/topo.svg");
	background-size: 200px 200px;
}

/* Proporcijos */
.ph--4-3   { aspect-ratio: 4 / 3; }
.ph--1-1   { aspect-ratio: 1 / 1; }
.ph--16-9  { aspect-ratio: 16 / 9; }
.ph--wide  { aspect-ratio: 16 / 5; }

/* Tamsi versija (hero / CTA juostoms) */
.ph--dark {
	background-color: var(--granite-900, #1C2126);
}

.ph--dark::before {
	background: radial-gradient(ellipse at 50% 40%, rgba(154, 163, 170, .22) 0%, rgba(28, 33, 38, 0) 70%);
}

.ph--dark .ph__label {
	color: var(--granite-300, #9AA3AA);
	border-color: rgba(154, 163, 170, .35);
}

/* Neutralus užrašas */
.ph__label {
	position: relative;
	z-index: 1;
	display: inline-block;
	padding: 8px 16px;
	border: 1px solid var(--stone-300, #CFCCC4);
	border-radius: 2px;
	background: rgba(255, 255, 255, .55);
	font-family: var(--font-display, inherit);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--granite-500, #5C666E);
}

/* Kai užrašo nereikia, bet norisi išlaikyti aukštį */
.ph--empty .ph__label {
	display: none;
}

@media (prefers-reduced-motion: no-preference) {
	.ph { transition: background-color .2s ease; }
}