/*
 * Teak Deck — stilovi patterna.
 * Geometrija i tipografija po dizajn/PATTERNS.md. Nijedna boja ni razmak
 * nisu upisani rukom; sve dolazi iz theme.json kao custom property.
 */

/* Zajednicko ------------------------------------------------------------- */

.td-section {
	padding-block: var(--wp--preset--spacing--section-y);
	padding-inline: var(--wp--preset--spacing--gutter);
}

.td-section--sm { padding-block: var(--wp--preset--spacing--section-y-sm); }
.td-section--lg { padding-block: var(--wp--preset--spacing--section-y-lg); }
.td-section--xl { padding-block: var(--wp--preset--spacing--section-y-xl); }

.td-surface { background: var(--wp--preset--color--surface); }
.td-ink { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--base); }
.td-ink :where(p, li) { color: var(--wp--custom--on-dark--body); }

.td-eyebrow-sub {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--eyebrow-sub);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	/* text-muted, ne muted-4: ovaj natpis stoji i na surface-cool (#F6F7F8),
	   gdje #767676 daje samo 4.23:1. */
	color: var(--wp--preset--color--text-muted);
	margin: 0;
}

/* Intrinzicne mreze — auto-fit, ne media queryji. Zato rade i na 375 px. */
.td-grid { display: grid; }

/* WP svakom sljedecem djetetu grupe dodaje margin-block-start iz blockGapa.
   U gridu to pomakne drugi stupac nize za vrijednost razmaka. */
.td-grid > *,
.td-short-answer > *,
.td-lead-magnet > *,
.td-form > * {
	margin-block-start: 0;
}
.td-grid--split       { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--split), 1fr)); gap: var(--wp--preset--spacing--gap-cols-wide); }
.td-grid--text        { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--text-col), 1fr)); gap: var(--wp--preset--spacing--gap-cols); }
.td-grid--cards       { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--project-card), 1fr)); gap: var(--wp--preset--spacing--gap-cards); }
.td-grid--route       { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--route-card), 1fr)); gap: clamp(20px, 3vw, 48px); }
.td-grid--plate       { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--plate), 1fr)); gap: 0; }
.td-grid--trust       { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--trust), 1fr)); }
.td-grid--contact-col { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--contact-col), 1fr)); gap: var(--wp--preset--spacing--gap-cols); }

/* Heroji ----------------------------------------------------------------- */

.td-hero {
	position: relative;
	min-height: min(100svh, 100vh);
	background: var(--wp--preset--color--ink);
	display: flex;
	align-items: flex-end;
	isolation: isolate;
}

@supports not (min-height: 100svh) { .td-hero { min-height: 100vh; } }

.td-hero { min-height: max(560px, 100svh); }

.td-hero__media,
.td-hero__media img,
.td-hero__media video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	margin: 0;
	z-index: -2;
}

.td-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--custom--scrim--hero);
	z-index: -1;
}

.td-hero__inner {
	width: 100%;
	padding-inline: var(--wp--preset--spacing--gutter);
	padding-block-end: clamp(24px, 4vw, 64px);
}

.td-hero h1 {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--h-1-hero);
	letter-spacing: var(--wp--custom--tracking--display);
	margin: 0;
}

.td-hero__row {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: var(--wp--preset--spacing--gap-cols);
	flex-wrap: wrap;
	margin-block-start: var(--wp--preset--spacing--stack-sm);
}

.td-hero__row p {
	max-width: var(--wp--custom--measure--hero-paragraph);
	color: var(--wp--custom--on-dark--body);
	margin: 0;
}

/* Dva CTA-a u istom odlomku inace sjednu jedan na drugi. */
.td-hero__row > :last-child {
	display: flex;
	align-items: center;
	gap: clamp(16px, 2vw, 32px);
	flex-wrap: wrap;
	max-width: none;
}

/* Sekundarni CTA na tamnoj podlozi — akcent tu ne bi prosao kontrast. */
.td-cta-secondary {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	color: var(--wp--preset--color--base);
	text-decoration: none;
	border-block-end: 1px solid var(--wp--custom--on-dark--line);
	padding-block-end: 4px;
}

/* pillar-hero — bez fotografije */
.td-pillar-hero {
	padding-block-start: clamp(34px, 6vw, 110px);
	padding-block-end: var(--wp--preset--spacing--stack-md);
	padding-inline: var(--wp--preset--spacing--gutter);
	border-block-end: 1px solid var(--wp--preset--color--line);
	align-items: end;
}

