/*
 * Grad Smederevo: strana „Привреда и инвестиције“ (page-templates/privreda.php)
 *
 * Učitava se samo na toj strani (inc/assets.php). Sve vrednosti su tokeni iz tokens.css.
 * Raspored po uzoru na duesseldorf-business.com, izgled iz sistema teme (gradijent, Montserrat, mirne površine).
 *
 *  1. Skok na odeljke („На овој страни“)
 *  2. Naslovi odeljaka, tekst i fotografija uz tekst
 *  3. Zašto Smederevo: brojke i pločice prednosti
 *  4. Industrijske zone
 *  5. Kako pomažemo: kartice sa vezama
 *  6. Podsticaji i javni pozivi, republički portali
 *  7. Kontakt službi i forma „Пошаљите упит“
 */

/* ==========================================================================
   1. Skok na odeljke: svetloplava traka odmah ispod uvoda
   ========================================================================== */

.biz-jump {
	background: var(--smd-blue-50);
	border-bottom: 1px solid var(--color-border);
}

.biz-jump__inner {
	display: grid;
	gap: var(--space-3);
	padding-block: var(--space-5);
}

.biz-jump__title {
	margin: 0;
	font-family: var(--font-display);
	font-size: var(--fs-2xs);
	font-weight: var(--fw-bold);
	letter-spacing: var(--tracking-label);
	text-transform: uppercase;
	color: var(--color-text-muted);
}

.biz-jump__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-1) var(--space-6);
	margin: 0;
	padding: 0;
	list-style: none;
}

.biz-jump__list a {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	min-height: var(--tap);
	font-family: var(--font-display);
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	color: var(--color-link);
	text-decoration: none;
}

.biz-jump__list a:hover span {
	text-decoration: underline;
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.2em;
}

.biz-jump__list .icon {
	flex: none;
	width: 1rem;
	height: 1rem;
	color: var(--smd-blue-500);
}

@container (min-width: 56rem) {
	.biz-jump__inner {
		grid-template-columns: auto minmax(0, 1fr);
		align-items: center;
		gap: var(--space-8);
	}
}

/* Sidra: odeljak ne ulazi ispod gornje ivice prozora */
.biz-band {
	scroll-margin-top: var(--space-4);
}

/* ==========================================================================
   2. Naslovi odeljaka (verzal, kao na naslovnoj) i tekst uz fotografiju
   ========================================================================== */

.biz-title {
	margin: 0 0 var(--space-6);
	font-size: var(--fs-2xl);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
}

.biz .section-head__lead {
	max-width: var(--measure);
}

.biz-lead {
	max-width: var(--measure);
	margin: 0;
	font-size: var(--fs-md);
	line-height: 1.6;
	color: var(--color-text);
}

.biz-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-8);
	align-items: center;
}

.biz-split__text > .biz-title:last-child {
	margin-bottom: 0;
}

.biz-media {
	position: relative;
	margin: 0;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--gradient-brand);
	border-radius: var(--radius-xl);
}

.biz-media__img,
.biz-media picture {
	display: block;
	width: 100%;
	height: 100%;
}

.biz-media__img {
	object-fit: cover;
}

@container (min-width: 56rem) {
	.biz-split {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: clamp(var(--space-10), 5vw, var(--space-16));
	}

	.biz-split--media-first .biz-split__media {
		order: -1;
	}

	.biz-split--text-only {
		grid-template-columns: minmax(0, 1fr);
	}
}

.biz-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	margin-top: var(--space-8);
}

.biz-actions .btn {
	max-width: 100%;
	white-space: normal;
	text-align: left;
}

.biz-more {
	margin-top: var(--space-6);
}

/* ==========================================================================
   3. Zašto Smederevo: brojke sa izvorom i pločice prednosti
   ========================================================================== */

.biz-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
	gap: var(--space-4);
	margin: var(--space-12) 0 0;
}

.biz-fact {
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
	padding: var(--space-6);
	color: var(--color-text-inverse);
	background: var(--gradient-brand);
	border-radius: var(--radius-lg);
}

.biz-fact__number {
	order: -1;
	margin: 0;
	font-family: var(--font-display);
	font-size: var(--fs-3xl);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
}

.biz-fact__label {
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
}

.biz-fact__source {
	margin: var(--space-2) 0 0;
	font-size: var(--fs-2xs);
	color: var(--color-text-inverse-subtle);
}

/* Pločice kao kod Diseldorfa: svetla površina, bez senke i podizanja */
.biz-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); /* 3 + 3 na širokom ekranu */
	gap: var(--space-4);
	margin: var(--space-12) 0 0;
	padding: 0;
	list-style: none;
}

.biz-tile {
	display: grid;
	align-content: start;
	gap: var(--space-3);
	padding: var(--space-6);
	background: var(--color-bg-subtle);
	border-radius: var(--radius-lg);
}

.section--subtle .biz-tile {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
}

.biz-tile .icon-tile {
	margin-bottom: var(--space-2);
}

.biz-tile__title,
.biz-card__title,
.biz-zone__title {
	margin: 0;
	font-size: var(--fs-lg);
	line-height: 1.25;
}

.biz-tile__text,
.biz-card__text,
.biz-zone__text {
	margin: 0;
	font-size: var(--fs-sm);
	line-height: 1.6;
	color: var(--color-text-muted);
}

/* ==========================================================================
   4. Industrijske zone: kartice sa podacima (samo upisani) i vezama
   ========================================================================== */

