@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("/fonts/manrope-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
		U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212,
		U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("/fonts/manrope-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
		U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
		U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
	--font-sans: "Manrope", "Segoe UI", Arial, sans-serif;
	--font-display: "Manrope", "Segoe UI", Arial, sans-serif;
	--ink: #20231f;
	--ink-soft: #4f554e;
	--forest: #1f332b;
	--forest-deep: #14231d;
	--cream: #f6f1e8;
	--paper: #fffdf9;
	--copper: #b9784c;
	--copper-light: #d7a37e;
	--line: rgba(31, 51, 43, 0.16);
	--white: #ffffff;
	--radius-sm: 0.45rem;
	--radius-md: 1rem;
	--radius-lg: 1.7rem;
	--container: min(1180px, calc(100% - 40px));
	--shadow: 0 24px 70px rgba(20, 35, 29, 0.14);
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	background: var(--paper);
}

body {
	margin: 0;
	color: var(--ink);
	background: var(--paper);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}

img {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-decoration: none;
}

button,
input,
textarea {
	font: inherit;
}

/* Loader stranice */

.page-loader {
	position: fixed;
	z-index: 1000;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 1.25rem;
	padding: 2rem;
	color: var(--white);
	background:
		radial-gradient(circle at 50% 42%, rgba(185, 120, 76, 0.18), transparent 28rem),
		var(--forest-deep);
	opacity: 1;
	visibility: visible;
	transition:
		opacity 420ms ease,
		visibility 420ms ease;
	animation: page-loader-failsafe 1ms linear 8s forwards;
}

.page-loader--scripted {
	animation: none;
}

.page-loader--hidden {
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}

.page-loader__mark {
	position: relative;
	display: grid;
	width: 7.5rem;
	height: 7.5rem;
	place-items: center;
}

.page-loader__logo {
	position: relative;
	z-index: 2;
	display: grid;
	width: 4.7rem;
	height: 4.7rem;
	place-items: center;
	overflow: hidden;
	border-radius: 50%;
	background: var(--white);
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.26),
		0 18px 45px rgba(0, 0, 0, 0.28);
	animation: page-loader-breathe 1.8s ease-in-out infinite;
}

.page-loader__logo img {
	width: 4rem;
	height: 4rem;
	object-fit: cover;
}

.page-loader__orbit {
	position: absolute;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 50%;
}

.page-loader__orbit::before {
	position: absolute;
	width: 0.58rem;
	height: 0.58rem;
	border-radius: 50%;
	background: var(--copper-light);
	box-shadow: 0 0 18px rgba(215, 163, 126, 0.75);
	content: "";
}

.page-loader__orbit--outer {
	inset: 0;
	animation: page-loader-spin 2.6s linear infinite;
}

.page-loader__orbit--outer::before {
	top: 0.65rem;
	right: 0.9rem;
}

.page-loader__orbit--inner {
	inset: 0.8rem;
	border-color: rgba(215, 163, 126, 0.34);
	animation: page-loader-spin 1.9s linear infinite reverse;
}

.page-loader__orbit--inner::before {
	right: -0.28rem;
	bottom: 2rem;
	width: 0.42rem;
	height: 0.42rem;
}

.page-loader__text {
	display: grid;
	gap: 0.2rem;
	text-align: center;
}

.page-loader__text strong {
	font-size: clamp(1.25rem, 3vw, 1.75rem);
	font-weight: 650;
	letter-spacing: -0.025em;
}

.page-loader__text span {
	color: rgba(255, 255, 255, 0.58);
	font-size: 0.72rem;
	font-weight: 650;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.page-loader__progress {
	position: relative;
	width: min(12rem, 58vw);
	height: 1px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.14);
}

.page-loader__progress::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, transparent, var(--copper-light), transparent);
	content: "";
	transform: translateX(-100%);
	animation: page-loader-progress 1.35s ease-in-out infinite;
}

@keyframes page-loader-spin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes page-loader-breathe {
	0%,
	100% {
		transform: scale(0.96);
	}

	50% {
		transform: scale(1.03);
	}
}

@keyframes page-loader-progress {
	50%,
	100% {
		transform: translateX(100%);
	}
}

@keyframes page-loader-failsafe {
	to {
		opacity: 0;
		pointer-events: none;
		visibility: hidden;
	}
}

.scroll-top {
	position: fixed;
	right: clamp(1rem, 2.5vw, 2rem);
	bottom: clamp(1rem, 2.5vw, 2rem);
	z-index: 45;
	display: flex;
	width: 3.4rem;
	height: 3.4rem;
	padding: 0;
	align-items: center;
	justify-content: flex-end;
	gap: 0.65rem;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 999px;
	background: var(--copper);
	color: var(--white);
	cursor: pointer;
	box-shadow: 0 14px 35px rgba(20, 35, 29, 0.24);
	opacity: 0;
	pointer-events: none;
	transform: translateY(1.2rem) scale(0.9);
	transition:
		width 260ms cubic-bezier(0.2, 0.75, 0.2, 1),
		opacity 260ms ease,
		transform 360ms cubic-bezier(0.2, 0.75, 0.2, 1),
		background-color 180ms ease;
}

.scroll-top--visible {
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

.scroll-top:hover,
.scroll-top:focus-visible {
	width: 7.4rem;
	background: var(--forest);
	outline: none;
}

.scroll-top:focus-visible {
	box-shadow:
		0 0 0 3px var(--paper),
		0 0 0 5px var(--copper),
		0 14px 35px rgba(20, 35, 29, 0.24);
}

.scroll-top__label {
	white-space: nowrap;
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	opacity: 0;
	text-transform: uppercase;
	transform: translateX(0.8rem);
	transition: opacity 160ms ease 40ms, transform 220ms ease;
}

.scroll-top:hover .scroll-top__label,
.scroll-top:focus-visible .scroll-top__label {
	opacity: 1;
	transform: translateX(0);
}

.scroll-top__arrow {
	display: grid;
	width: 3.3rem;
	height: 3.3rem;
	flex: 0 0 3.3rem;
	place-items: center;
	font-size: 1.25rem;
	transition: transform 180ms ease;
}

.scroll-top:hover .scroll-top__arrow,
.scroll-top:focus-visible .scroll-top__arrow {
	transform: translateY(-0.15rem);
}

@media (prefers-reduced-motion: reduce) {
	.page-loader__logo,
	.page-loader__orbit,
	.page-loader__progress::after {
		animation-duration: 1ms;
		animation-iteration-count: 1;
	}

	.page-loader {
		transition-duration: 120ms;
	}
}

.container {
	width: var(--container);
	margin-inline: auto;
}

.eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1rem;
	color: var(--copper);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.eyebrow::before {
	width: 2.2rem;
	height: 1px;
	background: currentColor;
	content: "";
}

.button {
	display: inline-flex;
	min-height: 3.35rem;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	padding: 0.8rem 1.4rem;
	border: 1px solid transparent;
	border-radius: var(--radius-sm);
	background: var(--copper);
	color: var(--white);
	font-size: 0.8rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: transform 180ms ease, background 180ms ease, border-color 180ms ease;
}

.button:hover {
	background: #a9663e;
	transform: translateY(-2px);
}

.button--ghost {
	border-color: rgba(255, 255, 255, 0.55);
	background: transparent;
}

.button--ghost:hover {
	border-color: var(--white);
	background: rgba(255, 255, 255, 0.08);
}

.page-intro {
	padding: 9rem 0 5rem;
	background:
		linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px) 0 0 / 90px 90px,
		var(--forest-deep);
	color: var(--white);
}

.page-intro h1 {
	max-width: 900px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3rem, 7vw, 6rem);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.045em;
}

.page-intro p:last-child {
	max-width: 680px;
	margin: 1.7rem 0 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: 1.08rem;
}

.content-shell {
	padding: 5rem 0 7rem;
}

.content-shell h2 {
	margin: 0 0 1rem;
	font-family: var(--font-display);
	font-size: clamp(2rem, 4vw, 3.2rem);
	font-weight: 400;
}

@media (max-width: 720px) {
	:root {
		--container: min(100% - 28px, 1180px);
	}

	.scroll-top:hover,
	.scroll-top:focus-visible {
		width: 3.4rem;
	}

	.scroll-top__label {
		display: none;
	}

	.page-intro {
		padding: 7.5rem 0 4rem;
	}
}

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

	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}
}

/* Header */
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--paper);
	border-bottom: 1px solid transparent;
	transform: translateY(0);
	transition:
		transform 420ms cubic-bezier(0.2, 0.75, 0.2, 1),
		background-color 280ms ease,
		border-color 280ms ease,
		box-shadow 280ms ease;
	will-change: transform;
}

.site-header--scrolled {
	border-bottom-color: rgba(31, 51, 43, 0.11);
	background: rgba(246, 241, 232, 0.94);
	box-shadow: 0 14px 38px rgba(20, 35, 29, 0.12);
	backdrop-filter: blur(16px) saturate(130%);
}

.site-header--hidden {
	transform: translateY(-105%);
}

.topline {
	max-height: 1.9rem;
	overflow: hidden;
	background: var(--forest-deep);
	color: rgba(255, 255, 255, 0.72);
	font-size: 0.73rem;
	letter-spacing: 0.035em;
	opacity: 1;
	transform: translateY(0);
	transition:
		max-height 280ms ease,
		opacity 200ms ease,
		transform 280ms ease;
}

.site-header--scrolled .topline {
	max-height: 0;
	opacity: 0;
	transform: translateY(-100%);
}

.topline__inner {
	display: flex;
	min-height: 1.9rem;
	align-items: center;
	justify-content: space-between;
}

.topline__inner div {
	display: flex;
	gap: 1.7rem;
}

.topline a:hover {
	color: var(--white);
}

.nav-shell {
	display: grid;
	min-height: 4.65rem;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 3rem;
	transition: min-height 280ms ease;
}

.site-header--scrolled .nav-shell {
	min-height: 4.15rem;
}

.brand {
	display: inline-flex;
	align-items: center;
}

.brand img {
	width: 148px;
	height: auto;
	transition: width 280ms ease;
}

.site-header--scrolled .brand img {
	width: 136px;
}

.desktop-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: clamp(1.2rem, 2.4vw, 2.6rem);
}