.td-pillar-hero h1 {
	font-size: var(--wp--preset--font-size--h-1-page);
	letter-spacing: var(--wp--custom--tracking--display);
	max-width: 13ch;
	margin: 0;
}

.td-pillar-hero__meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	line-height: 2.2;
	color: var(--wp--preset--color--text-muted-4);
	text-transform: uppercase;
	margin: 0;
}

.td-pillar-hero--dark {
	background: var(--wp--preset--color--ink);
	border-block-end: 0;
}

.td-pillar-hero--dark h1 {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--h-1-page-dark);
}

.td-pillar-hero--dark .td-pillar-hero__subhead {
	max-width: var(--wp--custom--measure--hero-paragraph);
	color: var(--wp--custom--on-dark--secondary);
	margin: 0;
}

/* compare-hero-centered */
.td-compare-hero {
	text-align: center;
	padding-block: clamp(34px, 6vw, 110px) var(--wp--preset--spacing--stack-md);
	padding-inline: var(--wp--preset--spacing--gutter);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.td-compare-hero h1 {
	font-size: var(--wp--preset--font-size--h-1-centered);
	letter-spacing: var(--wp--custom--tracking--display);
	max-width: 16ch;
	margin-inline: auto;
}

.td-compare-hero p {
	max-width: var(--wp--custom--measure--centered-intro);
	margin-inline: auto;
	font-size: var(--wp--preset--font-size--lead);
	color: var(--wp--preset--color--text-lead);
}

/* contact-direct */
.td-contact-direct {
	padding-block: clamp(34px, 6vw, 110px) var(--wp--preset--spacing--stack-md);
	padding-inline: var(--wp--preset--spacing--gutter);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.td-contact-direct h1 {
	font-size: var(--wp--preset--font-size--h-1-page);
	letter-spacing: var(--wp--custom--tracking--display);
	margin: 0 0 var(--wp--preset--spacing--stack-md);
}

.td-contact-direct .td-phone {
	font-size: clamp(19px, 2vw, 28px);
	font-weight: 200;
	color: inherit;
	text-decoration: none;
	display: inline-block;
}

.td-contact-direct .td-street {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-muted);
	margin: 6px 0 0;
}

/* Sadrzaj ---------------------------------------------------------------- */

.td-statement-split { align-items: center; }

.td-statement-split h2 {
	font-size: var(--wp--preset--font-size--h-2-xl);
	letter-spacing: var(--wp--custom--tracking--h-2);
	margin: 0;
}

.td-statement-split p {
	font-size: var(--wp--preset--font-size--lead-wide);
	color: var(--wp--preset--color--text-lead);
	margin: 0;
}

.td-image-band,
.td-image-band img {
	display: block;
	width: 100%;
	height: clamp(340px, 52vw, 700px);
	object-fit: cover;
	margin: 0;
}

/* article-section */
.td-article-section {
	border-block-start: 1px solid var(--wp--preset--color--line);
	padding-block-start: var(--wp--preset--spacing--stack-sm);
	margin-block-start: var(--wp--preset--spacing--stack-md);
}

.td-article-section__num {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	color: var(--wp--preset--color--accent);
	margin: 0 0 10px;
}

.td-article-section h2 {
	font-size: var(--wp--preset--font-size--h-2-s);
	letter-spacing: var(--wp--custom--tracking--h-2);
	margin: 0;
}

.td-article-section__body { max-width: var(--wp--custom--measure--body-column); }
.td-article-section__plate { margin-block-start: 26px; aspect-ratio: 16 / 9; }
.td-article-section__plate img { width: 100%; height: 100%; object-fit: cover; }

/* toc-numbered */
.td-toc { background: var(--wp--preset--color--surface); }

.td-toc__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--text-col), 1fr));
	gap: 0 clamp(24px, 5vw, 90px);
	margin: var(--wp--preset--spacing--stack-sm) 0 0;
	padding: 0;
	list-style: none;
	counter-reset: td-toc;
}

.td-toc__list li {
	counter-increment: td-toc;
	border-block-start: 1px solid var(--wp--preset--color--line-surface);
	padding: 16px 0;
}

.td-toc__list li a { text-decoration: none; color: inherit; }