.biz-zones {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
	gap: var(--space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.biz-zone {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-xs);
}

.biz-zone__media {
	aspect-ratio: 16 / 9;
	background: var(--gradient-brand);
}

.biz-zone__media .biz-media__img {
	width: 100%;
	height: 100%;
}

.biz-zone__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-6);
}

.biz-zone__body .icon-tile {
	margin-bottom: var(--space-1);
}

.biz-zone__facts {
	display: grid;
	gap: var(--space-2);
	margin: var(--space-1) 0 0;
	padding-top: var(--space-3);
	font-size: var(--fs-xs);
	border-top: 1px solid var(--color-border);
}

.biz-zone__facts div {
	display: grid;
	grid-template-columns: minmax(6.5rem, auto) minmax(0, 1fr);
	gap: var(--space-3);
}

.biz-zone__facts dt {
	font-weight: var(--fw-semibold);
	color: var(--color-text-strong);
}

.biz-zone__facts dd {
	margin: 0;
	white-space: pre-line;
	color: var(--color-text);
}

.biz-zone__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--space-6);
	margin-top: auto;
	padding-top: var(--space-2);
}

/* ==========================================================================
   5. Kako pomažemo: kartice po vrsti posetioca, veze ispod linije
   ========================================================================== */

.biz-support {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
	gap: var(--space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.biz-card {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	padding: var(--space-6);
	background: var(--color-bg-subtle);
	border-radius: var(--radius-lg);
}

.section--subtle .biz-card {
	background: var(--color-surface);
	border: 1px solid var(--color-border);
}

.biz-card .icon-tile {
	margin-bottom: var(--space-2);
}

.biz-links {
	display: grid;
	margin: auto 0 0;
	padding: var(--space-3) 0 0;
	list-style: none;
	border-top: 1px solid var(--color-border);
}

.biz-links li + li {
	border-top: 1px solid var(--color-border);
}

.biz-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-3);
	min-height: var(--tap);
	padding-block: var(--space-2);
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	line-height: var(--lh-ui);
	color: var(--color-link);
	text-decoration: none;
}

.biz-link > span:first-child {
	min-width: 0;
	overflow-wrap: anywhere;
}

.biz-link:hover > span:first-child {
	text-decoration: underline;
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.2em;
}

.biz-link .icon {
	flex: none;
	width: 1rem;
	height: 1rem;
	color: var(--smd-blue-600);
	transition: transform var(--dur) var(--ease-out);
}

.biz-link:hover .icon--arrow-right,
.biz-link:hover .icon:not(.icon--external) {
	transform: translateX(3px);
}

.biz-zone__links .biz-link {
	display: inline-flex;
	justify-content: flex-start;
	font-family: var(--font-display);
	letter-spacing: var(--tracking-caps);
	text-transform: uppercase;
}

/* ==========================================================================
   6. Podsticaji: pozivi levo, republički portali desno
   ========================================================================== */

.biz-incentives {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-12);
}

.biz-subtitle {
	margin: 0 0 var(--space-4);
	font-size: var(--fs-md);
	font-weight: var(--fw-bold);
	color: var(--color-text-strong);
}

@container (min-width: 60rem) {
	.biz-incentives {
		grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
		gap: clamp(var(--space-10), 5vw, var(--space-16));
		align-items: start;
	}

	.biz-incentives--single {
		grid-template-columns: minmax(0, 1fr);
	}
}

.biz-calls {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--color-border);
}

.biz-call {
	display: grid;
	gap: var(--space-1);
	padding-block: var(--space-4);
	border-bottom: 1px solid var(--color-border);
}

.biz-call__title {
	margin: 0;
	font-size: var(--fs-base);
	font-weight: var(--fw-semibold);
	line-height: 1.4;
}

.biz-call__title a {
	color: var(--color-heading);
	text-decoration: none;
}

.biz-call__title a:hover {
	text-decoration: underline;
	text-decoration-thickness: 0.07em;
	text-underline-offset: 0.18em;
}

.biz-call__meta {
	margin: 0;
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

.biz-portals {
	display: grid;
	gap: var(--space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.biz-portal {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--space-1) var(--space-4);
	align-items: center;
	padding: var(--space-4) var(--space-5);
	color: var(--color-text);
	text-decoration: none;
	background: var(--color-surface);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	transition: border-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}

.biz-portal:hover {
	border-color: var(--smd-blue-300);
	box-shadow: var(--shadow-sm);
}

.biz-portal__name {
	grid-column: 1;
	font-family: var(--font-display);
	font-size: var(--fs-sm);
	font-weight: var(--fw-bold);
	color: var(--color-heading);
}

.biz-portal:hover .biz-portal__name {
	text-decoration: underline;
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.2em;
}

.biz-portal__text {
	grid-column: 1;
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

.biz-portal__host {
	grid-column: 1;
	font-size: var(--fs-2xs);
	color: var(--color-text-subtle);
}

.biz-portal__icon {
	grid-column: 2;
	grid-row: 1 / span 3;
	width: 1.125rem;
	height: 1.125rem;
	color: var(--smd-blue-600);
}

/* ==========================================================================
   7. Kontakt službi i forma „Пошаљите упит“
   ========================================================================== */

.biz-people {
	margin-bottom: var(--space-6);
}

.biz-contacts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 28rem), 1fr));
	gap: var(--space-4);
}

.biz-contacts .contact-block {
	max-width: none;
}

/* Forma upita: komponenta „Forma sa uvodom“ (main.css, 6.2: .form-section, .form-card). */

@media (forced-colors: active) {
	.biz-tile,
	.biz-card,
	.biz-fact {
		border: 1px solid CanvasText;
	}
}