.desktop-nav a {
	position: relative;
	padding-block: 0.65rem;
	color: var(--ink-soft);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.desktop-nav a::after {
	position: absolute;
	right: 0;
	bottom: 0.25rem;
	left: 0;
	height: 1px;
	background: var(--copper);
	content: "";
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 180ms ease;
}

.desktop-nav a:hover::after,
.desktop-nav a.active::after {
	transform: scaleX(1);
	transform-origin: left;
}

.header-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.65rem;
	color: var(--forest);
	font-size: 0.75rem;
	font-weight: 750;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.header-cta span {
	display: grid;
	width: 2.2rem;
	height: 2.2rem;
	place-items: center;
	border-radius: 50%;
	background: var(--copper);
	color: var(--white);
	transition: transform 180ms ease;
}

.header-cta:hover span {
	transform: rotate(45deg);
}

.mobile-menu {
	display: none;
}

@media (max-width: 960px) {
	.desktop-nav,
	.header-cta {
		display: none;
	}

	.nav-shell {
		grid-template-columns: 1fr auto;
	}

	.mobile-menu {
		position: relative;
		display: block;
	}

	.mobile-menu summary {
		display: grid;
		width: 2.8rem;
		height: 2.8rem;
		cursor: pointer;
		list-style: none;
		place-content: center;
		gap: 0.3rem;
		border: 1px solid var(--line);
		border-radius: 50%;
	}

	.mobile-menu summary::-webkit-details-marker {
		display: none;
	}

	.mobile-menu summary span {
		width: 1rem;
		height: 1px;
		background: var(--forest);
	}

	.mobile-menu nav {
		position: absolute;
		top: calc(100% + 1rem);
		right: 0;
		display: grid;
		width: min(82vw, 310px);
		padding: 1.2rem;
		border: 1px solid var(--line);
		border-radius: var(--radius-md);
		background: var(--paper);
		box-shadow: var(--shadow);
	}

	.mobile-menu nav a {
		padding: 0.75rem;
		border-bottom: 1px solid var(--line);
		font-size: 0.9rem;
		font-weight: 650;
	}

	.mobile-menu nav a.active {
		color: var(--copper);
	}

	.mobile-menu nav .mobile-menu__cta {
		margin-top: 0.7rem;
		border: 0;
		background: var(--forest);
		color: var(--white);
		text-align: center;
	}
}

@media (max-width: 620px) {
	.topline__inner > span,
	.topline__inner a[href^="mailto"] {
		display: none;
	}

	.topline__inner {
		justify-content: center;
	}

	.nav-shell {
		min-height: 4.35rem;
		gap: 1rem;
	}

	.site-header--scrolled .nav-shell {
		min-height: 4rem;
	}

	.brand img {
		width: 132px;
	}

	.site-header--scrolled .brand img {
		width: 124px;
	}
}

/* Footer */
.site-footer {
	padding: 5rem 0 1.5rem;
	background: var(--forest-deep);
	color: rgba(255, 255, 255, 0.72);
}

.footer-grid {
	display: grid;
	grid-template-columns: 1.5fr 0.9fr 0.65fr 0.9fr;
	gap: 4rem;
	padding-bottom: 4rem;
}

.footer-grid > div {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	gap: 0.6rem;
}

.footer-brand {
	margin: 0;
	color: var(--white);
	font-family: var(--font-display);
	font-size: 2rem;
}

.footer-copy {
	max-width: 470px;
	margin: 0.5rem 0 0;
}

.footer-title {
	margin: 0 0 0.5rem;
	color: var(--copper-light);
	font-size: 0.72rem;
	font-weight: 750;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.footer-grid a:hover {
	color: var(--white);
}

.footer-privacy-button {
	margin: 0;
	padding: 0;
	cursor: pointer;
	border: 0;
	color: inherit;
	background: transparent;
	font: inherit;
	text-align: left;
}

.footer-privacy-button:hover,
.footer-privacy-button:focus-visible {
	color: var(--white);
}

.footer-bottom {
	display: grid;
	align-items: center;
	grid-template-columns: 1fr auto 1fr;
	gap: 1.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.13);
	font-size: 0.75rem;
}

.footer-bottom > span:last-child {
	justify-self: end;
}

.footer-credit {
	display: inline-flex;
	align-items: center;
	gap: 0.65rem;
	color: rgba(255, 255, 255, 0.66);
	line-height: 1.15;
	transition:
		color 180ms ease,
		transform 180ms ease;
}

.footer-credit:hover,
.footer-credit:focus-visible {
	color: var(--white);
	transform: translateY(-2px);
}

.footer-credit__logo {
	display: grid;
	width: 3.25rem;
	height: 2.1rem;
	place-items: center;
	padding: 0.2rem;
	border-radius: 0.3rem;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.16);
}

.footer-credit__logo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.footer-credit__text {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	gap: 0.15rem;
}