.td-toc__list li a::before {
	content: counter(td-toc, decimal-leading-zero);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	color: var(--wp--preset--color--accent);
	margin-inline-end: 14px;
}

/* checklist-numbered */
.td-checklist {
	list-style: none;
	counter-reset: td-check;
	margin: var(--wp--preset--spacing--stack-sm) 0 0;
	padding: 0;
}

.td-checklist li {
	counter-increment: td-check;
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	gap: 14px;
	align-items: baseline;
	padding: 17px 0;
	border-block-start: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--list);
	line-height: 1.6;
}

.td-surface .td-checklist li,
.td-toc .td-checklist li { border-block-start-color: var(--wp--preset--color--line-surface); }

.td-checklist li::before {
	content: counter(td-check, decimal-leading-zero);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 11px;
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	color: var(--wp--preset--color--accent);
}

/* service-rows — svaki red je jedan <a> */
.td-service-rows { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--stack-lg); margin-block-start: var(--wp--preset--spacing--stack-md); }

.td-service-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
	gap: var(--wp--preset--spacing--gap-cols);
	align-items: baseline;
	border-block-start: 1px solid var(--wp--preset--color--line-surface);
	padding-block-start: clamp(18px, 2.4vw, 32px);
	text-decoration: none;
	color: inherit;
}

.td-service-row h2,
.td-service-row h3 {
	font-size: var(--wp--preset--font-size--h-3-row);
	letter-spacing: var(--wp--custom--tracking--h-3);
	margin: 0;
}

.td-service-row__action {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	margin: 14px 0 0;
}

.td-service-row:hover h2,
.td-service-row:hover h3 { color: var(--wp--preset--color--accent); }

/* route-cards */
.td-route-card {
	border-block-start: 2px solid var(--wp--preset--color--accent);
	padding-block-start: 18px;
}

.td-route-card h3 {
	font-size: clamp(20px, 2.2vw, 32px);
	letter-spacing: var(--wp--custom--tracking--h-3);
	margin: 0 0 12px;
}

/* faq-rows — ravni redci, ne akordeon (README, Open decisions 4: dizajn je
   ravan, i dalje daje ispravnu FAQPage shemu). */
.td-faq { margin-block-start: var(--wp--preset--spacing--stack-md); }

.td-faq__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--text-col), 1fr));
	gap: var(--wp--preset--spacing--gap-cols);
	border-block-start: 1px solid var(--wp--preset--color--line);
	padding-block: clamp(20px, 2.6vw, 36px);
}

.td-faq__row > * { margin-block-start: 0; }

.td-faq__q {
	font-size: var(--wp--preset--font-size--h-3-faq);
	letter-spacing: var(--wp--custom--tracking--h-3);
	max-width: 20ch;
	margin: 0;
}

.td-faq__a { max-width: var(--wp--custom--measure--body-column); }
.td-faq__a p { margin: 0 0 14px; }

.td-faq__link {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}

/* Spec ------------------------------------------------------------------- */

.td-spec-table { width: 100%; border-collapse: collapse; }

.td-spec-table th,
.td-spec-table td {
	text-align: start;
	padding: 15px 0;
	border-block-start: 1px solid var(--wp--preset--color--line);
	vertical-align: baseline;
}

.td-spec-table th {
	font-weight: 300;
	font-size: var(--wp--preset--font-size--body);
	color: var(--wp--preset--color--text-body);
}

.td-spec-table td {
	font-family: var(--wp--preset--font-family--mono);
	font-variant-numeric: tabular-nums;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--ink);
	text-align: end;
}

/* process-4-step */
.td-process { counter-reset: td-step; margin-block-start: var(--wp--preset--spacing--stack-sm); }

.td-process__step {
	counter-increment: td-step;
	border-block-start: 1px solid var(--wp--preset--color--line);
	padding-block: 20px;
}

.td-process__head { display: flex; align-items: baseline; gap: 12px; }

.td-process__head::before {
	content: counter(td-step, decimal-leading-zero);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 10px;
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	color: var(--wp--preset--color--accent);
}

.td-process__step h3 {
	font-size: var(--wp--preset--font-size--h-3-step);
	font-weight: 300;
	letter-spacing: var(--wp--custom--tracking--step);
	margin: 0;
}

.td-process__step p {
	margin: 10px 0 0 24px;
	font-size: var(--wp--preset--font-size--body-fixed);
	max-width: var(--wp--custom--measure--body-column);
}

