/* ==========================================================================
   imotigreece-design — Помощни класове
   Скриване, текст, отстояния, съотношения, reveal, плавен скрол.
   Стойности: само var(--ig-...). DESIGN.md §5, §8
   ========================================================================== */

/* --- Достъпност --------------------------------------------------------- */
.ig-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Линк „към съдържанието" — видим само при клавиатурен фокус */
.ig-skip-link {
	position: fixed;
	top: var(--ig-s-2);
	left: var(--ig-s-2);
	z-index: var(--ig-z-modal);
	padding: var(--ig-s-3) var(--ig-s-5);
	font-family: var(--ig-font-body);
	font-size: var(--ig-fs-body-sm);
	font-weight: 600;
	color: var(--ig-text-on-dark);
	background-color: var(--ig-primary);
	border-radius: var(--ig-radius);
	text-decoration: none;
	transform: translateY(-150%);
	transition: transform var(--ig-t-fast) ease;
}

.ig-skip-link:focus {
	color: var(--ig-text-on-dark);
	text-decoration: none;
	transform: translateY(0);
	box-shadow: 0 0 0 3px var(--ig-focus-ring);
}

/* --- Текст -------------------------------------------------------------- */
.ig-text-left { text-align: left; }
.ig-text-center { text-align: center; }
.ig-text-right { text-align: right; }

.ig-text-lead {
	font-size: var(--ig-fs-lead);
	line-height: 1.6;
}

.ig-text-small { font-size: var(--ig-fs-small); }
.ig-text-caption {
	font-size: var(--ig-fs-caption);
	font-weight: 500;
	letter-spacing: 0.01em;
}
.ig-text-meta {
	font-size: var(--ig-fs-meta);
	font-weight: 500;
	font-variant-numeric: tabular-nums;
}

.ig-text-secondary { color: var(--ig-text-secondary); }
.ig-text-muted { color: var(--ig-text-tertiary); }
.ig-text-accent { color: var(--ig-accent-dark); }

/* --- Отстояния (8px скала) ---------------------------------------------- */
.ig-mt-0 { margin-top: 0; }
.ig-mt-1 { margin-top: var(--ig-s-2); }
.ig-mt-2 { margin-top: var(--ig-s-4); }
.ig-mt-3 { margin-top: var(--ig-s-5); }
.ig-mt-4 { margin-top: var(--ig-s-6); }
.ig-mt-5 { margin-top: var(--ig-s-7); }
.ig-mt-6 { margin-top: var(--ig-s-8); }
.ig-mt-7 { margin-top: var(--ig-s-9); }
.ig-mt-8 { margin-top: var(--ig-s-10); }
.ig-mt-9 { margin-top: var(--ig-s-11); }

.ig-mb-0 { margin-bottom: 0; }
.ig-mb-1 { margin-bottom: var(--ig-s-2); }
.ig-mb-2 { margin-bottom: var(--ig-s-4); }
.ig-mb-3 { margin-bottom: var(--ig-s-5); }
.ig-mb-4 { margin-bottom: var(--ig-s-6); }
.ig-mb-5 { margin-bottom: var(--ig-s-7); }
.ig-mb-6 { margin-bottom: var(--ig-s-8); }
.ig-mb-7 { margin-bottom: var(--ig-s-9); }
.ig-mb-8 { margin-bottom: var(--ig-s-10); }
.ig-mb-9 { margin-bottom: var(--ig-s-11); }

/* --- Скриване по устройство --------------------------------------------- */
.ig-hide-mobile { display: none; }

@media (min-width: 768px) {
	.ig-hide-mobile { display: revert; }
}

.ig-hide-desktop { display: revert; }

@media (min-width: 1024px) {
	.ig-hide-desktop { display: none; }
}

/* --- Отрязване на редове ------------------------------------------------ */
.ig-clamp-2,
.ig-clamp-3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.ig-clamp-2 {
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

.ig-clamp-3 {
	-webkit-line-clamp: 3;
	line-clamp: 3;
}

/* --- Съотношения -------------------------------------------------------- */
.ig-ratio {
	display: block;
	position: relative;
	overflow: hidden;
}

.ig-ratio > img,
.ig-ratio > video,
.ig-ratio > iframe {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ig-ratio--4x3 { aspect-ratio: 4 / 3; }
.ig-ratio--3x2 { aspect-ratio: 3 / 2; }
.ig-ratio--16x9 { aspect-ratio: 16 / 9; }

/* --- Reveal при влизане в екрана ---------------------------------------
   Скриването важи само при html.ig-js (слаган от design.js), за да няма
   празна страница при изключен JavaScript. */
.ig-reveal {
	transition: opacity var(--ig-t-slow) ease, transform var(--ig-t-slow) ease;
}

html.ig-js .ig-reveal {
	opacity: 0;
	transform: translateY(16px);
}

html.ig-js .ig-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* --- Плавен скрол ------------------------------------------------------- */
html {
	scroll-behavior: smooth;
	/* Отсядане под лепкавия хедър (височината идва от design.js) */
	scroll-padding-top: calc(var(--ig-header-h, 80px) + 16px);
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	html.ig-js .ig-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}