.footer-credit__text small {
	font-size: 0.58rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.footer-credit__text strong {
	color: var(--white);
	font-size: 0.72rem;
	font-weight: 700;
}

@media (max-width: 760px) {
	.footer-grid {
		grid-template-columns: 1fr;
		gap: 2.5rem;
	}

	.footer-bottom {
		align-items: flex-start;
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.footer-bottom > span:last-child {
		justify-self: start;
	}
}

/* Privatnost i kolačići */

.privacy-consent[hidden] {
	display: none;
}

.privacy-consent-backdrop[hidden] {
	display: none;
}

.mobile-call {
	display: none;
}

.privacy-consent-backdrop {
	position: fixed;
	z-index: 205;
	inset: 0;
	background: rgba(4, 20, 17, 0.68);
	backdrop-filter: blur(5px);
}

.privacy-consent {
	position: fixed;
	z-index: 210;
	top: 50%;
	right: 1rem;
	bottom: auto;
	left: 1rem;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: clamp(1.5rem, 4vw, 4rem);
	align-items: end;
	width: min(960px, calc(100% - 2rem));
	max-height: calc(100dvh - 2rem);
	overflow-y: auto;
	margin-inline: auto;
	padding: clamp(1.35rem, 3vw, 2.2rem);
	border: 1px solid rgba(255, 255, 255, 0.12);
	color: var(--white);
	background: rgba(5, 45, 38, 0.98);
	box-shadow: 0 24px 80px rgba(0, 0, 0, 0.28);
	backdrop-filter: blur(18px);
	transform: translateY(-50%);
}

.privacy-consent__content {
	max-width: 680px;
}

.privacy-consent__eyebrow {
	margin: 0 0 0.55rem;
	color: var(--copper-light);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.privacy-consent h2 {
	margin: 0 0 0.65rem;
	color: var(--white);
	font-size: clamp(1.3rem, 2.2vw, 2rem);
	line-height: 1.15;
	letter-spacing: -0.03em;
}

.privacy-consent__content > p:not(.privacy-consent__eyebrow) {
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
	font-size: 0.86rem;
	line-height: 1.65;
}

.privacy-consent__content > a {
	display: inline-block;
	margin-top: 0.7rem;
	color: var(--white);
	font-size: 0.78rem;
	font-weight: 700;
	text-underline-offset: 0.25rem;
}

.privacy-consent__actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(170px, 1fr));
	gap: 0.75rem;
}

.privacy-consent__actions button,
.legal-page__summary button,
.legal-page__action {
	min-height: 3.35rem;
	padding: 0.8rem 1.15rem;
	cursor: pointer;
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: 0;
	color: var(--white);
	background: transparent;
	font: inherit;
	font-size: 0.75rem;
	font-weight: 750;
	letter-spacing: 0.045em;
	text-transform: uppercase;
	transition:
		color 180ms ease,
		background-color 180ms ease,
		border-color 180ms ease;
}

.privacy-consent__actions button:last-child {
	border-color: var(--copper);
	background: var(--copper);
}

.privacy-consent__actions button:hover,
.privacy-consent__actions button:focus-visible {
	border-color: var(--white);
	color: var(--forest-deep);
	background: var(--white);
}

.legal-hero {
	padding-block: clamp(6rem, 11vw, 10rem);
	color: var(--white);
	background:
		linear-gradient(110deg, rgba(5, 45, 38, 0.98), rgba(5, 45, 38, 0.88)),
		url('/images/services/tepidarijum.jpg') center / cover;
}

.legal-hero .eyebrow {
	color: rgba(255, 255, 255, 0.65);
}

.legal-hero h1 {
	max-width: 940px;
	margin: 1rem 0 1.5rem;
	color: var(--white);
	font-size: clamp(3.2rem, 7vw, 7rem);
	line-height: 0.96;
	letter-spacing: -0.055em;
}

.legal-hero__inner > p:not(.eyebrow, .legal-hero__updated) {
	max-width: 650px;
	margin: 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: 1.05rem;
	line-height: 1.75;
}

.legal-hero__updated {
	margin: 2rem 0 0;
	color: rgba(255, 255, 255, 0.5);
	font-size: 0.76rem;
}

.legal-page {
	padding-block: clamp(5rem, 9vw, 9rem);
	background: var(--cream);
}

.legal-page__grid {
	display: grid;
	grid-template-columns: minmax(240px, 0.42fr) minmax(0, 1fr);
	gap: clamp(3rem, 8vw, 8rem);
	align-items: start;
}

.legal-page__summary {
	position: sticky;
	top: 8rem;
	padding: 1.5rem;
	border: 1px solid rgba(11, 65, 54, 0.18);
	background: rgba(255, 255, 255, 0.55);
}

.legal-page__summary ul {
	margin: 1.25rem 0;
	padding-left: 1.1rem;
}

.legal-page__summary li,
.legal-page__summary > p:not(.eyebrow) {
	margin-bottom: 0.75rem;
	color: rgba(20, 36, 31, 0.68);
	font-size: 0.86rem;
	line-height: 1.65;
}

.legal-page__summary button,
.legal-page__action {
	width: 100%;
	border-color: var(--forest);
	color: var(--forest);
}

.legal-page__summary button:hover,
.legal-page__summary button:focus-visible,
.legal-page__action:hover,
.legal-page__action:focus-visible {
	color: var(--white);
	background: var(--forest);
}

.legal-page__summary > a {
	display: inline-block;
	margin-top: 1rem;
	color: var(--forest);
	font-size: 0.8rem;
	font-weight: 700;
	text-underline-offset: 0.25rem;
}

.legal-page__content {
	min-width: 0;
}

.legal-page__content section {
	padding-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.legal-page__content section + section {
	padding-top: clamp(2.5rem, 5vw, 4.5rem);
	border-top: 1px solid rgba(11, 65, 54, 0.17);
}

.legal-page__content h2 {
	margin: 0 0 1.5rem;
	font-size: clamp(1.8rem, 3vw, 3rem);
	line-height: 1.1;
	letter-spacing: -0.035em;
}

.legal-page__content h3 {
	margin: 2rem 0 0.65rem;
	font-size: 1.15rem;
}

.legal-page__content p,
.legal-page__content li {
	color: rgba(20, 36, 31, 0.72);
	line-height: 1.8;
}

.legal-page__content a {
	color: var(--forest);
	font-weight: 650;
	text-underline-offset: 0.22rem;
}

.legal-page__content ul {
	padding-left: 1.25rem;
}

.legal-page__address {
	margin: 1.5rem 0;
	padding: 1.3rem 1.5rem;
	border-left: 3px solid var(--green);
	font-style: normal;
	line-height: 1.75;
	background: rgba(255, 255, 255, 0.56);
}

.legal-table-wrap {
	overflow-x: auto;
	margin-block: 1.5rem;
	border: 1px solid rgba(11, 65, 54, 0.17);
	background: rgba(255, 255, 255, 0.48);
}

.legal-table-wrap table {
	width: 100%;
	min-width: 680px;
	border-collapse: collapse;
	font-size: 0.88rem;
}

.legal-table-wrap th,
.legal-table-wrap td {
	padding: 1rem;
	text-align: left;
	vertical-align: top;
	border-right: 1px solid rgba(11, 65, 54, 0.13);
	border-bottom: 1px solid rgba(11, 65, 54, 0.13);
}

.legal-table-wrap th:last-child,
.legal-table-wrap td:last-child {
	border-right: 0;
}

.legal-table-wrap tr:last-child td {
	border-bottom: 0;
}

.legal-table-wrap th {
	color: var(--forest);
	background: rgba(11, 65, 54, 0.07);
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.legal-table-wrap code {
	white-space: nowrap;
	font-size: 0.82rem;
}

.legal-page__action {
	width: auto;
	margin-top: 1rem;
}

.contact-form__footer a {
	color: var(--forest);
	font-weight: 700;
	text-underline-offset: 0.18rem;
}

@media (max-width: 1040px) {
	.footer-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.privacy-consent {
		grid-template-columns: 1fr;
		align-items: start;
	}

	.privacy-consent__actions {
		width: 100%;
	}
}

@media (max-width: 820px) {
	.legal-page__grid {
		grid-template-columns: 1fr;
	}

	.legal-page__summary {
		position: static;
	}
}

@media (max-width: 620px) {
	.privacy-consent {
		right: 0.6rem;
		bottom: auto;
		left: 0.6rem;
		width: calc(100% - 1.2rem);
		max-height: calc(100vh - 1.2rem);
		overflow-y: auto;
	}

	.privacy-consent__actions {
		grid-template-columns: 1fr;
	}

	.privacy-consent__actions button {
		width: 100%;
	}

	.legal-page__action {
		width: 100%;
	}
}

@media (max-width: 760px) {
	.mobile-call {
		position: fixed;
		z-index: 104;
		bottom: 1.25rem;
		left: 1.25rem;
		display: flex;
		width: 4.8rem;
		height: 4.8rem;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		gap: 0.18rem;
		border: 1px solid rgba(255, 255, 255, 0.38);
		border-radius: 50%;
		color: var(--white);
		background: var(--copper);
		box-shadow: 0 12px 32px rgba(0, 0, 0, 0.22);
		transition:
			opacity 180ms ease,
			transform 180ms ease,
			background-color 180ms ease;
	}

	.mobile-call:hover,
	.mobile-call:focus-visible {
		color: var(--white);
		background: var(--forest);
		transform: translateY(-3px);
	}

	.mobile-call svg {
		width: 1.8rem;
		height: 1.8rem;
		fill: currentColor;
	}

	.mobile-call__label {
		font-size: 0.55rem;
		font-weight: 800;
		letter-spacing: 0.08em;
		line-height: 1;
		text-transform: uppercase;
	}

	.privacy-consent-open .mobile-call {
		opacity: 0;
		pointer-events: none;
		transform: translateY(0.75rem);
	}

	.site-footer-visible .mobile-call {
		opacity: 0;
		pointer-events: none;
		transform: translateY(0.75rem);
	}
}

/* Naslovna strana */
.hero {
	display: grid;
	min-height: 720px;
	grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
	background: var(--forest-deep);
	color: var(--white);
}

.hero__content {
	display: flex;
	min-width: 0;
	padding: clamp(4rem, 8vw, 8rem) clamp(2rem, 7vw, 7rem);
	align-items: flex-start;
	justify-content: center;
	flex-direction: column;
}

.hero h1 {
	max-width: 700px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.5rem, 6.2vw, 6.7rem);
	font-weight: 400;
	line-height: 0.94;
	letter-spacing: -0.055em;
}

.hero h1 em {
	display: block;
	color: var(--copper-light);
	font-weight: 400;
}

.hero__lead {
	max-width: 650px;
	margin: 2rem 0 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: clamp(1rem, 1.3vw, 1.15rem);
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem;
	margin-top: 2.2rem;
}

.hero__proof {
	display: grid;
	width: 100%;
	margin: auto 0 0;
	padding: 3.5rem 0 0;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
	list-style: none;
}

.hero__proof li {
	display: grid;
	padding-top: 1.1rem;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.hero__proof strong {
	color: var(--white);
	font-family: var(--font-display);
	font-size: 1.05rem;
	font-weight: 400;
}

.hero__proof span {
	color: rgba(255, 255, 255, 0.52);
	font-size: 0.73rem;
}

.hero__visual {
	position: relative;
	min-height: 720px;
	overflow: hidden;
}

.hero__visual::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(20, 35, 29, 0.18), transparent 40%);
	content: "";
}

.hero__visual img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero__badge {
	position: absolute;
	right: 2rem;
	bottom: 2rem;
	z-index: 2;
	display: flex;
	min-width: 190px;
	padding: 1.1rem;
	align-items: center;
	gap: 1rem;
	background: rgba(246, 241, 232, 0.92);
	color: var(--forest);
	backdrop-filter: blur(12px);
}

.hero__badge span {
	color: var(--copper);
	font-family: var(--font-display);
	font-size: 1.8rem;
}

.hero__badge p {
	margin: 0;
	font-size: 0.78rem;
	font-weight: 650;
	line-height: 1.35;
	text-transform: uppercase;
}

.services {
	padding: clamp(5rem, 9vw, 9rem) 0;
	background: var(--cream);
}

.section-heading {
	display: grid;
	margin-bottom: 4rem;
	grid-template-columns: 1.25fr 0.75fr;
	align-items: end;
	gap: 4rem;
}

.section-heading h2 {
	max-width: 780px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(2.8rem, 5vw, 5rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.045em;
}

.section-heading > p {
	margin: 0;
	color: var(--ink-soft);
}

.service-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.service-card {
	position: relative;
	display: flex;
	min-height: 310px;
	padding: 2rem;
	flex-direction: column;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	transition: background 200ms ease, color 200ms ease;
}

.service-card:hover {
	background: var(--forest);
	color: var(--white);
}

.service-card__number {
	color: var(--copper);
	font-family: var(--font-display);
	font-size: 0.9rem;
}

.service-card h3 {
	margin: auto 0 0.65rem;
	font-family: var(--font-display);
	font-size: 1.8rem;
	font-weight: 400;
}

.service-card p {
	max-width: 320px;
	margin: 0;
	color: var(--ink-soft);
	font-size: 0.88rem;
}

.service-card:hover p {
	color: rgba(255, 255, 255, 0.66);
}

.service-card__arrow {
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	display: grid;
	width: 2.2rem;
	height: 2.2rem;
	place-items: center;
	border: 1px solid var(--line);
	border-radius: 50%;
	transition: transform 180ms ease, background 180ms ease;
}

.service-card:hover .service-card__arrow {
	background: var(--copper);
	transform: rotate(45deg);
}

@media (max-width: 1020px) {
	.hero {
		grid-template-columns: 1fr;
	}

	.hero__content {
		min-height: 680px;
	}

	.hero__visual {
		min-height: 620px;
	}

	.service-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 700px) {
	.hero__content {
		min-height: auto;
		padding: 5rem 1.4rem 3rem;
	}

	.hero__visual {
		min-height: 470px;
	}

	.hero__proof {
		margin-top: 3.5rem;
		grid-template-columns: 1fr;
	}

	.hero__proof li:not(:first-child) {
		display: none;
	}

	.hero__badge {
		right: 1rem;
		bottom: 1rem;
	}

	.section-heading {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.service-grid {
		grid-template-columns: 1fr;
	}

	.service-card {
		min-height: 260px;
	}
}

/* Dodatne sekcije naslovne strane */

.home-process {
	padding: clamp(6rem, 10vw, 10rem) 0;
	background: var(--paper);
}

.home-process__heading {
	display: grid;
	max-width: 980px;
	grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
	gap: clamp(2rem, 6vw, 6rem);
	align-items: end;
}

.home-process__heading .eyebrow {
	grid-column: 1 / -1;
	margin-bottom: -0.5rem;
}

.home-process__heading h2,
.home-trust__heading h2,
.home-about h2,
.home-faq h2,
.home-cta h2 {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(2.7rem, 5vw, 5rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.045em;
}

.home-process__heading > p,
.home-trust__heading > p {
	margin: 0;
	color: var(--ink-soft);
}

.home-process__grid {
	display: grid;
	margin: 4.5rem 0 0;
	padding: 0;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
	list-style: none;
}

.home-process__grid li {
	min-height: 300px;
	padding: 1.8rem;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.home-process__grid li > span,
.home-trust__grid li > span {
	color: var(--copper);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.1em;
}

.home-process__grid h3 {
	margin: 5rem 0 0.8rem;
	color: var(--forest);
	font-size: 1.35rem;
	line-height: 1.15;
}

.home-process__grid p,
.home-trust__grid p {
	margin: 0;
	color: var(--ink-soft);
	font-size: 0.86rem;
}

.home-trust {
	padding: clamp(6rem, 10vw, 10rem) 0;
	color: var(--white);
	background: var(--forest-deep);
}

.home-trust .eyebrow {
	color: var(--copper-light);
}

.home-trust__heading {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
	gap: clamp(2.5rem, 7vw, 7rem);
	align-items: end;
}

.home-trust__heading h2 {
	max-width: 780px;
	color: var(--white);
}

.home-trust__heading > p {
	color: rgba(255, 255, 255, 0.62);
}

.home-trust__grid {
	display: grid;
	margin: 4.5rem 0 0;
	padding: 0;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	list-style: none;
}

.home-trust__grid li {
	min-height: 250px;
	padding: 1.6rem 1.6rem 0;
	border-right: 1px solid rgba(255, 255, 255, 0.16);
}

.home-trust__grid li:first-child {
	padding-left: 0;
}

.home-trust__grid li:last-child {
	border-right: 0;
}

.home-trust__grid strong {
	display: block;
	margin: 4rem 0 0.75rem;
	color: var(--white);
	font-size: clamp(1.35rem, 2vw, 1.8rem);
	font-weight: 600;
	letter-spacing: -0.025em;
}

.home-trust__grid p {
	max-width: 230px;
	color: rgba(255, 255, 255, 0.56);
}

.home-about {
	padding: clamp(6rem, 11vw, 11rem) 0;
	background: var(--cream);
}

.home-about__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(330px, 0.92fr);
	gap: clamp(3rem, 9vw, 9rem);
	align-items: center;
}

.home-about__media {
	position: relative;
	min-height: 650px;
}

.home-about__media img {
	width: 100%;
	height: 650px;
	object-fit: cover;
}

.home-about__stamp {
	position: absolute;
	right: -2rem;
	bottom: 2rem;
	display: grid;
	width: 9rem;
	height: 9rem;
	padding: 1rem;
	place-content: center;
	border-radius: 50%;
	color: var(--white);
	background: var(--copper);
	text-align: center;
	box-shadow: var(--shadow);
}

.home-about__stamp strong {
	font-size: 1.7rem;
	line-height: 1;
}

.home-about__stamp span {
	margin-top: 0.35rem;
	font-size: 0.6rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.home-about__content {
	max-width: 610px;
}

.home-about__content > p:not(.eyebrow) {
	color: var(--ink-soft);
	line-height: 1.8;
}

.home-about__content > p:nth-of-type(2) {
	margin-top: 1.8rem;
	font-size: 1.05rem;
}

.home-text-link {
	display: inline-flex;
	margin-top: 1.7rem;
	align-items: center;
	gap: 0.8rem;
	color: var(--forest);
	font-size: 0.78rem;
	font-weight: 750;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.home-text-link span {
	display: grid;
	width: 2.2rem;
	height: 2.2rem;
	place-items: center;
	border-radius: 50%;
	color: var(--white);
	background: var(--copper);
	transition: transform 180ms ease;
}

.home-text-link:hover span {
	transform: rotate(45deg);
}

.home-faq {
	padding: clamp(6rem, 11vw, 11rem) 0;
	background: var(--paper);
}

.home-faq__grid {
	display: grid;
	grid-template-columns: minmax(300px, 0.78fr) minmax(0, 1.22fr);
	gap: clamp(4rem, 9vw, 9rem);
	align-items: start;
}

.home-faq__heading {
	position: sticky;
	top: 8rem;
}

.home-faq__heading > p:not(.eyebrow) {
	max-width: 520px;
	margin: 1.5rem 0 0;
	color: var(--ink-soft);
}

.home-faq__items {
	border-top: 1px solid var(--line);
}

.home-faq__items details {
	border-bottom: 1px solid var(--line);
}

.home-faq__items summary {
	display: grid;
	padding: 1.55rem 0;
	grid-template-columns: 2.4rem 1fr auto;
	align-items: center;
	gap: 1rem;
	color: var(--forest);
	cursor: pointer;
	list-style: none;
	font-size: 1rem;
	font-weight: 650;
}

.home-faq__items summary::-webkit-details-marker {
	display: none;
}

.home-faq__items summary > span {
	color: var(--copper);
	font-size: 0.65rem;
	letter-spacing: 0.08em;
}

.home-faq__items summary > strong {
	display: grid;
	width: 2rem;
	height: 2rem;
	place-items: center;
	border-radius: 50%;
	background: var(--cream);
	font-size: 1.1rem;
	font-weight: 500;
	transition: color 180ms ease, background 180ms ease, transform 220ms ease;
}

.home-faq__items details[open] summary > strong {
	color: var(--white);
	background: var(--copper);
	transform: rotate(45deg);
}

.home-faq__items details > p {
	max-width: 700px;
	margin: 0;
	padding: 0 3rem 1.7rem 3.4rem;
	color: var(--ink-soft);
	font-size: 0.92rem;
}

.home-cta {
	position: relative;
	padding: clamp(7rem, 13vw, 13rem) 0;
	overflow: hidden;
	color: var(--white);
	background:
		linear-gradient(100deg, rgba(10, 38, 31, 0.95), rgba(10, 38, 31, 0.7)),
		url("/images/services/parno-kupatilo.jpg") center / cover;
}

.home-cta__inner {
	position: relative;
	z-index: 1;
	max-width: 900px;
}

.home-cta .eyebrow {
	color: var(--copper-light);
}

.home-cta h2 {
	max-width: 820px;
	color: var(--white);
	font-size: clamp(3.2rem, 6.5vw, 6.5rem);
}

.home-cta__inner > p:not(.eyebrow) {
	max-width: 660px;
	margin: 1.7rem 0 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.04rem;
}

.home-cta__actions {
	display: flex;
	margin-top: 2.2rem;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.4rem;
}

.home-cta__phone {
	color: var(--white);
	font-size: 0.82rem;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 0.3rem;
}

@media (max-width: 1020px) {
	.home-process__grid,
	.home-trust__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.home-trust__grid li:nth-child(2) {
		border-right: 0;
	}

	.home-trust__grid li:nth-child(n + 3) {
		border-top: 1px solid rgba(255, 255, 255, 0.16);
	}

	.home-trust__grid li:nth-child(3) {
		padding-left: 0;
	}

	.home-about__grid {
		grid-template-columns: 1fr;
	}

	.home-about__media {
		max-width: 760px;
	}
}

@media (max-width: 760px) {
	.home-process__heading,
	.home-trust__heading,
	.home-faq__grid {
		grid-template-columns: 1fr;
	}

	.home-process__heading .eyebrow {
		grid-column: auto;
		margin-bottom: 0;
	}

	.home-process__grid,
	.home-trust__grid {
		grid-template-columns: 1fr;
	}

	.home-process__grid li {
		min-height: 245px;
	}

	.home-process__grid h3 {
		margin-top: 3.5rem;
	}

	.home-trust__grid li,
	.home-trust__grid li:first-child,
	.home-trust__grid li:nth-child(3) {
		min-height: 210px;
		padding: 1.4rem 0;
		border-top: 1px solid rgba(255, 255, 255, 0.16);
		border-right: 0;
	}

	.home-trust__grid strong {
		margin-top: 2.7rem;
	}

	.home-about__media,
	.home-about__media img {
		min-height: 460px;
		height: 460px;
	}

	.home-about__stamp {
		right: 1rem;
		bottom: 1rem;
		width: 7.7rem;
		height: 7.7rem;
	}

	.home-faq__heading {
		position: static;
	}

	.home-faq__items summary {
		grid-template-columns: 2rem 1fr auto;
		gap: 0.7rem;
		font-size: 0.92rem;
	}

	.home-faq__items details > p {
		padding: 0 0 1.5rem 2.7rem;
	}

	.home-cta__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.home-cta__actions .button {
		justify-content: center;
	}

	.home-cta__phone {
		padding: 0.6rem;
		text-align: center;
	}
}

/* Lista blogova */
.blog-hero {
	padding: 8rem 0 6rem;
	background:
		linear-gradient(100deg, rgba(20, 35, 29, 0.98), rgba(20, 35, 29, 0.84)),
		url("/images/hero-sauna.jpg") center / cover;
	color: var(--white);
}

.blog-hero h1 {
	max-width: 850px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.2rem, 7vw, 6.4rem);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.05em;
}

.blog-hero > .container > p:last-child {
	max-width: 620px;
	margin: 1.6rem 0 0;
	color: rgba(255, 255, 255, 0.7);
}

.blog-list {
	padding: 7rem 0;
	background: var(--cream);
}

.post-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.post-card {
	overflow: hidden;
	background: var(--paper);
}

.post-card--featured {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: 1.25fr 0.75fr;
}

.post-card__image {
	display: block;
	min-height: 310px;
	overflow: hidden;
	background: var(--forest);
}

.post-card--featured .post-card__image {
	min-height: 500px;
}

.post-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 500ms ease;
}

.post-card:hover .post-card__image img {
	transform: scale(1.035);
}

.post-card__placeholder {
	display: grid;
	height: 100%;
	place-items: center;
	color: rgba(255, 255, 255, 0.35);
	font-family: var(--font-display);
	font-size: 2rem;
}

.post-card__body {
	display: flex;
	padding: clamp(1.8rem, 4vw, 3rem);
	flex-direction: column;
}

.post-card__meta {
	display: flex;
	gap: 1rem;
	color: var(--copper);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.post-card h2 {
	margin: 2.5rem 0 1rem;
	font-family: var(--font-display);
	font-size: clamp(1.8rem, 3.4vw, 3.2rem);
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -0.035em;
}

.post-card:not(.post-card--featured) h2 {
	font-size: clamp(1.6rem, 2.6vw, 2.3rem);
}

.post-card__body > p {
	margin: 0 0 2rem;
	color: var(--ink-soft);
}

.post-card__link {
	display: inline-flex;
	margin-top: auto;
	align-items: center;
	gap: 0.6rem;
	color: var(--forest);
	font-size: 0.75rem;
	font-weight: 750;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.empty-state {
	max-width: 700px;
	padding: 4rem;
	border: 1px solid var(--line);
	background: var(--paper);
}

.empty-state h2 {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 5vw, 4.5rem);
	font-weight: 400;
	line-height: 1;
}

.empty-state > p:last-child {
	margin: 1.5rem 0 0;
	color: var(--ink-soft);
}

@media (max-width: 760px) {
	.blog-hero {
		padding: 6rem 0 4rem;
	}

	.post-grid,
	.post-card--featured {
		grid-template-columns: 1fr;
	}

	.post-card--featured {
		display: block;
	}

	.post-card--featured .post-card__image,
	.post-card__image {
		min-height: 300px;
	}

	.empty-state {
		padding: 2rem;
	}
}

/* Blog tekst */
.article {
	background: var(--paper);
}

.article__header {
	padding: 7.5rem 0 11rem;
	background: var(--forest-deep);
	color: var(--white);
}

.article__header-inner {
	max-width: 980px;
}

.article__meta {
	display: flex;
	margin-bottom: 2rem;
	gap: 1.4rem;
	color: var(--copper-light);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.article__header h1 {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3rem, 7vw, 6rem);
	font-weight: 400;
	line-height: 0.98;
	letter-spacing: -0.05em;
}

.article__header p {
	max-width: 760px;
	margin: 2rem 0 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.1rem;
}

.article__cover {
	position: relative;
	margin-top: -7rem;
}

.article__cover img {
	width: 100%;
	max-height: 700px;
	object-fit: cover;
	box-shadow: var(--shadow);
}

.article__layout {
	display: grid;
	padding-top: 6rem;
	padding-bottom: 8rem;
	grid-template-columns: 180px minmax(0, 760px);
	justify-content: center;
	gap: 5rem;
}

.article__layout aside {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	color: var(--ink-soft);
	font-size: 0.78rem;
}

.article__layout aside > span {
	color: var(--copper);
	font-size: 0.67rem;
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.article__layout aside strong {
	margin-top: 0.3rem;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: 1.1rem;
	font-weight: 400;
}

.article__layout aside a {
	margin-top: 2rem;
	font-weight: 700;
}

.article__body {
	color: #383d38;
	font-size: 1.06rem;
}

.article__body > *:first-child {
	margin-top: 0;
}

.article__body h2,
.article__body h3 {
	margin: 3.2rem 0 1rem;
	color: var(--forest);
	font-family: var(--font-display);
	font-weight: 400;
	line-height: 1.1;
}

.article__body h2 {
	font-size: clamp(2rem, 4vw, 3.1rem);
	letter-spacing: -0.035em;
}

.article__body h3 {
	font-size: 1.6rem;
}

.article__body p,
.article__body ul,
.article__body ol {
	margin: 0 0 1.5rem;
}

.article__body li {
	margin-bottom: 0.55rem;
}

.article__body a {
	color: var(--copper);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.article__body blockquote {
	margin: 2.5rem 0;
	padding: 1.5rem 0 1.5rem 2rem;
	border-left: 2px solid var(--copper);
	color: var(--forest);
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-style: italic;
}

.article__body figure {
	margin: 3rem -5vw;
}

.article__body figure img {
	width: 100%;
	max-height: 720px;
	object-fit: cover;
}

.article__body figcaption {
	margin-top: 0.7rem;
	color: var(--ink-soft);
	font-size: 0.78rem;
	text-align: center;
}

@media (max-width: 820px) {
	.article__header {
		padding: 5rem 0 8rem;
	}

	.article__cover {
		margin-top: -4rem;
	}

	.article__layout {
		padding-top: 4rem;
		grid-template-columns: 1fr;
		gap: 3rem;
	}

	.article__layout aside {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 0.25rem 1rem;
	}

	.article__layout aside a {
		margin: 0;
		grid-column: 2;
	}

	.article__body figure {
		margin-inline: 0;
	}
}

/* Stranica usluga */
.services-hero {
	position: relative;
	overflow: hidden;
	background:
		linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 96px 96px,
		var(--forest-deep);
	color: var(--white);
}

.services-hero::before {
	position: absolute;
	top: -16rem;
	left: -12rem;
	width: 34rem;
	height: 34rem;
	border: 1px solid rgba(215, 163, 126, 0.18);
	border-radius: 50%;
	content: "";
}

.services-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	min-height: 760px;
	grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
	align-items: stretch;
}

.services-hero__content {
	display: flex;
	padding: clamp(5rem, 8vw, 8rem) clamp(2rem, 6vw, 6rem) clamp(5rem, 8vw, 8rem) 0;
	justify-content: center;
	flex-direction: column;
}

.services-hero h1 {
	max-width: 720px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.4rem, 6.5vw, 6.8rem);
	font-weight: 400;
	line-height: 0.94;
	letter-spacing: -0.055em;
}

.services-hero h1 em {
	display: block;
	color: var(--copper-light);
	font-weight: 400;
}

.services-hero__content > p:not(.eyebrow) {
	max-width: 610px;
	margin: 2rem 0 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.05rem;
}

.services-hero__actions {
	display: flex;
	margin-top: 2.4rem;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
}

.services-text-link {
	display: inline-flex;
	align-items: center;
	gap: 0.65rem;
	color: rgba(255, 255, 255, 0.78);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.services-text-link span {
	color: var(--copper-light);
	font-size: 1.1rem;
	transition: transform 180ms ease;
}

.services-text-link:hover span {
	transform: translateY(0.3rem);
}

.services-hero__media {
	position: relative;
	min-height: 760px;
	margin: 0;
	overflow: hidden;
}

.services-hero__media::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(20, 35, 29, 0.24), transparent 45%);
	content: "";
	pointer-events: none;
}

.services-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.services-hero__media figcaption {
	position: absolute;
	right: 2rem;
	bottom: 2rem;
	z-index: 1;
	display: grid;
	max-width: 260px;
	padding: 1.35rem 1.5rem;
	background: rgba(246, 241, 232, 0.92);
	color: var(--forest);
	backdrop-filter: blur(12px);
}

.services-hero__media figcaption strong {
	color: var(--copper);
	font-family: var(--font-display);
	font-size: 1.45rem;
	font-weight: 400;
}

.services-hero__media figcaption span {
	font-size: 0.76rem;
	line-height: 1.45;
}

.services-intro {
	padding: clamp(5rem, 9vw, 9rem) 0 4rem;
	background: var(--cream);
}

.services-intro__heading {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(260px, 0.75fr);
	align-items: end;
	gap: clamp(2rem, 6vw, 6rem);
}

.services-intro__heading h2,
.services-process__heading h2,
.services-cta h2 {
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(2.7rem, 5.1vw, 5rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.045em;
}

.services-intro__heading > p {
	margin: 0;
	color: var(--ink-soft);
}

.services-jump {
	display: grid;
	margin-top: 4.5rem;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.services-jump a {
	display: flex;
	min-height: 5.7rem;
	padding: 1.25rem 1.5rem;
	align-items: center;
	gap: 1rem;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	color: var(--forest);
	font-family: var(--font-display);
	font-size: 1.12rem;
	transition: color 180ms ease, background 180ms ease;
}

.services-jump a span {
	color: var(--copper);
	font-family: var(--font-sans);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.1em;
}

.services-jump a:hover {
	background: var(--forest);
	color: var(--white);
}

.services-catalogue {
	padding: 4rem 0 clamp(6rem, 10vw, 10rem);
	background: var(--cream);
}

.service-detail {
	display: grid;
	min-height: 570px;
	grid-template-columns: minmax(0, 1.08fr) minmax(350px, 0.92fr);
	background: var(--paper);
	box-shadow: 0 18px 55px rgba(20, 35, 29, 0.07);
}

.service-detail + .service-detail {
	margin-top: 2rem;
}

.service-detail:nth-child(even) {
	grid-template-columns: minmax(350px, 0.92fr) minmax(0, 1.08fr);
}

.service-detail:nth-child(even) .service-detail__media {
	order: 2;
}

.service-detail__media {
	position: relative;
	min-height: 570px;
	overflow: hidden;
	background: var(--forest);
}

.service-detail__media::after {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, transparent 55%, rgba(20, 35, 29, 0.38));
	content: "";
}

.service-detail__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms cubic-bezier(0.2, 0.75, 0.2, 1);
}

.service-detail:hover .service-detail__media img {
	transform: scale(1.035);
}

.service-detail__media > span {
	position: absolute;
	bottom: 1.5rem;
	left: 1.7rem;
	z-index: 1;
	color: var(--white);
	font-family: var(--font-display);
	font-size: 1.35rem;
}

.service-detail__content {
	display: flex;
	padding: clamp(2.5rem, 6vw, 5.5rem);
	justify-content: center;
	flex-direction: column;
}

.service-detail__kicker {
	margin: 0 0 1rem;
	color: var(--copper);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.service-detail__content h2 {
	margin: 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(2.5rem, 4.2vw, 4.2rem);
	font-weight: 400;
	line-height: 1;
	letter-spacing: -0.04em;
}

.service-detail__content > p:not(.service-detail__kicker) {
	margin: 1.5rem 0 0;
	color: var(--ink-soft);
}

.service-detail__content ul {
	display: grid;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
}

.service-detail__content li {
	position: relative;
	padding: 0.7rem 0 0.7rem 1.4rem;
	border-top: 1px solid var(--line);
	color: var(--forest);
	font-size: 0.82rem;
}

.service-detail__content li::before {
	position: absolute;
	top: 1.22rem;
	left: 0;
	width: 0.35rem;
	height: 0.35rem;
	border-radius: 50%;
	background: var(--copper);
	content: "";
}

.service-detail__content > a {
	display: inline-flex;
	margin-top: 2rem;
	align-items: center;
	align-self: flex-start;
	gap: 0.7rem;
	color: var(--forest);
	font-size: 0.73rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.service-detail__content > a span {
	display: grid;
	width: 2.15rem;
	height: 2.15rem;
	place-items: center;
	border-radius: 50%;
	background: var(--copper);
	color: var(--white);
	transition: transform 180ms ease;
}

.service-detail__content > a:hover span {
	transform: rotate(45deg);
}

.services-process {
	padding: clamp(6rem, 10vw, 10rem) 0;
	background: var(--paper);
}

.services-process__heading {
	max-width: 850px;
}

.services-process__grid {
	display: grid;
	margin: 4.5rem 0 0;
	padding: 0;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
	list-style: none;
}

.services-process__grid li {
	min-height: 285px;
	padding: 1.8rem;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.services-process__grid li > span {
	color: var(--copper);
	font-size: 0.7rem;
	font-weight: 750;
	letter-spacing: 0.1em;
}

.services-process__grid h3 {
	margin: 4.5rem 0 0.8rem;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: 1.45rem;
	font-weight: 400;
	line-height: 1.12;
}

.services-process__grid p {
	margin: 0;
	color: var(--ink-soft);
	font-size: 0.84rem;
}

.services-cta {
	padding: clamp(5rem, 9vw, 8rem) 0;
	background: var(--forest-deep);
	color: var(--white);
}

.services-cta__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(300px, 0.85fr);
	align-items: end;
	gap: clamp(2.5rem, 7vw, 7rem);
}

.services-cta__inner > div:last-child > p {
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
}

.services-cta__actions {
	display: flex;
	margin-top: 2rem;
	flex-wrap: wrap;
	gap: 0.8rem;
}

.has-reveal [data-reveal] {
	opacity: 0;
	transform: translateY(2rem);
	transition:
		opacity 700ms ease,
		transform 700ms cubic-bezier(0.2, 0.75, 0.2, 1);
}

.has-reveal [data-reveal="delay"] {
	transition-delay: 120ms;
}

.has-reveal [data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 1020px) {
	.services-hero__grid {
		width: 100%;
		grid-template-columns: 1fr;
	}

	.services-hero__content {
		width: var(--container);
		min-height: 650px;
		margin-inline: auto;
		padding-right: 0;
	}

	.services-hero__media {
		min-height: 620px;
	}

	.services-intro__heading,
	.services-cta__inner {
		grid-template-columns: 1fr;
	}

	.services-intro__heading > p,
	.services-cta__inner > div:last-child {
		max-width: 680px;
	}

	.service-detail,
	.service-detail:nth-child(even) {
		min-height: 500px;
		grid-template-columns: 1fr 1fr;
	}

	.service-detail__media {
		min-height: 500px;
	}

	.services-process__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 720px) {
	.services-hero__content {
		min-height: 570px;
		padding-block: 5rem;
	}

	.services-hero__media {
		min-height: 440px;
	}

	.services-hero__media figcaption {
		right: 1rem;
		bottom: 1rem;
		left: 1rem;
	}

	.services-jump {
		grid-template-columns: 1fr 1fr;
	}

	.service-detail,
	.service-detail:nth-child(even) {
		grid-template-columns: 1fr;
	}

	.service-detail:nth-child(even) .service-detail__media {
		order: 0;
	}

	.service-detail__media {
		min-height: 390px;
	}

	.services-process__grid {
		grid-template-columns: 1fr;
	}

	.services-process__grid li {
		min-height: 230px;
	}
}

@media (max-width: 480px) {
	.services-jump {
		grid-template-columns: 1fr;
	}

	.service-detail__media {
		min-height: 320px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.has-reveal [data-reveal] {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* Projekti iz CMS-a */
.projects-hero {
	padding: clamp(6rem, 11vw, 10rem) 0 clamp(5rem, 8vw, 8rem);
	background:
		linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 96px 96px,
		var(--forest-deep);
	color: var(--white);
}

.projects-hero__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
	align-items: end;
	gap: clamp(2.5rem, 8vw, 8rem);
}

.projects-hero h1 {
	max-width: 900px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.4rem, 7vw, 6.8rem);
	font-weight: 500;
	line-height: 0.94;
	letter-spacing: -0.055em;
}

.projects-hero__inner > p {
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
}

.projects-list {
	padding: clamp(4rem, 8vw, 8rem) 0;
	background: var(--cream);
}

.projects-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 3vw, 3rem);
}

.project-card {
	min-width: 0;
}

.project-card--featured {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
	align-items: stretch;
	background: var(--paper);
}

.project-card__media {
	position: relative;
	display: block;
	height: clamp(330px, 42vw, 560px);
	overflow: hidden;
	background: var(--forest);
}

.project-card--featured .project-card__media {
	height: clamp(520px, 57vw, 700px);
}

.project-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms cubic-bezier(0.2, 0.75, 0.2, 1);
}

.project-card:hover .project-card__media img {
	transform: scale(1.035);
}

.project-card__placeholder {
	display: grid;
	height: 100%;
	place-items: center;
	color: rgba(255, 255, 255, 0.35);
	font-size: 1.4rem;
	font-weight: 500;
	letter-spacing: -0.02em;
}

.project-card__arrow {
	position: absolute;
	right: 1.4rem;
	bottom: 1.4rem;
	display: grid;
	width: 3rem;
	height: 3rem;
	place-items: center;
	border-radius: 50%;
	background: rgba(246, 241, 232, 0.92);
	color: var(--forest);
	backdrop-filter: blur(10px);
	transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.project-card:hover .project-card__arrow {
	background: var(--copper);
	color: var(--white);
	transform: rotate(45deg);
}

.project-card__content {
	padding: 1.7rem 0 1rem;
}

.project-card__label {
	margin: 0;
	color: var(--copper);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.project-card--featured .project-card__content {
	display: flex;
	padding: clamp(2.5rem, 6vw, 5rem);
	justify-content: center;
	flex-direction: column;
}

.project-card__meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 0.6rem 1rem;
	color: var(--copper);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.project-card h2 {
	margin: 1.3rem 0 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(2rem, 3.3vw, 3.6rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.045em;
}

.project-card:not(.project-card--featured) h2 {
	font-size: clamp(1.8rem, 2.7vw, 2.7rem);
}

.project-card__content > p {
	margin: 1.15rem 0 0;
	color: var(--ink-soft);
}

.projects-empty {
	max-width: 780px;
	padding: clamp(2.5rem, 7vw, 5rem);
	border: 1px solid var(--line);
	background: var(--paper);
}

.projects-empty h2 {
	margin: 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(2.8rem, 6vw, 5rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.045em;
}

.projects-empty > p:last-child {
	max-width: 620px;
	margin: 1.5rem 0 0;
	color: var(--ink-soft);
}

.projects-cta,
.project-article__cta {
	padding: clamp(5rem, 9vw, 8rem) 0;
	background: var(--forest-deep);
	color: var(--white);
}

.projects-cta__inner,
.project-article__cta-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 3rem;
}

.projects-cta h2,
.project-article__cta h2 {
	max-width: 850px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(2.8rem, 5.5vw, 5.2rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.05em;
}

.project-article {
	background: var(--paper);
}

.project-article__header {
	padding: clamp(5rem, 9vw, 8rem) 0 clamp(10rem, 16vw, 15rem);
	background: var(--forest-deep);
	color: var(--white);
}

.project-article__header--gallery {
	padding: clamp(5rem, 9vw, 8rem) 0;
}

.project-article__header-simple {
	position: relative;
}

.project-article__header-simple > a {
	display: inline-flex;
	margin-bottom: clamp(3.5rem, 7vw, 6rem);
	color: rgba(255, 255, 255, 0.62);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.project-article__header-simple > a:hover {
	color: var(--white);
}

.project-article__header-simple > span {
	display: block;
	margin-top: 1.5rem;
	color: rgba(255, 255, 255, 0.58);
	font-size: 0.74rem;
	font-weight: 650;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.project-article__header-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
	align-items: end;
	gap: clamp(3rem, 8vw, 8rem);
}

.project-article__header h1 {
	max-width: 900px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.3rem, 7vw, 6.7rem);
	font-weight: 500;
	line-height: 0.94;
	letter-spacing: -0.055em;
}

.project-article__summary > p {
	margin: 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.03rem;
}

.project-article__summary dl {
	display: grid;
	margin: 2rem 0 0;
	border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.project-article__summary dl > div {
	display: grid;
	padding: 0.75rem 0;
	grid-template-columns: 1fr 1.35fr;
	gap: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.project-article__summary dt {
	color: var(--copper-light);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.project-article__summary dd {
	margin: 0;
	font-size: 0.84rem;
}

.project-article__cover {
	position: relative;
	margin-top: clamp(-10rem, -11vw, -7rem);
}

.project-article__cover img {
	width: 100%;
	max-height: 820px;
	object-fit: cover;
	box-shadow: var(--shadow);
}

.project-article__content {
	display: grid;
	padding-top: clamp(5rem, 9vw, 8rem);
	padding-bottom: clamp(6rem, 10vw, 10rem);
	grid-template-columns: 180px minmax(0, 780px);
	justify-content: center;
	gap: clamp(3rem, 7vw, 7rem);
}

.project-article__content aside {
	display: flex;
	align-items: flex-start;
	flex-direction: column;
	color: var(--ink-soft);
	font-size: 0.78rem;
}

.project-article__content aside > span {
	color: var(--copper);
	font-size: 0.67rem;
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.project-article__content aside strong {
	margin-top: 0.35rem;
	color: var(--forest);
	font-size: 1rem;
	font-weight: 600;
}

.project-article__content aside a {
	margin-top: 2rem;
	font-weight: 700;
}

.project-article__body {
	color: #383d38;
	font-size: 1.06rem;
}

.project-article__body > *:first-child {
	margin-top: 0;
}

.project-article__body h2,
.project-article__body h3 {
	margin: 3.2rem 0 1rem;
	color: var(--forest);
	font-family: var(--font-display);
	font-weight: 500;
	line-height: 1.08;
	letter-spacing: -0.035em;
}

.project-article__body h2 {
	font-size: clamp(2.2rem, 4.2vw, 3.5rem);
}

.project-article__body h3 {
	font-size: 1.65rem;
}

.project-article__body p,
.project-article__body ul,
.project-article__body ol {
	margin: 0 0 1.5rem;
}

.project-article__body li {
	margin-bottom: 0.55rem;
}

.project-article__body a {
	color: var(--copper);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.project-article__body blockquote {
	margin: 2.5rem 0;
	padding: 1.5rem 0 1.5rem 2rem;
	border-left: 2px solid var(--copper);
	color: var(--forest);
	font-size: 1.4rem;
	font-weight: 500;
}

.project-gallery {
	padding: clamp(6rem, 10vw, 10rem) 0;
	background: var(--cream);
}

.project-gallery--standalone {
	padding-top: clamp(3rem, 6vw, 6rem);
}

.project-gallery__heading h2 {
	margin: 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(2.8rem, 5.5vw, 5.2rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.05em;
}

.project-gallery__grid {
	display: grid;
	margin-top: 4rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
}

.project-gallery__grid figure {
	margin: 0;
}

.project-gallery__item--wide {
	grid-column: 1 / -1;
}

.project-gallery__grid img {
	width: 100%;
	height: clamp(360px, 48vw, 620px);
	object-fit: cover;
}

.project-gallery__item--wide img {
	height: clamp(500px, 62vw, 780px);
}

.project-gallery__grid figcaption {
	margin-top: 0.7rem;
	color: var(--ink-soft);
	font-size: 0.76rem;
}

@media (max-width: 900px) {
	.projects-hero__inner,
	.project-article__header-grid {
		grid-template-columns: 1fr;
	}

	.projects-hero__inner > p,
	.project-article__summary {
		max-width: 680px;
	}

	.project-card--featured {
		grid-template-columns: 1fr;
	}

	.project-card--featured .project-card__media {
		height: clamp(430px, 70vw, 620px);
	}

	.projects-cta__inner,
	.project-article__cta-inner {
		grid-template-columns: 1fr;
		align-items: start;
	}
}

@media (max-width: 700px) {
	.projects-grid {
		grid-template-columns: 1fr;
	}

	.project-card--featured {
		grid-column: auto;
	}

	.project-card--featured .project-card__content {
		padding: 1.7rem 0 1rem;
	}

	.project-card__media,
	.project-card--featured .project-card__media {
		height: 390px;
	}

	.project-article__content {
		grid-template-columns: 1fr;
	}

	.project-article__content aside {
		display: grid;
		grid-template-columns: auto 1fr;
		gap: 0.3rem 1rem;
	}

	.project-article__content aside a {
		margin: 0;
		grid-column: 2;
	}

	.project-gallery__grid {
		grid-template-columns: 1fr;
	}

	.project-gallery__item--wide {
		grid-column: auto;
	}

	.project-gallery__grid img,
	.project-gallery__item--wide img {
		height: 420px;
	}
}

/* O nama */
.about-hero {
	overflow: hidden;
	background: var(--forest-deep);
	color: var(--white);
}

.about-hero__grid {
	display: grid;
	min-height: 760px;
	grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr);
}

.about-hero__content {
	display: flex;
	padding: clamp(5rem, 8vw, 8rem) clamp(2.5rem, 7vw, 7rem) clamp(5rem, 8vw, 8rem) 0;
	justify-content: center;
	flex-direction: column;
}

.about-hero h1 {
	max-width: 720px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.5rem, 6.5vw, 6.8rem);
	font-weight: 500;
	line-height: 0.94;
	letter-spacing: -0.055em;
}

.about-hero h1 em {
	display: block;
	color: var(--copper-light);
	font-weight: 500;
}

.about-hero__content > p:not(.eyebrow) {
	max-width: 600px;
	margin: 2rem 0 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.05rem;
}

.about-hero__actions {
	display: flex;
	margin-top: 2.4rem;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
}

.about-text-link {
	color: rgba(255, 255, 255, 0.76);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	transition: color 180ms ease;
}

.about-text-link:hover {
	color: var(--white);
}

.about-hero__media {
	position: relative;
	min-height: 760px;
	margin: 0;
	overflow: hidden;
}

.about-hero__media::after {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(20, 35, 29, 0.18), transparent 45%),
		linear-gradient(180deg, transparent 65%, rgba(20, 35, 29, 0.3));
	content: "";
}

.about-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.about-hero__media figcaption {
	position: absolute;
	right: 2rem;
	bottom: 2rem;
	z-index: 1;
	display: grid;
	min-width: 220px;
	padding: 1.4rem 1.5rem;
	background: rgba(246, 241, 232, 0.93);
	color: var(--forest);
	backdrop-filter: blur(12px);
}

.about-hero__media figcaption strong {
	color: var(--copper);
	font-family: var(--font-display);
	font-size: 2rem;
	font-weight: 550;
	line-height: 1;
}

.about-hero__media figcaption span {
	margin-top: 0.35rem;
	font-size: 0.72rem;
	font-weight: 650;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.about-story {
	padding: clamp(6rem, 11vw, 11rem) 0;
	background: var(--paper);
}

.about-story__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(3rem, 9vw, 9rem);
}

.about-story h2,
.about-values__heading h2,
.about-expertise h2,
.about-company h2,
.about-cta h2 {
	margin: 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(2.8rem, 5.3vw, 5.2rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.05em;
}

.about-story__copy {
	padding-top: 2.1rem;
}

.about-story__copy p {
	margin: 0;
	color: var(--ink-soft);
	font-size: 1.02rem;
}

.about-story__copy p + p {
	margin-top: 1.4rem;
}

.about-story__copy p:first-child {
	color: var(--forest);
	font-size: 1.22rem;
	font-weight: 550;
	line-height: 1.55;
}

.about-values {
	padding: clamp(6rem, 10vw, 10rem) 0;
	background: var(--cream);
}

.about-values__heading {
	max-width: 900px;
}

.about-values__grid {
	display: grid;
	margin: 4.5rem 0 0;
	padding: 0;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
	list-style: none;
}

.about-values__grid li {
	min-height: 315px;
	padding: 1.8rem;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.about-values__grid li > span {
	color: var(--copper);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.1em;
}

.about-values__grid h3 {
	margin: 5rem 0 0.85rem;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: 1.5rem;
	font-weight: 550;
	line-height: 1.1;
	letter-spacing: -0.025em;
}

.about-values__grid p {
	margin: 0;
	color: var(--ink-soft);
	font-size: 0.84rem;
}

.about-expertise {
	padding: clamp(6rem, 11vw, 11rem) 0;
	background: var(--paper);
}

.about-expertise__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
	align-items: center;
	gap: clamp(4rem, 9vw, 9rem);
}

.about-expertise__visual {
	position: relative;
	min-height: 710px;
	padding: 0 5rem 5rem 0;
}

.about-expertise__image-main {
	width: 100%;
	height: 100%;
	min-height: 660px;
	object-fit: cover;
}

.about-expertise__image-small {
	position: absolute;
	right: 0;
	bottom: 0;
	width: min(52%, 370px);
	height: 260px;
	border: 0.8rem solid var(--paper);
	object-fit: cover;
	box-shadow: var(--shadow);
}

.about-expertise__content > p:not(.eyebrow) {
	margin: 1.7rem 0 0;
	color: var(--ink-soft);
}

.about-expertise__content nav {
	display: grid;
	margin-top: 2.5rem;
	border-top: 1px solid var(--line);
}

.about-expertise__content nav a {
	display: grid;
	padding: 0.85rem 0;
	grid-template-columns: 2.2rem 1fr auto;
	align-items: center;
	gap: 0.7rem;
	border-bottom: 1px solid var(--line);
	color: var(--forest);
	font-size: 0.9rem;
	font-weight: 650;
}

.about-expertise__content nav a > span {
	color: var(--copper);
	font-size: 0.65rem;
	letter-spacing: 0.08em;
}

.about-expertise__content nav a > strong {
	display: grid;
	width: 1.8rem;
	height: 1.8rem;
	place-items: center;
	border-radius: 50%;
	background: var(--cream);
	font-weight: 500;
	transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.about-expertise__content nav a:hover > strong {
	background: var(--copper);
	color: var(--white);
	transform: rotate(45deg);
}

.about-company {
	padding: clamp(5rem, 9vw, 8rem) 0;
	background: var(--cream);
}

.about-company__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(360px, 0.8fr);
	align-items: end;
	gap: clamp(3rem, 9vw, 9rem);
}

.about-company h2 {
	font-size: clamp(2.7rem, 4.8vw, 4.6rem);
}

.about-company__grid > div > p:last-child {
	margin: 1.2rem 0 0;
	color: var(--ink-soft);
}

.about-company dl {
	display: grid;
	margin: 0;
	border-top: 1px solid var(--line);
}

.about-company dl > div {
	display: grid;
	padding: 0.8rem 0;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 1rem;
	border-bottom: 1px solid var(--line);
}

.about-company dt {
	color: var(--copper);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.about-company dd {
	margin: 0;
	color: var(--forest);
	font-size: 0.86rem;
}

.about-company dd a:hover {
	color: var(--copper);
}

.about-cta {
	padding: clamp(6rem, 10vw, 9rem) 0;
	background: var(--forest-deep);
	color: var(--white);
}

.about-cta__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
	align-items: end;
	gap: clamp(3rem, 8vw, 8rem);
}

.about-cta h2 {
	color: var(--white);
}

.about-cta__inner > div:last-child > p {
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
}

.about-cta__inner .button {
	margin-top: 2rem;
}

@media (max-width: 1020px) {
	.about-hero__grid {
		width: 100%;
		grid-template-columns: 1fr;
	}

	.about-hero__content {
		width: var(--container);
		min-height: 650px;
		margin-inline: auto;
		padding-right: 0;
	}

	.about-hero__media {
		min-height: 620px;
	}

	.about-values__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.about-expertise__grid {
		grid-template-columns: 1fr;
	}

	.about-expertise__visual {
		min-height: 620px;
	}

	.about-expertise__image-main {
		min-height: 570px;
	}
}

@media (max-width: 760px) {
	.about-hero__content {
		min-height: 580px;
		padding-block: 5rem;
	}

	.about-hero__media {
		min-height: 470px;
	}

	.about-hero__media figcaption {
		right: 1rem;
		bottom: 1rem;
		left: 1rem;
	}

	.about-story__grid,
	.about-company__grid,
	.about-cta__inner {
		grid-template-columns: 1fr;
	}

	.about-story__copy {
		padding-top: 0;
	}

	.about-values__grid {
		grid-template-columns: 1fr;
	}

	.about-values__grid li {
		min-height: 250px;
	}

	.about-values__grid h3 {
		margin-top: 3.5rem;
	}

	.about-expertise__visual {
		min-height: 500px;
		padding: 0 2.5rem 3rem 0;
	}

	.about-expertise__image-main {
		min-height: 460px;
	}

	.about-expertise__image-small {
		height: 190px;
		border-width: 0.55rem;
	}
}

/* Pojedinačne stranice usluga */
.service-page-hero {
	position: relative;
	overflow: hidden;
	background: var(--forest-deep);
	color: var(--white);
}

.service-breadcrumbs {
	display: flex;
	padding-top: 1.2rem;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.55rem;
	color: rgba(255, 255, 255, 0.48);
	font-size: 0.68rem;
	font-weight: 650;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.service-breadcrumbs a {
	transition: color 180ms ease;
}

.service-breadcrumbs a:hover {
	color: var(--white);
}

.service-page-hero__grid {
	display: grid;
	min-height: 700px;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
}

.service-page-hero__content {
	display: flex;
	padding: clamp(4rem, 8vw, 7rem) clamp(2.5rem, 7vw, 7rem) clamp(5rem, 9vw, 8rem) 0;
	justify-content: center;
	flex-direction: column;
}

.service-page-hero h1 {
	max-width: 760px;
	margin: 0;
	font-family: var(--font-display);
	font-size: clamp(3.4rem, 6.4vw, 6.5rem);
	font-weight: 500;
	line-height: 0.94;
	letter-spacing: -0.055em;
}

.service-page-hero__content > p:not(.eyebrow) {
	max-width: 620px;
	margin: 2rem 0 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 1.05rem;
}

.service-page-hero__actions {
	display: flex;
	margin-top: 2.4rem;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.5rem;
}

.service-page-text-link {
	display: inline-flex;
	align-items: center;
	gap: 0.65rem;
	color: var(--forest);
	font-size: 0.74rem;
	font-weight: 750;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.service-page-hero .service-page-text-link {
	color: rgba(255, 255, 255, 0.76);
}

.service-page-text-link:hover {
	color: var(--copper);
}

.service-page-hero__media {
	position: relative;
	min-height: 700px;
	margin: 0;
	overflow: hidden;
}

.service-page-hero__media::after {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(20, 35, 29, 0.22), transparent 45%),
		linear-gradient(180deg, transparent 60%, rgba(20, 35, 29, 0.25));
	content: "";
}

.service-page-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.service-overview {
	padding: clamp(6rem, 11vw, 11rem) 0 0;
	background: var(--paper);
}

.service-overview__grid {
	display: grid;
	grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
	gap: clamp(3rem, 9vw, 9rem);
}

.service-overview h2,
.service-benefits__heading h2,
.service-details h2,
.service-process__heading h2,
.service-faq h2,
.service-related h2,
.service-page-cta h2 {
	margin: 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(2.8rem, 5.3vw, 5.2rem);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.05em;
}

.service-overview__copy {
	padding-top: 2.1rem;
}

.service-overview__copy p {
	margin: 0;
	color: var(--ink-soft);
	font-size: 1.02rem;
}

.service-overview__copy p:first-child {
	color: var(--forest);
	font-size: 1.2rem;
	font-weight: 550;
	line-height: 1.55;
}

.service-overview__copy p + p {
	margin-top: 1.4rem;
}

.service-highlights {
	display: grid;
	margin-top: clamp(5rem, 8vw, 8rem);
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.service-highlights > div {
	display: grid;
	min-height: 185px;
	padding: 2rem;
	align-content: center;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
}

.service-highlights strong {
	color: var(--copper);
	font-family: var(--font-display);
	font-size: clamp(1.6rem, 3vw, 2.7rem);
	font-weight: 550;
	letter-spacing: -0.04em;
}

.service-highlights span {
	margin-top: 0.35rem;
	color: var(--ink-soft);
	font-size: 0.75rem;
	font-weight: 650;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.service-benefits {
	padding: clamp(6rem, 10vw, 10rem) 0;
	background: var(--cream);
}

.service-benefits__heading {
	max-width: 920px;
}

.service-benefits__grid {
	display: grid;
	margin-top: 4.5rem;
	grid-template-columns: repeat(2, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.service-benefits__grid article {
	min-height: 300px;
	padding: clamp(1.8rem, 4vw, 3rem);
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	background: rgba(255, 253, 249, 0.35);
	transition: color 220ms ease, background 220ms ease;
}

.service-benefits__grid article:hover {
	background: var(--forest);
	color: var(--white);
}

.service-benefits__grid article > span {
	color: var(--copper);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.1em;
}

.service-benefits__grid h3 {
	max-width: 430px;
	margin: 5rem 0 0.85rem;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: clamp(1.55rem, 2.7vw, 2.25rem);
	font-weight: 550;
	line-height: 1.08;
	letter-spacing: -0.035em;
	transition: color 220ms ease;
}

.service-benefits__grid p {
	max-width: 520px;
	margin: 0;
	color: var(--ink-soft);
	font-size: 0.87rem;
	transition: color 220ms ease;
}

.service-benefits__grid article:hover h3 {
	color: var(--white);
}

.service-benefits__grid article:hover p {
	color: rgba(255, 255, 255, 0.66);
}

.service-details {
	padding: clamp(6rem, 11vw, 11rem) 0;
	background: var(--paper);
}

.service-details__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(380px, 0.95fr);
	align-items: stretch;
	gap: clamp(4rem, 9vw, 9rem);
}

.service-details__media {
	min-height: 750px;
	margin: 0;
	overflow: hidden;
	background: var(--forest);
}

.service-details__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 800ms cubic-bezier(0.2, 0.75, 0.2, 1);
}

.service-details__media:hover img {
	transform: scale(1.025);
}

.service-details__content {
	display: flex;
	padding-block: 2rem;
	justify-content: center;
	flex-direction: column;
}

.service-details__content > p:not(.eyebrow) {
	margin: 1.7rem 0 0;
	color: var(--ink-soft);
}

.service-details__lists {
	display: grid;
	margin-top: 2.8rem;
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
}

.service-details__lists h3 {
	margin: 0 0 0.8rem;
	color: var(--copper);
	font-size: 0.69rem;
	font-weight: 750;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.service-details__lists ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.service-details__lists li {
	position: relative;
	padding: 0.7rem 0 0.7rem 1.2rem;
	border-top: 1px solid var(--line);
	color: var(--forest);
	font-size: 0.8rem;
}

.service-details__lists li::before {
	position: absolute;
	top: 1.17rem;
	left: 0;
	width: 0.3rem;
	height: 0.3rem;
	border-radius: 50%;
	background: var(--copper);
	content: "";
}

.service-process {
	padding: clamp(6rem, 10vw, 10rem) 0;
	background: var(--forest-deep);
	color: var(--white);
}

.service-process__heading {
	max-width: 880px;
}

.service-process__heading h2 {
	color: var(--white);
}

.service-process__grid {
	display: grid;
	margin: 4.5rem 0 0;
	padding: 0;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	border-left: 1px solid rgba(255, 255, 255, 0.14);
	list-style: none;
}

.service-process__grid li {
	min-height: 290px;
	padding: 1.8rem;
	border-right: 1px solid rgba(255, 255, 255, 0.14);
	border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

.service-process__grid li > span {
	color: var(--copper-light);
	font-size: 0.68rem;
	font-weight: 750;
	letter-spacing: 0.1em;
}

.service-process__grid h3 {
	margin: 4.8rem 0 0.85rem;
	color: var(--white);
	font-family: var(--font-display);
	font-size: 1.45rem;
	font-weight: 550;
	line-height: 1.1;
	letter-spacing: -0.03em;
}

.service-process__grid p {
	margin: 0;
	color: rgba(255, 255, 255, 0.6);
	font-size: 0.82rem;
}

.service-faq {
	padding: clamp(6rem, 11vw, 11rem) 0;
	background: var(--paper);
}

.service-faq__grid {
	display: grid;
	grid-template-columns: minmax(300px, 0.75fr) minmax(0, 1.25fr);
	align-items: start;
	gap: clamp(4rem, 9vw, 9rem);
}

.service-faq__heading {
	position: sticky;
	top: 7rem;
}

.service-faq__heading > p:not(.eyebrow) {
	margin: 1.5rem 0 1.7rem;
	color: var(--ink-soft);
}

.service-faq__items {
	border-top: 1px solid var(--line);
}

.service-faq__items details {
	border-bottom: 1px solid var(--line);
}

.service-faq__items summary {
	display: grid;
	padding: 1.5rem 0;
	grid-template-columns: 2.4rem 1fr auto;
	align-items: center;
	gap: 1rem;
	color: var(--forest);
	cursor: pointer;
	list-style: none;
	font-size: 1rem;
	font-weight: 650;
}

.service-faq__items summary::-webkit-details-marker {
	display: none;
}

.service-faq__items summary > span {
	color: var(--copper);
	font-size: 0.65rem;
	letter-spacing: 0.08em;
}

.service-faq__items summary > strong {
	display: grid;
	width: 2rem;
	height: 2rem;
	place-items: center;
	border-radius: 50%;
	background: var(--cream);
	font-size: 1.1rem;
	font-weight: 500;
	transition: color 180ms ease, background 180ms ease, transform 220ms ease;
}

.service-faq__items details[open] summary > strong {
	background: var(--copper);
	color: var(--white);
	transform: rotate(45deg);
}

.service-faq__items details > p {
	max-width: 700px;
	margin: 0;
	padding: 0 3rem 1.6rem 3.4rem;
	color: var(--ink-soft);
	font-size: 0.92rem;
}

.service-related {
	padding: clamp(5rem, 9vw, 8rem) 0;
	background: var(--cream);
}

.service-related__heading {
	max-width: 760px;
}

.service-related__grid {
	display: grid;
	margin-top: 3.5rem;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--line);
	border-left: 1px solid var(--line);
}

.service-related__grid a {
	position: relative;
	display: flex;
	min-height: 260px;
	padding: 1.8rem;
	flex-direction: column;
	border-right: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	transition: color 220ms ease, background 220ms ease;
}

.service-related__grid a:hover {
	background: var(--forest);
	color: var(--white);
}

.service-related__grid a > span {
	color: var(--copper);
	font-size: 0.68rem;
	font-weight: 750;
}

.service-related__grid h3 {
	max-width: 290px;
	margin: auto 0 0;
	color: var(--forest);
	font-family: var(--font-display);
	font-size: 1.6rem;
	font-weight: 550;
	line-height: 1.08;
	letter-spacing: -0.03em;
	transition: color 220ms ease;
}

.service-related__grid a:hover h3 {
	color: var(--white);
}

.service-related__grid a > strong {
	position: absolute;
	top: 1.4rem;
	right: 1.4rem;
	display: grid;
	width: 2.2rem;
	height: 2.2rem;
	place-items: center;
	border-radius: 50%;
	background: var(--paper);
	color: var(--forest);
	font-weight: 500;
	transition: color 180ms ease, background 180ms ease, transform 180ms ease;
}

.service-related__grid a:hover > strong {
	background: var(--copper);
	color: var(--white);
	transform: rotate(45deg);
}

.service-page-cta {
	padding: clamp(6rem, 10vw, 9rem) 0;
	background: var(--forest-deep);
	color: var(--white);
}

.service-page-cta__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
	align-items: end;
	gap: clamp(3rem, 8vw, 8rem);
}

.service-page-cta h2 {
	color: var(--white);
}

.service-page-cta__inner > div:last-child > p {
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
}

.service-page-cta .button {
	margin-top: 2rem;
}

@media (max-width: 1020px) {
	.service-page-hero__grid {
		width: 100%;
		grid-template-columns: 1fr;
	}

	.service-page-hero__content {
		width: var(--container);
		min-height: 620px;
		margin-inline: auto;
		padding-right: 0;
	}

	.service-page-hero__media {
		min-height: 600px;
	}

	.service-details__grid {
		grid-template-columns: 1fr;
	}

	.service-details__media {
		min-height: 620px;
	}

	.service-process__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 780px) {
	.service-page-hero__content {
		min-height: 560px;
		padding-block: 4.5rem;
	}

	.service-page-hero__media {
		min-height: 450px;
	}

	.service-overview__grid,
	.service-faq__grid,
	.service-page-cta__inner {
		grid-template-columns: 1fr;
	}

	.service-overview__copy {
		padding-top: 0;
	}

	.service-highlights {
		grid-template-columns: 1fr;
	}

	.service-highlights > div {
		min-height: 140px;
	}

	.service-benefits__grid,
	.service-related__grid {
		grid-template-columns: 1fr;
	}

	.service-benefits__grid article {
		min-height: 250px;
	}

	.service-benefits__grid h3 {
		margin-top: 3.5rem;
	}

	.service-details__media {
		min-height: 470px;
	}

	.service-details__lists {
		grid-template-columns: 1fr;
	}

	.service-process__grid {
		grid-template-columns: 1fr;
	}

	.service-process__grid li {
		min-height: 240px;
	}

	.service-faq__heading {
		position: static;
	}
}

@media (max-width: 520px) {
	.service-details__media {
		min-height: 390px;
	}

	.service-faq__items summary {
		grid-template-columns: 1.8rem 1fr auto;
		gap: 0.65rem;
		font-size: 0.9rem;
	}

	.service-faq__items details > p {
		padding-left: 2.45rem;
	}
}

/* Kontakt */

.contact-hero {
	position: relative;
	overflow: hidden;
	color: var(--white);
	background:
		linear-gradient(115deg, rgba(5, 45, 38, 0.98), rgba(5, 45, 38, 0.9)),
		url('/images/services/finska-sauna.jpg') center / cover;
}

.contact-hero::before {
	position: absolute;
	inset: 0;
	pointer-events: none;
	content: '';
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
	background-size: 72px 72px;
	mask-image: linear-gradient(to right, black, transparent 75%);
}

.contact-hero__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
	gap: clamp(3rem, 8vw, 8rem);
	align-items: end;
	min-height: 680px;
	padding-block: clamp(6rem, 11vw, 10rem) clamp(4rem, 8vw, 7rem);
}

.contact-hero .eyebrow {
	color: rgba(255, 255, 255, 0.68);
}

.contact-hero h1 {
	max-width: 850px;
	margin: 1.25rem 0 2rem;
	color: var(--white);
	font-size: clamp(3rem, 6.3vw, 6.8rem);
	line-height: 0.95;
	letter-spacing: -0.055em;
}

.contact-hero h1 em {
	color: #a7cbb4;
	font-family: Georgia, 'Times New Roman', serif;
	font-weight: 400;
}

.contact-hero__lead {
	max-width: 690px;
	margin: 0;
	color: rgba(255, 255, 255, 0.72);
	font-size: clamp(1.02rem, 1.4vw, 1.2rem);
	line-height: 1.8;
}

.contact-direct {
	display: block;
	margin: 0;
	padding: clamp(1.5rem, 3vw, 2.25rem);
	color: var(--ink);
	font-style: normal;
	background: rgba(247, 244, 236, 0.96);
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.2);
	backdrop-filter: blur(18px);
}

.contact-direct__label {
	margin: 0 0 1rem;
	color: var(--forest);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.contact-direct__item {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.35rem 1rem;
	padding: 1.35rem 2.4rem 1.35rem 0;
	color: inherit;
	text-decoration: none;
	border-top: 1px solid rgba(11, 65, 54, 0.17);
}

.contact-direct__item span {
	grid-column: 1;
	color: rgba(20, 36, 31, 0.58);
	font-size: 0.76rem;
	font-weight: 650;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.contact-direct__item strong {
	grid-column: 1;
	overflow-wrap: anywhere;
	font-size: clamp(0.98rem, 1.35vw, 1.12rem);
	font-weight: 600;
}

.contact-direct__item small {
	grid-column: 1;
	color: rgba(20, 36, 31, 0.58);
	font-size: 0.78rem;
	font-style: normal;
}

.contact-direct__item i {
	position: absolute;
	top: 50%;
	right: 0.2rem;
	color: var(--forest);
	font-size: 1.25rem;
	font-style: normal;
	transform: translateY(-50%);
	transition: transform 220ms ease;
}

.contact-direct__item:hover i {
	transform: translate(0.25rem, calc(-50% - 0.25rem));
}

.contact-inquiry {
	padding-block: clamp(5.5rem, 10vw, 10rem);
	background: var(--cream);
}

.contact-inquiry__grid {
	display: grid;
	grid-template-columns: minmax(280px, 0.72fr) minmax(0, 1.28fr);
	gap: clamp(3rem, 8vw, 9rem);
	align-items: start;
}

.contact-inquiry__intro {
	position: sticky;
	top: 9rem;
}

.contact-inquiry__intro h2,
.contact-company h2,
.contact-process__heading h2 {
	margin: 1.15rem 0 1.5rem;
	font-size: clamp(2.2rem, 4.2vw, 4.7rem);
	line-height: 1.02;
	letter-spacing: -0.045em;
}

.contact-inquiry__intro > p:not(.eyebrow) {
	max-width: 520px;
	color: rgba(20, 36, 31, 0.68);
	line-height: 1.75;
}

.contact-inquiry__intro ul {
	margin: 2.25rem 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid rgba(11, 65, 54, 0.18);
}

.contact-inquiry__intro li {
	display: grid;
	grid-template-columns: 2.4rem 1fr;
	gap: 0.65rem;
	padding: 1rem 0;
	color: var(--ink);
	border-bottom: 1px solid rgba(11, 65, 54, 0.18);
}

.contact-inquiry__intro li span {
	color: var(--green);
	font-size: 0.75rem;
	font-weight: 700;
}

.contact-form {
	position: relative;
	padding: clamp(1.5rem, 4.5vw, 4rem);
	background: var(--white);
	box-shadow: 0 24px 70px rgba(10, 55, 45, 0.08);
}

.contact-form__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.2rem;
}

.contact-form label {
	display: block;
	margin-bottom: 1.35rem;
}

.contact-form label > span {
	display: block;
	margin-bottom: 0.65rem;
	color: var(--ink);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.055em;
	text-transform: uppercase;
}

.contact-form label b {
	color: var(--green);
}

.contact-form input,
.contact-form select,
.contact-form textarea {
	width: 100%;
	border: 1px solid rgba(11, 65, 54, 0.22);
	border-radius: 0;
	outline: none;
	color: var(--ink);
	background: #fbfaf6;
	font: inherit;
	transition:
		border-color 180ms ease,
		box-shadow 180ms ease,
		background-color 180ms ease;
}

.contact-form input,
.contact-form select {
	height: 3.8rem;
	padding: 0 1rem;
}

.contact-form textarea {
	min-height: 190px;
	padding: 1rem;
	resize: vertical;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
	border-color: var(--green);
	background: var(--white);
	box-shadow: 0 0 0 3px rgba(23, 122, 98, 0.12);
}

.contact-form__footer {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 2rem;
	align-items: center;
	margin-top: 0.4rem;
}

.contact-form__footer p,
.contact-form__note {
	margin: 0;
	color: rgba(20, 36, 31, 0.55);
	font-size: 0.76rem;
	line-height: 1.6;
}

.contact-form__footer .button {
	cursor: pointer;
	border: 0;
	white-space: nowrap;
}

.contact-form__footer .button:disabled {
	cursor: wait;
	opacity: 0.64;
}

.contact-form__note {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(11, 65, 54, 0.1);
}

.contact-form__status {
	display: none;
	margin: 1rem 0 0;
	padding: 0.9rem 1rem;
	font-size: 0.82rem;
	font-weight: 650;
	line-height: 1.55;
}

.contact-form__status:not(:empty) {
	display: block;
}

.contact-form__status--success {
	color: #0a5545;
	background: rgba(80, 164, 132, 0.14);
	border-left: 3px solid #278466;
}

.contact-form__status--warning {
	color: #72501a;
	background: rgba(190, 132, 45, 0.14);
	border-left: 3px solid #be842d;
}

.contact-form__status--error {
	color: #7a2f2f;
	background: rgba(178, 66, 66, 0.12);
	border-left: 3px solid #b24242;
}

.contact-company {
	padding-block: clamp(5rem, 9vw, 8.5rem);
	color: var(--white);
	background: var(--forest);
}

.contact-company__grid {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: clamp(3rem, 9vw, 10rem);
	align-items: end;
}

.contact-company .eyebrow {
	color: rgba(255, 255, 255, 0.58);
}

.contact-company h2 {
	color: var(--white);
}

.contact-company__grid > div > p:last-child {
	margin-bottom: 0;
	color: rgba(255, 255, 255, 0.68);
	line-height: 1.7;
}

.contact-company dl {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.contact-company dl div {
	padding: 1.35rem 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.contact-company dl div:nth-child(odd) {
	padding-right: 2rem;
}

.contact-company dt {
	margin-bottom: 0.35rem;
	color: rgba(255, 255, 255, 0.48);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.contact-company dd {
	margin: 0;
	font-size: 1rem;
}

.contact-company a {
	color: inherit;
	text-decoration-color: rgba(255, 255, 255, 0.45);
	text-underline-offset: 0.2em;
}

.contact-process {
	padding-block: clamp(5.5rem, 10vw, 9rem);
	background: var(--white);
}

.contact-process__heading {
	display: grid;
	grid-template-columns: 0.45fr 1fr;
	gap: 3rem;
	align-items: start;
	margin-bottom: clamp(3rem, 6vw, 5rem);
}

.contact-process__heading h2 {
	max-width: 780px;
	margin-top: 0;
}

.contact-process__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid rgba(11, 65, 54, 0.2);
}

.contact-process__grid li {
	min-height: 290px;
	padding: 1.6rem clamp(1.1rem, 3vw, 2.5rem) 2rem 0;
	border-right: 1px solid rgba(11, 65, 54, 0.2);
}

.contact-process__grid li:not(:first-child) {
	padding-left: clamp(1.1rem, 3vw, 2.5rem);
}

.contact-process__grid li:last-child {
	border-right: 0;
}

.contact-process__grid span {
	color: var(--green);
	font-size: 0.75rem;
	font-weight: 700;
}

.contact-process__grid h3 {
	margin: 5rem 0 1rem;
	font-size: clamp(1.35rem, 2vw, 1.8rem);
	letter-spacing: -0.025em;
}

.contact-process__grid p {
	margin: 0;
	color: rgba(20, 36, 31, 0.62);
	line-height: 1.7;
}

@media (max-width: 980px) {
	.contact-hero__grid,
	.contact-inquiry__grid,
	.contact-company__grid {
		grid-template-columns: 1fr;
	}

	.contact-hero__grid {
		align-items: start;
		min-height: auto;
	}

	.contact-direct {
		max-width: 680px;
	}

	.contact-inquiry__intro {
		position: static;
	}

	.contact-inquiry__intro h2 {
		max-width: 720px;
	}

	.contact-company dl {
		max-width: 760px;
	}

	.contact-process__heading {
		grid-template-columns: 1fr;
		gap: 1rem;
	}
}

@media (max-width: 680px) {
	.contact-hero__grid {
		padding-top: 4.5rem;
	}

	.contact-hero h1 {
		font-size: clamp(2.8rem, 14vw, 4.7rem);
	}

	.contact-form__row,
	.contact-form__footer,
	.contact-company dl,
	.contact-process__grid {
		grid-template-columns: 1fr;
	}

	.contact-form__footer {
		gap: 1.25rem;
	}

	.contact-form__footer .button {
		width: 100%;
		justify-content: center;
	}

	.contact-company dl div:nth-child(odd) {
		padding-right: 0;
	}

	.contact-process__grid {
		border-top: 0;
	}

	.contact-process__grid li,
	.contact-process__grid li:not(:first-child) {
		min-height: 230px;
		padding: 1.5rem 0;
		border-top: 1px solid rgba(11, 65, 54, 0.2);
		border-right: 0;
	}

	.contact-process__grid h3 {
		margin-top: 3.5rem;
	}
}

/* 404 */

.not-found {
	position: relative;
	display: flex;
	align-items: center;
	min-height: calc(100vh - 132px);
	overflow: hidden;
	padding-block: clamp(5rem, 10vw, 9rem);
	color: var(--white);
	background:
		linear-gradient(110deg, rgba(5, 45, 38, 0.98), rgba(5, 45, 38, 0.88)),
		url('/images/services/finska-sauna.jpg') center / cover;
}

.not-found::before {
	position: absolute;
	inset: 0;
	pointer-events: none;
	content: '';
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
	background-size: 72px 72px;
}

.not-found__grid {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(330px, 0.65fr);
	gap: clamp(3rem, 9vw, 10rem);
	align-items: end;
}

.not-found .eyebrow {
	color: rgba(255, 255, 255, 0.62);
}

.not-found__number {
	margin: 1.5rem 0 -1rem;
	color: rgba(167, 203, 180, 0.2);
	font-family: Georgia, 'Times New Roman', serif;
	font-size: clamp(7rem, 16vw, 14rem);
	font-style: italic;
	line-height: 0.8;
	letter-spacing: -0.07em;
}

.not-found h1 {
	max-width: 760px;
	margin: 0 0 1.5rem;
	color: var(--white);
	font-size: clamp(2.8rem, 5.5vw, 6rem);
	line-height: 0.98;
	letter-spacing: -0.05em;
}

.not-found__content > p:not(.eyebrow, .not-found__number) {
	max-width: 620px;
	color: rgba(255, 255, 255, 0.68);
	line-height: 1.75;
}

.not-found__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	align-items: center;
	margin-top: 2.25rem;
}

.not-found__link {
	color: var(--white);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-underline-offset: 0.35rem;
	text-transform: uppercase;
}

.not-found__nav {
	padding: clamp(1.25rem, 3vw, 2.2rem);
	color: var(--ink);
	background: rgba(247, 244, 236, 0.96);
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.2);
}

.not-found__nav a {
	display: grid;
	grid-template-columns: 2.3rem 1fr auto;
	gap: 0.75rem;
	align-items: center;
	padding: 1.35rem 0;
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid rgba(11, 65, 54, 0.18);
}

.not-found__nav a:last-child {
	border-bottom: 0;
}

.not-found__nav span {
	color: var(--green);
	font-size: 0.72rem;
	font-weight: 700;
}

.not-found__nav strong {
	font-size: 1.05rem;
	font-weight: 600;
}

.not-found__nav i {
	color: var(--forest);
	font-size: 1.1rem;
	font-style: normal;
	transition: transform 200ms ease;
}

.not-found__nav a:hover i {
	transform: translate(0.2rem, -0.2rem);
}

@media (max-width: 900px) {
	.not-found__grid {
		grid-template-columns: 1fr;
	}

	.not-found__nav {
		max-width: 680px;
	}
}

@media (max-width: 560px) {
	.not-found {
		min-height: auto;
	}

	.not-found__number {
		font-size: 8rem;
	}

	.not-found__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.not-found__actions .button {
		justify-content: center;
	}
}