/* sticky-image-spec */
.td-sticky-spec { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--split), 1fr)); }

.td-sticky-spec__media {
	background: var(--wp--preset--color--ink);
	position: relative;
}

.td-sticky-spec__media figure {
	position: sticky;
	inset-block-start: 0;
	height: 100vh;
	overflow: hidden;
	margin: 0;
}

.td-sticky-spec__media img { width: 100%; height: 100%; object-fit: cover; }

.td-sticky-spec__caption {
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: 0;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--caption);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	padding: 12px 16px;
	margin: 0;
}

.td-sticky-spec__body {
	padding: var(--wp--preset--spacing--section-y) var(--wp--preset--spacing--gutter-inset);
}

/* Kad se stupci slozu, slika prestaje biti sticky i postaje 16/9 traka. */
@media (max-width: 800px) {
	.td-sticky-spec__media figure { position: static; height: auto; aspect-ratio: 16 / 9; }
}

/* compare-table — obje vrijednosne kolone moraju izgledati identicno */
.td-compare-table { margin-block-start: var(--wp--preset--spacing--stack-md); }

.td-compare-table__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	align-items: baseline;
	gap: var(--wp--preset--spacing--gap-cols);
	padding: 20px 0;
	border-block-start: 1px solid var(--wp--preset--color--line);
}

.td-compare-table__criterion {
	font-size: clamp(17px, 1.6vw, 24px);
	font-weight: 200;
	margin: 0;
}

.td-compare-table__value {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 13.5px;
	color: var(--wp--preset--color--text-body);
	margin: 0;
}

/* Dokaz ------------------------------------------------------------------ */

.td-project-card { text-decoration: none; color: inherit; display: block; }
.td-project-card figure { margin: 0; aspect-ratio: 4 / 5; }
.td-project-card img { width: 100%; height: 100%; object-fit: cover; display: block; }

.td-project-card__name {
	display: inline-block;
	font-size: 17px;
	border-block-end: 1px solid var(--wp--preset--color--accent);
	padding-block-end: 5px;
	margin: 16px 0 0;
}

.td-project-card__scope {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-muted-3);
	margin: 8px 0 0;
}

/* plate-grid — plocice se dodiruju */
.td-plate { position: relative; margin: 0; aspect-ratio: 1 / 1; }
.td-plate img { width: 100%; height: 100%; object-fit: cover; display: block; }

.td-plate__label {
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: 0;
	background: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 9px;
	letter-spacing: var(--wp--custom--tracking--caption);
	text-transform: uppercase;
	padding: 9px 12px;
	margin: 0;
}

/* trust-split */
.td-trust-split {
	background: var(--wp--preset--color--surface);
	min-height: clamp(340px, 44vw, 600px);
}

.td-trust-split__media { min-height: clamp(260px, 32vw, 600px); }
.td-trust-split__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.td-trust-split__body {
	padding: var(--wp--preset--spacing--gutter-inset);
	align-self: center;
}

.td-trust-block {
	border-block-start: 1px solid var(--wp--preset--color--line-surface);
	padding-block: 16px;
}

.td-trust-block h3 {
	font-size: var(--wp--preset--font-size--h-3-card);
	letter-spacing: var(--wp--custom--tracking--h-3);
	margin: 0 0 8px;
}

/* certificate-strip */
.td-certs {
	display: flex;
	align-items: center;
	gap: clamp(16px, 2.5vw, 34px);
	flex-wrap: wrap;
}

.td-certs img { width: auto; object-fit: contain; display: block; }
.td-certs .td-cert-sgs img { height: 52px; }
.td-certs .td-cert-fsc img { height: 60px; }

.td-certs__caption {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--caption);
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted-2);
	margin: 0;
}

/* diagnostic-duel — dvije strane iste geometrije */
.td-duel { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--split), 1fr)); gap: 0; }

.td-duel__side { background: var(--wp--preset--color--base); }
.td-duel__side--dark { background: var(--wp--preset--color--ink-panel); color: var(--wp--preset--color--base); }

.td-duel__media { margin: 0; aspect-ratio: 16 / 9; }
.td-duel__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.td-duel__body { padding: clamp(24px, 3.5vw, 56px) var(--wp--preset--spacing--gutter); }

.td-duel__side--dark .td-eyebrow { color: var(--wp--preset--color--accent-on-dark); }

.td-duel h2 {
	font-size: var(--wp--preset--font-size--h-2-s);
	letter-spacing: var(--wp--custom--tracking--h-2);
	max-width: 16ch;
	margin: 12px 0 0;
}

.td-duel ol {
	list-style: none;
	counter-reset: td-duel;
	margin: var(--wp--preset--spacing--stack-sm) 0 0;
	padding: 0;
}

.td-duel ol li {
	counter-increment: td-duel;
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	gap: 14px;
	align-items: baseline;
	padding: 18px 0;
	border-block-start: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--list);
	line-height: 1.6;
}

.td-duel__side--dark ol li { border-block-start-color: var(--wp--custom--on-dark--line); }

.td-duel ol li::before {
	content: counter(td-duel, decimal-leading-zero);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 11px;
	color: var(--wp--preset--color--accent);
}

.td-duel__side--dark ol li::before { color: var(--wp--preset--color--accent-on-dark); }

/* Kad postoji fotografija stanja, brojcani stupac postaje 96 px 4/3 thumb. */
.td-duel ol li.has-thumb { grid-template-columns: 96px minmax(0, 1fr); }
.td-duel ol li.has-thumb::before { content: none; }
.td-duel ol li.has-thumb img { width: 96px; aspect-ratio: 4 / 3; object-fit: cover; display: block; }

/* compare-duel-columns — nijedna strana ne smije dobiti tezinu */
.td-compare-duel { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--split), 1fr)); gap: 0; }
.td-compare-duel__side { padding: clamp(20px, 2.6vw, 36px) clamp(18px, 3vw, 44px); }
.td-compare-duel__side + .td-compare-duel__side { border-inline-start: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--surface-cool); }
.td-compare-duel__side + .td-compare-duel__side .td-eyebrow { color: var(--wp--preset--color--neutral-cool); }
.td-compare-duel__media { margin: 0 0 18px; aspect-ratio: 16 / 10; }
.td-compare-duel__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.td-compare-duel ul { list-style: none; margin: var(--wp--preset--spacing--stack-sm) 0 0; padding: 0; }
.td-compare-duel ul li {
	border-block-start: 1px solid var(--wp--preset--color--line);
	padding: 16px 0;
	font-size: var(--wp--preset--font-size--list);
	line-height: 1.6;
}

/* compare-short-answer-band */
.td-short-answer {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--base);
	padding-block: var(--wp--preset--spacing--section-y-sm);
	padding-inline: var(--wp--preset--spacing--gutter);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--text-col), 1fr));
	gap: clamp(24px, 5vw, 90px);
}

.td-short-answer h2 {
	font-size: var(--wp--preset--font-size--h-2-l);
	letter-spacing: var(--wp--custom--tracking--h-2);
	color: var(--wp--preset--color--base);
	margin: 0;
}

.td-short-answer p { color: var(--wp--custom--on-dark--body); margin: 0; }

/* Konverzija ------------------------------------------------------------- */

.td-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: clamp(20px, 2.4vw, 32px); }
.td-form--single { max-width: var(--wp--custom--measure--field-column); grid-template-columns: 1fr; }
.td-form__full { grid-column: 1 / -1; }

.td-field label {
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 9.5px;
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted-4);
	margin-block-end: 6px;
}

.td-field input,
.td-field textarea,
.td-field select {
	width: 100%;
	border: 0;
	border-block-end: 1px solid var(--wp--preset--color--line-input);
	border-radius: 0;
	background: transparent;
	font-family: inherit;
	font-size: 16px;
	padding: 12px 0;
	color: inherit;
}

.td-field textarea { resize: vertical; }

.td-field input:invalid:not(:placeholder-shown),
.td-field textarea:invalid:not(:placeholder-shown) { border-block-end-color: var(--wp--preset--color--error); }

.td-field__error { color: var(--wp--preset--color--error); font-size: var(--wp--preset--font-size--small); margin: 6px 0 0; }

.td-roles { display: flex; flex-wrap: wrap; gap: 10px; }

.td-roles label {
	border: 1px solid var(--wp--preset--color--line-chip);
	padding: 10px 16px;
	font-size: 14px;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--sans);
	letter-spacing: normal;
	text-transform: none;
	color: inherit;
	margin: 0;
}

.td-roles input { position: absolute; opacity: 0; width: 0; height: 0; }
.td-roles input:checked + span,
.td-roles label:has(input:checked) { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }
.td-roles label:has(input:focus-visible) { outline: 2px solid var(--wp--preset--color--accent); outline-offset: 3px; }

.td-dropzone {
	border: 1px dashed var(--wp--preset--color--line-input);
	padding: 26px;
	text-align: center;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--text-muted-4);
}

.td-submit {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	border: 0;
	border-radius: 0;
	padding: 19px 40px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--wp--custom--motion--duration) var(--wp--custom--motion--easing);
}

.td-submit:hover { background: var(--wp--preset--color--accent-hover); }
.td-submit[disabled] { opacity: .5; cursor: not-allowed; }

/* CTA */
.td-cta {
	display: inline-block;
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--base);
	text-decoration: none;
	padding: 17px 30px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	transition: background var(--wp--custom--motion--duration) var(--wp--custom--motion--easing);
}

.td-cta:hover { background: var(--wp--preset--color--accent-hover); color: var(--wp--preset--color--base); }

.td-cta-band-photo {
	position: relative;
	min-height: clamp(340px, 44vw, 600px);
	display: grid;
	place-items: center;
	text-align: center;
	padding-inline: var(--wp--preset--spacing--gutter);
	isolation: isolate;
}

.td-cta-band-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; margin: 0; }

.td-cta-band-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--custom--scrim--cta-flat), var(--wp--custom--scrim--cta-radial);
	z-index: -1;
}

.td-cta-band-photo h2 {
	color: var(--wp--preset--color--base);
	font-size: var(--wp--preset--font-size--h-2-m);
	letter-spacing: var(--wp--custom--tracking--h-2);
	max-width: 18ch;
	margin: 0 auto var(--wp--preset--spacing--stack-sm);
}

.td-cta-band-flat {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--wp--preset--spacing--gap-cols);
	flex-wrap: wrap;
}

.td-cta-band-flat h2 {
	font-size: var(--wp--preset--font-size--h-2-m);
	letter-spacing: var(--wp--custom--tracking--h-2);
	max-width: 18ch;
	margin: 0;
}

.td-cta-band-flat.td-ink h2 { color: var(--wp--preset--color--base); }

/* lead-magnet-panel — specimen, ne brosura */
.td-lead-magnet {
	border: 1px solid var(--wp--preset--color--ink);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: clamp(20px, 3vw, 44px);
	padding: clamp(20px, 2.6vw, 36px);
	align-items: start;
}

.td-lead-magnet__specimen { margin: 0; aspect-ratio: 1 / 1.414; }
.td-lead-magnet__specimen img { width: 100%; height: 100%; object-fit: cover; display: block; border: 1px solid var(--wp--preset--color--line); }

.td-lead-magnet h2 { font-size: var(--wp--preset--font-size--h-2-s); letter-spacing: var(--wp--custom--tracking--h-2); margin: 10px 0 12px; }

/* map-pair */
.td-map-pair { grid-template-columns: repeat(auto-fit, minmax(var(--wp--custom--grid-min--split), 1fr)); gap: var(--wp--preset--spacing--gap-cards); }

.td-map {
	position: relative;
	/* max-width je nuzan: aspect-ratio + min-height inace izvedu sirinu
	   od 427 px i probiju viewport na 375. */
	width: 100%;
	max-width: 100%;
	aspect-ratio: 16 / 9;
	min-height: 240px;
	background: repeating-linear-gradient(45deg, var(--wp--preset--color--surface) 0 10px, var(--wp--preset--color--surface-cool-2) 10px 20px);
}

.td-map__card {
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: 0;
	background: var(--wp--preset--color--base);
	padding: 14px 18px;
}

.td-map__label {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--cta);
	letter-spacing: var(--wp--custom--tracking--eyebrow-sub);
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	margin: 0 0 4px;
}

.td-map__street { font-size: var(--wp--preset--font-size--small); margin: 0; }

/* tbc-chip */
.td-tbc {
	display: inline-block;
	border: 1px dashed var(--wp--preset--color--line-tbc);
	padding: 8px 11px;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--caption);
	letter-spacing: var(--wp--custom--tracking--caption);
	text-transform: uppercase;
	color: var(--wp--preset--color--text-muted);
}

@media (prefers-reduced-motion: reduce) {
	.td-cta, .td-submit { transition: none; }
}